
/* self-hosted fonts (latin) */
@font-face { font-family: 'Bodoni Moda'; font-style: italic; font-weight: 400; font-display: swap; src: url(/fonts/bodoni-moda-25f68c.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: 'Bodoni Moda'; font-style: normal; font-weight: 400; font-display: swap; src: url(/fonts/bodoni-moda-aad168.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: 'Bodoni Moda'; font-style: normal; font-weight: 500; font-display: swap; src: url(/fonts/bodoni-moda-aad168.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: 'Bodoni Moda'; font-style: normal; font-weight: 600; font-display: swap; src: url(/fonts/bodoni-moda-aad168.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: 'Playwrite US Trad'; font-style: normal; font-weight: 400; font-display: swap; src: url(/fonts/playwrite-us-trad-79c761.woff2) format('woff2'); }
@font-face { font-family: 'Plus Jakarta Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url(/fonts/plus-jakarta-sans-fdb05b.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: 'Plus Jakarta Sans'; font-style: normal; font-weight: 500; font-display: swap; src: url(/fonts/plus-jakarta-sans-fdb05b.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: 'Plus Jakarta Sans'; font-style: normal; font-weight: 600; font-display: swap; src: url(/fonts/plus-jakarta-sans-fdb05b.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: 'Plus Jakarta Sans'; font-style: normal; font-weight: 700; font-display: swap; src: url(/fonts/plus-jakarta-sans-fdb05b.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: 'Plus Jakarta Sans'; font-style: normal; font-weight: 800; font-display: swap; src: url(/fonts/plus-jakarta-sans-fdb05b.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; }


/* Layout: bold coral + white editorial one-pager. Hero = giant wordmark with nail photos that fly out from the center and float;
   about = scroll-reveal statement + divider rows; services = pill tabs; gallery = 3D photo ring; coral call band; black footer.
   Single committed light look (no theme switching). */
:root{
  color-scheme:light;
  --coral:#8a6c58;       /* mocha brand color, fills + large text */
  --coral-ink:#6f5443;   /* deeper mocha for small text on white */
  --ink:#231b17;
  --sage:#7d8f62;        /* signature-pedicure accent, from the CBD Volcano poster */
  --sage-ink:#5d6e45;
  --nails:#a86b5c;       /* rose-clay for the word Nails, pairs with mocha BB */
  --muted:#6b605a;
  --soft:#f3eee9;
  --soft-2:#f8f4f0;
  --line:#e6ddd5;
  --pending:#c4b8ae;     /* scroll-reveal words not yet reached */
  --white:#ffffff;
  --sans:"Plus Jakarta Sans","Avenir Next",system-ui,sans-serif;
  --script:"Playwrite US Trad","Snell Roundhand","Segoe Script",cursive;
  --serif:"Bodoni Moda","Didot","Bodoni 72",Georgia,serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--white);color:var(--ink);font-family:var(--sans);font-size:1.0625rem;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit}
img{max-width:100%;display:block}
:focus-visible{outline:2px solid var(--coral);outline-offset:3px;border-radius:6px}
.wrap{max-width:1200px;margin:0 auto;padding-inline:clamp(16px,3vw,32px)}
h1,h2,h3,h4{margin:0;text-wrap:balance;letter-spacing:-.03em}
section{padding-block:clamp(72px,10vw,128px)}
section[id]{scroll-margin-top:72px}
.label{display:inline-flex;align-items:center;gap:10px;font-weight:500;font-size:1rem;color:var(--coral-ink);margin:0 0 14px}
.label::before{content:"";width:12px;height:12px;border-radius:3px;background:var(--coral)}
.h2{font-size:clamp(2.6rem,7vw,5rem);font-weight:700;line-height:1;letter-spacing:-.05em}
.lead-p{color:var(--muted);max-width:60ch;margin:16px 0 0}

/* pill buttons with a round icon, like the reference */
.pill{display:inline-flex;align-items:center;gap:12px;padding:6px 20px 6px 6px;border-radius:999px;background:var(--soft);color:var(--ink);text-decoration:none;font-weight:600;font-size:1rem;transition:background .25s,transform .25s}
.pill .dot{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--coral);color:#fff;transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.pill .dot svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pill:hover{background:#ecebe9}
.pill:hover .dot{transform:rotate(-45deg)}
.pill.solid{background:var(--coral);color:#fff}
.pill.solid .dot{background:#fff;color:var(--coral)}
.pill.solid:hover{background:#755a48}
.pill.dark{background:var(--ink);color:#fff}
.pill.dark:hover{background:#262626}
.pill.plain{padding:12px 22px}

/* header */
header{position:sticky;top:env(safe-area-inset-top,0px);z-index:40;border-top:3px solid var(--coral);background:rgba(255,255,255,.86);backdrop-filter:saturate(1.4) blur(12px);-webkit-backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid rgba(0,0,0,.05)}
.hbar{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px;min-height:68px}
.logo{display:inline-flex;align-items:baseline;gap:6px;text-decoration:none;color:var(--ink);line-height:1}
.logo .w{font-weight:800;font-size:1.45rem;letter-spacing:-.04em}
.logo .bb{display:inline-flex;font-weight:800;font-size:1.45rem;color:var(--coral)}
.logo .bb .m{display:inline-block;transform:scaleX(-1);margin-left:-.04em}
.logo .s{font-family:var(--script);font-size:.85rem;color:var(--muted);margin-left:4px}
.nav{display:flex;justify-content:center;gap:4px}
.nav a{text-decoration:none;font-weight:500;font-size:.98rem;padding:8px 14px;border-radius:999px;color:var(--ink);transition:background .2s}
.nav a:hover{background:var(--soft)}
.nav a.on{background:var(--ink);color:#fff}
.nav sup{font-size:.6em;margin-left:2px;color:var(--coral-ink);font-weight:600}
.nav a.on sup{color:#e6d3c4}
.plus{display:none;width:44px;height:44px;border:0;background:none;padding:0;cursor:pointer;color:var(--ink)}
.plus svg{width:22px;height:22px;stroke:currentColor;stroke-width:2;transition:transform .35s}
.plus[aria-expanded="true"] svg{transform:rotate(45deg)}
.hcall .pill{padding-block:4px}
.hcall .pill .dot{width:34px;height:34px}
@media (max-width:860px){
  .hbar{grid-template-columns:auto 1fr auto}
  .plus{display:grid;place-items:center;order:-1}
  .hbar{grid-template-columns:auto 1fr auto auto}
  .hbar .logo{justify-self:end;order:1}
  .hcall{order:2}
  .nav{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;gap:2px;background:#fff;padding:10px 16px 18px;border-bottom:1px solid var(--line);box-shadow:0 18px 30px rgba(0,0,0,.08)}
  .nav.open{display:flex}
  .nav a{padding:12px 14px;font-size:1.1rem}
  .hcall .pill span:last-child{display:none}
  .hcall .pill{padding:4px}
  .logo .s{display:none}
}

/* hero with flying photo tiles */
.hero{position:relative;overflow:hidden;padding:0;min-height:clamp(660px,calc(100svh - 68px),940px);display:grid;place-items:center;isolation:isolate}
.hero-copy{position:relative;z-index:2;text-align:center;display:grid;justify-items:center;gap:18px;padding:120px 16px;max-width:820px}
.hero h1{display:grid;justify-items:center;gap:10px;font-weight:800;line-height:.86}
.hero h1 .tag{font-size:1rem;font-weight:500;letter-spacing:0;color:var(--coral-ink);display:inline-flex;align-items:center;gap:10px}
.hero h1 .tag::before{content:"";width:12px;height:12px;border-radius:3px;background:var(--coral)}
.hero h1 .big{font-size:clamp(4.6rem,16vw,12rem);letter-spacing:-.07em;display:inline-flex;align-items:baseline;gap:.12em}
.hero h1 .big b{color:var(--coral);display:inline-flex;font-weight:800}
.hero h1 .big b .m{display:inline-block;transform:scaleX(-1);margin-left:-.03em}
.hero .script{text-shadow:0 0 12px #fff,0 0 4px #fff;font-family:var(--script);font-size:clamp(1.3rem,3vw,2rem);color:var(--ink);line-height:1.2;margin-top:-6px}
.hero p.intro{margin:0;color:var(--muted);max-width:44ch;font-size:1.08rem;background:rgba(255,255,255,.75);border-radius:12px;padding:2px 8px}
.hero .cta{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}
.status{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:.9rem;padding:6px 14px;border-radius:999px;background:var(--soft)}
.status i{width:9px;height:9px;border-radius:50%;background:#a3a19e}
.status.open i{background:#1f9d5c;box-shadow:0 0 0 4px rgba(31,157,92,.18)}

/* spinning photo spiral */
.spiral-wrap{position:absolute;inset:0;z-index:1;pointer-events:none;
  -webkit-mask-image:conic-gradient(from 0deg at 50% 50%,#000 0deg 40deg,rgba(0,0,0,.22) 95deg,#000 150deg 360deg);
  mask-image:conic-gradient(from 0deg at 50% 50%,#000 0deg 40deg,rgba(0,0,0,.22) 95deg,#000 150deg 360deg);
  animation:spiralIn 1.6s cubic-bezier(.16,.84,.24,1) .9s both}
.spiral{position:absolute;left:50%;top:50%;width:0;height:0;--S:clamp(720px,130svh,1420px);will-change:transform}
.orbit{position:absolute;left:0;top:0;animation:spin var(--dur) linear infinite}
.st{position:absolute;left:0;top:0;width:calc(var(--S) * var(--k));aspect-ratio:1;max-width:none;margin:calc(var(--S) * var(--k) / -2) 0 0 calc(var(--S) * var(--k) / -2);
  transform:rotate(var(--a)) translateX(calc(var(--S) * var(--rad))) rotate(90deg)}
.st img{width:100%;height:100%;object-fit:cover;border-radius:14%;box-shadow:0 6px 16px rgba(0,0,0,.16)}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes spiralIn{from{opacity:0;transform:scale(.6) rotate(-60deg)}}
.hero.paused .orbit{animation-play-state:paused}
@media (max-width:700px){
  .hero{min-height:760px}
  .hero-copy{padding:120px 16px}
  .spiral{--S:clamp(620px,190vw,860px)}
}

/* sticky hero: the next sections slide up over it */
.hero{position:sticky;top:0;z-index:0}
main > section:not(.hero){position:relative;z-index:1;background:rgba(255,255,255,.86)}
main > section.gallery,main > section.faq,main > section.care{background:rgba(248,244,240,.84)}
main > section.band{background:rgba(138,108,88,.94)}
main > section.photo{background:transparent}
#about{border-radius:32px 32px 0 0;box-shadow:0 -24px 50px rgba(0,0,0,.08)}

/* red stair-step opening wipe */
.loader{position:fixed;inset:0;z-index:100;display:grid;grid-template-rows:repeat(8,1fr);pointer-events:none;animation:gone 0s 1.7s forwards}
.loader i{background:var(--coral);transform-origin:right center;animation:wipe .75s cubic-bezier(.7,0,.2,1) forwards;animation-delay:calc(.35s + var(--i) * 60ms)}
@keyframes wipe{to{transform:scaleX(0)}}
@keyframes gone{to{visibility:hidden}}

/* red wipe when jumping between sections */
.wipe{position:fixed;inset:0;z-index:100;display:grid;grid-template-rows:repeat(8,1fr);pointer-events:none;visibility:hidden}
.wipe.go{visibility:visible}
.wipe i{background:var(--coral);transform:translateX(-101%)}
.wipe.go i{animation:sweep 1s cubic-bezier(.7,0,.25,1) both;animation-delay:calc(var(--i) * 45ms)}
@keyframes sweep{0%{transform:translateX(-101%)}42%,58%{transform:translateX(0)}100%{transform:translateX(101%)}}

/* red cursor dot */
.cursor{position:fixed;left:0;top:0;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:var(--coral);z-index:90;pointer-events:none;opacity:0;transition:width .25s,height .25s,margin .25s,opacity .25s}
.cursor.on{opacity:1}
.cursor.big{width:44px;height:44px;margin:-22px 0 0 -22px;opacity:.28}

/* wide photo revealed in stair-step blocks */
.photo{padding:0!important;height:clamp(320px,64vh,660px);overflow:hidden}
.photo img{width:100%;height:100%;object-fit:cover}
.steps{position:absolute;inset:0;display:grid;grid-template-columns:repeat(6,1fr)}
.steps i{background:var(--white);transform-origin:bottom center;transform:scaleY(0)}
.js .photo .steps i{transform:scaleY(1);transition:transform 1s cubic-bezier(.7,0,.2,1);transition-delay:calc(var(--i) * 90ms)}
.js .photo.in .steps i{transform:scaleY(0)}

/* about: scroll-reveal statement + rows */
.reveal{font-size:clamp(1.9rem,4.4vw,3.4rem);font-weight:600;line-height:1.12;letter-spacing:-.04em;margin:0;max-width:24ch}
.reveal .w{transition:color .35s}
.js .reveal .w{color:var(--pending)}
.js .reveal .w.on{color:var(--coral)}
.about-cta{margin-top:34px}
.rows{margin-top:clamp(48px,7vw,80px);border-top:1px solid var(--line)}
.rowx{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:center;padding-block:clamp(22px,3vw,34px);border-bottom:1px solid var(--line);text-decoration:none}
.rowx h3{font-size:clamp(1.5rem,3vw,2rem);font-weight:700}
.rowx .sub{color:var(--coral-ink);font-weight:500;margin:4px 0 8px}
.rowx p{margin:0;color:var(--muted);max-width:62ch}
.rowx .go{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--soft);color:var(--muted);transition:background .25s,color .25s,transform .35s}
.rowx .go svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.rowx:hover .go{background:var(--coral);color:#fff;transform:rotate(-45deg)}

/* services */
.svc-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:32px}
.svc-head > div{min-width:0}
.svc{max-width:none}
.svc-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}
.svc-tabs button{font:inherit;font-weight:600;font-size:.95rem;color:var(--ink);background:var(--white);border:1.5px solid var(--line);border-radius:999px;padding:9px 18px;cursor:pointer;transition:background .2s,border-color .2s,color .2s}
.svc-tabs button:hover{border-color:var(--ink)}
.svc-tabs button[aria-selected="true"]{background:var(--coral);border-color:var(--coral);color:#fff}
.svc-panel{background:var(--soft);border-radius:22px;padding:clamp(22px,3vw,40px)}
.panel-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px 20px;flex-wrap:wrap;margin-bottom:22px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.panel-head h3{font-size:clamp(1.6rem,3.4vw,2.2rem);font-weight:700}
.panel-head p{margin:0;color:var(--coral-ink);font-weight:500;font-size:.95rem}
.items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 48px;align-items:start}
@media (max-width:700px){.items{grid-template-columns:1fr}}
.item{min-width:0}
.item .row{display:flex;align-items:baseline;gap:8px;font-weight:600;font-size:1.02rem}
.item .row .lead{flex:1;border-bottom:1.5px dotted #cfccc8;transform:translateY(-5px);min-width:16px}
.item .row .pr{font-weight:700;color:var(--coral-ink);font-variant-numeric:tabular-nums;white-space:nowrap}
.item small{font-weight:500;font-size:.8rem;color:var(--muted);margin-left:4px}
.item p{margin:4px 0 0;color:var(--muted);font-size:.93rem;line-height:1.45}
.menu-note{color:var(--muted);font-size:.92rem;margin:18px 0 0;max-width:80ch}

/* gallery: 3D photo ring */
.gallery{background:var(--soft-2);overflow:hidden}
.ghead{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.ghead a{color:var(--muted);text-decoration:none;font-weight:500}
.ghead a:hover{color:var(--coral-ink)}
.stage{--iw:280px;--ih:220px;position:relative;height:calc(var(--ih) * 1.9);margin-top:28px;perspective:760px;perspective-origin:50% 50%;cursor:grab;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.stage.drag{cursor:grabbing}
.ring{position:absolute;left:50%;top:50%;width:var(--iw);height:var(--ih);margin:calc(var(--ih) / -2) 0 0 calc(var(--iw) / -2);transform-style:preserve-3d;transform:rotateY(var(--a,0deg))}
.card{position:absolute;inset:0;transform:rotateY(calc(var(--i) * 30deg)) translateZ(calc(var(--r,470px) * -1));backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:14px;overflow:hidden;background:#ddd;box-shadow:0 10px 30px rgba(0,0,0,.12)}
.card img{width:100%;height:100%;object-fit:cover;pointer-events:none}
.card span{position:absolute;left:10px;bottom:10px;background:rgba(255,255,255,.94);color:var(--ink);font-size:.82rem;font-weight:600;padding:5px 12px;border-radius:999px}
@media (max-width:700px){.stage{--iw:170px;--ih:136px;perspective:480px}}
.gfoot{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-top:28px}
.gfoot p{margin:0;color:var(--muted);font-size:.9rem;max-width:56ch}

/* coral call band */
.band{background:var(--coral);color:#fff;text-align:left}
.band .big{font-size:clamp(2.8rem,9vw,7.5rem);font-weight:800;letter-spacing:-.06em;line-height:.95;margin:0}
.band .big a{text-decoration:none;color:#fff;font-variant-numeric:tabular-nums}
.band .script{font-family:var(--script);font-size:clamp(1.2rem,2.6vw,1.8rem);margin:0 0 18px}
.band p{max-width:52ch;margin:18px 0 28px;color:rgba(255,255,255,.92)}
.band .label{color:#fff}
.band .label::before{background:#fff}

/* policies */
.pol-intro{color:var(--muted);max-width:70ch;margin:14px 0 30px}
.policy ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:14px}
.policy li{background:var(--soft);border-radius:18px;padding:20px 22px;color:var(--muted);font-size:.96rem;line-height:1.5}
.policy li b{display:block;color:var(--ink);font-size:1.08rem;margin-bottom:4px}


/* section label rows: label left, small text right (like the reference) */
.lrow{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:14px}
.lrow .label{margin:0}
.lrow .meta{color:var(--muted);font-weight:500;font-size:.95rem}
.lrow .meta a{text-decoration:none}
.center-head{text-align:center;max-width:820px;margin:28px auto 0}
.center-head .lead-p{margin-inline:auto}

/* about: label left / statement right, then columns */
.about-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.6fr);gap:24px 48px;align-items:start}
.about-grid .label{margin-top:12px}
@media (max-width:800px){.about-grid{grid-template-columns:1fr}}
.cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px 32px;margin-top:clamp(48px,7vw,84px);padding-top:clamp(28px,4vw,40px);border-top:1px solid var(--line)}
@media (max-width:1000px){.cols{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.cols{grid-template-columns:1fr}}
.col h3{font-size:1.3rem;font-weight:700;letter-spacing:-.02em}
.col .sub{color:var(--coral-ink);font-weight:500;font-size:.93rem;margin:4px 0 10px}
.col p{margin:0;color:var(--muted);font-size:.95rem;line-height:1.55}

/* fade-up on scroll */
.js .fu{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.8,.2,1);transition-delay:calc(var(--d,0) * 110ms)}
.js .fu.in{opacity:1;transform:none}

/* featured: word strip + big photo cards with a following red arrow */
.featured{background:var(--white)}
.strip{overflow:hidden;margin:28px 0 36px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.strip-track{display:flex;gap:14px;width:max-content;animation:marquee 32s linear infinite}
.strip-track span{display:inline-flex;align-items:center;gap:10px;padding:8px 16px;border-radius:999px;border:1px solid var(--line);font-weight:600;font-size:.95rem;color:var(--muted);white-space:nowrap}
.strip-track span b{width:8px;height:8px;border-radius:50%;background:var(--coral)}
@keyframes marquee{to{transform:translateX(-50%)}}
.fgrid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
@media (max-width:760px){.fgrid2{grid-template-columns:1fr}}
.fcard{display:block;text-decoration:none;color:inherit;background:var(--soft);border-radius:24px;padding:10px;position:relative}
.fcard .ph{position:relative;border-radius:18px;overflow:hidden;aspect-ratio:16/10;max-width:100%;cursor:none}
.fcard .ph img{width:100%;height:100%;object-fit:cover;transition:filter .45s,transform .6s cubic-bezier(.2,.8,.2,1)}
.fcard:hover .ph img{filter:blur(6px) brightness(.95);transform:scale(1.04)}
.fcard .go2{position:absolute;left:0;top:0;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;background:var(--coral);color:#fff;display:grid;place-items:center;transform:translate(var(--gx,50%),var(--gy,50%)) scale(0);transition:transform .35s cubic-bezier(.2,.8,.2,1);pointer-events:none}
.fcard:hover .go2{transform:translate(var(--gx,50%),var(--gy,50%)) scale(1)}
.fcard .go2 svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transform:rotate(-45deg)}
.fcard .meta2{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 10px 6px}
.fcard h3{font-size:1.15rem;font-weight:700;letter-spacing:-.02em}
.fcard .s{color:var(--coral-ink);font-size:.9rem;font-weight:500}
.fcard .tagp{flex:none;border:1px solid var(--line);background:#fff;border-radius:999px;padding:6px 14px;font-weight:700;font-size:.92rem}
@media (pointer:coarse){.fcard .ph{cursor:pointer}.fcard .go2,.fcard:hover .go2{left:auto;right:14px;top:14px;margin:0;width:48px;height:48px;transform:none}.fcard:hover .ph img{filter:none;transform:none}}

/* contact like the reference: big title left, card right */
.contact2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:32px 56px;align-items:start;margin-top:36px}
@media (max-width:860px){.contact2{grid-template-columns:1fr}}
.ctag{display:inline-flex;align-items:center;gap:8px;background:rgba(138,108,88,.1);color:var(--coral-ink);font-weight:600;font-size:.88rem;padding:6px 12px;border-radius:8px}
.ctag svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.cbig{font-size:clamp(3rem,8vw,5.4rem);font-weight:800;letter-spacing:-.06em;line-height:.95;margin:16px 0 14px}
.cleft p{color:var(--muted);margin:0 0 18px;max-width:42ch}
.avail{display:flex;align-items:center;gap:10px;font-weight:500;margin:18px 0;padding-top:18px;border-top:1px solid var(--line)}
.avail i{width:18px;height:18px;border-radius:50%;background:rgba(138,108,88,.14);display:grid;place-items:center}
.avail i::after{content:"";width:8px;height:8px;border-radius:50%;background:var(--coral)}
.ccard{background:var(--soft);border-radius:24px;padding:clamp(22px,3vw,34px)}
.ccard h3{font-size:1.4rem;font-weight:700;margin-bottom:6px}
.blackbtn{display:flex;justify-content:center;align-items:center;gap:10px;width:100%;margin-top:22px;padding:16px;border-radius:12px;background:var(--ink);color:#fff;text-decoration:none;font-weight:700;font-size:1.05rem;transition:background .2s}
.blackbtn:hover{background:#262626}
.blackbtn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* stair edge stays at the bottom of the wide photo */
.photo{height:clamp(360px,82vh,820px)}
.js .photo.in .steps i{transform:scaleY(var(--h))}


/* two-column: title left, cards stacked right */
.care{background:var(--soft-2);overflow-x:clip}
.care-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px 56px;align-items:start}
@media (max-width:860px){.care-grid{grid-template-columns:1fr}}
.care-left{position:sticky;top:110px}
@media (max-width:860px){.care-left{position:static}}
.care-left p.lead-p{margin-bottom:22px}
.care-left dl{margin:0;display:grid;gap:14px}
.care-left dt{font-weight:700}
.care-left dd{margin:2px 0 0;color:var(--muted);font-size:.95rem}
.ccards{display:grid;gap:14px}
.ccard2{background:#fff;border-radius:18px;padding:22px 24px;box-shadow:0 1px 0 rgba(0,0,0,.03)}
.ccard2 .hd{display:flex;align-items:center;gap:12px;margin-bottom:8px}
.ccard2 .ic{width:38px;height:38px;border-radius:10px;background:rgba(138,108,88,.12);color:var(--coral-ink);display:grid;place-items:center;flex:none}
.ccard2 .ic svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ccard2 h3{font-size:1.25rem;font-weight:700;letter-spacing:-.02em}
.ccard2 p{margin:0;color:var(--muted);font-size:.95rem}
.js .ccard2.fu{transform:translateX(40px)}
.js .ccard2.fu.in{transform:none}


/* NAILS BB logo: Nails + butterfly + mirrored BB, in mocha serif */
.mark{font-optical-sizing:none;font-variation-settings:"opsz" 14;display:inline-flex;align-items:center;gap:.08em;font-family:var(--serif);font-weight:500;line-height:1;letter-spacing:.02em;color:var(--nails)}
.mark .bf{width:.9em;height:.72em;color:var(--coral);flex:none;transform:translateY(-.32em)}
.mark .bb{display:inline-flex;color:var(--coral);font-weight:500}
.mark .bb .m{display:inline-block;transform:scaleX(-1);margin-left:-.05em}
.logo .mark{font-size:1.55rem}
footer .mark{color:#e9c8bc}
footer .mark .bf,footer .mark .bb{color:#cbb3a1}
.hero h1 .big{font-family:var(--serif);font-weight:600;letter-spacing:-.01em;gap:0;text-shadow:0 0 22px #fff,0 0 10px #fff,0 0 3px #fff}
.hero h1 .big .bf{width:.4em;height:.32em;margin:0 .02em 0 .04em;transform:translateY(-.5em);filter:drop-shadow(0 0 6px #fff)}
.hero h1 .big .bb{margin-left:.04em}
.h2,.cbig,.band .big,.reveal{font-family:var(--serif);font-weight:500;letter-spacing:-.02em}
.reveal{line-height:1.15}

/* faint logo watermark that stays in place while the content scrolls over it */
.watermark{position:fixed;inset:0;z-index:2;display:grid;place-items:center;pointer-events:none;opacity:0;transition:opacity .7s ease;mix-blend-mode:multiply}
.watermark.on{opacity:1}
.watermark .mark{font-size:clamp(4.5rem,17vw,15rem);font-weight:600;color:rgba(138,108,88,.1);text-shadow:2px 2px 0 rgba(255,255,255,.55),-1px -1px 0 rgba(60,40,30,.05)}
.watermark .mark .bf,.watermark .mark .bb{color:inherit}
.watermark .mark .bf{width:.4em;height:.32em;transform:translateY(-.72em)}


/* hero promo pill for the signature pedicure */
.promo{display:inline-flex;align-items:center;gap:10px;margin:0 auto 18px;padding:6px 8px 6px 6px;border-radius:999px;background:rgba(255,255,255,.92);box-shadow:0 6px 24px rgba(60,40,30,.14);font-weight:600;font-size:.92rem;color:var(--ink);text-decoration:none;max-width:100%}
.promo b{background:var(--sage);color:#fff;border-radius:999px;padding:4px 10px;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;flex:none}
.promo em{font-style:normal;color:var(--nails);font-weight:700}
.promo svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;flex:none;margin-right:4px;transition:transform .3s}
.promo:hover svg{transform:translateX(4px)}
.promo .t{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:480px){.promo{font-size:.8rem}.promo .x{display:none}}

/* signature service: The Ultimate CBD Volcano */
main > section.sig.sig{background:linear-gradient(160deg,#f7f4ea,#f3eee9 55%,#eef2e6)}
.sig{overflow-x:clip}
.sig-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(32px,5vw,72px);align-items:center}
@media (max-width:900px){.sig-grid{grid-template-columns:1fr}}
.sig-art{position:relative}
.sig-art .frame{border-radius:28px;overflow:hidden;box-shadow:0 30px 60px -20px rgba(60,40,30,.35);transform:rotate(-1.5deg)}
.sig-art img{display:block;width:100%;height:auto}
.sig-price{position:absolute;top:-22px;right:-14px;width:118px;height:118px;border-radius:50%;background:var(--nails);color:#fff;display:grid;place-content:center;text-align:center;box-shadow:0 14px 30px -8px rgba(120,60,45,.55);transform:rotate(8deg);animation:bob 4s ease-in-out infinite}
.sig-price small{font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;opacity:.9}
.sig-price strong{font-family:var(--serif);font-size:2.05rem;font-weight:600;line-height:1}
@keyframes bob{50%{transform:rotate(8deg) translateY(-8px)}}
@media (max-width:600px){.sig-price{width:92px;height:92px;right:-4px}.sig-price strong{font-size:1.8rem}}
.sig .script{font-family:var(--script);color:var(--sage-ink);font-size:clamp(1.05rem,2vw,1.3rem);margin:14px 0 0}
.sig .h2 em{font-style:normal;color:var(--nails)}
.sig-steps{list-style:none;margin:26px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px 22px;counter-reset:s}
@media (max-width:480px){.sig-steps{grid-template-columns:1fr}}
.sig-steps li{counter-increment:s;display:flex;align-items:baseline;gap:12px;padding:10px 0;border-bottom:1px solid var(--line);font-weight:500}
.sig-steps li::before{content:counter(s,decimal-leading-zero);font-family:var(--serif);font-size:1.25rem;font-weight:600;color:var(--sage-ink);min-width:1.6em}
.sig-perks{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:24px 0 0}
@media (max-width:480px){.sig-perks{grid-template-columns:1fr}}
.perk{background:#fff;border-radius:16px;padding:14px 16px;box-shadow:0 1px 0 rgba(0,0,0,.03)}
.perk .k{display:block;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--sage-ink);margin-bottom:4px}
.perk p{margin:0;font-weight:600}
.sig .cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.sig .fine{font-size:.8rem;color:var(--muted);margin:16px 0 0}
@media (prefers-reduced-motion:reduce){.sig-price{animation:none}}
.sig-art .frame.poster{display:block;transform:rotate(-1deg);max-width:560px;margin-inline:auto;border-radius:22px;transition:transform .3s ease,box-shadow .3s ease}
.sig-art .frame.poster:hover{transform:rotate(0) scale(1.01)}
.poster-tap{text-align:center;font-size:.85rem;color:var(--muted);margin:14px 0 0}
@media (prefers-reduced-motion:reduce){.sig-art .frame.poster{transition:none}}

/* faq */
.faq{background:var(--soft-2)}
.faq-list{margin-top:28px;border-top:1px solid var(--line)}
.qa{border-bottom:1px solid var(--line)}
.qa summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px 0;font-weight:600;font-size:clamp(1.1rem,2vw,1.3rem)}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:"+";flex:none;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--coral-ink);font-size:1.4rem;font-weight:500;transition:transform .3s}
.qa[open] summary::after{transform:rotate(45deg)}
.qa p{margin:0 0 22px;color:var(--muted);max-width:72ch}

/* contact */
.contact{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));gap:24px;margin-top:32px}
.contact > div{min-width:0;background:var(--soft);border-radius:22px;padding:clamp(22px,3vw,36px)}
.contact h3{font-size:1.6rem;font-weight:700;margin-bottom:14px}
.hours{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums;margin-top:12px}
.hours td{padding:10px 0;border-bottom:1px solid var(--line)}
.hours td:last-child{text-align:right;font-weight:600}
.hours tr.today td{color:var(--coral-ink)}
.hnote{margin:14px 0 0;color:var(--muted);font-size:.9rem}
.cl{display:grid;gap:14px;margin-bottom:24px}
.cl div{display:flex;gap:12px;align-items:flex-start}
.cl svg{flex:none;width:20px;height:20px;fill:none;stroke:var(--coral);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;margin-top:3px}
.cl strong{font-size:1.25rem}
.btnrow{display:flex;gap:10px;flex-wrap:wrap}
.reviews{margin-top:24px;padding-top:20px;border-top:1px solid var(--line);display:grid;gap:12px}
.reviews > span{font-weight:600}

/* footer */
footer{background:var(--ink);color:#bdbab6;padding-block:64px 28px;font-size:.95rem}
.fgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:32px;padding-bottom:40px;border-bottom:1px solid #2a2a2a}
footer .logo{color:#fff}
footer h4{color:#fff;font-size:1.05rem;font-weight:700;letter-spacing:0;margin-bottom:10px}
footer p{margin:0 0 6px}
footer a{color:#fff;text-decoration:none}
footer a:hover{color:var(--coral)}
.flinks{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.flinks a{border:1px solid #3a3a3a;border-radius:999px;padding:6px 14px;font-size:.88rem;font-weight:600}
.flinks a:hover{border-color:var(--coral)}
.fbot{padding-top:22px;display:grid;gap:6px;font-size:.84rem;color:#8f8c88}

/* phone call bar */
.callbar{display:none}
@media (max-width:760px),(hover:none) and (max-width:1100px),(max-height:500px) and (orientation:landscape){
  .callbar{display:grid;grid-template-columns:1fr 1fr;gap:8px;position:fixed;left:0;right:0;bottom:0;z-index:50;padding:8px 10px calc(8px + env(safe-area-inset-bottom,0px));background:rgba(255,255,255,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-top:1px solid var(--line)}
  .callbar a{display:flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;font-weight:700;padding:13px 8px;border-radius:999px;background:var(--soft);color:var(--ink)}
  .callbar a:first-child{background:var(--coral);color:#fff}
  footer{padding-bottom:100px}
}
@media (prefers-reduced-motion:reduce){
  .wipe{display:none}
  .js .fu{opacity:1;transform:none}
  .strip-track{animation:none}
  .loader,.cursor{display:none}
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .js .reveal .w{color:var(--coral)}
}

/* ===== phone layout cleanup ===== */
@media (max-width:760px){
  :root{--muted:#574d47}
  body{font-size:16px}
  /* solid sections: the spinning home screen no longer bleeds through */
  main > section:not(.hero):not(.band):not(.photo){background:#fff}
  main > section.gallery,main > section.faq,main > section.care{background:#f8f4f0}
  main > section.band{background:var(--coral)}
  section{padding-block:56px}
  .h2{font-size:clamp(2.1rem,9.5vw,2.8rem)}
  .reveal{font-size:clamp(1.45rem,6.4vw,1.9rem)!important;line-height:1.25}
  .lead-p{font-size:1rem}
  /* photo band: no half-finished white steps */
  .photo{height:52vh}
  .photo .steps{display:none}
  /* gallery: simple swipe row instead of the 3D ring */
  .stage{height:auto;perspective:none;margin-top:20px;cursor:auto;touch-action:auto;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding:0 16px 8px;scrollbar-width:none}
  .stage::-webkit-scrollbar{display:none}
  .ring{position:static;width:auto;height:auto;margin:0;display:flex;gap:12px;transform:none!important;transform-style:flat}
  .card{position:relative;inset:auto;flex:0 0 74vw;aspect-ratio:4/5;transform:none!important;scroll-snap-align:center;box-shadow:0 6px 18px rgba(0,0,0,.1)}
  .g-desk{display:none}
  .g-mob{display:inline}
  .gfoot{margin-top:18px}
  /* tidy small text rows */
  .lrow{flex-wrap:wrap;gap:6px}
  .cols .col p{font-size:1rem}
}
.g-mob{display:none}

/* ===== review round: shared fixes ===== */
html{scroll-padding-top:84px}
.skip{position:absolute;left:12px;top:-60px;z-index:200;background:var(--ink);color:#fff;padding:12px 16px;border-radius:10px;text-decoration:none;font-weight:600}
.skip:focus{top:12px}
.card{margin:0}
:root{--pending:#b3a398}
.wrap{padding-left:max(clamp(16px,3vw,32px),env(safe-area-inset-left));padding-right:max(clamp(16px,3vw,32px),env(safe-area-inset-right))}
/* see-through stays subtle; hero text/buttons hide once covered (JS) */
@media (min-width:761px){
  main > section:not(.hero):not(.band):not(.photo){background:rgba(255,255,255,.95)}
  main > section.gallery,main > section.faq{background:rgba(248,244,240,.95)}
  .watermark .mark{color:rgba(138,108,88,.07)}
}
.hero.paused .spiral-wrap{opacity:.85}
/* hero readability */
.hero-copy::before{content:"";position:absolute;inset:6% -12%;z-index:-1;background:radial-gradient(closest-side,rgba(255,255,255,.92) 55%,rgba(255,255,255,0));pointer-events:none}
.hero h1 .tag{background:rgba(255,255,255,.88);padding:3px 12px;border-radius:999px}
.hero p.intro{font-size:clamp(1.05rem,1.6vw,1.2rem);font-weight:600;color:var(--ink)}
.chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.chips li{background:rgba(255,255,255,.92);border:1px solid var(--line);border-radius:999px;padding:6px 12px;font-size:.88rem;font-weight:600;color:var(--ink)}
.nobook{margin:0;font-size:.92rem;font-weight:600;color:var(--ink);background:rgba(255,255,255,.85);padding:2px 10px;border-radius:999px}
.chipsets{display:grid;gap:18px;margin-top:36px;padding-top:28px;border-top:1px solid var(--line)}
.chipsets .k{display:block;font-weight:700;margin-bottom:10px}
.chipsets .chips{justify-content:flex-start}
.chipsets .chips li{background:var(--soft-2)}
h2.label{font-size:1rem;font-family:var(--sans);letter-spacing:0}
/* photo band: steps fully clear once revealed */
.js .photo.in .steps i{transform:scaleY(0)!important}
/* services */
.svc-cta{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:22px}
.svc-cta > span:last-child{color:var(--muted);font-size:.95rem}
.panel-head h3,.ccard h3{font-family:var(--serif);font-weight:500;letter-spacing:0}
/* tap targets + small text */
.promo,.flinks a,.pill{min-height:44px}
.hcall .pill{min-height:44px;min-width:44px}
.hcall .pill .dot{width:36px;height:36px}
.fbot a,footer p a,.lrow a.meta{display:inline-block;padding-block:10px}
.sig-price small{font-size:.75rem;opacity:1}
.perk .k,.promo b{font-size:.78rem}
.sig .fine,.item small,.card span{font-size:.875rem}
/* contrast */
.promo b{background:#5f6f48}
.promo em{color:#8f5546}
main > section.band{background:#7a5d4b}
.band p{color:#fff}
/* warmer footer */
footer{background:#2a201b}
.flinks a{border-color:#4a3c34}
footer a:hover{color:#e9c8bc}
/* phones */
@media (max-width:760px){
  html{scroll-padding-bottom:80px}
  .hero{min-height:max(600px,calc(100svh - 72px))}
  .hero-copy{padding:84px 16px 104px;gap:14px}
  .hero .chips li{font-size:.8rem;padding:5px 10px}
  .nav{max-height:calc(100dvh - 72px);overflow-y:auto}
  .svc-tabs{flex-wrap:nowrap;overflow-x:auto;scroll-snap-type:x proximity;margin-inline:-16px;padding:2px 16px 6px;scrollbar-width:none}
  .svc-tabs::-webkit-scrollbar{display:none}
  .svc-tabs button{flex:0 0 auto;scroll-snap-align:start;min-height:44px}
  .fgrid2{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;margin-inline:-16px;padding:0 16px 8px;scrollbar-width:none}
  .fgrid2::-webkit-scrollbar{display:none}
  .fgrid2 .fcard{flex:0 0 80%;scroll-snap-align:center}
  .card{flex:0 0 80vw}
  .ring::after{content:"";flex:0 0 4px}
  .photo{height:52svh}
  .chipsets{margin-top:28px}
}
@media (max-height:500px) and (orientation:landscape){
  .hero{min-height:100svh}
  .hero-copy{padding:72px 16px 96px}
  footer{padding-bottom:100px}
}

/* ===== v14: phone video fixes ===== */
.hero{background:#fff;isolation:isolate}
html:not(.js) .svc-tabs{display:none}
html:not(.js) .svc-panel[hidden]{display:block;margin-top:14px}
@media (max-width:760px){
  .orbit:nth-child(4){display:none}
  main > section:not(.hero):not(.photo){padding-top:40px;padding-bottom:40px}
  .hero-copy{padding:36px 14px 96px;gap:10px}
  .hero .intro{font-size:1rem;line-height:1.35;margin:4px 0 0}
  .hero .chips{gap:6px}
  .hero .chips li{font-size:.78rem;padding:4px 9px}
}

/* ===== v15: price grid + accordions ===== */
.svc{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:start}
@media (max-width:1024px){.svc{grid-template-columns:repeat(2,minmax(0,1fr))}}
.svc-cat{background:var(--soft);border-radius:22px;padding:22px 22px 24px;scroll-margin-top:90px}
.svc-cat summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px;cursor:default;padding-bottom:12px;border-bottom:1px solid var(--line);margin-bottom:14px}
.svc-cat summary::-webkit-details-marker{display:none}
.svc-cat h3{font-family:var(--serif);font-weight:500;font-size:1.7rem;margin:0;line-height:1.1}
.svc-cat .sub{margin:0 0 14px;color:var(--coral-ink);font-weight:500;font-size:.9rem}
.svc-cat .items{grid-template-columns:1fr;gap:12px}
.svc-cat .chev{display:none}
.sig-more{margin-top:22px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.sig-more > summary{font-weight:700;padding:16px 0}
.sig-more .sig-steps{margin-top:6px}
.sig-more .sig-perks{margin-bottom:18px}
@media (max-width:760px){
  .svc{grid-template-columns:1fr;gap:12px}
  .svc-cat{padding:4px 18px}
  .svc-cat summary{cursor:pointer;min-height:56px;padding:12px 0;margin:0;border-bottom:0}
  .svc-cat[open] summary{border-bottom:1px solid var(--line);margin-bottom:14px}
  .svc-cat[open]{padding-bottom:20px}
  .svc-cat h3{font-size:1.4rem}
  .svc-cat .chev{display:block;width:12px;height:12px;border-right:2px solid var(--ink);border-bottom:2px solid var(--ink);transform:rotate(45deg) translateY(-3px);transition:transform .25s}
  .svc-cat[open] .chev{transform:rotate(-135deg)}
}
.item .pol{display:inline-block;margin-top:6px;font-size:.78rem;font-weight:600;color:var(--ink);padding:3px 9px;border-radius:999px;background:#fff;border:1px solid var(--line)}

/* ===== v18: premium menu alignment ===== */
.svc{align-items:stretch}
.svc-cat{display:block;height:100%;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 4px 15px rgba(0,0,0,.05);padding:26px 24px 24px}
.svc-cat summary{border-bottom:2px solid var(--ink);padding-bottom:10px;margin-bottom:16px}
.svc-cat h3{font-family:var(--sans,inherit);font-size:1.05rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.svc-cat .sub{text-align:left;font-size:.85rem;margin:0 0 16px}
.svc-cat .items{display:block}
.svc-cat .item{display:block;margin:0 0 16px;text-align:left}
.svc-cat .item:last-child{margin-bottom:0}
.svc-cat .item .row{display:flex;justify-content:space-between;align-items:baseline;width:100%;gap:0;font-size:1rem}
.svc-cat .item .row > span:first-child{flex:0 1 auto;min-width:0;font-weight:600;color:var(--ink)}
.svc-cat .item .row .lead{flex:1 1 24px;min-width:24px;border-bottom:2px dotted #ccc;margin:0 8px;transform:translateY(-4px)}
.svc-cat .item .row .pr{flex:none;white-space:nowrap;font-weight:700;color:var(--ink)}
.svc-cat .item p{margin:4px 0 0;padding:0;text-align:left;font-size:.84rem;line-height:1.4;color:var(--muted)}
.svc-cat .item .pol{margin-top:6px;background:var(--soft)}
@media (max-width:760px){
  .svc-cat{height:auto;padding:4px 18px}
  .svc-cat summary{border-bottom:0;padding:12px 0;margin:0}
  .svc-cat[open] summary{border-bottom:2px solid var(--ink);margin-bottom:16px}
  .svc-cat[open]{padding-bottom:20px}
}

/* ===== v19: fail-safe responsive rows ===== */
.svc-cat .item .row{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:nowrap;width:100%;margin-bottom:0}
.svc-cat .item .row > span:first-child{flex:0 1 auto;min-width:0;max-width:75%;overflow-wrap:break-word;word-wrap:break-word}
.svc-cat .item .row .lead{flex-grow:1;min-width:10px;border-bottom:2px dotted #ccc;margin:0 8px;transform:translateY(-.42em)}
.svc-cat .item .row .pr{flex:none;white-space:nowrap;margin-left:auto}

/* ===== v21: brand lockup (UX review option C) ===== */
.mark{gap:.1em}
.mark .nw{font-family:var(--sans);font-weight:800;text-transform:uppercase;letter-spacing:.08em;font-size:.8em;line-height:1;color:#8a6c58;font-variation-settings:normal}
.mark .bb{display:inline-flex;align-items:center;color:#8a6c58;margin-left:0}
.mark .bbv{height:.58em;width:auto;display:block}
.mark .bf{width:.5em;height:.4em;color:#8a6c58;transform:translateY(-.12em)}
.hero h1 .big{align-items:center;gap:.06em}
.hero h1 .big .nw{letter-spacing:.02em}
.hero h1 .big .bf{width:.42em;height:.34em;margin:0 .03em;transform:translateY(-.08em)}
.hero h1 .big .bb{margin-left:0}
footer .mark .nw,footer .mark .bb,footer .mark .bf{color:#e9c8bc}
.watermark .mark .nw,.watermark .mark .bb,.watermark .mark .bf{color:inherit}
.mark .bbv{height:.62em}
.mark .bf{transform:translateY(-.02em)}
.hero h1 .big .bbv{height:.58em;filter:drop-shadow(0 0 10px #fff) drop-shadow(0 0 3px #fff)}
.hero h1 .big .bf{transform:translateY(-.08em)}

/* ===== v22: original Nails BB hummingbird logo, site colors (UX review D-refined) ===== */
:root{--lg-t:#6b4d3e;--lg-w1:#6577a8;--lg-w2:#d46e63}
footer .mark{--lg-t:#f1e7e1;--lg-w1:#93a1c9;--lg-w2:#e58a80}
.watermark .mark{--lg-t:rgba(138,108,88,.09);--lg-w1:rgba(138,108,88,.09);--lg-w2:rgba(138,108,88,.09)}
.mark .lg{display:block;width:auto;height:1em;overflow:visible}
.logo .mark{font-size:44px}
footer .logo .mark{font-size:56px}
.watermark .mark .lg{height:1.25em}
.hero h1 .big{display:block;font-size:clamp(130px,19vw,250px);line-height:1;text-shadow:none;margin:4px 0 2px}
.hero h1 .big .lg{height:1em;margin:0 auto;filter:drop-shadow(0 0 14px #fff) drop-shadow(0 0 5px #fff)}
@media (max-width:760px){.logo .mark{font-size:34px}.hero h1 .big{font-size:clamp(108px,30vw,150px)}}
footer{position:relative;z-index:2}

/* ===== v23: background logo visible while scrolling (phones + desktop) ===== */
.watermark .mark{font-size:clamp(6rem,21vw,21rem);--lg-t:rgba(107,77,62,.10);--lg-w1:rgba(101,119,168,.10);--lg-w2:rgba(212,110,99,.10)}
@media (max-width:760px){.watermark .mark{font-size:37vw;--lg-t:rgba(107,77,62,.09);--lg-w1:rgba(101,119,168,.09);--lg-w2:rgba(212,110,99,.09)}}
@media (prefers-reduced-motion:reduce){.watermark{transition:none}}
