/* Hiwaga — glass stage */
:root{
  --ink:#2e1f24; --ink-2:#4a3a42; --mute:#5e4a55;
  --white:#ffffff; --plum:#8c1d54; --plum-d:#6a1540; --gold:#c9a24c; --gold-l:#ecd08a; --gold-t:#8a6a1f;
  --sans:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif; --serif:'Cormorant Garamond',Georgia,serif;
  --ease:cubic-bezier(.22,1,.36,1);
  --pad-x:clamp(22px,3.2vw,48px); --pad-y:clamp(18px,2.6vh,30px);
}
*,*::before,*::after{box-sizing:border-box}
html{background:#ecbfcd;scroll-snap-type:y mandatory;-webkit-text-size-adjust:100%}
html.is-loading{overflow:hidden}
body{margin:0;font-family:var(--sans);font-weight:400;color:var(--ink);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}
h1,h2,p,ul{margin:0}ul{padding:0;list-style:none}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
img{display:block;max-width:100%}
::selection{background:var(--plum);color:#fff}
@media (hover:hover) and (pointer:fine){html.js body,html.js a,html.js button{cursor:none}html.js.map-on body,html.js.map-on button{cursor:default}html.js #lux{cursor:pointer}} /* over the clinics map the plain thin arrow shows instead of the ring, so a dot can be picked exactly */
@media (prefers-reduced-motion:reduce){html{scroll-snap-type:none}}

/* world */
.world{position:fixed;inset:0;width:100%;height:100%;z-index:0}
.grain{position:fixed;inset:-50%;z-index:3;pointer-events:none;opacity:.07;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:180px 180px}
.track{position:relative;z-index:0;padding-bottom:calc(100lvh - 100svh)} /* a phone with its URL bar hidden is taller than a chapter, so without this the last chapter cannot be scrolled to */
.snap{height:100vh;height:100svh;scroll-snap-align:start}

/* loader */
.loader{position:fixed;inset:0;z-index:60;background:#a4a1a0;display:grid;place-items:center;transition:opacity .9s var(--ease),visibility 0s .9s}
.loader.is-done{opacity:0;visibility:hidden}
.loader__logo{position:relative;z-index:1;width:clamp(180px,22vw,300px);height:auto;filter:drop-shadow(0 2px 18px rgba(0,0,0,.18))}
.loader__core{position:absolute;left:50%;top:50%;width:260px;height:260px;margin:-130px;border-radius:50%;background:radial-gradient(circle,rgba(255,236,200,1) 0%,rgba(255,200,110,.85) 18%,rgba(226,160,80,.35) 42%,rgba(226,160,80,0) 70%);animation:ignite 1.2s var(--ease) forwards;transform:scale(.2);opacity:0}
@keyframes ignite{to{transform:scale(1);opacity:1}}

/* glass panel */
.glass{position:fixed;z-index:2;inset:clamp(10px,3.4vh,30px) clamp(10px,3vw,44px);border-radius:clamp(14px,2.2vw,30px);overflow:hidden;
  background:linear-gradient(165deg,rgba(255,255,255,.26) 0%,rgba(255,255,255,.12) 45%,rgba(255,255,255,.05) 100%);
  border:1px solid rgba(255,255,255,.55);
  box-shadow:0 50px 120px -40px rgba(20,16,18,.45),0 2px 0 rgba(255,255,255,.35) inset,0 -1px 0 rgba(0,0,0,.06) inset;
  backdrop-filter:blur(14px) saturate(1.05);-webkit-backdrop-filter:blur(14px) saturate(1.05)}
.stage{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}
.gl{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none}

/* top bar */
.top{position:absolute;left:0;right:0;top:0;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:var(--pad-y) var(--pad-x) 0;height:calc(var(--pad-y) + 44px)}
.brand{position:relative;display:flex;align-items:center;isolation:isolate;border-radius:14px;background:linear-gradient(145deg,#a3286a 0%,#8c1d54 50%,#6f1544 100%);border:1px solid rgba(255,255,255,.52);box-shadow:inset 0 1px 0 rgba(255,255,255,.72),inset 0 -1px 0 rgba(60,8,34,.3),inset 0 0 18px rgba(255,255,255,.12),0 12px 28px -14px rgba(106,21,64,.6),0 2px 6px -2px rgba(106,21,64,.25);backdrop-filter:blur(12px) saturate(1.5);-webkit-backdrop-filter:blur(12px) saturate(1.5);transition:transform .5s var(--ease),box-shadow .5s var(--ease);gap:7px;padding:6px 14px 6px 10px} /* the Hiwaga tile in the brand plum of the booking button, made glass by its lit rim, a soft highlight, a sheen that glides across and a glow that breathes with the lotus */
.brand::before{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(130% 110% at 16% -10%,rgba(255,255,255,.34),rgba(255,255,255,.08) 38%,rgba(255,255,255,0) 62%),linear-gradient(115deg,rgba(255,255,255,0) 58%,rgba(255,255,255,.09) 70%,rgba(255,255,255,0) 82%);pointer-events:none;z-index:-1}
.brand:hover{transform:translateY(-1px)}
.brand::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(105deg,rgba(255,255,255,0) 35%,rgba(255,255,255,.42) 47%,rgba(255,255,255,.1) 53%,rgba(255,255,255,0) 63%);background-size:260% 100%;background-position:140% 0;animation:tileSheen 6.6s ease-in-out 2.6s infinite}
.is-ready .brand{animation:tileGlow 4.2s ease-in-out 1.2s infinite}
@keyframes tileSheen{0%{background-position:140% 0}32%{background-position:-40% 0}100%{background-position:-40% 0}}
@keyframes tileGlow{0%,100%{box-shadow:inset 0 1px 0 rgba(255,255,255,.72),inset 0 -1px 0 rgba(60,8,34,.3),inset 0 0 18px rgba(255,255,255,.12),0 12px 28px -14px rgba(106,21,64,.6),0 2px 6px -2px rgba(106,21,64,.25)}50%{box-shadow:inset 0 1px 0 rgba(255,255,255,.85),inset 0 -1px 0 rgba(60,8,34,.3),inset 0 0 22px rgba(255,255,255,.2),0 14px 34px -12px rgba(140,29,84,.72),0 0 18px -4px rgba(201,162,76,.35)}}
@media (prefers-reduced-motion:reduce){.brand,.brand::after{animation:none}}
.brand__word img{filter:drop-shadow(0 1px 0 rgba(50,6,30,.45))}
.brand__mark{height:clamp(24px,2.2vw,30px);width:auto;transform-origin:50% 80%;opacity:0;filter:drop-shadow(0 0 0 rgba(201,162,76,0))}
.brand__word{position:relative;display:block;height:clamp(18px,1.75vw,23px);clip-path:inset(0 100% 0 0)}
.brand__word img{height:100%;width:auto;display:block}
.brand__word i{position:absolute;inset:0;pointer-events:none;-webkit-mask:url(assets/logo-word-ink.png) center/contain no-repeat;mask:url(assets/logo-word-ink.png) center/contain no-repeat;background:linear-gradient(110deg,transparent 38%,rgba(232,196,110,.95) 50%,transparent 62%);background-size:260% 100%;background-position:130% 0;animation:sweep 4.4s ease-in-out 2.4s infinite} /* normal mode: the gold crosses the wordmark, then rests about 3 s */
.is-ready .brand__mark{animation:bloom .9s var(--ease) .1s both,breathe 4.2s ease-in-out 1.2s infinite}
.is-ready .brand__word{animation:wipe .9s var(--ease) .35s both}
@keyframes bloom{0%{opacity:0;transform:scale(.3) rotate(-25deg)}60%{opacity:1;transform:scale(1.08) rotate(3deg)}100%{opacity:1;transform:scale(1) rotate(0)}}
@keyframes breathe{0%,100%{transform:perspective(300px) rotateY(-34deg) translateY(0) scale(1);filter:brightness(1.35) saturate(1.15) drop-shadow(0 0 2px rgba(255,236,190,.55))}50%{transform:perspective(300px) rotateY(34deg) translateY(-1.5px) scale(1.08);filter:brightness(1.5) saturate(1.2) drop-shadow(0 0 8px rgba(236,208,138,.85))}} /* the lotus glows warm on the plum glass as it breathes */
@keyframes wipe{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 -2% 0 0)}}
@keyframes sweep{0%{background-position:130% 0}31%{background-position:-130% 0}100%{background-position:-130% 0}}
.is-bright .brand__word i{animation:sweepBright 3.4s ease-in-out .4s infinite} /* bright mode: the gold light crosses the wordmark from the left at its usual pace, then rests 2 s */
.is-relit .brand__word i{animation-delay:.4s} /* switching bright mode off by hand shines the wordmark again soon, as switching it on does */
@keyframes sweepBright{0%{background-position:130% 0}40%{background-position:-130% 0}100%{background-position:-130% 0}}
.lotus{width:20px;height:20px;fill:var(--gold);flex:none}
.links{position:relative;display:none;gap:clamp(14px,2vw,34px);font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:var(--ink-2);height:44px;align-items:center}
@media (min-width:860px){.links{display:flex}}
.links a{position:relative;padding:14px 0;transition:color .3s,transform .4s var(--ease)}.links a.is-active{color:var(--ink)}.links a:hover{color:var(--plum);transform:translateY(-1px)}
.links a::after{content:"";position:absolute;left:0;right:0;bottom:8px;height:1px;background:var(--plum);transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease)}.links a:hover::after{transform:scaleX(1)}
.links__glow{position:absolute;bottom:-1px;left:0;width:60px;height:2px;border-radius:2px;background:var(--gold);box-shadow:0 0 12px 2px rgba(201,162,76,.8),0 0 30px 6px rgba(201,162,76,.35);transition:transform .8s var(--ease),width .8s var(--ease);transform-origin:left}
.top__right{display:flex;align-items:center;gap:22px;font-size:12px;letter-spacing:.18em;text-transform:uppercase;font-weight:600;color:var(--ink)}
.top__phone{display:none}@media (min-width:1320px){.top__phone{display:inline}}
@media (min-width:861px) and (max-width:1100px){.links{font-size:10.5px;letter-spacing:.14em;gap:15px}}
.lb{position:absolute;inset:0;z-index:8;display:grid;place-items:center;background:rgba(30,24,28,.74);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);opacity:0;visibility:hidden;transition:opacity .35s var(--ease),visibility 0s .35s}
.lb.is-on{opacity:1;visibility:visible;transition:opacity .35s var(--ease)}
.lb figure{margin:0;max-width:min(1100px,84%);text-align:center}
.lb img{max-width:100%;max-height:72vh;border-radius:12px;box-shadow:0 40px 100px -30px rgba(0,0,0,.7);border:1px solid rgba(255,255,255,.35)}
.lb figcaption{margin-top:14px;color:#fff;font-family:var(--serif);font-style:italic;font-size:17px;letter-spacing:.01em}
.lb button{position:absolute;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.45);background:rgba(255,255,255,.12);color:#fff;font-size:24px;line-height:1;cursor:pointer;display:grid;place-items:center;transition:background-color .3s}.lb button:hover{background:rgba(255,255,255,.28)}
.lb__x{top:18px;right:18px}.lb__p{left:18px;top:50%;transform:translateY(-50%)}.lb__n{right:18px;top:50%;transform:translateY(-50%)}
/* the Videos block: the card, and the channel and Instagram links on a line beneath it, so they stay in view while a video plays */
.video{--lit:0;transform:translateY(calc(-7px * var(--lit)));position:absolute;right:var(--pad-x);bottom:clamp(44px,6vh,60px);width:min(420px,34vw);pointer-events:auto}
.video__card{position:relative;width:100%;aspect-ratio:16/9;border-radius:14px;overflow:hidden;background:#2a2226 center/cover no-repeat;box-shadow:0 30px 60px -30px rgba(0,0,0,.6);border:1px solid rgba(255,255,255,.5);display:grid;place-items:center}
.video__card::before{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(20,14,18,.45),rgba(20,14,18,0) 55%)}
.video__card iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.video__play{position:relative;width:34px;height:34px;border-radius:50%;border:1.5px solid rgba(255,255,255,.85);background:rgba(20,14,18,.22);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);cursor:pointer;display:grid;place-items:center;transition:background-color .35s,transform .4s var(--ease)}.video__play:hover{background:rgba(20,14,18,.4);transform:scale(1.05)} /* a quiet ring, not a gold disc: the picture and the headline keep the eye */
.video__play span{width:0;height:0;border-left:10px solid #fff;border-top:6px solid transparent;border-bottom:6px solid transparent;margin-left:3px}
.video__links{display:flex;align-items:center;gap:18px;margin:11px 2px 0;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:var(--ink)}
.video__note{margin:0 auto 0 0;color:var(--ink-2)}
.video__links a{display:inline-flex;align-items:center;gap:7px;color:var(--ink);transition:color .3s}@media (hover:hover){.video__links a:hover{color:var(--plum)}}
.video__links svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.offers{position:absolute;right:var(--pad-x);bottom:clamp(56px,7vh,72px);width:min(600px,48vw);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:0;padding:0;list-style:none;pointer-events:auto}
.fc--offer .fc__img{aspect-ratio:21/8}
.oc__tag{position:absolute;left:10px;top:9px;z-index:1;padding:4px 8px;border-radius:999px;background:rgba(255,255,255,.5);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);font-style:normal;font-size:8px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--gold-t)}
.oc__price{display:block;margin-top:5px;font-family:var(--serif);font-weight:700;font-size:22px;line-height:1;color:var(--ink)}.oc__price s{font-family:var(--sans);font-weight:500;font-size:10.5px;color:var(--ink-2);margin-left:7px}
.fc--offer small{text-transform:none;letter-spacing:.01em;font-size:11px;font-weight:600;opacity:.9;margin-top:4px}
.fine{font-size:11.5px;color:var(--ink-2)}
.facts button.inline,.facts a.inline{all:unset;cursor:pointer;font:inherit;letter-spacing:inherit;text-transform:inherit;color:inherit;border-bottom:1px solid rgba(34,30,38,.3);transition:color .3s}.facts button.inline:hover,.facts a.inline:hover{color:var(--plum)}
.offers{gap:16px}

