/* Self-hosted from Google Fonts. Generated by tools/fonts.mjs */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/cormorant-garamond-italic-latin0.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/cormorant-garamond-normal-latin1.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/cormorant-garamond-normal-latin1.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(/assets/fonts/jost-normal-cyrillic2.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(/assets/fonts/jost-normal-latin3.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/jost-normal-cyrillic2.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/jost-normal-latin3.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/jost-normal-cyrillic2.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/jost-normal-latin3.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Cinzel';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/cinzel-normal-latin4.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Cinzel';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/cinzel-normal-latin4.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/playfair-display-italic-cyrillic5.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/playfair-display-italic-latin6.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/playfair-display-normal-cyrillic7.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/playfair-display-normal-latin8.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/playfair-display-normal-cyrillic7.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/playfair-display-normal-latin8.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Pinyon Script';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/pinyon-script-normal-text9.woff2) format('woff2');
  unicode-range: U+4d, U+61, U+69, U+6d;
}

/* Glam Beauty Bar Miami — site styles.
   Palette from the salon's own brand art: deep plum, champagne gold, lavender, warm ivory. */
:root {
  --plum-950: #170a1a;
  --plum-900: #1f1024;
  --plum-800: #2b1630;
  --plum-700: #3d2143;
  --plum-600: #573260;
  --plum-400: #8c6a92;
  --lav-200: #e4d8ee;
  --lav-100: #f2ecf7;
  --ivory: #fbf8f4;
  --sand: #f4ede6;
  --line: rgba(43, 22, 48, .12);
  --ink: #231726;
  --muted: #655868;
  --gold-300: #ecd6a6;
  --gold-400: #ddbd83;
  --gold-500: #c9a165;
  --gold-600: #a47c45;
  --gold-text: #8a6432;          /* gold that passes contrast on ivory */
  --gold-grad: linear-gradient(135deg, #f1dcab 0%, #d7b274 38%, #b98c4f 72%, #e2c48e 100%);
  --serif: 'Cormorant Garamond', 'Times New Roman', serif;
  --sans: 'Jost', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --caps: 'Cinzel', 'Cormorant Garamond', serif;
  --script: 'Pinyon Script', cursive;
  --r: 18px;
  --r-lg: 28px;
  --shadow: 0 18px 50px -24px rgba(31, 16, 36, .35);
  --hdr: 68px;
  --dock: 0px;
  --gut: clamp(18px, 4.5vw, 40px);
}

html:is([lang="ru"], [lang="uk"]) { --serif: 'Playfair Display', Georgia, serif; }
html:is([lang="ru"], [lang="uk"]) .hero__h1 { font-size: clamp(46px, 6.2vw, 90px); }
html:is([lang="ru"], [lang="uk"]) .hero__h1--page { font-size: clamp(32px, 4.2vw, 56px); }
html:is([lang="ru"], [lang="uk"]) .shead__t { font-size: clamp(30px, 4.2vw, 44px); }
html:is([lang="ru"], [lang="uk"]) .sig__name, html:is([lang="ru"], [lang="uk"]) .why__t { font-size: 25px; }
html:is([lang="ru"], [lang="uk"]) .row__name, html:is([lang="ru"], [lang="uk"]) .look__name, html:is([lang="ru"], [lang="uk"]) .faq__i summary { font-size: 19px; }
html:is([lang="ru"], [lang="uk"]) .offer__t { font-size: clamp(22px, 2.4vw, 27px); }
@media (max-width: 899px) { html:is([lang="ru"], [lang="uk"]) .hero__h1 { font-size: clamp(40px, 11.4vw, 60px); } html:is([lang="ru"], [lang="uk"]) .hero__h1--page { font-size: clamp(30px, 8vw, 40px); } }
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--hdr) + 16px); }
body { margin: 0; background: var(--ivory); color: var(--ink); font: 400 17px/1.6 var(--sans); padding-bottom: var(--dock); overflow-x: clip; }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
h1, h2, h3, h4 { margin: 0; font-weight: 500; text-wrap: balance; }
.eyebrow, .member__role, .offer__t, .sig__name { text-wrap: balance; }
p { text-wrap: pretty; }
p { margin: 0; }
ul, ol { margin: 0; padding: 0; }
table { border-collapse: collapse; }
svg { width: 1em; height: 1em; flex: none; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
:focus-visible { outline: 2px solid var(--gold-500); outline-offset: 3px; border-radius: 4px; }
.skip { position: absolute; left: 12px; top: -60px; z-index: 100; background: var(--gold-400); color: var(--plum-900); padding: 10px 16px; border-radius: 999px; font-weight: 500; text-decoration: none; }
.skip:focus { top: 12px; }

.wrap { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 var(--gut); }
.wrap--narrow { max-width: 820px; }

/* ------------------------------------------------ type */
.eyebrow { font: 500 12.5px/1.4 var(--sans); letter-spacing: .22em; text-transform: uppercase; color: var(--gold-text); margin-bottom: 14px; }
.eyebrow--gold { color: var(--gold-400); }
.shead { max-width: 660px; margin-bottom: clamp(28px, 4vw, 44px); }
.shead--c { margin-left: auto; margin-right: auto; text-align: center; }
.shead__t { font: 500 clamp(34px, 5vw, 52px)/1.05 var(--serif); letter-spacing: -.01em; }
.shead__s { margin-top: 14px; color: var(--muted); font-size: 17.5px; }
.sec--plum .shead__s, .final .shead__s { color: rgba(255, 255, 255, .72); }
.split-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px 32px; margin-bottom: clamp(28px, 4vw, 44px); }
.split-head .shead { margin-bottom: 0; }
.link-arrow { display: inline-flex; align-items: center; gap: 8px; font-weight: 500; text-decoration: none; color: var(--gold-text); border-bottom: 1px solid currentColor; padding-bottom: 2px; }
.link-arrow svg { font-size: 18px; }
.link-arrow:hover svg:last-child { transform: translateX(3px); }
.link-arrow svg:last-child { transition: transform .2s; }

/* ------------------------------------------------ buttons */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 0 28px; border-radius: 999px; font: 500 13.5px/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; text-decoration: none; border: 1px solid transparent; cursor: pointer; transition: transform .2s, box-shadow .2s, background-color .2s, color .2s; white-space: nowrap; }
.btn svg { font-size: 18px; }
.btn--gold { background: var(--gold-grad); color: var(--plum-900); box-shadow: 0 10px 26px -12px rgba(201, 161, 101, .9), inset 0 1px 0 rgba(255, 255, 255, .45); }
.btn--gold:hover { transform: translateY(-1px); box-shadow: 0 16px 34px -14px rgba(201, 161, 101, 1), inset 0 1px 0 rgba(255, 255, 255, .5); }
.btn--line { border-color: rgba(221, 189, 131, .7); color: var(--gold-300); }
.btn--line:hover { background: rgba(221, 189, 131, .12); }
.btn--line-dark { border-color: var(--plum-800); color: var(--plum-800); }
.btn--line-dark:hover { background: var(--plum-800); color: var(--ivory); }
.btn--sm { min-height: 42px; padding: 0 20px; font-size: 12.5px; }

/* ------------------------------------------------ header */
.hdr { position: sticky; top: 0; z-index: 50; background: rgba(31, 16, 36, .94); backdrop-filter: saturate(140%) blur(10px); -webkit-backdrop-filter: saturate(140%) blur(10px); border-bottom: 1px solid rgba(221, 189, 131, .14); color: #fff; }
.hdr__in { height: var(--hdr); display: flex; align-items: center; gap: 18px; }
.brand { display: flex; align-items: center; gap: 12px; text-decoration: none; margin-right: auto; min-width: 0; }
.brand__mono { width: 66px; height: auto; }
.brand__word { display: flex; flex-direction: column; line-height: 1; }
.brand__name { font: 500 15px/1 var(--caps); letter-spacing: .12em; color: var(--gold-300); white-space: nowrap; }
.brand__city { font: 500 10px/1 var(--caps); letter-spacing: .5em; text-transform: uppercase; color: var(--gold-400); margin-top: 5px; }
.nav__list { list-style: none; display: flex; gap: 6px; }
.nav__link { display: block; white-space: nowrap; padding: 10px 12px; text-decoration: none; font: 400 15px/1 var(--sans); letter-spacing: .04em; color: rgba(255, 255, 255, .82); border-radius: 999px; transition: color .2s, background-color .2s; }
.nav__link:hover, .nav__link.is-on { color: var(--gold-300); }
.nav__link.is-on { background: rgba(221, 189, 131, .1); }
.nav__extra { display: none; }
.lang { order: 3; display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; font: 500 13px/1 var(--sans); letter-spacing: .12em; color: var(--gold-300); text-decoration: none; border: 1px solid rgba(221, 189, 131, .35); border-radius: 999px; padding: 0 12px; }
.hdr__book { order: 4; }
.lang:hover { background: rgba(221, 189, 131, .12); }
.burger { order: 5; display: none; background: none; border: 0; color: var(--gold-300); width: 44px; height: 44px; margin-right: -8px; cursor: pointer; font-size: 26px; align-items: center; justify-content: center; }
.burger__close { display: none; }

@media (max-width: 1020px) {
  :root { --hdr: 62px; }
  .brand__mono { width: 54px; }
  .brand__name { font-size: 13px; }
  .brand__city { font-size: 9px; }
  .burger { display: inline-flex; }
  .hdr__book { display: none; }
  .nav { position: fixed; inset: var(--hdr) 0 auto 0; height: calc(100dvh - var(--hdr)); background: var(--plum-900); padding: 22px var(--gut) 40px; overflow-y: auto; visibility: hidden; opacity: 0; transform: translateY(-8px); transition: opacity .25s, transform .25s, visibility 0s .25s; }
  .nav-open .nav { visibility: visible; opacity: 1; transform: none; transition: opacity .25s, transform .25s; }
  .nav-open .burger__open { display: none; }
  .nav-open .burger__close { display: block; }
  .nav-open { overflow: hidden; }
  .nav__list { flex-direction: column; gap: 0; }
  .nav__link { font: 500 30px/1.1 var(--serif); padding: 16px 0; border-bottom: 1px solid rgba(221, 189, 131, .14); border-radius: 0; color: #fff; }
  .nav__link.is-on { background: none; }
  .nav__extra { display: grid; gap: 18px; margin-top: 26px; }
  .nav__cta { display: grid; grid-template-columns: 1fr; gap: 10px; }
  .nav__cta .btn { width: 100%; }
  .nav__contact { display: flex; align-items: center; gap: 12px; color: var(--gold-300); text-decoration: none; font-size: 17px; }
  .nav__contact svg { font-size: 22px; }
}
@media (max-width: 380px) { .brand__word { display: none; } }

/* ------------------------------------------------ hero: silk light + 3D stage
   Background: a WebGL satin (site.js) over a CSS fallback. Right: the salon's real work photos in
   perspective, two short glass price chips and the offer ticket in front. The pointer tilts the rig;
   phones get a slow idle sway; the pause button (and reduced motion) stops everything. */
.hero { position: relative; isolation: isolate; overflow: hidden; color: #fff;
  background: radial-gradient(70% 90% at 78% 30%, #3a1d41 0%, rgba(58, 29, 65, 0) 60%), linear-gradient(160deg, #221026 0%, #160919 70%); }
.hero__silk { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; display: block; z-index: -2; opacity: 0; transition: opacity 1.8s ease; }
.hero__silk.is-live { opacity: 1; }
.hero::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: linear-gradient(90deg, rgba(22, 9, 25, .8) 0%, rgba(22, 9, 25, .45) 40%, rgba(22, 9, 25, 0) 62%); }
.hero::after { content: ''; position: absolute; inset: auto 0 0 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(221, 189, 131, .6), transparent); }
.hero__grid { position: relative; z-index: 1; display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(24px, 4vw, 56px); align-items: center; padding-top: clamp(32px, 4.5vw, 64px); padding-bottom: clamp(44px, 6vw, 84px); }

/* copy */
.hero__h1 { font: 500 clamp(56px, 7.4vw, 108px)/.92 var(--serif); letter-spacing: -.025em; }
.hero__h1--page { font-size: clamp(40px, 5vw, 68px); line-height: .98; }
.h1-line { display: block; padding: .04em 0 .1em; margin-bottom: -.1em; }
.h1-line > span { display: inline-block; animation: lineUp 1s cubic-bezier(.2, .8, .2, 1) both; animation-delay: .12s; }
.h1-line--2 > span, .h1-line--gold > span { animation-delay: .22s; }
.h1-line--gold > span { font-style: italic; color: var(--gold-400); font-size: .66em; letter-spacing: -.01em; }
.flip { display: inline-grid; vertical-align: bottom; perspective: 700px; transition: width .7s cubic-bezier(.2, .8, .2, 1); }
.flip__w { grid-area: 1 / 1; justify-self: start; white-space: nowrap; font-style: italic; color: var(--gold-400); transform-origin: 50% 50% -.45em; transform: rotateX(-95deg); opacity: 0; transition: transform .9s cubic-bezier(.2, .8, .2, 1), opacity .5s; backface-visibility: hidden; }
.flip__w.is-on { transform: none; opacity: 1; }
.flip__w.is-out { transform: rotateX(95deg); opacity: 0; }
.hero__line { margin-top: 20px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; font-size: 17px; color: rgba(255, 255, 255, .86); }
.hero__line s { color: rgba(255, 255, 255, .5); }
.hero__line b { font: 600 30px/1 var(--serif); color: var(--gold-300); }
.hero__line-m { color: rgba(255, 255, 255, .62); font-size: 15px; }
.hero__lead { margin-top: 20px; font-size: clamp(16.5px, 1.45vw, 18.5px); color: rgba(255, 255, 255, .76); max-width: 33em; font-weight: 300; }
.hero__cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; }
.hero__offer { display: flex; align-items: center; gap: 10px; width: fit-content; max-width: 100%; margin-top: 22px; padding: 11px 16px; border-radius: 14px; background: rgba(221, 189, 131, .12); border: 1px solid rgba(221, 189, 131, .42); color: var(--gold-300); text-decoration: none; font-size: 15px; line-height: 1.3; transition: background-color .2s; }
.hero__offer:hover { background: rgba(221, 189, 131, .2); }
.hero__offer svg { font-size: 18px; flex: none; }
.hero__offer svg:last-child { margin-left: 4px; }
@media (min-width: 900px) { .hero__offer--m { display: none; } }
.trust { list-style: none; display: flex; flex-wrap: wrap; gap: 10px 22px; margin-top: 26px; font-size: 14.5px; color: rgba(255, 255, 255, .78); }
.trust li { display: flex; align-items: center; gap: 8px; }
.trust a { display: inline-flex; align-items: center; gap: 8px; text-decoration: none; }
.trust a:hover { color: #fff; }
.trust b { color: #fff; font-weight: 500; }
.trust svg { color: var(--gold-400); font-size: 16px; }
.stars { display: inline-flex; gap: 1px; color: var(--gold-400); }
.stars svg { font-size: 15px; }
/* entrance: movement only — everything is painted from the first frame (the LCP must not wait) */
.rise { animation: rise .9s cubic-bezier(.2, .8, .2, 1) both; animation-delay: calc(var(--d, 0) * 70ms + 80ms); }
@keyframes rise { from { transform: translateY(18px); } to { transform: none; } }
@keyframes lineUp { from { transform: translateY(28%); } to { transform: none; } }

/* stage */
.hero__media { position: relative; }
.stage { position: relative; height: clamp(480px, 47vw, 680px); perspective: 1500px; perspective-origin: 50% 42%; }
.stage__rig { position: absolute; inset: 0; transform-style: preserve-3d; will-change: transform; }
.c3d { position: absolute; left: 50%; top: 50%; margin: 0; width: 54%; aspect-ratio: 4 / 5; transform-style: preserve-3d; }
.c3d--c { transform: translate(-50%, -50%) translateZ(60px); z-index: 3; }
.c3d--l { width: 40%; transform: translate(-124%, -44%) translateZ(-110px) rotateY(20deg) rotateZ(-5deg); }
.c3d--r { width: 40%; transform: translate(24%, -56%) translateZ(-160px) rotateY(-20deg) rotateZ(5deg); }
.c3d__f { width: 100%; height: 100%; transform-style: preserve-3d; animation: c3dFloat 6.5s ease-in-out infinite alternate; animation-delay: calc(var(--i, 0) * -2.2s); }
.c3d__in { position: relative; width: 100%; height: 100%; border-radius: 22px; overflow: hidden; background: var(--plum-700);
  box-shadow: 0 60px 90px -40px rgba(0, 0, 0, .75), 0 0 0 1px rgba(241, 220, 171, .38);
  animation: c3dIn 1.2s cubic-bezier(.16, .84, .24, 1) both; animation-delay: calc(var(--i, 0) * 120ms + 120ms); }
.c3d--c .c3d__in { animation: none; }
.c3d__in img { width: 100%; height: 100%; object-fit: cover; }
.c3d--r .c3d__in img { transform: scaleX(-1); object-position: 30% 50%; } /* the lashes sit on the side that stays visible */
.c3d__in::after { content: ''; position: absolute; inset: 9px; border-radius: 15px; border: 1px solid rgba(241, 220, 171, .42); pointer-events: none; }
.c3d--l .c3d__in, .c3d--r .c3d__in { filter: saturate(.92) brightness(.88); }
.c3d__gloss { position: absolute; inset: 0; pointer-events: none; background: radial-gradient(circle at var(--gx, 30%) var(--gy, 18%), rgba(255, 255, 255, .3), rgba(255, 255, 255, 0) 46%); mix-blend-mode: soft-light; }
@keyframes c3dIn { from { opacity: 0; transform: translate3d(0, 30px, -420px) rotateX(20deg) scale(.86); } to { opacity: 1; transform: none; } }
@keyframes c3dFloat { from { transform: translateY(0); } to { transform: translateY(12px); } }

/* two short glass price chips and the offer ticket float in front, always inside the stage */
.chip3d { position: absolute; z-index: 5; display: flex; align-items: baseline; gap: 10px; padding: 10px 14px; border-radius: 14px; white-space: nowrap;
  background: rgba(36, 17, 40, .66); backdrop-filter: blur(14px) saturate(140%); -webkit-backdrop-filter: blur(14px) saturate(140%);
  border: 1px solid rgba(241, 220, 171, .32); box-shadow: 0 24px 40px -22px rgba(0, 0, 0, .7); font-size: 14px; color: rgba(255, 255, 255, .88);
  animation: chipIn .9s cubic-bezier(.2, .8, .2, 1) both; animation-delay: calc(var(--i, 0) * 140ms + 600ms); }
.chip3d b { font: 600 21px/1 var(--serif); color: var(--gold-300); }
.chip3d--1 { left: 3%; top: 7%; transform: translateZ(150px); }
.chip3d--2 { right: 3%; top: 68%; transform: translateZ(170px); }
@keyframes chipIn { from { opacity: 0; translate: 0 14px; } to { opacity: 1; translate: 0 0; } }
.ticket { position: absolute; z-index: 6; left: 4%; bottom: 5%; transform: translateZ(220px) rotate(-3deg); display: grid; grid-template-columns: auto auto; align-items: center; gap: 2px 12px; padding: 12px 18px 12px 16px; border-radius: 16px; text-decoration: none; color: var(--plum-900);
  background: var(--gold-grad); box-shadow: 0 26px 46px -18px rgba(0, 0, 0, .7), inset 0 1px 0 rgba(255, 255, 255, .55);
  animation: chipIn .9s cubic-bezier(.2, .8, .2, 1) both; animation-delay: .9s; }
.ticket::before { content: ''; position: absolute; inset: 5px; border-radius: 12px; border: 1px dashed rgba(43, 22, 48, .32); pointer-events: none; }
.ticket__k { grid-column: 1 / -1; font: 500 11px/1 var(--sans); letter-spacing: .16em; text-transform: uppercase; opacity: .78; }
.ticket__v { font: 600 34px/1 var(--serif); }
.ticket__t { font: 500 12px/1.2 var(--sans); letter-spacing: .06em; text-transform: uppercase; max-width: 9em; }
.ticket:hover { filter: brightness(1.05); }

/* one photo (brows) */
.stage--one .c3d--c { width: 58%; }
.stage--one .chip3d--1 { left: 3%; top: 10%; }
.stage--one .chip3d--2 { right: 3%; top: auto; bottom: 10%; }

/* glass price cards (waxing: no bodies, just the deal) */
.c3d--price .c3d__in { display: flex; flex-direction: column; justify-content: flex-end; gap: 6px; padding: 24px 20px;
  background: linear-gradient(160deg, rgba(87, 50, 96, .92), rgba(31, 16, 36, .95)); filter: none; }
.c3d--price.c3d--c .c3d__in { background: linear-gradient(160deg, #3d2143, #1f1024); box-shadow: 0 60px 90px -40px rgba(0, 0, 0, .75), 0 0 0 1px rgba(241, 220, 171, .7); }
.pc__k { font: 500 11px/1 var(--sans); letter-spacing: .18em; text-transform: uppercase; color: var(--gold-400); }
.pc__n { font: 500 clamp(19px, 1.8vw, 26px)/1.1 var(--serif); color: #fff; }
.pc__p { font: 600 clamp(28px, 2.8vw, 42px)/1 var(--serif); color: var(--gold-300); display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; margin-top: 6px; }
.pc__p s { font: 400 16px/1 var(--sans); color: rgba(255, 255, 255, .5); }
.pc__d { font-size: 13px; color: rgba(255, 255, 255, .62); }
.stage--prices .c3d--c { width: 44%; }
.stage--prices .c3d--l, .stage--prices .c3d--r { width: 38%; }
.stage--prices .c3d--l { transform: translate(-152%, -42%) translateZ(-90px) rotateY(18deg) rotateZ(-5deg); }
.stage--prices .c3d--r { transform: translate(54%, -58%) translateZ(-120px) rotateY(-18deg) rotateZ(5deg); }
.stage--mini { height: clamp(360px, 34vw, 460px); }
.stage--mini .c3d__in { animation: none; }

/* pause button (WCAG 2.2.2: anything moving for more than 5 s can be stopped) */
.motion { position: absolute; z-index: 4; right: var(--gut); bottom: 16px; display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 14px; border-radius: 999px; cursor: pointer;
  background: rgba(22, 9, 25, .55); border: 1px solid rgba(241, 220, 171, .28); color: rgba(255, 255, 255, .78); font: 400 12.5px/1 var(--sans); }
.motion:hover { color: #fff; border-color: rgba(241, 220, 171, .6); }
.motion svg { font-size: 15px; }
.motion__play { display: none; }
.motion[aria-pressed="true"] .motion__pause { display: none; }
.motion[aria-pressed="true"] .motion__play { display: inline; }
.is-still .c3d__f, .is-still .c3d__in, .is-still .chip3d, .is-still .ticket { animation-play-state: paused; }

@media (max-width: 1100px) and (min-width: 900px) { .ticket { left: 2%; } }
@media (max-width: 899px) {
  .hero::before { background: linear-gradient(180deg, rgba(22, 9, 25, 0) 0%, rgba(22, 9, 25, .2) 34%, rgba(22, 9, 25, .74) 62%); }
  .hero__grid { grid-template-columns: 1fr; padding-top: 6px; padding-bottom: 72px; gap: 6px; }
  .hero__media { order: -1; margin: 0 calc(-1 * var(--gut)); }
  /* ad landings: headline, price and the button first; the 3D stage under them */
  .hero--landing .hero__media { order: 1; margin-top: 18px; }
  .hero--landing .hero__grid { padding-top: 26px; }
  .stage { height: clamp(270px, 72vw, 420px); perspective: 1200px; }
  /* size the cards by the stage height, so they never spill out of it on tablets */
  .c3d, .stage--one .c3d--c, .stage--prices .c3d--c { width: auto; height: 80%; }
  .c3d--l, .c3d--r, .stage--prices .c3d--l, .stage--prices .c3d--r { width: auto; height: 64%; }
  .c3d--c { transform: translate(-50%, -50%) translateZ(16px); }
  .c3d--l { transform: translate(-118%, -44%) translateZ(-80px) rotateY(16deg) rotateZ(-5deg); }
  .c3d--r { transform: translate(18%, -58%) translateZ(-120px) rotateY(-16deg) rotateZ(5deg); }
  .stage--prices .c3d--l { transform: translate(-130%, -42%) translateZ(-60px) rotateY(14deg) rotateZ(-5deg); }
  .stage--prices .c3d--r { transform: translate(30%, -58%) translateZ(-80px) rotateY(-14deg) rotateZ(5deg); }
  .c3d__in { border-radius: 16px; }
  .c3d__in::after { inset: 6px; border-radius: 11px; }
  .chip3d { padding: 8px 11px; gap: 7px; font-size: 12.5px; border-radius: 11px; }
  .chip3d b { font-size: 17px; }
  .chip3d--1 { left: 5%; top: 5%; transform: translateZ(60px); }
  .chip3d--2 { right: 5%; top: auto; bottom: 6%; transform: translateZ(60px); }
  .ticket { display: none; }
  .stage--prices .c3d__in { padding: 14px 12px; }
  .pc__k { font-size: 9.5px; letter-spacing: .12em; }
  .pc__n { font-size: 16px; }
  .pc__p { font-size: 24px; }
  .pc__d { font-size: 11px; }
  .pc__p s { font-size: 12px; }
  .stage--mini { height: clamp(260px, 70vw, 340px); margin: 0; }
  .hero__h1 { font-size: clamp(52px, 14vw, 76px); }
  .hero__h1--page { font-size: clamp(36px, 9.6vw, 50px); }
  .hero__line b { font-size: 26px; }
  .hero .eyebrow { font-size: 11.5px; letter-spacing: .16em; }
  .hero__copy { display: flex; flex-direction: column; }
  .hero__copy .eyebrow { order: 1; } .hero__h1 { order: 2; } .hero__line { order: 3; } .hero__offer { order: 4; margin-top: 16px; }
  .hero__cta { order: 5; margin-top: 16px; } .hero__copy > .rise:last-child { order: 6; } .hero__lead { order: 7; margin-top: 20px; }
  .hero__cta .btn { flex: 1 1 200px; white-space: normal; text-align: center; line-height: 1.25; }
  .motion { bottom: 18px; }
}
@media (max-width: 899px) and (min-width: 600px) { .hero__media { margin: 0; } }
@media (prefers-reduced-motion: reduce) {
  .h1-line > span, .rise, .c3d__f, .c3d__in, .chip3d, .ticket { animation: none !important; }
  .flip__w { transition: none; }
  .motion { display: none; }
}

/* ------------------------------------------------ offers */
.offers { background: linear-gradient(var(--plum-800) 0 50%, var(--ivory) 50% 100%); padding-bottom: clamp(36px, 5vw, 60px); }
.offers__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.offers__grid--1 { grid-template-columns: minmax(0, 780px); justify-content: center; }
.offer { position: relative; background: #fff; border-radius: var(--r-lg); padding: 30px 30px 28px; box-shadow: var(--shadow); border: 1px solid rgba(201, 161, 101, .28); display: flex; flex-direction: column; align-items: flex-start; overflow: hidden; }
.offer::after { content: ''; position: absolute; right: -60px; top: -60px; width: 180px; height: 180px; border-radius: 50%; background: radial-gradient(circle, var(--lav-100), transparent 70%); }
.offer--wax { background: var(--lav-100); }
.offer--wax::after { background: radial-gradient(circle, #fff, transparent 70%); }
.offer__icon { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: var(--plum-800); color: var(--gold-300); font-size: 22px; margin-bottom: 16px; }
.offer__kick { font: 500 12px/1 var(--sans); letter-spacing: .2em; text-transform: uppercase; color: var(--gold-text); }
.offer__t { font: 500 clamp(26px, 2.8vw, 32px)/1.1 var(--serif); margin: 10px 0 12px; max-width: 18em; position: relative; z-index: 1; }
.offer__key { color: var(--muted); font-size: 15.5px; margin-bottom: 22px; position: relative; z-index: 1; }
.offer__terms { position: relative; z-index: 1; margin-top: 14px; font-size: 13.5px; color: var(--muted); }
.offer__terms summary { cursor: pointer; display: inline-block; padding: 10px 0; text-decoration: underline; text-underline-offset: 3px; }
.offer__terms p { margin-top: 8px; }
.offer .btn { margin-top: auto; position: relative; z-index: 1; }
.offer__ex { position: relative; z-index: 1; background: #fff; border: 1px dashed rgba(164, 124, 69, .5); border-radius: 12px; padding: 10px 14px; font-size: 15px; margin-bottom: 14px; }
.offer__ex-k { color: var(--gold-text); font-weight: 500; }
.offer__ex b { font-weight: 500; color: var(--plum-700); }
.offer__ex s { color: var(--muted); margin-left: 2px; }
@media (max-width: 760px) {
  .offers { background: linear-gradient(var(--plum-800) 0 90px, var(--ivory) 90px 100%); }
  .offers__grid { grid-template-columns: 1fr; gap: 14px; }
  .offer { padding: 24px 22px; }
  .offer .btn { width: 100%; }
}

/* ------------------------------------------------ sections */
.sec { padding: clamp(64px, 9vw, 120px) 0; }
.sec--sand { background: var(--sand); }
.sec--plum { background: var(--plum-800); color: #fff; }
.sec--plum .eyebrow { color: var(--gold-400); }

/* signature sets */
.sig-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; align-items: stretch; }
.sig { background: #fff; border-radius: var(--r-lg); padding: 34px 28px 28px; border: 1px solid var(--line); display: flex; flex-direction: column; text-align: center; align-items: center; transition: transform .25s, box-shadow .25s; }
.sig:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.sig--mid { background: var(--plum-800); color: #fff; border-color: transparent; }
.sig__icon { font-size: 40px; color: var(--gold-500); margin-bottom: 8px; }
.sig__tag { font: 500 12px/1 var(--sans); letter-spacing: .2em; text-transform: uppercase; color: var(--gold-text); }
.sig--mid .sig__tag { color: var(--gold-400); }
.sig__name { font: 500 31px/1.08 var(--serif); margin: 12px 0 12px; }
.sig__line { color: var(--muted); font-size: 15.5px; }
.sig--mid .sig__line { color: rgba(255, 255, 255, .74); }
.sig__meta { display: flex; align-items: baseline; justify-content: center; gap: 16px; margin: 22px 0 22px; padding-top: 18px; border-top: 1px solid var(--line); width: 100%; margin-top: auto; }
.sig--mid .sig__meta { border-color: rgba(255, 255, 255, .14); }
.sig__price { font: 600 40px/1 var(--serif); color: var(--plum-800); }
.sig--mid .sig__price { color: var(--gold-300); }
.sig__dur { display: inline-flex; gap: 6px; align-items: center; font-size: 14px; color: var(--muted); }
.sig--mid .sig__dur { color: rgba(255, 255, 255, .7); }
.sig .btn { width: 100%; }
.sig__line { margin-bottom: 4px; }
.sig__facts { list-style: none; width: 100%; margin: -6px 0 20px; display: grid; gap: 6px; font-size: 14.5px; }
.sig__facts li { display: flex; justify-content: space-between; gap: 12px; padding: 7px 12px; border-radius: 10px; background: var(--sand); color: var(--muted); }
.sig__facts b { font-weight: 500; color: var(--ink); }
.sig__facts .sig__fv { background: var(--lav-100); }
.sig__facts .sig__fv b { color: var(--plum-700); }
.sig--mid .sig__facts li { background: rgba(255, 255, 255, .07); color: rgba(255, 255, 255, .72); }
.sig--mid .sig__facts b { color: #fff; }
.sig--mid .sig__facts .sig__fv { background: rgba(221, 189, 131, .16); }
.sig--mid .sig__facts .sig__fv b { color: var(--gold-300); }
.sig__note { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 26px; color: var(--muted); font-size: 15px; text-align: center; flex-wrap: wrap; }
.sig__note svg { color: var(--gold-500); }
@media (max-width: 899px) {
  .sig-grid { grid-template-columns: 1fr; max-width: 480px; margin: 0 auto; }
  .sig--mid { order: -1; }
}

/* looks */
.looks { list-style: none; display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.look__a { display: flex; flex-direction: column; text-decoration: none; height: 100%; }
.look__img { display: block; border-radius: var(--r); overflow: hidden; aspect-ratio: 1; background: var(--sand); }
.look__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.look__a:hover .look__img img { transform: scale(1.05); }
.look__name { font: 500 22px/1.15 var(--serif); margin-top: 14px; }
.look__note { color: var(--muted); font-size: 14.5px; margin-top: 4px; }
.look__price { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-top: auto; padding-top: 10px; font: 600 22px/1 var(--serif); color: var(--plum-800); }
.look__go { display: inline-flex; align-items: center; gap: 6px; font: 500 12px/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--gold-text); }
.look__a:hover .look__go svg { transform: translateX(3px); }
.look__go svg { transition: transform .2s; }
.looks__note { margin-top: 18px; color: var(--muted); font-size: 13.5px; }
@media (max-width: 1020px) { .looks { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 760px) {
  .looks { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: var(--gut); gap: 14px; margin: 0 calc(-1 * var(--gut)); padding: 0 var(--gut) 8px; scrollbar-width: none; }
  .looks::-webkit-scrollbar { display: none; }
  .look { flex: 0 0 62%; scroll-snap-align: start; }
}

/* mini price lists (home) */
.mini { list-style: none; margin-top: 8px; }
.mini__row a { display: flex; align-items: baseline; gap: 10px; padding: 13px 0; text-decoration: none; border-bottom: 1px solid var(--line); }
.sec--plum .mini__row a { border-color: rgba(255, 255, 255, .12); }
.mini__n { font-size: 17px; }
.mini__dots { flex: 1; border-bottom: 1px dotted currentColor; opacity: .3; transform: translateY(-4px); }
.mini__p { font: 600 22px/1 var(--serif); color: var(--plum-800); }
.sec--plum .mini__p { color: var(--gold-300); }
.mini__row a:hover .mini__n { color: var(--gold-text); }
.sec--plum .mini__row a:hover .mini__n { color: var(--gold-300); }

/* waxing block */
.wax__grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(32px, 6vw, 88px); align-items: center; }
.wax__media { max-width: 460px; width: 100%; justify-self: center; }
.pill { display: inline-flex; align-items: center; gap: 10px; background: rgba(221, 189, 131, .14); border: 1px solid rgba(221, 189, 131, .45); color: var(--gold-300); border-radius: 999px; padding: 10px 18px; font-size: 15px; margin-bottom: 18px; }
.pill svg { font-size: 18px; }
.wax__cta, .brows__cta { margin-top: 30px; }
.brows__grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(32px, 6vw, 88px); align-items: center; }
.brows__media { position: relative; display: grid; grid-template-columns: 1.15fr 1fr; gap: 16px; align-items: end; }
.tile { margin: 0; border-radius: var(--r-lg); overflow: hidden; box-shadow: var(--shadow); }
.tile img { width: 100%; height: 100%; object-fit: cover; }
.tile--a { aspect-ratio: 4 / 5; border-radius: 999px 999px var(--r-lg) var(--r-lg); }
.tile--b { aspect-ratio: 1; margin-bottom: 40px; }
@media (max-width: 899px) {
  .wax__grid, .brows__grid { grid-template-columns: minmax(0, 1fr); }
  .btn { white-space: normal; text-align: center; line-height: 1.25; padding-top: 10px; padding-bottom: 10px; }
  .wax__media { max-width: 280px; }
  .brows__media { order: -1; max-width: 460px; margin: 0 auto; }
  .wax__cta .btn, .brows__cta .btn { width: 100%; }
}

/* real work */
.work { list-style: none; display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.work__i { border-radius: var(--r); overflow: hidden; aspect-ratio: 4 / 5; background: var(--sand); }
.work__i:nth-child(even) { transform: translateY(26px); }
.work__i img { width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 760px) { .work { grid-template-columns: repeat(2, 1fr); gap: 12px; } .work__i:nth-child(even) { transform: translateY(18px); } }
#work { padding-bottom: calc(clamp(64px, 9vw, 120px) + 20px); }

/* why */
.why__list { list-style: none; display: grid; grid-template-columns: repeat(4, 1fr); gap: 28px; counter-reset: why; }
.why__i { border-top: 1px solid rgba(221, 189, 131, .35); padding-top: 22px; }
.why__i .why__t { margin-top: 0; }
.why__n { font: 500 15px/1 var(--caps); color: var(--gold-400); letter-spacing: .12em; }
.why__t { font: 500 26px/1.15 var(--serif); margin: 12px 0 10px; color: #fff; }
.why__i p { color: rgba(255, 255, 255, .72); font-size: 15.5px; }
@media (max-width: 1020px) { .why__list { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .why__list { grid-template-columns: 1fr; gap: 22px; } }

/* team */
.team { list-style: none; display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; }
.team--1 { grid-template-columns: minmax(0, 300px); justify-content: center; }
.team--2 { grid-template-columns: repeat(2, minmax(0, 280px)); justify-content: center; }
.team--3 { grid-template-columns: repeat(3, minmax(0, 280px)); justify-content: center; }
.team--5 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.team--5 .member { grid-column: span 2; }
.team--5 .member:nth-child(4) { grid-column: 2 / span 2; }
.team--5 .member:nth-child(5) { grid-column: 4 / span 2; }
.member { text-align: center; }
.member__img { margin: 0 0 16px; aspect-ratio: 4 / 5; border-radius: 999px 999px var(--r) var(--r); overflow: hidden; background: var(--sand); }
.member__img img { width: 100%; height: 100%; object-fit: cover; }
.member__mono { margin: 0 auto 16px; width: min(100%, 220px); aspect-ratio: 1 / 1.08; border-radius: 999px 999px var(--r) var(--r); display: grid; place-items: center;
  background: radial-gradient(120% 90% at 50% 0%, #4a2a52, var(--plum-900) 75%); box-shadow: inset 0 0 0 1px rgba(241, 220, 171, .35); }
.member__mono span { font: italic 500 clamp(64px, 8vw, 104px)/1 var(--serif); color: var(--gold-400); }
.member__name { font: 500 28px/1 var(--serif); }
.member__role { font: 500 12px/1.4 var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--gold-text); margin-top: 8px; }
.member__bio { color: var(--muted); font-size: 15px; margin-top: 10px; }
.team__note { text-align: center; color: var(--muted); font-size: 14.5px; margin: 34px auto 0; max-width: 620px; }
@media (max-width: 899px) {
  .team, .team--3 { grid-template-columns: repeat(2, 1fr); gap: 26px 14px; }
  .team--5 .member, .team--5 .member:nth-child(4), .team--5 .member:nth-child(5) { grid-column: auto; }
  .team--5 { grid-template-columns: repeat(2, 1fr); }
  .team--5 .member:nth-child(5) { grid-column: 1 / -1; max-width: 50%; justify-self: center; }
  .member__name { font-size: 24px; }
  .member__bio { font-size: 14px; }
}
@media (max-width: 420px) { .member__role { font-size: 10.5px; letter-spacing: .1em; } }

/* reviews */
.rev-head { text-align: center; margin-bottom: 40px; }
.rev-score { display: flex; justify-content: center; align-items: center; gap: 14px; margin-top: 14px; }
.rev-score__n { font: 600 56px/1 var(--serif); color: var(--plum-800); }
.rev-score__r { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; font-size: 14.5px; }
.rev-score__r a { color: var(--muted); }
.rev-score .stars svg { font-size: 20px; }
.revs { list-style: none; display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.rev { background: #fff; border-radius: var(--r-lg); padding: 28px 26px; border: 1px solid var(--line); display: flex; flex-direction: column; }
.rev:nth-child(n+4) { display: none; }
.rev blockquote { margin: 0; flex: 1; }
.rev blockquote p { font: italic 500 22px/1.35 var(--serif); }
.rev__who { margin-top: 18px; color: var(--gold-text); font-size: 14px; letter-spacing: .06em; }
.rev-foot { text-align: center; margin-top: 30px; display: flex; flex-direction: column; align-items: center; gap: 10px; }
.rev-compact { padding: 40px 0; }
.rev-compact .rev-head { margin-bottom: 0; }
.rev-note { color: var(--muted); font-size: 13.5px; }
@media (max-width: 899px) {
  .revs { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: var(--gut); gap: 14px; margin: 0 calc(-1 * var(--gut)); padding: 0 var(--gut) 8px; scrollbar-width: none; }
  .revs::-webkit-scrollbar { display: none; }
  .rev, .rev:nth-child(n+4) { display: flex; flex: 0 0 82%; scroll-snap-align: start; }
}

/* faq */
.faq { border-top: 1px solid var(--line); }
.faq__i { border-bottom: 1px solid var(--line); }
.faq__i summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 18px; padding: 22px 4px; font: 500 22px/1.25 var(--serif); }
.faq__i summary::-webkit-details-marker { display: none; }
.faq__i summary::after { content: '+'; font: 300 28px/1 var(--sans); color: var(--gold-500); transition: transform .25s; }
.faq__i[open] summary::after { transform: rotate(45deg); }
.faq__a { padding: 0 4px 24px; color: var(--muted); max-width: 64ch; }

/* visit */
.visit__grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 5vw, 72px); align-items: stretch; }
.facts { list-style: none; display: grid; gap: 22px; }
.facts li { display: grid; grid-template-columns: 26px 1fr; gap: 14px; }
.facts li > svg { font-size: 22px; color: var(--gold-500); margin-top: 3px; }
.facts b { display: block; font: 500 12.5px/1.4 var(--sans); letter-spacing: .18em; text-transform: uppercase; color: var(--gold-text); margin-bottom: 4px; }
.facts a { text-decoration-color: rgba(43, 22, 48, .25); text-underline-offset: 3px; }
.facts__a { display: block; width: fit-content; padding: 6px 0; }
.hours th { text-align: left; font-weight: 500; padding: 3px 18px 3px 0; white-space: nowrap; }
.hours td { padding: 3px 0; color: var(--muted); }
.visit__cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
.map { position: relative; height: 100%; min-height: 360px; border-radius: var(--r-lg); overflow: hidden; background: linear-gradient(135deg, var(--plum-700), var(--plum-900)); }
.map::before { content: ''; position: absolute; inset: 0; background: url(/assets/img/gbb-mono-s-240.webp) center 22% / 38% no-repeat; opacity: .1; }
.map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.map__btn { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; background: none; border: 0; color: #fff; cursor: pointer; font: 500 14px/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; }
.map__btn svg { font-size: 34px; color: var(--gold-400); }
.map__btn small { font: 400 14px/1.3 var(--sans); letter-spacing: 0; text-transform: none; color: rgba(255, 255, 255, .7); }
.map__btn:hover span { color: var(--gold-300); }
@media (max-width: 899px) {
  .visit__grid { grid-template-columns: 1fr; }
  .map { min-height: 280px; }
  .visit__cta .btn { flex: 1 1 220px; }
}

/* final CTA */
.final { background: radial-gradient(80% 120% at 50% 0%, #4a2a52, var(--plum-900) 70%); color: #fff; text-align: center; padding: clamp(64px, 9vw, 110px) 0; }
.final__mono { width: 120px; margin: 0 auto 22px; }
.final__t { font: 500 clamp(36px, 5vw, 56px)/1.05 var(--serif); }
.final__s { color: rgba(255, 255, 255, .74); margin-top: 14px; }
.final__cta { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; margin-top: 30px; }

/* ------------------------------------------------ menus */
.menu { padding-top: clamp(56px, 7vw, 96px); }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { padding: 10px 16px; border-radius: 999px; border: 1px solid var(--line); text-decoration: none; font-size: 14.5px; background: #fff; transition: border-color .2s, color .2s; }
.chip:hover { border-color: var(--gold-500); color: var(--gold-text); }
.menu__cat + .menu__cat { margin-top: clamp(44px, 6vw, 72px); }
.menu__head { display: grid; grid-template-columns: minmax(0, 340px) 1fr; gap: 10px 40px; align-items: baseline; padding-bottom: 16px; border-bottom: 1px solid var(--plum-800); }
.menu__t { font: 500 clamp(28px, 3.4vw, 38px)/1.1 var(--serif); }
.menu__intro { color: var(--muted); font-size: 15.5px; }
.menu__list { list-style: none; }
.row { display: grid; grid-template-columns: 1fr auto; gap: 8px 32px; padding: 22px 0; border-bottom: 1px solid var(--line); align-items: center; }
.row:target { background: linear-gradient(90deg, rgba(221, 189, 131, .16), transparent); }
.row__name { font: 500 22px/1.2 var(--serif); }
.badge { display: inline-block; vertical-align: middle; font: 500 10.5px/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--plum-800); background: var(--lav-200); border-radius: 999px; padding: 5px 9px; margin-left: 6px; transform: translateY(-2px); }
.row__desc { color: var(--muted); font-size: 15px; margin-top: 6px; max-width: 62ch; }
.row__side { display: flex; align-items: center; gap: 22px; }
.row__dur { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font-size: 14px; white-space: nowrap; }
.row__price { font: 600 28px/1 var(--serif); color: var(--plum-800); min-width: 64px; text-align: right; }
.row__book { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 20px; border-radius: 999px; background: var(--plum-800); color: var(--gold-300); text-decoration: none; font: 500 12.5px/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; transition: background-color .2s, color .2s; }
.row__book:hover { background: var(--gold-grad); color: var(--plum-900); }
.menu__foot { margin-top: 26px; color: var(--muted); font-size: 14px; }
.steps { background: var(--lav-100); border-radius: var(--r-lg); padding: 24px 26px; margin-bottom: clamp(36px, 5vw, 56px); }
.steps__t { font: 500 24px/1.2 var(--serif); margin-bottom: 12px; }
.steps__list { padding-left: 22px; display: grid; gap: 6px; }
.steps__list li::marker { color: var(--gold-text); font-weight: 500; }
.steps__note { margin-top: 12px; color: var(--muted); font-size: 15px; }
.steps__note a { color: var(--plum-700); }
@media (max-width: 760px) {
  .menu__head { grid-template-columns: 1fr; }
  .row { grid-template-columns: 1fr; padding: 20px 0; }
  .row__side { justify-content: space-between; gap: 12px; }
  .row__dur { margin-right: auto; }
  .row__price { font-size: 26px; min-width: 0; }
  .chips { margin-top: 4px; }
}

/* ------------------------------------------------ legal, 404 */
.legal__h1 { font: 500 clamp(36px, 5vw, 52px)/1.1 var(--serif); margin-bottom: 24px; }
.legal h2 { font: 500 26px/1.2 var(--serif); margin: 34px 0 10px; }
.legal p { color: var(--muted); }
.legal__date { margin-top: 40px; font-size: 14px; }
.hero--404 { min-height: 70vh; display: flex; align-items: center; }
.nf { text-align: center; padding-top: 60px; padding-bottom: 80px; }
.nf__mono { width: 150px; margin: 0 auto 26px; }
.nf .hero__lead { margin-left: auto; margin-right: auto; }
.nf .hero__cta { justify-content: center; }
.nf__links { margin-top: 24px; color: var(--gold-300); }

/* ------------------------------------------------ footer + mobile dock */
.ftr { background: var(--plum-950); color: rgba(255, 255, 255, .72); padding: 64px 0 28px; font-size: 15px; }
.ftr__grid { display: grid; grid-template-columns: 1.2fr 1fr 1fr .8fr; gap: 36px; }
.ftr__mono { width: 92px; }
.ftr__name { font: 500 15px/1 var(--caps); letter-spacing: .12em; color: var(--gold-300); margin-top: 14px; }
.ftr__name span { font: 500 11px/1 var(--caps); letter-spacing: .45em; color: var(--gold-400); margin-left: 6px; }
.ftr__tag { margin-top: 10px; font-size: 13.5px; letter-spacing: .08em; }
.ftr__h { font: 500 12px/1.4 var(--sans); letter-spacing: .2em; text-transform: uppercase; color: var(--gold-400); margin: 0 0 10px; }
.ftr__h:not(:first-child) { margin-top: 22px; }
.ftr a { text-decoration: none; }
.ftr a:hover { color: var(--gold-300); }
.ftr__links { list-style: none; display: grid; gap: 8px; }
.ftr__contacts a { display: block; width: fit-content; padding: 4px 0; }
.hours--ftr td { color: rgba(255, 255, 255, .6); }
.ftr__base { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px 24px; border-top: 1px solid rgba(255, 255, 255, .1); margin-top: 48px; padding-top: 22px; font-size: 13.5px; color: rgba(255, 255, 255, .5); }
@media (max-width: 899px) { .ftr__grid { grid-template-columns: 1fr 1fr; } .ftr__brand { grid-column: 1 / -1; } }
@media (max-width: 520px) { .ftr__grid { grid-template-columns: 1fr; } }

.dock { display: none; }
@media (max-width: 899px) {
  :root { --dock: calc(68px + env(safe-area-inset-bottom)); }
  .dock { display: grid; grid-template-columns: 1fr 1.6fr; gap: 10px; position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; padding: 10px 12px; background: rgba(31, 16, 36, .96); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-top: 1px solid rgba(221, 189, 131, .2); transition: transform .3s; }
  .dock__btn { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 12px; border-radius: 999px; text-decoration: none; font: 500 13px/1 var(--sans); letter-spacing: .1em; text-transform: uppercase; margin-bottom: env(safe-area-inset-bottom); }
  html:is([lang="ru"], [lang="uk"]) .dock__btn { letter-spacing: .05em; font-size: 12.5px; }
  .dock__btn svg { font-size: 18px; }
  .dock__btn--line { border: 1px solid rgba(221, 189, 131, .55); color: var(--gold-300); }
  .dock__btn--gold { background: var(--gold-grad); color: var(--plum-900); }
  .nav-open .dock, .cta-in-view .dock { transform: translateY(110%); }
}

/* reveal on scroll (only when JS is running) */
.js .rv { opacity: 0; transform: translateY(18px); transition: opacity .7s ease, transform .7s ease; }
.js .rv.in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
  .js .rv { opacity: 1; transform: none; }
}
.stage--mini .stage__rig { transition: transform .5s cubic-bezier(.2, .8, .2, 1); }
/* small glass price cards: the long RU "Бесплатно" must fit */
.stage--mini .pc__p { font-size: clamp(22px, 2.2vw, 32px); }
.c3d--free .pc__p b { font-size: .86em; }
html:is([lang="ru"], [lang="uk"]) .c3d--free .pc__p b { font-size: .7em; }
.facts__a { padding: 9px 0; }
.offer__terms summary, .faq__i summary { min-height: 44px; }

/* ================================================ v3 (2026-10-06): the salon's banner as the cover, WhatsApp/SMS, contact form, 3 languages */
/* header wordmark: "Glam Beauty Bar" + "Miami" in script, as on the banner */
.brand__word { align-items: center; }
.brand__city { font: 400 22px/.9 'Pinyon Script', cursive; letter-spacing: 0; text-transform: none; color: var(--gold-400); margin-top: 2px; }
@media (max-width: 1020px) { .brand__city { font-size: 19px; } }
@media (max-width: 380px) { .brand__word { display: flex; } .brand__name { font-size: 11.5px; letter-spacing: .08em; } .brand__city { font-size: 17px; } .brand__mono { width: 44px; } }
.ftr__name span { font: 400 26px/1 'Pinyon Script', cursive; letter-spacing: 0; text-transform: none; margin-left: 8px; }

/* language switch: EN · RU · ES */
.langs { position: relative; order: 3; }
.langs > summary { list-style: none; cursor: pointer; }
.langs > summary::-webkit-details-marker { display: none; }
.langs__list { list-style: none; position: absolute; right: 0; top: calc(100% + 8px); z-index: 60; min-width: 150px; padding: 6px; border-radius: 14px; background: var(--plum-900); border: 1px solid rgba(221, 189, 131, .35); box-shadow: var(--shadow); }
.langs__list a { display: block; padding: 11px 14px; border-radius: 9px; color: #fff; text-decoration: none; font-size: 15px; }
.langs__list a:hover { background: rgba(221, 189, 131, .12); }
.langs__list a[aria-current] { color: var(--gold-300); }

/* ---------- cover: lockup, pillars, tagline | eye portal + studio, gold wave, three circles */
.hero--banner { min-height: calc(100svh - var(--hdr)); display: flex; align-items: center; }
.hero--banner .hero__grid { width: 100%; grid-template-columns: 1fr 1.05fr; }
.hero--banner::before { background: linear-gradient(90deg, rgba(22, 9, 25, .72) 0%, rgba(22, 9, 25, .3) 46%, rgba(22, 9, 25, 0) 70%); }
.bnr { text-align: center; display: flex; flex-direction: column; align-items: center; }
.bnr__h1 { margin: 0; }
.bnr__lock { display: flex; flex-direction: column; align-items: center; }
.bnr__mono { width: clamp(150px, 15vw, 230px); height: auto; filter: drop-shadow(0 10px 24px rgba(0, 0, 0, .45)); animation: rise 1s cubic-bezier(.2, .8, .2, 1) both; }
.bnr__name { font: 500 clamp(30px, 3.4vw, 50px)/1.05 var(--caps); letter-spacing: .07em; margin-top: 10px; white-space: nowrap;
  background: linear-gradient(100deg, #b98c4f 0%, #f1dcab 30%, #d7b274 45%, #fff3d6 52%, #d7b274 60%, #b98c4f 100%); background-size: 250% 100%;
  -webkit-background-clip: text; background-clip: text; color: transparent; animation: shimmer 7s ease-in-out infinite; }
@keyframes shimmer { 0%, 100% { background-position: 100% 0; } 50% { background-position: 0 0; } }
.bnr__city { display: flex; align-items: center; gap: 16px; width: min(100%, 520px); margin-top: 2px; }
.bnr__city span { font: 400 clamp(34px, 3.4vw, 48px)/1.2 'Pinyon Script', cursive; color: var(--gold-400); }
.bnr__city i, .bnr__rule i { flex: 1; height: 1px; background: linear-gradient(90deg, transparent, rgba(221, 189, 131, .75)); }
.bnr__city i:last-child, .bnr__rule i:last-child { background: linear-gradient(90deg, rgba(221, 189, 131, .75), transparent); }
.bnr__pillars { display: flex; justify-content: center; align-items: center; gap: clamp(12px, 1.6vw, 22px); margin-top: 14px; font: 300 clamp(14px, 1.3vw, 17px)/1 var(--sans); letter-spacing: .3em; text-transform: uppercase; color: rgba(255, 255, 255, .9); }
.bnr__pillars b { color: var(--gold-500); font-weight: 300; }
.bnr__rule { display: flex; align-items: center; gap: 14px; width: min(80%, 420px); margin-top: 18px; color: var(--gold-400); }
.bnr__rule svg { width: 20px; height: 20px; animation: beat 2.4s ease-in-out infinite; }
@keyframes beat { 0%, 100% { transform: scale(1); } 12% { transform: scale(1.18); } 24% { transform: scale(1); } }
.bnr__tag { margin-top: 14px; font: 400 clamp(13px, 1.15vw, 15.5px)/1.7 var(--sans); letter-spacing: .24em; text-transform: uppercase; color: var(--gold-400); max-width: 26em; }
.bnr .hero__offer { margin: 22px auto 0; }
.bnr .hero__cta { justify-content: center; }
.bnr .trust { justify-content: center; }
.hero--banner .hero__cta .btn svg { font-size: 18px; }

.stage--banner { height: clamp(420px, 40vw, 560px); perspective: 1400px; }
.bl { position: absolute; margin: 0; transform-style: preserve-3d; }
.bl .c3d__f { position: relative; width: 100%; height: 100%; overflow: hidden; }
.bl img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bl--room { left: 0; top: 14%; width: 56%; height: 74%; transform: translateZ(-90px) rotateY(10deg); }
.bl--room .c3d__f { border-radius: 26px; box-shadow: 0 50px 80px -40px rgba(0, 0, 0, .8), 0 0 0 1px rgba(241, 220, 171, .3); animation: c3dFloat 7s ease-in-out infinite alternate; }
.bl--room .c3d__f::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(22, 9, 25, .25), transparent 40%); }
/* the neon "Glam" sign breathes */
.bl__neon { position: absolute; left: 14%; top: 6%; width: 58%; height: 34%; border-radius: 50%; background: radial-gradient(closest-side, rgba(255, 214, 170, .55), rgba(255, 214, 170, 0)); mix-blend-mode: screen; animation: neon 4.6s infinite; pointer-events: none; }
@keyframes neon { 0%, 18%, 22%, 62%, 64%, 100% { opacity: .9; } 20%, 63% { opacity: .35; } 40% { opacity: 1; } }
.bl--eye { right: 2%; top: 0; width: 52%; height: 100%; transform: translateZ(70px); }
.bl--eye .c3d__f { border-radius: 60% 26px 26px 60% / 50% 26px 26px 50%; box-shadow: 0 60px 90px -40px rgba(0, 0, 0, .8), 0 0 0 2px rgba(241, 220, 171, .85), 0 0 0 9px rgba(23, 10, 26, .55), 0 0 0 10px rgba(241, 220, 171, .45);
  animation: c3dFloat 6s ease-in-out infinite alternate; animation-delay: -2s; }
.bl--eye img { object-position: 46% 40%; }
.bl__wave { position: absolute; left: -4%; bottom: -26px; width: 108%; height: 70px; transform: translateZ(40px); overflow: visible; }
.bl__wave path { fill: none; stroke: #d7b274; stroke-width: 2.2; stroke-linecap: round; stroke-dasharray: 900; stroke-dashoffset: 900; animation: draw 2.4s .5s cubic-bezier(.4, 0, .2, 1) forwards; filter: drop-shadow(0 0 6px rgba(241, 220, 171, .55)); }
@keyframes draw { to { stroke-dashoffset: 0; } }

.circles { list-style: none; display: flex; justify-content: center; gap: clamp(18px, 3vw, 44px); margin-top: 46px; }
.circle { display: flex; flex-direction: column; align-items: center; gap: 12px; text-decoration: none; color: #fff; animation: pop .8s cubic-bezier(.2, .9, .3, 1.3) both; animation-delay: calc(var(--i) * 140ms + 700ms); }
.circle__img { width: clamp(92px, 9vw, 128px); aspect-ratio: 1; border-radius: 50%; overflow: hidden; display: block; padding: 4px; background: var(--gold-grad); box-shadow: 0 18px 30px -16px rgba(0, 0, 0, .7); transition: transform .3s; }
.circle__img img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; border: 2px solid var(--plum-900); }
.circle__t { font: 500 13px/1 var(--caps); letter-spacing: .24em; text-transform: uppercase; color: var(--gold-300); }
html:is([lang="ru"], [lang="uk"]) .circle__t { font-family: var(--sans); letter-spacing: .16em; }
.circle:hover .circle__img { transform: translateY(-6px) scale(1.04); }
@keyframes pop { from { transform: scale(.6); opacity: 0; } to { transform: none; opacity: 1; } }
.is-still .bnr__name, .is-still .bl .c3d__f, .is-still .bl__neon, .is-still .bnr__rule svg { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) {
  .bnr__name, .bnr__mono, .bl .c3d__f, .bl__neon, .bnr__rule svg, .circle { animation: none !important; }
  .bl__wave path { animation: none; stroke-dashoffset: 0; }
}

@media (max-width: 899px) {
  .hero--banner { min-height: 0; }
  .hero--banner .hero__grid { display: flex; flex-direction: column; align-items: center; padding-top: 22px; gap: 0; }
  .hero--banner .bnr, .hero--banner .hero__media { display: contents; }
  .bnr__h1 { order: 1; } .bnr__pillars { order: 2; } .bnr__rule { order: 3; } .bnr__tag { order: 4; }
  .hero--banner .stage { order: 5; width: 100%; margin-top: 22px; height: clamp(300px, 86vw, 440px); }
  .circles { order: 6; margin-top: 40px; }
  .bnr__offer { order: 7; } .hero--banner .hero__cta { order: 8; width: 100%; justify-content: center; } .hero--banner .trust { order: 9; justify-content: center; }
  .bnr__mono { width: clamp(120px, 34vw, 170px); }
  .bnr__name { font-size: clamp(25px, 7.4vw, 36px); }
  .bnr__city span { font-size: clamp(30px, 9vw, 40px); }
  .bnr__pillars { letter-spacing: .22em; font-size: 13px; }
  .bnr__tag { font-size: 12px; letter-spacing: .18em; text-align: center; }
  .bl--room { width: 58%; left: 2%; }
  .bl--eye { width: 54%; right: 3%; transform: translateZ(30px); }
  .bl__wave { bottom: -18px; }
  .circle__img { width: clamp(84px, 25vw, 110px); }
  .circle__t { font-size: 11.5px; letter-spacing: .18em; }
}

/* ---------- contact: message buttons and the form */
.cbtns { display: flex; flex-wrap: wrap; gap: 10px; margin: 6px 0 26px; }
.cbtn { display: inline-flex; align-items: center; gap: 9px; min-height: 48px; padding: 0 18px; border-radius: 999px; text-decoration: none; font: 500 14.5px/1 var(--sans); border: 1px solid var(--line); background: #fff; color: var(--ink); transition: transform .2s, border-color .2s; }
.cbtn svg { font-size: 20px; color: var(--gold-text); }
.cbtn:hover { transform: translateY(-2px); border-color: var(--gold-500); }
.cbtn--wa { background: #25d366; border-color: #25d366; color: #052b14; }
.cbtn--wa svg { color: #052b14; }
.visit__grid { align-items: start; }
.map--small { min-height: 180px; height: 180px; margin-top: 22px; }
.visit__form { position: relative; }
.cform { background: #fff; border-radius: var(--r-lg); padding: clamp(22px, 3vw, 34px); box-shadow: var(--shadow); border: 1px solid rgba(201, 161, 101, .25); }
.cform__t { font: 500 clamp(26px, 2.8vw, 34px)/1.1 var(--serif); }
.cform__s { color: var(--muted); font-size: 15.5px; margin: 8px 0 20px; }
.cform__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.cform__row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
.fld { margin: 0 0 14px; border: 0; padding: 0; min-width: 0; }
.fld > label, .fld legend { display: block; font: 500 12px/1.4 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--gold-text); margin-bottom: 6px; padding: 0; }
.fld input, .fld select, .fld textarea { width: 100%; min-height: 48px; padding: 11px 14px; border: 1px solid rgba(43, 22, 48, .2); border-radius: 12px; background: var(--ivory); font: 400 16px/1.3 var(--sans); color: var(--ink); }
.fld textarea { resize: vertical; min-height: 90px; }
.fld input:focus, .fld select:focus, .fld textarea:focus { outline: none; border-color: var(--gold-500); box-shadow: 0 0 0 3px rgba(201, 161, 101, .25); }
.fld--via { display: flex; flex-wrap: wrap; gap: 8px; }
.fld--via legend { width: 100%; }
.via { position: relative; }
.via input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.via span { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px; border-radius: 999px; border: 1px solid rgba(43, 22, 48, .2); font-size: 15px; transition: background-color .2s, border-color .2s, color .2s; }
.via svg { font-size: 18px; }
.via input:checked + span { background: var(--plum-800); border-color: var(--plum-800); color: var(--gold-300); }
.via input:focus-visible + span { outline: 2px solid var(--gold-500); outline-offset: 2px; }
.cform__consent { font-size: 13px; color: var(--muted); margin: 4px 0 18px; }
.cform__go .btn { width: 100%; }
@media (max-width: 560px) { .cform__row { grid-template-columns: 1fr; } }

/* ---------- dock: WhatsApp · call · Book */
@media (max-width: 899px) {
  .dock { grid-template-columns: auto 48px 1fr; }
  .dock__btn--wa { background: #25d366; border-color: #25d366; color: #052b14; padding: 0 14px; }
  .dock__btn--icon { padding: 0; }
  .dock__btn--icon svg { font-size: 20px; }
}
.fld--via > label.via { display: inline-block; margin: 0; padding: 0; font: 400 15px/1 var(--sans); letter-spacing: 0; text-transform: none; color: var(--ink); }
.dock__btn { text-align: center; white-space: nowrap; }

/* WhatsApp in the brand colours (Valentina 2026-10-07: "green — we don't like it") */
.cbtn--wa { background: var(--plum-700); border-color: var(--plum-700); color: var(--gold-300); }
.cbtn--wa svg { color: var(--gold-300); }
.cbtn--wa:hover { border-color: var(--gold-500); }
@media (max-width: 899px) { .dock__btn--wa { background: var(--plum-600); border-color: rgba(221, 189, 131, .55); color: var(--gold-300); } }

/* v5 (2026-10-08). Valentina's Android phone painted the gradient fills of the 3D price cards and the team
   arches as transparent, drew a dark-red block where the blurred card shadows are, and the floating cards
   flickered. On touch screens those blocks now get flat, solid paint: no gradients, blurred shadows,
   blend modes, backdrop filters or endless float under 3D transforms. Desktop keeps the full look. */

/* author display rules (.pc__p is flex, .pill is inline-flex) were beating the hidden attribute, so the
   regular "$25" showed under "Free $25" — and expired offers would have stayed on screen after Dec 31 */
[hidden] { display: none !important; }

/* a solid colour under every gradient fill, in case a GPU drops the gradient */
.member__mono { background-color: #34193a; }
.final { background-color: var(--plum-900); }

@media (hover: none), (max-width: 899px) {
  .member__mono { background: #34193a; }
  .final { background: var(--plum-900); }
  .c3d__f { animation: none; }
  .c3d__gloss { display: none; }
  .c3d .c3d__in { box-shadow: 0 0 0 1px rgba(241, 220, 171, .38); filter: none; }
  .c3d--price .c3d__in { background: #43264a; }
  .c3d--price.c3d--c .c3d__in { background: #33193a; box-shadow: 0 0 0 1px rgba(241, 220, 171, .7); }
  .chip3d { background: rgba(36, 17, 40, .94); backdrop-filter: none; -webkit-backdrop-filter: none; box-shadow: none; }
}
/* the plum band above the offer cards, painted as a hard inset shadow instead of a hard-stop gradient */
@media (max-width: 899px) { .offers { background: var(--ivory); box-shadow: inset 0 90px 0 var(--plum-800); } }