/* feature cards: frosted, low-contrast edge, one photo treatment, title + one meta line + arrow */
.feat{position:absolute;right:var(--pad-x);bottom:clamp(56px,7vh,72px);width:min(500px,40vw);pointer-events:auto;display:flex;flex-direction:column;align-items:flex-end}
.fcs{width:100%}
.feat--1{width:min(320px,26vw)}
.fcs{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:0;padding:0;list-style:none}
.feat--1 .fcs{grid-template-columns:1fr}
.fc{--lit:0;position:relative;min-width:0;border-radius:16px;background:transparent;border:1px solid rgba(255,238,200,calc(.34 + .5 * var(--lit)));box-shadow:0 18px 40px -22px rgba(201,162,76,calc(.75 * var(--lit)));overflow:hidden;transform:translateY(calc(-7px * var(--lit)));transition:transform .5s var(--ease),background-color .6s var(--ease),border-color .35s,box-shadow .35s}
.fc::before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(160deg,rgba(255,244,220,.22),rgba(255,244,220,.06));opacity:var(--lit);pointer-events:none;z-index:1;transition:opacity .3s}
.fc:hover{transform:translateY(calc(-3px - 7px * var(--lit)));background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.55)}
.fc__btn{all:unset;box-sizing:border-box;display:block;width:100%;cursor:pointer} /* border-box, so a card's padding never pushes its content past the card edge */.fc__btn:focus-visible{outline:2px solid var(--gold);outline-offset:-2px;border-radius:16px}
.fc__img{display:block;position:relative;aspect-ratio:21/7;overflow:hidden}
.fc__img::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(200,190,180,.22),rgba(200,190,180,0) 50%)}
.fc__img img,.fc__face,.row img{filter:saturate(.42) sepia(.22) contrast(.9) brightness(1.05);transition:filter .7s var(--ease),transform 1.2s var(--ease)}
.fc:hover .fc__img img,.fc:hover .fc__face,.row:hover img{filter:saturate(.85) sepia(.06) contrast(.95)}
/* a touch screen never hovers, so without this every photograph on a phone keeps the muted treatment for good and the faces stay grey */
@media (hover:none){.fc__img img,.fc__face,.row img{filter:saturate(.85) sepia(.06) contrast(.95)}}
.fc__img img{display:block;width:100%;height:100%;object-fit:cover}.fc:hover .fc__img img{transform:scale(1.04)}
.fc__ph{display:grid;place-items:center;width:100%;height:100%;font-size:8.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-2);font-weight:700;background:linear-gradient(135deg,rgba(201,162,76,.22),rgba(255,255,255,.2))}
.fc__body{display:block;padding:9px 14px 11px;text-shadow:0 1px 0 rgba(255,255,255,.4)}
.fc b{display:flex;align-items:baseline;justify-content:space-between;gap:10px;font-size:14.5px;font-weight:700;color:var(--ink);line-height:1.25;letter-spacing:.01em}
.fc b i{font-style:normal;font-size:15px;color:var(--gold-t);transition:transform .5s var(--ease),color .3s}.fc:hover b i{transform:translateX(4px);color:var(--plum)}
.fc small{display:block;margin-top:5px;font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);font-weight:700;opacity:.82;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fc--doc .fc__btn{display:grid;grid-template-columns:56px 1fr;gap:12px;align-items:center;padding:12px 14px}
.fc__face{display:block;width:56px;height:56px;border-radius:50%;object-fit:cover;object-position:top;border:1px solid rgba(255,255,255,.7)}
.fc--doc .fc__body{padding:0;min-width:0;text-shadow:0 1px 0 rgba(255,255,255,.4)}.fc--doc b{font-size:13.5px}.fc--doc small{text-transform:none;letter-spacing:.02em;font-size:11px;font-weight:600;opacity:.9;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.35}
.more{all:unset;display:inline-flex;align-items:center;gap:8px;margin-top:10px;cursor:pointer;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;font-weight:700;color:var(--ink);border-bottom:1px solid rgba(34,30,38,.35);padding-bottom:3px;transition:color .3s}.more i{font-style:normal;color:var(--gold-t);transition:transform .5s var(--ease)}.more:hover{color:var(--plum)}.more:hover i{transform:translateX(4px)}
.for{margin:14px 0 0;font-size:11.5px;color:var(--ink-2);font-weight:500;line-height:1.7}.for span{font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;font-weight:700;color:var(--gold-t);margin-right:8px}
/* sheet lists ("View all") */
.pagelink{margin:22px 0 0!important;display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px}.pagelink .more{margin-top:0;color:var(--ink-2)}@media (hover:hover){.pagelink .more:hover{color:var(--plum)}}.pagelink a{display:inline-flex;align-items:center;gap:8px;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;font-weight:700;color:var(--ink);border-bottom:1px solid rgba(34,30,38,.35);padding-bottom:3px;transition:color .3s,border-color .3s}.pagelink a:hover{color:var(--plum);border-color:var(--plum)}.pagelink i{font-style:normal;color:var(--gold-t)}
.dlg__main--list{max-width:720px}
.rows{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:9px}
.row{all:unset;display:grid;grid-template-columns:76px 1fr auto;gap:14px;align-items:center;width:100%;cursor:pointer;box-sizing:border-box;padding:9px 14px 9px 9px;border-radius:14px;border:1px solid rgba(255,238,200,.5);background:linear-gradient(160deg,rgba(255,255,255,.62),rgba(255,255,255,.4));box-shadow:0 14px 30px -24px rgba(40,28,34,.45);transition:transform .5s var(--ease),border-color .4s,box-shadow .5s var(--ease)}.row:hover{transform:translateY(-2px);border-color:rgba(201,162,76,.85);box-shadow:0 20px 40px -22px rgba(201,162,76,.55)}
.row img,.row__ph{width:72px;height:50px;object-fit:cover;border-radius:8px;display:block;background:linear-gradient(135deg,rgba(201,162,76,.22),rgba(255,255,255,.4))}.row img.round{width:50px;height:50px;border-radius:50%;object-position:top;margin:0 11px}
.row span{min-width:0}.row b{display:block;font-size:15px;font-weight:600;color:var(--ink);transition:color .3s}.row:hover b{color:var(--plum)}.row small{display:block;margin-top:3px;font-size:11.5px;color:var(--ink-2);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row i{font-style:normal;color:var(--gold-t);font-size:16px;transition:transform .5s var(--ease)}.row:hover i{transform:translateX(4px)}
/* detail sheet */
.dlg{position:absolute;inset:0;z-index:9;display:grid;place-items:center;padding:clamp(12px,3vh,32px) clamp(12px,4vw,60px);background:rgba(30,24,28,.5);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);opacity:0;visibility:hidden;transition:opacity .35s var(--ease),visibility 0s .35s}
.dlg.is-on{opacity:1;visibility:visible;transition:opacity .35s var(--ease)}
.dlg__sheet{position:relative;width:min(1040px,100%);max-height:100%;overflow:auto;border-radius:18px;background:linear-gradient(165deg,rgba(255,255,255,.97),rgba(250,247,243,.95));border:1px solid rgba(255,255,255,.9);box-shadow:0 60px 120px -40px rgba(0,0,0,.6);padding:clamp(20px,3vw,40px);transform:translateY(14px);transition:transform .45s var(--ease);overscroll-behavior:contain}
.dlg.is-on .dlg__sheet{transform:none}
.dlg__x{position:absolute;top:clamp(18px,4vh,44px);right:clamp(18px,5vw,72px);width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.6);background:rgba(34,30,38,.55);color:#fff;font-size:22px;line-height:1;cursor:pointer;display:grid;place-items:center;transition:background-color .3s}.dlg__x:hover{background:var(--plum)}
.dlg__grid{display:grid;grid-template-columns:300px 1fr;gap:32px;align-items:start}
.dlg__side img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:12px}.dlg__side img.portrait{aspect-ratio:1;object-position:top}
.facts2{margin:16px 0 0;display:grid;grid-template-columns:auto 1fr;gap:7px 12px;font-size:12px}.facts2 dt{font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--plum);padding-top:3px}.facts2 dd{margin:0;color:var(--ink-2);font-weight:500;line-height:1.45}.facts2 a{color:var(--ink);font-weight:600}.facts2 a:hover{color:var(--plum)}
.dlg__cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}.dlg__cta .btn{height:40px;padding:0 16px;font-size:10px}
.eyebrow2{margin:0;font-size:10px;letter-spacing:.24em;text-transform:uppercase;font-weight:700;color:var(--plum)}
.dlg__main h3{font-family:var(--sans);font-weight:600;font-size:clamp(22px,2.4vw,32px);line-height:1.1;letter-spacing:.04em;text-transform:uppercase;margin:8px 0 12px;color:var(--ink)}
.dlg__main h4{font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--plum);font-weight:700;margin:22px 0 8px}
.dlg__main p{margin:0 0 10px;font-size:14px;line-height:1.65;color:var(--ink-2);font-weight:500}.dlg__main p b{color:var(--ink)}.dlg__main .lead{font-size:16px;color:var(--ink)}
.dlg__main ol,.dlg__main ul{margin:0;padding-left:18px;font-size:13.5px;line-height:1.7;color:var(--ink-2);font-weight:500}
.chips{display:flex;flex-wrap:wrap;gap:8px}.chips span,.chips button,.chips a{font:inherit;font-size:11.5px;font-weight:600;color:var(--ink);padding:5px 11px;border-radius:999px;border:1px solid rgba(34,30,38,.25);background:rgba(255,255,255,.55);cursor:default}.chips button,.chips a{cursor:pointer;transition:border-color .3s,color .3s}.chips button:hover,.chips a:hover{border-color:var(--plum);color:var(--plum)}
.docchips{display:flex;flex-wrap:wrap;gap:10px 18px}.docchips button,.docchips a{all:unset;cursor:pointer;display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;color:var(--ink)}.docchips button:hover,.docchips a:hover{color:var(--plum)}.docchips img{width:36px;height:36px;border-radius:50%;object-fit:cover;object-position:top;border:1px solid rgba(255,255,255,.9)}
.dlg__main details{border-top:1px solid rgba(34,30,38,.18);padding:9px 0}.dlg__main summary{cursor:pointer;font-size:13.5px;font-weight:700;color:var(--ink);list-style:none;display:flex;justify-content:space-between;gap:10px}.dlg__main summary::after{content:"+";color:var(--plum);font-weight:400}.dlg__main details[open] summary::after{content:"–"}.dlg__main details p{margin:8px 0 0}
.gal{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.gal button{all:unset;cursor:pointer;display:block;border-radius:10px;overflow:hidden;aspect-ratio:4/3}.gal img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s var(--ease)}.gal button:hover img{transform:scale(1.05)}
html.dlg-open{overflow:hidden}
.lb{z-index:12}
.lux{position:relative;width:38px;height:20px;border-radius:10px;border:1px solid rgba(34,30,38,.5);background:none;cursor:pointer;padding:0;transition:border-color .35s,background-color .35s} /* a small switch: the knob slides right and turns gold when bright mode is on */
.lux::before{content:"";position:absolute;inset:-12px -8px} /* a finger-sized target around the small switch */
.lux::after{content:"";position:absolute;left:2px;top:2px;width:14px;height:14px;border-radius:50%;background:var(--ink);transition:transform .35s var(--ease),background-color .35s}
.lux svg{display:none}
a:focus-visible,button:focus-visible{outline:2px solid var(--ink);outline-offset:3px}.lb button:focus-visible{outline-color:#fff} /* the same ring for every link and button reached with the keyboard */
@media (hover:hover){.lux:hover{border-color:var(--plum)}}
.is-bright .lux{border-color:var(--plum);background:none}
.is-bright .lux::after{transform:translateX(18px);background:var(--plum)}
html.is-bright{background:#ecE9e6}
.is-bright .loader{background:#ece9e6}
.is-bright .fc{background:rgba(255,255,255,.45);border-color:rgba(46,31,36,calc(.14 - .14 * var(--lit)));box-shadow:0 18px 40px -22px rgba(201,162,76,calc(.75 * var(--lit))),inset 0 0 0 1px rgba(201,162,76,calc(.85 * var(--lit)))} /* the cream edge vanishes on the cream ground: in bright mode a card takes an ink edge, and the gold one lights from inside when the object points at it */
.is-bright .glass{background:linear-gradient(165deg,rgba(255,255,255,.82) 0%,rgba(255,255,255,.64) 45%,rgba(255,253,248,.48) 100%);border-color:#fff;box-shadow:0 50px 120px -40px rgba(20,16,18,.28),0 2px 0 rgba(255,255,255,.6) inset,0 -1px 0 rgba(0,0,0,.04) inset}
.is-bright .grain{opacity:.02}
.top__book{display:none;white-space:nowrap;padding:10px 16px;border:1px solid rgba(34,30,38,.6);border-radius:999px;transition:background-color .3s,color .3s,border-color .3s}
.top__book:hover,.top__book.is-active{background:var(--plum);color:#fff;border-color:var(--plum)}
@media (min-width:860px){.top__book{display:inline-block}}
/* the Book list under the Book button: WhatsApp or a callback (bookMenu in tools/build-content.mjs, opened by track.js). The header
   rises above the chapters and the map pins while it is open. On a phone the menu carries the same two choices. */
.book{position:relative;display:none}@media (min-width:860px){.book{display:inline-flex}}
.top:has(.book.is-open){z-index:8}
#dlgSheet:focus{outline:none} /* the sheet takes focus when it opens so the keyboard starts inside it; its own links and fields keep their ring */
.book.is-open .top__book{background:var(--plum);color:#fff;border-color:var(--plum)}
.book__pop{position:absolute;right:0;top:calc(100% + 12px);z-index:40;width:284px;padding:6px;display:grid;gap:2px;border-radius:18px;text-align:left;text-transform:none;letter-spacing:0;font-weight:400;white-space:normal;
  background:linear-gradient(165deg,rgba(255,255,255,.96) 0%,rgba(255,253,248,.9) 100%);border:1px solid rgba(255,255,255,.85);box-shadow:0 34px 70px -30px rgba(20,16,18,.5),0 2px 0 rgba(255,255,255,.7) inset;backdrop-filter:blur(18px) saturate(1.05);-webkit-backdrop-filter:blur(18px) saturate(1.05);
  opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .35s var(--ease),transform .35s var(--ease),visibility 0s linear .35s}
.book.is-open .book__pop{opacity:1;visibility:visible;transform:none;transition:opacity .35s var(--ease),transform .35s var(--ease),visibility 0s}
.book__row{display:flex;align-items:center;gap:13px;width:100%;min-height:58px;padding:9px 12px;border-radius:13px;text-align:left;color:var(--ink);font:inherit;transition:background-color .25s}
.book__row:hover{background:rgba(140,29,84,.07)}.book__row:focus-visible{outline-offset:-2px}
.book__ic{display:grid;place-items:center;width:38px;height:38px;flex:none;border-radius:50%;border:1px solid rgba(140,29,84,.32);color:var(--plum)}
.book__ic--wa{background:var(--plum);border-color:var(--plum);color:#fff}
.book__ic .wa{width:18px;height:18px;margin:0;fill:currentColor}.book__ic .bi{width:18px;height:18px;margin:0;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.book__row b{display:block;font-size:11px;line-height:1.3;letter-spacing:.16em;text-transform:uppercase;font-weight:700}
.book__row small{display:block;margin-top:3px;font-size:13px;line-height:1.35;color:var(--ink-2)}
.book.is-ready [data-book-open]::after{content:"";display:inline-block;width:6px;height:6px;margin:0 0 3px 10px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);transition:transform .35s var(--ease)} /* the arrow shows only once the list works */
.book.is-open [data-book-open]::after{transform:translateY(3px) rotate(-135deg)}
@media (prefers-reduced-motion:reduce){.book__pop,.book.is-open .book__pop,.book [data-book-open]::after{transition:none}}
.burger{position:relative;width:38px;height:38px;margin-right:-8px}.burger::before{content:"";position:absolute;inset:-4px} /* a 46px target */
@media (min-width:860px){.burger{display:none}}
.burger i{position:absolute;left:9px;right:9px;height:1.5px;background:var(--ink);transition:transform .4s var(--ease),top .4s var(--ease)}
.burger i:first-child{top:15px}.burger i:last-child{top:22px}
.menu-open .burger i:first-child{top:18px;transform:rotate(45deg)}.menu-open .burger i:last-child{top:18px;transform:rotate(-45deg)}
.rule{position:absolute;left:var(--pad-x);right:var(--pad-x);top:calc(var(--pad-y) + 44px);height:1px;z-index:4;background:linear-gradient(90deg,rgba(34,30,38,.35),rgba(34,30,38,.18) 60%,rgba(34,30,38,.35))}

/* chapters */
.cap{position:absolute;left:0;top:0;z-index:4;margin:0;font-family:var(--serif);font-style:italic;font-weight:500;font-size:clamp(15px,1.25vw,19px);line-height:1;letter-spacing:.01em;color:var(--ink-2);white-space:nowrap;text-align:center;pointer-events:none;opacity:0;will-change:transform,opacity;text-shadow:0 1px 0 rgba(255,255,255,.4)}
.chap{position:absolute;inset:0;z-index:4;pointer-events:none;visibility:hidden}
.chap.is-active,.chap.is-leaving{visibility:visible}
.copy{position:absolute;left:var(--pad-x);top:50%;transform:translateY(-48%);max-width:min(560px,52vw)}
.trust{display:flex;flex-wrap:wrap;align-items:center;gap:6px 0;margin:0 0 16px;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:var(--ink-2)}
.trust span{display:inline-flex;align-items:center;white-space:nowrap}
.trust span+span::before{content:"";display:inline-block;width:4px;height:4px;border-radius:50%;background:var(--gold);margin:0 10px 1px 10px}
.eyebrow{font-size:11px;letter-spacing:.3em;text-transform:uppercase;font-weight:700;color:var(--plum);margin-bottom:18px}
.eyebrow a{pointer-events:auto;border-bottom:1px solid rgba(140,29,84,.32);transition:border-color .3s}.eyebrow a:hover,.eyebrow a:focus-visible{border-bottom-color:currentColor}
.h em{font-family:var(--serif);font-style:italic;font-weight:500;text-transform:none;letter-spacing:.005em;font-size:1.22em;line-height:.9;color:var(--ink)}
.h{font-family:var(--sans);font-weight:600;font-size:clamp(26px,3.4vw,46px);line-height:1.12;letter-spacing:.06em;text-transform:uppercase;color:var(--ink);text-shadow:0 1px 0 rgba(255,255,255,.35)}
.h span{display:block}
.sub{margin-top:18px;font-size:clamp(14px,1.1vw,16px);line-height:1.7;color:var(--ink-2);font-weight:500;max-width:44ch}
.cta{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin-top:26px;pointer-events:auto}
.btn{display:inline-flex;align-items:center;height:44px;padding:0 22px;border-radius:999px;background:var(--plum);color:#fff;font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:600;box-shadow:0 14px 30px -14px rgba(106,21,64,.7);transition:transform .5s var(--ease),background-color .3s}
.btn:hover{transform:translateY(-2px);background:var(--plum-d);box-shadow:0 18px 40px -14px rgba(106,21,64,.8),0 0 0 4px rgba(140,29,84,.14)}
.btn--wa .wa{width:18px;height:18px;fill:currentColor;margin-right:10px;flex:none}
.btn .bi{width:15px;height:15px;margin-right:8px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.btn--line{background:rgba(255,255,255,.18);border:1px solid rgba(38,34,42,.45);color:var(--ink);box-shadow:none}.btn--line:hover{background:rgba(255,255,255,.4)}
.link{font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:var(--ink);border-bottom:1px solid rgba(38,34,42,.5);padding-bottom:3px}
.facts{position:absolute;right:var(--pad-x);bottom:clamp(96px,16vh,150px);display:flex;gap:clamp(24px,3vw,48px);text-align:right;pointer-events:auto}
.facts b{display:block;font-family:var(--serif);font-weight:600;font-size:clamp(22px,2.2vw,32px);line-height:1;color:var(--ink)}
.facts li{perspective:700px;transform-style:preserve-3d;cursor:default}
.facts .ch{display:inline-block;will-change:transform,opacity;transition:transform 1.1s var(--ease),opacity 1.1s var(--ease);transform-style:preserve-3d}
.facts li.is-scat .ch{opacity:.12;transition-duration:.9s}
.facts span{display:block;margin-top:6px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-2);font-weight:600}
.facts span.w{display:inline-block;margin:0;font:inherit;letter-spacing:inherit;text-transform:inherit;color:inherit;white-space:nowrap;transform-style:preserve-3d} /* a word's letters stay together, so labels only wrap between words */
.facts--contact{flex-direction:column;gap:16px}.facts--contact b{font-family:var(--sans);font-weight:700;font-size:15px;letter-spacing:.04em}
.facts--contact a:hover{color:var(--plum)}
.soc{display:inline-flex;align-items:center;justify-content:flex-end;gap:12px}
.soc a{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:50%;border:1px solid rgba(34,30,38,.3);color:var(--ink);background:rgba(255,255,255,.14);transition:background-color .3s,border-color .3s,color .3s,transform .45s var(--ease)}
.soc a:hover{color:#fff;background:var(--plum);border-color:var(--plum);transform:translateY(-2px)}
.soc svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.list{position:absolute;right:var(--pad-x);bottom:clamp(96px,16vh,150px);width:min(300px,30vw);pointer-events:auto}
.list li{display:flex;flex-direction:column;gap:2px;padding:12px 0;border-top:1px solid rgba(34,30,38,.28)}
.list li:last-child{border-bottom:1px solid rgba(34,30,38,.28)}
.list b{font-size:15px;font-weight:700;color:var(--ink);letter-spacing:.02em}
.list span{font-size:13px;color:var(--ink-2);font-weight:500}
.clinics{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 20px;margin:18px 0 0;padding:0;list-style:none;pointer-events:auto}
.clinics li{min-width:0;padding:8px 0;border-top:1px solid rgba(34,30,38,.22)}
.clinics .row{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.clinics b{font-size:13px;font-weight:700;color:var(--ink);letter-spacing:.02em}
.clinics .tel{font-size:12px;font-weight:600;color:var(--plum);font-variant-numeric:tabular-nums;white-space:nowrap}.clinics .tel:hover{color:var(--plum-d)}
.clinics .adr{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-top:2px;font-size:11px;line-height:1.35;color:var(--ink-2);font-weight:500}
.clinics .adr span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.clinics .map{flex:none;font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;font-weight:700;color:var(--plum)}.clinics .map:hover{color:var(--plum-d)}
#c7 .copy{max-width:min(440px,36vw)}
.inline{color:var(--plum);font-weight:600;border-bottom:1px solid rgba(140,29,84,.35);pointer-events:auto}
.list--docs{width:min(420px,38vw);display:grid;grid-template-columns:1fr 1fr;column-gap:22px}
.list--docs li{padding:8px 0}.list--docs b{font-size:13.5px}.list--docs span{font-size:11.5px}
.list b a{transition:color .3s}.list b a:hover{color:var(--plum)}
.list--docs .consult{margin-top:4px;font-size:10px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--plum);width:max-content;border-bottom:1px solid rgba(140,29,84,.35)}.list--docs .consult:hover{color:var(--plum-d)}
.facts span a{color:inherit}.facts span a:hover{color:var(--plum)}
.photos{position:absolute;right:var(--pad-x);bottom:clamp(96px,16vh,150px);display:grid;grid-template-columns:repeat(2,1fr);gap:12px;width:min(340px,32vw);pointer-events:auto}
.photos--8{gap:10px;width:min(310px,25vw)}
.photos button{all:unset;display:block;width:100%;height:100%;cursor:pointer}.photos button:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.photos img{transition:transform .8s var(--ease)}.photos li:hover img{transform:scale(1.05)}
.photos li{position:relative;border-radius:10px;overflow:hidden;aspect-ratio:4/3;box-shadow:0 20px 40px -22px rgba(0,0,0,.5);border:1px solid rgba(255,255,255,.5)}
.photos img{width:100%;height:100%;object-fit:cover}
.photos span{position:absolute;left:10px;bottom:8px;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.7)}
.photos li::after{content:"";position:absolute;inset:auto 0 0 0;height:45%;background:linear-gradient(to top,rgba(20,16,18,.55),transparent)}

/* chapter transitions */
.chap .eyebrow,.chap .h span,.chap .sub,.chap .cta,.chap .list li,.chap .facts li,.chap .photos li,.chap .offers li,.chap .video,.chap .tcards li,.chap .clin li,.chap .docs li,.chap .feat,.chap .for,.chap .copy > .more{opacity:0;transform:translate3d(0,22px,0);transition:opacity .9s var(--ease),transform 1.1s var(--ease)}
.chap.is-active .eyebrow,.chap.is-active .h span,.chap.is-active .sub,.chap.is-active .cta,.chap.is-active .list li,.chap.is-active .facts li,.chap.is-active .photos li,.chap.is-active .offers li,.chap.is-active .video,.chap.is-active .tcards li,.chap.is-active .clin li,.chap.is-active .docs li,.chap.is-active .feat,.chap.is-active .for,.chap.is-active .copy > .more{opacity:1;transform:none}
.chap.is-active .h span:nth-child(2){transition-delay:.08s}.chap.is-active .sub{transition-delay:.18s}.chap.is-active .cta{transition-delay:.28s}.chap.is-active .for{transition-delay:.24s}.chap.is-active .copy > .more{transition-delay:.32s} /* the For line and the clinics link arrive after the paragraph and leave with the chapter */
.chap.is-active .list li:nth-child(1),.chap.is-active .facts li:nth-child(1),.chap.is-active .photos li:nth-child(1){transition-delay:.3s}
.chap.is-active .list li:nth-child(2),.chap.is-active .facts li:nth-child(2),.chap.is-active .photos li:nth-child(2){transition-delay:.4s}
.chap.is-active .list li:nth-child(3),.chap.is-active .facts li:nth-child(3),.chap.is-active .photos li:nth-child(3){transition-delay:.5s}
.chap.is-active .list li:nth-child(4),.chap.is-active .photos li:nth-child(4){transition-delay:.6s}
.chap.is-leaving .eyebrow,.chap.is-leaving .h span,.chap.is-leaving .sub,.chap.is-leaving .cta,.chap.is-leaving .list li,.chap.is-leaving .facts li,.chap.is-leaving .photos li,.chap.is-leaving .offers li,.chap.is-leaving .video,.chap.is-leaving .tcards li,.chap.is-leaving .clin li,.chap.is-leaving .docs li,.chap.is-leaving .feat,.chap.is-leaving .for,.chap.is-leaving .copy > .more{opacity:0;transform:translate3d(0,-18px,0);transition-duration:.5s,.6s;transition-delay:0s}

/* bottom controls */
.mouse{position:absolute;left:50%;bottom:clamp(18px,3vh,30px);z-index:5;width:20px;height:32px;margin-left:-10px;border:1.5px solid var(--ink);border-radius:12px;transition:opacity .4s}
.mouse i{position:absolute;left:50%;top:6px;width:2px;height:6px;margin-left:-1px;background:var(--ink);border-radius:2px;animation:wheel 1.8s ease-in-out infinite}
.mouse::before{content:"Scroll";position:absolute;left:50%;top:-24px;transform:translateX(-50%);font-size:10px;letter-spacing:.3em;text-transform:uppercase;font-weight:600;color:var(--ink-2);white-space:nowrap}
.mouse.is-end::before{content:"End"}
.mouse.is-end{opacity:.35}
.mouse.is-covered{opacity:0;pointer-events:none} /* a wide card block reaches the centre on small windows */
@keyframes wheel{0%{transform:translateY(0);opacity:1}70%{transform:translateY(10px);opacity:0}100%{opacity:0}}
.share{position:absolute;right:var(--pad-x);bottom:clamp(20px,3vh,32px);z-index:5;display:flex;align-items:center;gap:10px;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--ink);font-weight:600;transition:color .3s}.share:hover{color:var(--plum)}
.swatches{position:fixed;left:50%;bottom:6px;transform:translate(-50%,12px);opacity:0;transition:opacity .5s var(--ease),transform .5s var(--ease);z-index:90;display:flex;gap:8px;padding:6px 10px;border-radius:999px;background:rgba(255,255,255,.72);border:1px solid rgba(255,255,255,.9);box-shadow:0 8px 20px -10px rgba(0,0,0,.35);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.swatches button{width:26px;height:26px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px rgba(46,31,36,.22);cursor:pointer}.swatches button.on{box-shadow:0 0 0 2px var(--plum)}.swatches.is-on{opacity:1;transform:translateX(-50%)}.swatches .swatches__x{display:grid;place-items:center;border:0;box-shadow:none;background:rgba(46,31,36,.08);color:var(--ink);font-size:17px;line-height:1} /* the colour bar: ?palette, or five taps on the logo */
.mpins{position:absolute;inset:0;z-index:6;overflow:hidden;pointer-events:none} /* clipped, so a pin can never push the page sideways */ /* ?map=lens photo pins */
.mpin{position:absolute;left:0;top:0;display:flex;align-items:center;gap:7px;padding:4px 12px 4px 4px;border-radius:999px;background:linear-gradient(160deg,rgba(255,255,255,.58),rgba(255,255,255,.26));border:1px solid rgba(255,255,255,.78);box-shadow:inset 0 1px 0 rgba(255,255,255,.9),inset 0 -1px 0 rgba(140,29,84,.08),0 10px 26px -14px rgba(46,31,36,.45);backdrop-filter:blur(14px) saturate(1.5);-webkit-backdrop-filter:blur(14px) saturate(1.5);font:700 12px/1 var(--sans);text-shadow:0 1px 0 rgba(255,255,255,.55); /* frosted glass, like the stage, so the map softens behind it */letter-spacing:.01em;color:var(--ink);white-space:nowrap;cursor:pointer;opacity:0;pointer-events:none;transition:opacity .45s var(--ease),box-shadow .3s,background-color .3s}
.mpins.is-on .mpin{opacity:1;pointer-events:auto}.mpin:hover,.mpin:focus-visible,.mpin.is-hot,.mpin[aria-expanded="true"]{background:linear-gradient(160deg,rgba(255,255,255,.74),rgba(255,255,255,.42));box-shadow:inset 0 1px 0 #fff,0 0 0 2px var(--plum),0 12px 26px -12px rgba(140,29,84,.55);outline:none}
.mpin__ph{flex:none;width:28px;height:28px;border-radius:50%;overflow:hidden;border:2px solid rgba(255,255,255,.85);box-shadow:0 1px 3px rgba(0,0,0,.22);background:linear-gradient(145deg,#a3286a,#6f1544)}.mpin__ph img{width:100%;height:100%;object-fit:cover}
.mpin__ph--mark{display:grid;place-items:center}.mpin__ph--mark img{width:64%;height:auto;object-fit:contain;filter:brightness(1.4)}
.mpin__stack{display:flex}.mpin__stack .mpin__ph+.mpin__ph{margin-left:-11px}.mpin__n{display:grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--plum);color:#fff;font-size:10px}.mpin__n--m{display:none}
.mpin::after{content:"";position:absolute;width:0;height:0;border:6px solid transparent}
.mpin--up::after{left:50%;top:100%;margin-left:-6px;border-top-color:rgba(255,255,255,.6)}.mpin--down::after{left:50%;bottom:100%;margin-left:-6px;border-bottom-color:rgba(255,255,255,.6)}.mpin--left::after{top:50%;left:100%;margin-top:-6px;border-left-color:rgba(255,255,255,.6)}.mpin--right::after{top:50%;right:100%;margin-top:-6px;border-right-color:rgba(255,255,255,.6)}
.mpop{position:absolute;left:0;top:0;z-index:7;width:250px;padding:6px;border-radius:16px;background:linear-gradient(160deg,rgba(255,255,255,.66),rgba(255,255,255,.38));border:1px solid rgba(255,255,255,.8);box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 22px 44px -22px rgba(40,28,34,.5);backdrop-filter:blur(18px) saturate(1.5);-webkit-backdrop-filter:blur(18px) saturate(1.5);pointer-events:auto}
.mpop__row{display:grid;grid-template-columns:34px 1fr auto;gap:10px;align-items:center;width:100%;padding:7px 8px;border-radius:10px;text-align:left}.mpop__row:hover,.mpop__row:focus-visible{background:rgba(140,29,84,.07);outline:none}.mpop__row .mpin__ph{width:34px;height:34px}
.mpop__row b{display:block;font-size:13px;font-weight:700;color:var(--ink)}.mpop__row small{display:block;margin-top:2px;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}.mpop__row i{font-style:normal;color:var(--gold-t)}
.mpin--dot{width:16px;height:16px;padding:0;margin:-8px 0 0 -8px;justify-content:center;background:none;border-color:transparent;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
.mpin--dot::after{display:none}
.mpin--dot .mpin__t{display:none}
.mpin--dot .mpin__ph{width:10px;height:10px;border:2px solid #fff;background:var(--plum);box-shadow:0 0 0 1px rgba(140,29,84,.4),0 1px 4px rgba(0,0,0,.25);transition:width .2s,height .2s,box-shadow .2s}
.mpin--dot .mpin__ph img{display:none}
.mpin--dot .mpin__stack .mpin__ph+.mpin__ph{display:none}
.mpin--dot .mpin__n{position:absolute;left:9px;top:-6px;min-width:14px;height:14px;padding:0 3px;font-size:9px;line-height:14px}
.mpin--dot:hover,.mpin--dot:focus-visible,.mpin--dot.is-hot,.mpin--dot[aria-expanded="true"]{background:none;box-shadow:none;border-color:transparent;z-index:2}
.mpin--dot:hover .mpin__ph,.mpin--dot:focus-visible .mpin__ph,.mpin--dot.is-hot .mpin__ph,.mpin--dot[aria-expanded="true"] .mpin__ph{width:14px;height:14px;box-shadow:0 0 0 3px rgba(201,162,76,.5),0 1px 4px rgba(0,0,0,.25)}
@media (prefers-reduced-motion:reduce){.mpin{transition:none}}
.mouse::after{content:"";position:absolute;inset:-8px -12px} /* a finger-sized target around the small scroll hint */
.mouse:hover{border-color:var(--plum)}.mouse:hover i{background:var(--plum)}
.link:hover{color:var(--plum);border-color:var(--plum)}
.share svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.5}
.consent{position:absolute;left:var(--pad-x);bottom:clamp(56px,8vh,80px);z-index:7;width:min(420px,calc(100% - 2*var(--pad-x)));padding:16px 18px 15px;border-radius:14px;border:1px solid rgba(255,255,255,.42);background:rgba(255,255,255,.24);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:var(--ink);font-size:12.5px;line-height:1.55;box-shadow:0 24px 50px -34px rgba(0,0,0,.45);animation:consentIn .9s var(--ease) both}
.consent p{margin:0 0 12px}.consent b{font-weight:700}.consent__row{display:flex;align-items:center;gap:18px}.consent__short{display:none}.consent .btn{height:36px;padding:0 20px;font-size:10px}
@keyframes consentIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
/* the callback form, asked for from the booking chapter and answered inside its own sheet */
.cbf{margin-top:20px;max-width:350px}
.cbf__f{display:block;margin-bottom:10px}.cbf__f span{display:block;margin-bottom:5px;font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--mute)}
.cbf__f input,.cbf__f select{width:100%;height:44px;padding:0 13px;border-radius:11px;border:1px solid rgba(46,31,36,.22);background:rgba(255,255,255,.72);font:inherit;font-size:14px;color:var(--ink)}
.cbf__f input:focus-visible,.cbf__f select:focus-visible{outline:2px solid var(--plum);outline-offset:1px}
.cbf__f select:invalid{color:var(--mute)}.cbf__f option{color:var(--ink)} /* Choose one reads as a hint until a team is picked */
.cbf__f select{-webkit-appearance:none;appearance:none;padding-right:38px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234a3a42' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 10l5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:16px} /* the same field as Name and Mobile in every browser, Safari included */
@media (max-width:859px){.cbf__f input,.cbf__f select{font-size:16px}} /* 16px keeps a phone from zooming in when a field is tapped */
.cbf__row{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:15px}
.cbf__err{margin:8px 0 0;color:var(--plum);font-size:12.5px;font-weight:600}
.cbf__fine{margin:11px 0 0;font-size:11px;color:var(--mute)}
.cbf__c{display:flex;align-items:flex-start;gap:9px;margin-top:12px;font-size:12.5px;line-height:1.4;color:var(--ink-2)}
.cbf__c input{flex:none;width:17px;height:17px;margin-top:1px;accent-color:var(--plum)}
.cbf__c .inline{font-size:12.5px}
.cbf__trap{position:absolute;left:-9999px;width:1px;height:1px;opacity:0} /* only a robot fills this in */
.cbf.is-sending button[type=submit]{opacity:.6;pointer-events:none}
.cbf__ok{margin:20px 0 0;font-size:14.5px;line-height:1.55}.cbf__ok b{font-weight:700}
.diag{position:fixed;left:12px;top:12px;z-index:80;width:min(470px,calc(100vw - 24px));padding:10px 12px;border-radius:10px;background:rgba(20,16,20,.9);color:#fff;font:11px/1.55 ui-monospace,Menlo,Consolas,monospace;pointer-events:auto}
.diag pre{margin:0;white-space:pre-wrap;word-break:break-word;font:inherit}
.diag button{margin-top:8px;padding:4px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.4);color:#fff;font:inherit;letter-spacing:.1em;text-transform:uppercase}
html.no-fx .glass{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(255,255,255,.55)}html.no-fx .grain{display:none}
.trk{position:fixed;right:12px;bottom:12px;z-index:80;width:min(380px,calc(100vw - 24px));max-height:42vh;overflow:auto;padding:10px 12px;border-radius:10px;background:rgba(20,16,20,.9);color:#fff;font:11px/1.55 ui-monospace,Menlo,monospace;pointer-events:auto}
.trk__t{display:block;width:100%;padding:0;margin:0 0 6px;border:0;background:none;text-align:left;font:inherit;font-weight:700;letter-spacing:.14em;text-transform:uppercase;font-size:10px;color:#e8c979;cursor:pointer}.trk__t::after{content:' \2212'}.trk.is-folded{width:auto;padding:6px 12px}.trk.is-folded .trk__t{margin:0}.trk.is-folded .trk__t::after{content:' +'}.trk.is-folded .trk__body{display:none}.trk table{border-collapse:collapse;width:100%;margin-bottom:8px}.trk th{text-align:left;padding:2px 8px 2px 0;font-weight:700;color:#e8c979;white-space:nowrap;vertical-align:top}.trk td{padding:2px 0;word-break:break-word;color:#f3eee9}.trk__btns{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:8px}.trk__btns button{font:inherit;font-size:10px;padding:4px 8px;border-radius:6px;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.1);color:#fff;cursor:pointer}.trk__btns button:hover{background:rgba(255,255,255,.22)}.trk ol{margin:0;padding-left:18px;color:#ddd}
.pincard{position:absolute;left:0;top:0;z-index:6;width:212px;border-radius:14px;overflow:hidden;background:rgba(255,255,255,.66);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.75);box-shadow:0 22px 44px -26px rgba(40,28,34,.5);pointer-events:auto;opacity:0;transform:translateY(8px);transition:opacity .25s,transform .4s var(--ease);will-change:transform}
.pincard.is-on{opacity:1;transform:none}.pincard .fc__img{aspect-ratio:16/7}.pincard .fc__img img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.7) sepia(.1)}.pincard .fc__ph{display:grid;place-items:center;height:100%;font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-2)}
.pincard .fc__body{padding:8px 12px 10px}.pincard b{display:flex;justify-content:space-between;align-items:baseline;font-size:13.5px;font-weight:700;color:var(--ink)}.pincard b i{font-style:normal;color:var(--gold-t)}.pincard small{display:block;margin-top:4px;font-size:9px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--ink);opacity:.8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dots{position:absolute;right:calc(var(--pad-x) * .4);top:50%;transform:translateY(-50%);z-index:5;display:flex;flex-direction:column;gap:6px}
.dots i{display:block;width:2px;height:22px;background:rgba(34,30,38,.3);transition:background-color .4s}.dots i.on{background:var(--plum)}

/* menu (mobile): the site's own frosted glass rather than a grey curtain, with the brand tile, a close, the chapter you are
   on marked in plum and gold, and a way to book. It scrolls if a phone is too short to hold ten links and the pill at once. */
.menu{position:absolute;inset:0;z-index:8;display:flex;flex-direction:column;padding:calc(var(--pad-y) + 2px) var(--pad-x);
  background:linear-gradient(168deg,rgba(255,255,255,.985) 0%,rgba(255,247,251,.975) 46%,rgba(253,230,240,.98) 100%);
  backdrop-filter:blur(26px) saturate(1.5);-webkit-backdrop-filter:blur(26px) saturate(1.5);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85);opacity:0;visibility:hidden;overflow-y:auto;overscroll-behavior:contain;
  transition:opacity .5s var(--ease),visibility 0s .5s}
.menu-open .menu{opacity:1;visibility:visible;transition:opacity .5s var(--ease)}
.menu__top{display:flex;align-items:center;justify-content:space-between;gap:16px;flex:none}
.menu__brand{flex:none;pointer-events:none}
.menu__x{width:40px;height:40px;flex:none;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(34,30,38,.22);background:rgba(255,255,255,.55);color:var(--ink);transition:color .3s,border-color .3s,transform .4s var(--ease)}
.menu__x svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
.menu__x:hover{color:var(--plum);border-color:var(--plum);transform:rotate(90deg)}
.menu__nav{flex:1 0 auto;display:flex;flex-direction:column;justify-content:center} /* on a short phone the menu scrolls rather than squeezing the list under the logo */
.menu__nav a{display:flex;align-items:center;gap:11px;min-height:42px;font-family:var(--serif);font-weight:500;font-size:clamp(23px,6.8vw,38px);line-height:1.1;color:var(--ink);
  transform:translateY(16px);opacity:0;transition:transform .7s var(--ease),opacity .7s var(--ease),color .3s}
.menu__nav a+a{border-top:1px solid rgba(34,30,38,.09)}
.menu__nav .mi{width:21px;height:21px;flex:none;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;color:var(--mute);opacity:.75;transition:color .3s,opacity .3s}
.menu__nav a.is-on{color:var(--plum)}.menu__nav a.is-on .mi{color:var(--gold-t);opacity:1}
.menu-open .menu__nav a{transform:none;opacity:1}
.menu-open .menu__nav a:nth-child(2){transition-delay:.04s}.menu-open .menu__nav a:nth-child(3){transition-delay:.08s}.menu-open .menu__nav a:nth-child(4){transition-delay:.12s}.menu-open .menu__nav a:nth-child(5){transition-delay:.16s}
.menu-open .menu__nav a:nth-child(6){transition-delay:.2s}.menu-open .menu__nav a:nth-child(7){transition-delay:.24s}.menu-open .menu__nav a:nth-child(8){transition-delay:.28s}.menu-open .menu__nav a:nth-child(9){transition-delay:.32s}.menu-open .menu__nav a:nth-child(10){transition-delay:.36s}
.menu__cta{flex:none;display:flex;align-items:center;justify-content:center;height:46px;margin-top:14px;border-radius:999px;background:var(--plum);color:#fff;
  font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:700;box-shadow:0 14px 30px -14px rgba(106,21,64,.7);transition:background-color .3s,transform .45s var(--ease)}
.menu__cta:hover{background:var(--plum-d);transform:translateY(-2px)}
.menu__book{flex:none;display:grid;grid-template-columns:1.4fr 1fr;gap:10px;margin-top:14px}.menu__book .menu__cta{margin-top:0}.menu__cta .wa{width:17px;height:17px;margin-right:9px;fill:currentColor;flex:none}
.menu__cb{flex:none;display:flex;align-items:center;justify-content:center;width:100%;height:46px;margin:0;border-radius:999px;border:1px solid rgba(34,30,38,.5);color:var(--ink);font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:700;transition:border-color .3s,color .3s}.menu__cb:hover{border-color:var(--plum);color:var(--plum)}
.menu__salon{flex:none;display:flex;align-items:center;justify-content:center;height:46px;margin-top:14px;border-radius:999px;border:1px solid rgba(34,30,38,.35);color:var(--ink);font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:700;transition:border-color .3s,color .3s}.menu__salon:hover{border-color:var(--plum);color:var(--plum)}

/* cursor */
.cursor{position:fixed;left:0;top:0;z-index:70;pointer-events:none;width:34px;height:34px;margin:-17px 0 0 -17px;border:1px solid rgba(38,34,42,.6);border-radius:50%;opacity:0;transition:width .25s var(--ease),height .25s var(--ease),margin .25s var(--ease),border-color .25s,background-color .25s,opacity .3s;will-change:transform}
.cursor::after{content:"";position:absolute;left:50%;top:50%;width:4px;height:4px;margin:-2px;border-radius:50%;background:var(--gold)}
.cursor.is-on{opacity:1}.cursor.is-map,.cursor.is-off{opacity:0}
.cursor.is-hover{width:48px;height:48px;margin:-24px 0 0 -24px;border-color:var(--gold);border-width:1.5px;background:rgba(201,162,76,.16)}
.cursor.is-hover::after{width:7px;height:7px;margin:-3.5px;background:var(--plum)}
.cursor.is-grab{width:58px;height:58px;margin:-29px 0 0 -29px;border-color:var(--gold);border-width:1.5px} /* over an object that can be turned by hand */
.cursor.is-grabbing{width:44px;height:44px;margin:-22px 0 0 -22px;border-color:var(--plum);border-width:2px}
html.is-dragging,html.is-dragging *{-webkit-user-select:none;user-select:none}
@media (hover:none){.cursor{display:none}}

/* mobile */
/* clinics: on desktop the map is the interface, the two photo tiles stay for phones; the View all link lives in the copy */
@media (min-width:861px){#c7 .feat{display:none}}
#c7 .copy .more{margin-top:16px}
.copy .more{pointer-events:auto} /* the chapter lets the canvas take the pointer; the links in the copy take their own clicks */
/* short desktop windows (a 1366 by 768 laptop shows about 1366 by 657, at 125% scaling about 1093 by 540): cards lose their photos and sit lower so the object keeps its room; the engine reads the same query as S.compact */
@media (min-width:861px) and (max-height:700px){
  .feat,.offers,.video{bottom:46px}
  .feat .fc__img,.offers .fc__img{display:none}
  .fcs,.offers{gap:12px}
  .video{width:min(260px,22vw)}
  .facts,.list{bottom:72px}
  .copy{max-width:min(520px,48vw)}
  .eyebrow{margin-bottom:10px}.for{margin-top:8px}
  .video__links a span{display:none}
}
/* a short laptop screen (a 1366 by 768 laptop leaves about 660 for the page): the cookie notice keeps to one line at the foot, as on
   a phone, so it never covers the booking buttons of the opening screen */
@media (min-width:861px) and (max-height:820px){
  .consent{bottom:14px;width:auto;max-width:calc(100% - 2*var(--pad-x));padding:8px 8px 8px 16px;line-height:1.3;border-radius:999px;background:rgba(255,255,255,.4)}
  .consent p{display:none}.consent__short{display:block;flex:1;min-width:0;white-space:nowrap}.consent__row{gap:14px}.consent .btn{height:32px;padding:0 16px;flex:none}
}
/* the six offer cards are the tallest block: below 900px they keep only title and price so the gem has room */
@media (min-width:861px) and (max-height:899px){
  .offers .fc__img{display:none}.fc--offer small{display:none}.offers .fc b{font-size:13px}
}
/* laptop widths with the full-size nav: keep the phone number on one line */
@media (min-width:1101px) and (max-width:1400px){.top__right{gap:14px;font-size:11px;letter-spacing:.14em;white-space:nowrap}}
@media (max-width:860px){
  .glass{inset:8px;border-radius:18px}
  .brand{padding:5px 11px 5px 8px;border-radius:12px}.brand__mark{height:24px}.brand__word{height:18px}
  .copy{left:var(--pad-x);right:var(--pad-x);bottom:auto;top:calc(var(--pad-y) + 92px);max-width:none;transform:none}
  .trust{display:none}
  .h{font-size:clamp(24px,7vw,34px)}
  .sub{font-size:13px;max-width:none}
  .facts{left:var(--pad-x);right:var(--pad-x);bottom:72px;justify-content:space-between;text-align:left;gap:12px}
  .facts b{font-size:20px}
  .facts--contact{flex-direction:column;gap:10px}
  .list{left:var(--pad-x);right:var(--pad-x);width:auto;bottom:70px;display:grid;grid-template-columns:1fr 1fr;column-gap:14px}
  .list li{padding:8px 0}.list li:last-child{border-bottom:0}.list li:nth-child(3){border-bottom:0}.list span{display:none}
  .photos{left:var(--pad-x);right:var(--pad-x);width:auto;bottom:70px;grid-template-columns:repeat(4,1fr);gap:8px}
  .photos span{display:none}
  .photos{display:none}
  .clinics{grid-template-columns:1fr 1fr;gap:0 14px;margin-top:12px}.clinics li{padding:5px 0}.clinics .row{flex-direction:column;align-items:flex-start;gap:0}.clinics b{font-size:12px}.clinics .tel{font-size:11px}.clinics .adr{display:none}
  #c7 .copy{max-width:none}
  .video{left:var(--pad-x);right:var(--pad-x);width:auto;bottom:46px}.video__links{margin-top:7px}.video__links a span{display:none} /* play is the way in; the note and the two logos stay, and the card sits lower to pay for that line */
  .offers{left:var(--pad-x);right:var(--pad-x);width:auto;bottom:70px;display:flex;overflow-x:auto;gap:10px;scroll-snap-type:x mandatory;padding-bottom:4px;-webkit-overflow-scrolling:touch}.offers li{flex:0 0 200px;scroll-snap-align:start} /* phones: one row of offers to swipe, so the heading, text and gem keep their room */.fc--offer small{display:none}.oc__price{font-size:17px}
  .lb figure{max-width:92%}.lb__p,.lb__n{display:none}
  .feat{left:var(--pad-x);right:var(--pad-x);width:auto;bottom:70px}.fcs{display:flex;overflow-x:auto;gap:10px;scroll-snap-type:x mandatory;padding-bottom:4px;-webkit-overflow-scrolling:touch}.fcs li{flex:0 0 200px;scroll-snap-align:start}.fc__img{aspect-ratio:21/8}.fc__body{padding:9px 12px 10px}.fc b{font-size:12.5px}.more{margin-top:10px;font-size:9.5px}.fc--doc .fc__btn{padding:8px 10px;grid-template-columns:40px 1fr}.fc__face{width:40px;height:40px}
  .tcards,.clin,.docs{left:var(--pad-x);right:var(--pad-x);width:auto;bottom:70px;display:flex;overflow-x:auto;gap:10px;scroll-snap-type:x mandatory;padding-bottom:4px;-webkit-overflow-scrolling:touch}
  .row{grid-template-columns:56px 1fr auto;gap:10px}.row img,.row__ph{width:56px;height:40px}.row img.round{width:48px;height:48px;margin:0 4px}
  .tcards li{flex:0 0 210px;scroll-snap-align:start}.clin li{flex:0 0 190px;scroll-snap-align:start}.docs li{flex:0 0 190px;scroll-snap-align:start}
  .tcard,.ccard,.dcard{border-top:0;padding:4px 0}.tcard__sum{display:none}.tcard__links{padding-left:0;padding-top:2px}.clin li:nth-last-child(-n+2) .ccard,.docs li:nth-last-child(-n+2) .dcard,.tcards li:last-child .tcard{border-bottom:0}
  .for:not(.for--soon){display:none} /* the treatment chapters' For lines give way on a phone; Coming soon in the Clinics chapter stays, */
  #c7 .for--soon{margin-top:2px;line-height:1.3}#c7 .copy .for--soon + .more{margin-top:6px} /* on one tight line, so the map keeps its size and its pins stay apart */
  .dlg{padding:8px}.dlg__sheet{padding:18px 16px 24px;border-radius:14px}.dlg__grid{grid-template-columns:1fr;gap:18px}.dlg__x{top:14px;right:14px;width:36px;height:36px}.dlg__main h3{font-size:22px}
  .list--docs .consult{display:none}
  .share{display:none}
  .trk{top:76px;bottom:auto;max-height:36vh} /* below the header, so the menu button stays in reach while testing */  .consent{left:var(--pad-x);right:var(--pad-x);width:auto;bottom:12px;padding:8px 8px 8px 14px;font-size:11.5px;line-height:1.3;border-radius:999px;background:rgba(255,255,255,.4)}.consent p{display:none}.consent__short{display:block;flex:1;min-width:0}.consent__row{gap:12px}.consent .btn{height:32px;padding:0 14px;flex:none}.consent .inline{white-space:nowrap;margin-right:8px;font-size:11px}.consent__row{gap:10px}
  /* the bright toggle wore a ring and a pale fill around a 17px icon, which read as a big disc next to the logo.
     On a phone it is the icon alone, like the burger beside it; the tap area stays 38px and the gold fill still marks it on */
  /* a phone re-composites every blurred layer on every frame, and the clinics map moves its eleven pins by script on each one,
     so those eleven blurs are redone sixty times a second for an effect that is barely visible at this size. On a phone the layers
     that are numerous or animated take a solid tint instead; the signature glass panel, the sheets and the menu keep their blur. */
  /* the frosted panel is the one blurred layer left on a phone, and on an iPhone it costs more frame time than the phone has.
     A soft luminous gradient stands in for it here: the background behind it is a gentle blush wash rather than a photograph,
     so almost nothing was showing through the blur anyway. Desktop keeps the real frosted glass. */
  .glass{backdrop-filter:none;-webkit-backdrop-filter:none;background:linear-gradient(165deg,rgba(255,255,255,.52) 0%,rgba(255,255,255,.4) 45%,rgba(255,255,255,.3) 100%)}
  .grain{display:none}
  .mpin,.mpop,.pincard,.brand,.oc__tag{backdrop-filter:none;-webkit-backdrop-filter:none}
  .mpin{background:linear-gradient(160deg,rgba(255,255,255,.95),rgba(255,252,253,.9))}
  .mpop{background:rgba(255,255,255,.96)}
  .pincard{background:rgba(255,255,255,.95)}
  .oc__tag{background:rgba(255,255,255,.82)}
  .desk{display:none}
  /* the closing lotus needs the slot beside the booking button on a phone, and a second button costs it that room,
     so here the callback is the link in the sentence instead (the engine measures this block before it sets is-tight) */
  .cta .cta__cb{display:none}
  .mouse{left:auto;right:var(--pad-x);margin:0}
  .cap{font-size:14px}
  /* the contact block: the social links sit beside the opening hours, so the booking buttons and the details never meet */
  .facts--contact li:last-child{perspective:none;transform-style:flat;transform:none!important}
  .facts--contact .soc{position:absolute;top:0;right:0}
  /* a phone too short for the copy and the contact block together (the engine sets is-tight): one row of short buttons, no head office line */
  .is-tight .sub{line-height:1.55}.is-tight .cta{flex-wrap:nowrap;gap:10px;margin-top:14px}.is-tight .cta .btn{padding:0 16px}.is-tight .cta .lg{display:none}
  .is-tight .facts--contact{gap:6px}.is-tight .facts--contact li:nth-child(2) span{display:none}
  /* phone polish: the scroll hint is the icon alone (swiping comes naturally here, and its label met the cards), the chapter dashes stop short of it,
     card lines wrap to two instead of trailing off, the doctor card arrow follows the name, small links get a finger-sized target,
     and a sheet's photo leaves room for the name on the first screen */
  .mouse::before{display:none}
  /* the chapter marks lay in a row along the bottom, which reads as pages to swipe sideways while the site actually moves down,
     and the card rows inside a chapter already use a row of dots for exactly that. On a phone the marks stand as a rail down the
     right edge instead, so they run the same way as the scroll and cannot be mistaken for the card pager */
  .dots{left:auto;right:7px;bottom:auto;top:50%;transform:translateY(-50%);flex-direction:column;gap:5px}
  .dots i{width:2px;height:14px}
  /* a mouse means nothing on a touch screen, and drawn as an outlined button it invited taps that did nothing people expected */
  .mouse{display:none}
  .fc small{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.35}.row small{white-space:normal}.fc--offer small{display:none} /* offer cards keep their title and price only on phones, as before */
  .fc--doc .fc__btn{position:relative}.fc--doc b{display:block;padding-right:20px}.fc--doc b i{position:absolute;top:10px;right:10px} /* the arrow sits in the card's corner beside the name, as on treatment cards, and the speciality keeps the full width */
  .more{padding:8px 0 4px;margin-top:2px}.video__links a{padding:8px 0} /* a finger-sized target on both logo links, padded evenly so they stay level */
  .dlg dd a,.facts2 dd a{display:inline-block;padding:4px 0}
  .dlg__side img{max-height:30vh}.dlg__side img.portrait{object-position:50% 22%}
  /* card rows: one whole card at a time, never a sliver of the next; dots under a row that holds more show how many and which is showing */
  .fcs li,.offers li{flex:0 0 100%}
  .mpin__n,.mpin__n--m{display:none} /* a phone shows the pin alone: a tap opens the clinics behind it, and the count stays in the pin's spoken label */
  .mpin{padding:2px}.mpin__t{display:none}.mpin__ph{width:26px;height:26px}.mpin__stack .mpin__ph+.mpin__ph{display:none}.mpin--group{padding:2px}.mpin--group .mpin__n{position:absolute;top:-7px;right:-8px;box-shadow:0 0 0 2px #fff}.mpin--on::after{display:none} /* phones: a photo dot on each spot, a count on shared ones */
  .fcs .fc__img,.offers .fc__img{aspect-ratio:auto;height:80px}.fcs .fc__img img,.offers .fc__img img{width:100%;height:100%;object-fit:cover}
  .pager{display:flex;gap:6px;pointer-events:none}.pager i{display:block;width:6px;height:6px;border-radius:50%;background:rgba(34,30,38,.22);transition:background-color .3s,transform .3s}.pager i.on{background:var(--plum);transform:scale(1.2)}
  .feat .pager{position:absolute;left:0;bottom:9px}.offers + .pager{position:absolute;left:var(--pad-x);bottom:56px}
  .chap .pager{opacity:0;transition:opacity .9s var(--ease)}.chap.is-active .pager{opacity:1;transition-delay:.4s}
}
/* short phones (the usual iPhone in Safari and smaller): tighter spacing and no card photos, so the object keeps its place between the text and the cards */
/* A tablet in portrait is still under 860px, so it inherits the phone card row, where one card fills the width. At 390px a
   card is about 350px across and an 80px photograph reads well; at 800px the same fixed height leaves a sliver of the picture.
   Above 560px the photograph keeps its proportions instead. The short window rules below still hide it when height is scarce. */
@media (min-width:560px) and (max-width:860px){
  .fcs .fc__img,.offers .fc__img{height:auto;aspect-ratio:21/8}
}
@media (max-width:860px) and (max-height:700px){
  .eyebrow{margin-bottom:12px}.sub{margin-top:12px}.cta{margin-top:16px}
  .feat .fc__img,.offers .fc__img{display:none}
}

/* phones turned sideways: the stage is made for portrait, so a short landscape phone gets a turn-upright screen with links to the plain pages */
.rotate{display:none}
@media (orientation:landscape) and (max-height:500px) and (pointer:coarse){
  html{overflow:hidden}
  .rotate{position:fixed;inset:0;z-index:90;display:grid;place-content:center;justify-items:center;gap:12px;padding:20px 28px;text-align:center;
    background:radial-gradient(700px 420px at 12% -10%,rgba(236,208,138,.6),transparent 62%),radial-gradient(600px 500px at 108% 20%,rgba(140,29,84,.12),transparent 60%),linear-gradient(180deg,#bdb9b6,#a4a1a0 60%,#9c9897)}
  .rotate img{height:46px;width:auto;animation:rotHint 2.6s var(--ease) infinite}
  .rotate__t{margin:4px 0 0;font-size:14px;letter-spacing:.26em;text-transform:uppercase;font-weight:700;color:var(--ink)}
  .rotate__s{margin:0;font-size:13px;line-height:1.55;color:var(--ink-2);font-weight:500;max-width:44ch}
  .rotate__l{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:6px 0 0}
  .rotate__l a{padding:10px 18px;border-radius:999px;border:1px solid rgba(34,30,38,.35);background:rgba(255,255,255,.45);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;font-weight:700;color:var(--ink)}
}
@keyframes rotHint{0%,18%{transform:rotate(-90deg)}55%,100%{transform:rotate(0)}}
@media (prefers-reduced-motion:reduce){.rotate img{animation:none}}