/* alder.css — self-contained design system for this prototype.
   Extracted from the original single-page build so all pages of the site share it.
   Brand-isolated on purpose: do NOT merge into the main site stylesheet. */

button,input,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit;color:inherit}
:root{
  --ink:#1a2740; --ink-2:#2c3a55; --ink-3:#5a6a85; --ink-4:#5e6b85;
  --bone:#f5f7fa; --bone-2:#e9eef4; --paper:#fafbfd;
  --copper:#c89b6d; --copper-2:#836641; --copper-soft:#dcb898;
  --blue:#4a6fa5;
  --rule:rgba(26,39,64,.08); --rule-2:rgba(26,39,64,.14); --rule-soft:rgba(26,39,64,.04);
  --rule-bone:rgba(245,247,250,.14);
  --display:'Tenor Sans', sans-serif;
  --serif:'Source Serif 4', serif;
  --sans:'Inter', sans-serif;
  --mono:'JetBrains Mono', ui-monospace, monospace;
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{background:var(--bone);color:var(--ink);font-family:var(--sans);font-weight:400;-webkit-font-smoothing:antialiased;overflow-x:clip}
img{display:block;max-width:100%}
a{color:inherit}

.js #pto{position:fixed;inset:0;background:var(--ink);z-index:9999;pointer-events:none;opacity:1;transition:opacity .4s ease}
#pto.hide{opacity:0}

.yeti-bar{
  position:sticky;top:0;z-index:9000;background:#0c1426;color:rgba(245,247,250,.6);
  display:flex;align-items:center;justify-content:space-between;
  padding:10px 28px;font-family:var(--mono);font-size:11px;letter-spacing:.08em;
  border-bottom:1px solid rgba(245,247,250,.06);
}
.yeti-bar a{color:rgba(245,247,250,.6);text-decoration:none}
.yeti-bar a:hover{color:#fff}
.yeti-bar .right{background:var(--copper);color:var(--ink);font-weight:500;
  padding:7px 14px;font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;}
.yeti-bar .right:hover{background:var(--copper-2);color:#fff}

.nav-toggle{display:none;background:none;border:none;font-size:22px;cursor:pointer;padding:8px;color:var(--ink)}
nav.site-nav{
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  padding:24px 40px;background:var(--bone);border-bottom:1px solid var(--rule);
  position:relative;z-index:8500;
}
.nav-l,.nav-r{display:flex;gap:36px;align-items:center}
.nav-r{justify-content:flex-end}
nav.site-nav a{
  font-family:var(--sans);font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--ink-3);text-decoration:none;position:relative;padding-bottom:4px;font-weight:500;
}
nav.site-nav a::after{
  content:"";position:absolute;left:0;right:100%;bottom:0;height:1px;
  background:var(--copper);transition:right .35s cubic-bezier(.4,0,.2,1);
}
nav.site-nav a:hover{color:var(--ink)}
nav.site-nav a:hover::after{right:0}
nav.site-nav a.nav-cta::after{display:none}
nav.site-nav .nav-mark{
  font-family:var(--display);font-size:24px;letter-spacing:.18em;color:var(--ink);
  display:inline-block;line-height:1;text-transform:uppercase;white-space:nowrap;
}
nav.site-nav .nav-mark sub{font-family:var(--mono);font-size:9px;letter-spacing:.22em;color:var(--ink-4);text-transform:uppercase;vertical-align:baseline;font-weight:400;margin-left:10px}
.nav-cta{
  border:1px solid var(--ink);color:var(--ink)!important;
  padding:14px 20px!important;font-size:10px!important;letter-spacing:.18em!important;
  transition:background .25s,color .25s;
}
.nav-cta:hover{background:var(--ink);color:var(--bone)!important}

.hero{
  position:relative;min-height:94vh;
  display:grid;grid-template-columns:1fr 1.05fr;
  background:var(--bone);overflow:hidden;
}
.hero-figure{position:relative;background:var(--ink-2);overflow:hidden;order:2}
.hero-figure image-slot, .hero-figure img{
  position:absolute;inset:0;width:100%;height:100%;
  animation:kenburns 26s ease-in-out infinite alternate;
}
@keyframes kenburns{from{transform:scale(1.05)}to{transform:scale(1.13) translate(-1.5%,-1%)}}
.hero-figure::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(26,39,64,0) 0%,rgba(26,39,64,0) 60%,rgba(26,39,64,.45) 100%);
  pointer-events:none;
}
.hero-tag{position:absolute;top:34px;right:34px;z-index:2;font-family:var(--mono);font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:#fff;display:flex;gap:10px;align-items:center;text-shadow:0 1px 8px rgba(0,0,0,.45);}
.hero-tag span{display:inline-block;width:18px;height:1px;background:rgba(255,255,255,.7)}
.hero-coord{position:absolute;bottom:30px;right:34px;z-index:2;color:#fff;font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;display:flex;flex-direction:column;gap:3px;text-shadow:0 1px 8px rgba(0,0,0,.5);align-items:flex-end;}
.hero-coord b{font-weight:500;letter-spacing:.22em}
.hero-coord i{font-style:normal;opacity:.78}

.hero-body{position:relative;padding:88px 80px 60px;display:flex;flex-direction:column;justify-content:center;background:var(--bone);order:1}
.hero-since{font-family:var(--mono);font-size:11px;color:var(--copper-2);display:flex;align-items:center;gap:14px;margin-bottom:32px;letter-spacing:.22em;text-transform:uppercase;}
.hero-since::before{content:"";display:inline-block;width:36px;height:1px;background:var(--copper)}
.hero-h1{font-family:var(--display);font-weight:400;line-height:1.06;letter-spacing:0;font-size:clamp(50px,5.6vw,86px);color:var(--ink);margin-bottom:30px}
.hero-h1 em{font-family:var(--serif);font-style:italic;font-weight:400;color:var(--copper-2);font-size:.94em}
.hero-h1 .word{display:inline-block;opacity:0;transform:translateY(.18em);animation:wordIn .9s cubic-bezier(.2,.7,.2,1) forwards}
@keyframes wordIn{to{opacity:1;transform:none}}
.hero-lede{font-family:var(--serif);font-style:italic;font-weight:400;font-size:21px;line-height:1.55;color:var(--ink-2);max-width:42ch;margin-bottom:40px}
.hero-lede em{color:var(--copper-2);font-style:italic;font-weight:500}
.hero-ctas{display:flex;gap:24px;align-items:center;margin-bottom:54px;flex-wrap:wrap}
.btn-fill{background:var(--ink);color:var(--bone);padding:17px 30px;font-size:11px;letter-spacing:.22em;text-transform:uppercase;border:none;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:14px;font-family:var(--sans);font-weight:600;transition:background .25s, transform .25s;}
.btn-fill:hover{background:var(--copper-2);transform:translateY(-1px)}
.btn-fill .arrow{display:inline-block;width:20px;height:12px;background:currentColor;-webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 12' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'><path d='M1 6h17M13 1l5 5-5 5'/></svg>") center/contain no-repeat;mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 12' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'><path d='M1 6h17M13 1l5 5-5 5'/></svg>") center/contain no-repeat;vertical-align:middle;margin-left:2px;transition:transform .25s ease}
.btn-fill:hover .arrow{transform:translateX(3px)}
.btn-ghost{font-family:var(--sans);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-2);text-decoration:none;display:inline-flex;align-items:center;gap:12px;font-weight:500;padding:16px 0;border-bottom:1px solid var(--rule-2);transition:color .25s,border-color .25s;}
.btn-ghost:hover{color:var(--copper-2);border-color:var(--copper)}

.hero-stats{display:grid;grid-template-columns:repeat(3,auto);gap:42px;padding-top:36px;border-top:1px solid var(--rule)}
.hero-stat .num{font-family:var(--display);font-size:38px;color:var(--ink);line-height:1;margin-bottom:8px;letter-spacing:.02em}
.hero-stat .num em{font-family:var(--serif);font-style:italic;color:var(--copper-2);font-weight:400}
.hero-stat .lab{font-family:var(--mono);font-size:9.5px;letter-spacing:.22em;color:var(--ink-4);text-transform:uppercase}

.marq{background:var(--ink);color:var(--bone);overflow:hidden;border-top:1px solid var(--copper);border-bottom:1px solid var(--copper);padding:22px 0;}
.marq-track{display:flex;gap:48px;animation:marq 36s linear infinite;white-space:nowrap;width:max-content}
.marq span{font-family:var(--mono);font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:rgba(245,247,250,.78)}
.marq .dot{color:var(--copper);font-size:6px;line-height:0;display:flex;align-items:center}
.marq .dot::before{content:"◆"}
@keyframes marq{from{transform:translateX(0)}to{transform:translateX(-50%)}}

.prov{background:var(--ink);color:var(--bone);padding:120px 40px;position:relative;overflow:hidden}
.prov::before{content:"";position:absolute;top:0;right:0;width:30%;height:100%;background:radial-gradient(80% 60% at 70% 50%,rgba(200,155,109,.1) 0%,rgba(200,155,109,0) 60%);pointer-events:none}
.prov-grid{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:1.1fr 1fr;gap:80px;align-items:center;position:relative}
.prov-eyebrow{font-family:var(--mono);font-size:10.5px;letter-spacing:.28em;color:var(--copper-soft);text-transform:uppercase;display:flex;align-items:center;gap:14px;margin-bottom:24px}
.prov-eyebrow span{display:inline-block;width:36px;height:1px;background:var(--copper)}
.prov-name{font-family:var(--display);font-size:clamp(50px,5.6vw,86px);line-height:1.05;color:var(--bone);margin-bottom:18px;letter-spacing:.005em}
.prov-name em{font-family:var(--serif);font-style:italic;color:var(--copper-soft);font-weight:400}
.prov-title{font-family:var(--serif);font-style:italic;font-size:22px;color:var(--copper-soft);margin-bottom:32px;letter-spacing:.01em;font-weight:400}
.prov-bio{font-family:var(--sans);font-size:16px;line-height:1.7;color:rgba(245,247,250,.78);margin-bottom:32px;max-width:48ch}
.prov-creds{list-style:none;display:flex;flex-direction:column;gap:14px;border-top:1px solid var(--rule-bone);padding-top:24px;margin-bottom:32px;max-width:50ch}
.prov-creds li{display:grid;grid-template-columns:auto 1fr;gap:18px;font-family:var(--mono);font-size:11px;letter-spacing:.18em;color:rgba(245,247,250,.65);text-transform:uppercase;align-items:baseline;padding-bottom:14px;border-bottom:1px dashed var(--rule-bone)}
.prov-creds li:last-child{border-bottom:none}
.prov-creds li .y{color:var(--copper-soft);font-weight:500}
.prov-fig{position:relative;aspect-ratio:4/5;background:var(--ink-2);overflow:hidden}
.prov-fig image-slot{position:absolute;inset:0;width:100%;height:100%}
.prov-fig::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 65%,rgba(0,0,0,.45) 100%)}
.prov-meta{position:absolute;left:18px;bottom:18px;color:var(--bone);font-family:var(--mono);font-size:9.5px;letter-spacing:.22em;text-transform:uppercase;background:rgba(0,0,0,.55);padding:7px 11px;border:1px solid rgba(245,247,250,.18);}
.prov-badges{position:absolute;top:18px;right:18px;display:flex;flex-direction:column;gap:8px;align-items:flex-end}
.prov-badges .b{background:var(--copper);color:var(--ink);font-family:var(--mono);font-size:9px;letter-spacing:.22em;text-transform:uppercase;padding:6px 10px;font-weight:600;}
.prov-badges .b.alt{background:rgba(0,0,0,.55);color:var(--bone);border:1px solid rgba(245,247,250,.2);font-weight:500}

.sec{padding:140px 40px;background:var(--bone)}
.sec.paper{background:var(--paper)}
.sec.cool{background:var(--bone-2)}
.sec.dark{background:var(--ink);color:var(--bone)}
.sec-wrap{max-width:1280px;margin:0 auto}
.sec-eyebrow{font-family:var(--mono);font-size:10.5px;letter-spacing:.28em;color:var(--copper-2);text-transform:uppercase;display:flex;align-items:center;gap:14px;margin-bottom:24px}
.sec-eyebrow span{display:inline-block;width:36px;height:1px;background:var(--copper)}
.sec.dark .sec-eyebrow{color:var(--copper-soft)}
.sec.dark .sec-eyebrow span{background:var(--copper-soft)}
.sec-h2{font-family:var(--display);font-weight:400;font-size:clamp(40px,4.4vw,68px);line-height:1.1;letter-spacing:0;color:var(--ink);margin-bottom:24px;max-width:18ch}
.sec-h2 em{font-family:var(--serif);font-style:italic;font-weight:400;color:var(--copper-2)}
.sec.dark .sec-h2{color:var(--bone)}
.sec.dark .sec-h2 em{color:var(--copper-soft)}
.sec-lede{font-family:var(--serif);font-style:italic;font-weight:400;font-size:22px;line-height:1.55;color:var(--ink-2);max-width:55ch;margin-bottom:64px}
.sec.dark .sec-lede{color:rgba(245,247,250,.78)}

.tt-cats{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:56px}
.tt-cats button{font-family:var(--mono);font-size:10px;letter-spacing:.22em;padding:11px 18px;background:transparent;color:var(--ink-3);border:1px solid var(--rule-2);cursor:pointer;text-transform:uppercase;transition:background .2s,color .2s,border-color .2s;}
.tt-cats button:hover, .tt-cats button.on{background:var(--ink);color:var(--bone);border-color:var(--ink)}
.tt-table{border-top:1px solid var(--rule)}
.tt-row{display:grid;grid-template-columns:60px 1.4fr 1.6fr 90px 100px 60px;gap:24px;align-items:start;padding:28px 0;border-bottom:1px solid var(--rule);position:relative;cursor:pointer;transition:padding .35s ease;}
.tt-row:hover{padding-left:14px}
.tt-num{font-family:var(--mono);font-size:11px;letter-spacing:.18em;color:var(--ink-4);padding-top:6px}
.tt-name{font-family:var(--display);font-size:24px;color:var(--ink);line-height:1.15;letter-spacing:.005em}
.tt-name em{font-family:var(--serif);font-style:italic;color:var(--copper-2);font-weight:400}
.tt-name .cat{display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.22em;color:var(--copper-2);text-transform:uppercase;margin-top:4px;font-weight:500}
.tt-desc{font-family:var(--serif);font-style:italic;font-size:15px;line-height:1.55;color:var(--ink-3);padding-top:4px}
.tt-meta{font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:var(--ink-3);text-align:right;padding-top:8px}
.tt-price{font-family:var(--mono);font-size:13px;color:var(--ink);text-align:right;font-weight:500;padding-top:8px}
.tt-arrow{width:32px;height:1px;background:var(--ink-3);justify-self:end;align-self:center;transition:width .3s,background .3s}
.tt-row:hover .tt-arrow{width:48px;background:var(--copper)}

.cf{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:32px;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.cf-step{padding:48px 36px 48px 0;border-right:1px solid var(--rule);position:relative}
.cf-step:last-child{border-right:none;padding-right:0}
.cf-step:not(:first-child){padding-left:36px}
.cf-num{font-family:var(--mono);font-size:11px;letter-spacing:.22em;color:var(--copper-2);margin-bottom:24px;display:flex;gap:14px;align-items:center}
.cf-num span{display:inline-block;width:32px;height:1px;background:var(--copper)}
.cf-name{font-family:var(--display);font-size:32px;line-height:1.1;color:var(--ink);margin-bottom:18px;letter-spacing:.005em}
.cf-name em{font-family:var(--serif);font-style:italic;color:var(--copper-2);font-weight:400}
.cf-desc{font-size:15px;line-height:1.65;color:var(--ink-2);margin-bottom:24px;max-width:36ch}
.cf-time{font-family:var(--mono);font-size:10.5px;letter-spacing:.2em;color:var(--ink-4);text-transform:uppercase;border-top:1px dashed var(--rule);padding-top:14px;display:flex;justify-content:space-between}

.cw-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--rule)}
.cw{padding:36px 28px;border-right:1px solid var(--rule);border-bottom:1px solid var(--rule);position:relative;transition:background .25s;background:var(--bone)}
.cw:hover{background:var(--paper)}
.cw:nth-child(4n){border-right:none}
.cw:nth-last-child(-n+4){border-bottom:none}
.cw-mark{font-family:var(--display);font-size:36px;color:var(--copper-2);line-height:1;margin-bottom:18px;letter-spacing:.04em}
.cw-mark em{font-family:var(--serif);font-style:italic;font-weight:400}
.cw-name{font-family:var(--sans);font-size:16px;font-weight:500;color:var(--ink);line-height:1.4;margin-bottom:12px}
.cw-desc{font-family:var(--mono);font-size:10px;letter-spacing:.2em;color:var(--ink-3);text-transform:uppercase;line-height:1.6}

.rv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:48px}
.rv{padding:32px 0;border-top:1px solid var(--rule-bone)}
.rv-stars{font-family:var(--mono);font-size:13px;letter-spacing:.3em;color:var(--copper-soft);margin-bottom:24px}
.rv-quote{font-family:var(--serif);font-style:italic;font-weight:400;font-size:21px;line-height:1.5;color:var(--bone);margin-bottom:28px}
.rv-quote em{color:var(--copper-soft);font-weight:500}
.rv-attr{font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;color:rgba(245,247,250,.55);text-transform:uppercase;display:flex;flex-direction:column;gap:5px}
.rv-attr b{color:var(--bone);font-weight:500;letter-spacing:.22em}

.about{display:grid;grid-template-columns:1fr 1.1fr;gap:80px;align-items:center}
.about-fig{position:relative;aspect-ratio:1/1.1;background:var(--bone-2);overflow:hidden}
.about-fig image-slot{position:absolute;inset:0;width:100%;height:100%}
.about-body .sec-h2{margin-bottom:32px}
.about-body p{font-size:16px;line-height:1.75;color:var(--ink-2);margin-bottom:20px;max-width:48ch}
.about-body p em{font-family:var(--serif);font-style:italic;color:var(--copper-2);font-weight:500}
.about-sig{margin-top:40px;font-family:var(--display);font-size:24px;color:var(--ink);letter-spacing:.18em;text-transform:uppercase;line-height:1}
.about-sig em{font-family:var(--serif);font-style:italic;text-transform:none;color:var(--copper-2);letter-spacing:0;font-weight:400}
.about-sig + .about-sig-meta{font-family:var(--mono);font-size:10.5px;letter-spacing:.22em;color:var(--ink-4);text-transform:uppercase;margin-top:14px}

.cta{background:var(--ink);color:var(--bone);padding:160px 40px;position:relative;text-align:center;overflow:hidden}
.cta::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 40% at 50% 30%,rgba(200,155,109,.13) 0%,rgba(200,155,109,0) 60%)}
.cta-eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.3em;color:var(--copper-soft);text-transform:uppercase;margin-bottom:32px}
.cta-h{font-family:var(--display);font-weight:400;font-size:clamp(38px,6.4vw,98px);line-height:1.05;letter-spacing:0;color:var(--bone);margin-bottom:32px}
.cta-h em{font-family:var(--serif);font-style:italic;color:var(--copper-soft);font-weight:400}
.cta-lede{font-family:var(--serif);font-style:italic;font-size:22px;line-height:1.55;color:rgba(245,247,250,.78);max-width:50ch;margin:0 auto 56px}
.cta .btn-fill{background:var(--copper);color:var(--ink)}
.cta .btn-fill:hover{background:var(--copper-soft)}
.cta-meta{margin-top:48px;display:flex;gap:36px;justify-content:center;flex-wrap:wrap;font-family:var(--mono);font-size:10.5px;letter-spacing:.22em;color:rgba(245,247,250,.5);text-transform:uppercase}

.yeti-cs{background:#0c1426;color:var(--bone);padding:88px 40px;border-top:1px solid var(--rule-bone)}
.yeti-cs-wrap{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:auto 1fr auto;gap:48px;align-items:center}
.yeti-cs-mark{font-family:var(--display);font-size:24px;color:var(--bone);letter-spacing:.18em;line-height:1;text-transform:uppercase}
.yeti-cs-mark em{font-family:var(--serif);font-style:italic;color:var(--copper);font-weight:400;text-transform:none;letter-spacing:0}
.yeti-cs-text{font-family:var(--serif);font-style:italic;font-size:18px;line-height:1.55;color:rgba(245,247,250,.78);max-width:48ch}
.yeti-cs-text b{color:var(--bone);font-style:normal;font-weight:500;font-family:var(--sans)}
.yeti-cs-meta{display:flex;flex-direction:column;gap:6px;font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;color:rgba(245,247,250,.55);text-transform:uppercase;text-align:right}
.yeti-cs-meta b{color:var(--copper-soft);font-weight:500;letter-spacing:.22em}
.yeti-cs-cta{display:inline-flex;align-items:center;gap:14px;font-family:var(--sans);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--copper-soft);text-decoration:none;border-bottom:1px solid var(--copper-soft);padding-bottom:6px;font-weight:500;transition:color .25s,border-color .25s}
.yeti-cs-cta:hover{color:var(--copper);border-color:var(--copper)}

footer{background:var(--ink);color:var(--bone);padding:80px 40px 36px}
.foot-wrap{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:56px}
.foot-mark{font-family:var(--display);font-size:30px;letter-spacing:.18em;color:var(--bone);margin-bottom:20px;line-height:1;text-transform:uppercase}
.foot-mark em{font-family:var(--serif);font-style:italic;color:var(--copper);font-weight:400;text-transform:none;letter-spacing:0}
.foot-blurb{font-family:var(--serif);font-style:italic;font-size:16px;line-height:1.6;color:rgba(245,247,250,.6);max-width:32ch;font-weight:400}
.foot-col h3{font-family:var(--mono);font-size:10.5px;letter-spacing:.26em;color:var(--copper);text-transform:uppercase;margin-bottom:20px;font-weight:500}
.foot-col ul{list-style:none;display:flex;flex-direction:column;gap:11px}
.foot-col a, .foot-col li{font-family:var(--sans);font-size:13px;color:rgba(245,247,250,.7);text-decoration:none;transition:color .25s}
.foot-col a:hover{color:var(--bone)}
.foot-bottom{max-width:1280px;margin:64px auto 0;padding-top:28px;border-top:1px solid var(--rule-bone);display:flex;justify-content:space-between;align-items:center;font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;color:rgba(245,247,250,.5);text-transform:uppercase;flex-wrap:wrap;gap:16px;}
.foot-bottom a{color:rgba(245,247,250,.5);text-decoration:none}
.foot-bottom a:hover{color:var(--bone)}

.modal-bg{position:fixed;inset:0;background:rgba(26,39,64,.78);backdrop-filter:blur(8px);z-index:9500;opacity:0;pointer-events:none;transition:opacity .3s}
.modal-bg.on{opacity:1;pointer-events:auto}
.modal{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%) scale(.95);background:var(--bone);width:min(580px,92vw);z-index:9600;opacity:0;pointer-events:none;transition:opacity .3s,transform .35s cubic-bezier(.2,.7,.2,1);max-height:90vh;overflow:auto;border:1px solid var(--rule);}
.modal.on{opacity:1;pointer-events:auto;transform:translate(-50%,-50%) scale(1)}
.modal-h{padding:36px 40px 28px;border-bottom:1px solid var(--rule);display:flex;align-items:center;justify-content:space-between}
.modal-h h3{font-family:var(--display);font-size:28px;color:var(--ink);font-weight:400;line-height:1;letter-spacing:.04em;text-transform:uppercase}
.modal-h h3 em{font-family:var(--serif);font-style:italic;color:var(--copper-2);font-weight:400;letter-spacing:0;text-transform:none}
.modal-x{background:none;border:none;cursor:pointer;color:var(--ink-3);padding:8px;font-family:var(--mono);letter-spacing:.16em;text-transform:uppercase;font-size:11px}
.modal-x:hover{color:var(--ink)}
.modal-body{padding:32px 40px 40px}
.modal-body label{display:block;margin-bottom:18px;font-family:var(--mono);font-size:10.5px;letter-spacing:.2em;color:var(--ink-3);text-transform:uppercase}
.modal-body input,.modal-body select{display:block;width:100%;padding:13px 14px;background:var(--paper);border:1px solid var(--rule);font-family:var(--sans);font-size:16px;color:var(--ink);margin-top:8px;}
.modal-body input:focus,.modal-body select:focus{outline:none;border-color:var(--copper)}
.modal-body button{width:100%;padding:16px;background:var(--ink);color:var(--bone);border:none;cursor:pointer;font-family:var(--sans);font-size:11px;letter-spacing:.22em;text-transform:uppercase;font-weight:600;margin-top:12px;transition:background .25s;}
.modal-body button:hover{background:var(--copper-2)}

@media (max-width:980px){
  nav.site-nav{grid-template-columns:1fr auto auto;padding:18px 22px}
  .nav-l, .nav-r .nav-link{display:none}
  .nav-toggle{display:block}
  .nav-r{gap:14px}
  .hero{grid-template-columns:1fr;min-height:auto}
  .hero-figure{min-height:60vh;order:1}
  .hero-body{padding:64px 28px 56px;order:2}
  .hero-stats{gap:28px}
  .prov{padding:88px 24px}
  .prov-grid{grid-template-columns:1fr;gap:48px}
  .prov-name{font-size:48px}
  .sec{padding:88px 24px}
  .sec-h2{font-size:42px}
  .tt-row{grid-template-columns:40px 1fr 80px;gap:14px;padding:24px 0}
  .tt-desc, .tt-meta, .tt-arrow{display:none}
  .tt-name{font-size:20px}
  .tt-price{font-size:12px}
  .cf{grid-template-columns:1fr;gap:0}
  .cf-step{padding:36px 0!important;border-right:none;border-bottom:1px solid var(--rule)}
  .cf-step:last-child{border-bottom:none}
  .cw-grid{grid-template-columns:1fr 1fr}
  .cw{border-right:1px solid var(--rule);border-bottom:1px solid var(--rule)}
  .cw:nth-child(4n){border-right:1px solid var(--rule)}
  .cw:nth-child(2n){border-right:none}
  .cw:nth-last-child(-n+4){border-bottom:1px solid var(--rule)}
  .cw:nth-last-child(-n+2){border-bottom:none}
  .rv-grid{grid-template-columns:1fr;gap:24px}
  .about{grid-template-columns:1fr;gap:48px}
  .cta{padding:96px 28px}
  .yeti-cs-wrap{grid-template-columns:1fr;gap:24px;text-align:left}
  .yeti-cs-meta{text-align:left}
  .foot-wrap{grid-template-columns:1fr 1fr;gap:36px}
  .foot-bottom{justify-content:flex-start}
}
@media (max-width:560px){
  .cw-grid{grid-template-columns:1fr}
  .cw{border-right:none!important}
  .foot-wrap{grid-template-columns:1fr}
  .hero-stats{grid-template-columns:1fr;gap:18px}
  .hero-stat{display:flex;align-items:baseline;gap:14px}
  .hero-stat .num{margin-bottom:0;font-size:30px}
  .yeti-bar{flex-direction:column;gap:8px;padding:10px 16px}
  .yeti-bar .right{align-self:stretch;text-align:center}
}

.mob-nav{position:fixed;top:0;right:0;bottom:0;width:min(360px,86vw);background:var(--ink);color:var(--bone);padding:28px;z-index:9700;transform:translateX(105%);transition:transform .35s cubic-bezier(.2,.7,.2,1);display:flex;flex-direction:column;gap:20px}
.mob-nav.on{transform:translateX(0);visibility:visible;
  transition:transform .32s cubic-bezier(.2,.7,.2,1),visibility 0s}
.mob-nav .x{align-self:flex-end;background:none;border:none;color:var(--bone);font-family:var(--mono);font-size:12px;letter-spacing:.2em;cursor:pointer;text-transform:uppercase}
.mob-nav a{font-family:var(--display);font-size:28px;color:var(--bone);text-decoration:none;letter-spacing:.06em;text-transform:uppercase}
.mob-nav a em{font-family:var(--serif);font-style:italic;color:var(--copper-soft);font-weight:400;letter-spacing:0;text-transform:none}
.mob-nav .sub{font-family:var(--mono);font-size:10px;letter-spacing:.22em;color:var(--copper);margin-top:auto;text-transform:uppercase}

/* ── Mobile + reduced-motion: disable kenburns + heavy animations to keep scroll smooth ─ */
@media (max-width:880px){
  image-slot{animation:none !important}
}
@media (prefers-reduced-motion:reduce){
  image-slot{animation:none !important}
  *{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important}
}


/* ─── A11y: keyboard focus ring + touch handling ─── */
:focus{outline:none}
:focus-visible{outline:2px solid #b87a4f;outline-offset:3px;border-radius:2px}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:2px solid #b87a4f;outline-offset:3px;border-radius:2px}
button,a,input[type=submit],input[type=button]{touch-action:manipulation;-webkit-tap-highlight-color:rgba(0,0,0,.08)}
.modal,.booking-modal{overscroll-behavior:contain}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:-9999px;top:0;background:#111;color:#fff;padding:14px 22px;font-family:inherit;font-size:11px;letter-spacing:.18em;text-transform:uppercase;z-index:9999}
.skip-link:focus,.skip-link:focus-visible{left:16px;top:16px;outline:2px solid #b87a4f;outline-offset:3px}

/* ─── Mobile scroll-perf — kill infinite animations + backdrop-filter + heavy transforms.
       Stops scroll jank on iOS Safari + low-end Android. Universal selectors. */
@media (max-width: 880px) {
  .hero-fig image-slot, .hero-figure image-slot,
  .hero-fig img, .hero-figure img,
  .hero-photo image-slot, .hero-photo img,
  image-slot[id*="hero"], .featured-cover img {
    animation: none !important;
    transform: none !important;
  }
  .modal-bg, .booking-modal-bg, [class*="modal-bg"],
  [class*="-cap"], [class*="-bar"], [class*="-stamp"], [class*="-plate"],
  .topbar, .site-nav, .yeti-bar, nav.site-nav {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  section { content-visibility: auto; contain-intrinsic-size: 0 800px; }
  /* Reset stuck compositor layers from opacity:0 backdrop-filter elements */
  .modal-bg[style*="opacity: 0"], .modal-bg:not(.is-open) {
    will-change: auto;
  }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}
/* NO MOBILE BTN PATCH — mobile button shrink */
@media (max-width:560px) {
  .btn-fill { padding: 13px 22px !important; font-size: 10.5px !important; letter-spacing: .18em !important; gap: 10px !important; }
  .btn-fill .arrow { width: 16px !important; height: 10px !important; }
  .btn-ghost { padding: 13px 20px !important; font-size: 10.5px !important; letter-spacing: .16em !important; }
  .nav-cta { padding: 11px 16px !important; font-size: 10px !important; letter-spacing: .14em !important; }
  .hero-actions, .hero-ctas { gap: 12px !important; flex-direction: column !important; align-items: stretch !important; }
  .hero-actions a, .hero-ctas a { justify-content: center !important; }
}
/* ─── Multi-page build: shared sub-page components ───────────────────────
   Added when the prototype expanded from one page to a full site.
   Reused by about / providers / contact / consultation and available to
   every other page in portfolio-med-spa/. Brand-isolated like the rest. */

/* Secondary nav rail — carries the deeper pages under the primary nav */
nav.site-nav a[aria-current="page"]{color:var(--ink)}
nav.site-nav a[aria-current="page"]::after{right:0}

/* Sub-page mastheads — two variants of the existing .hero */
.hero--page{min-height:auto;grid-template-columns:1fr .92fr}
.hero--page .hero-body{padding:76px 80px 72px}
.hero--page .hero-figure{min-height:520px}
.hero--plain{grid-template-columns:1fr;min-height:auto;border-bottom:1px solid var(--rule)}
.hero--plain .hero-body{padding:84px 40px 64px;max-width:1280px;margin:0 auto;width:100%}
.about-fig img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* Running text */
.prose{max-width:66ch}
.prose p{font-size:16.5px;line-height:1.78;color:var(--ink-2);margin-bottom:22px}
.prose p:last-child{margin-bottom:0}
.prose em{font-family:var(--serif);font-style:italic;color:var(--copper-2);font-weight:500}
.prose strong{font-weight:600;color:var(--ink)}
.prose a{color:var(--ink);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--copper)}
.prose a:hover{color:var(--copper-2)}
.prose h3{font-family:var(--display);font-size:26px;font-weight:400;color:var(--ink);line-height:1.2;margin:46px 0 16px;letter-spacing:.005em}
.prose h3:first-child{margin-top:0}
.prose h3 em{font-family:var(--serif);font-style:italic;color:var(--copper-2);font-weight:400}
.prose ul{list-style:none;margin:0 0 24px}
.prose li{position:relative;padding-left:26px;font-size:16px;line-height:1.72;color:var(--ink-2);margin-bottom:13px}
.prose li::before{content:"";position:absolute;left:0;top:12px;width:12px;height:1px;background:var(--copper)}
.prose li b{font-weight:600;color:var(--ink)}

/* Two-column reading layout: running text + a data column */
.rail{display:grid;grid-template-columns:1.4fr .8fr;gap:76px;align-items:start}
.aside{border-top:2px solid var(--ink);padding-top:22px}
.aside h2,.aside h3,
.aside h4{font-family:var(--mono);font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--copper-2);font-weight:500;margin-bottom:20px}
.aside dt{font-family:var(--mono);font-size:9.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-4);padding-top:15px;border-top:1px solid var(--rule)}
.aside dt:first-of-type{border-top:none;padding-top:0}
.aside dd{font-size:15px;line-height:1.6;color:var(--ink-2);margin:6px 0 15px}
.aside dd b{font-weight:600;color:var(--ink)}

/* Pulled-aside caution / policy block */
.note{border-left:2px solid var(--copper);background:var(--paper);padding:28px 32px;margin:38px 0}
.note b{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--copper-2);margin-bottom:13px;font-weight:500}
.note p{font-family:var(--serif);font-size:17px;line-height:1.7;color:var(--ink-2);margin:0 0 14px}
.note p:last-child{margin-bottom:0}
.sec.cool .note{background:var(--bone)}

/* Disclosure list */
.qa{border-top:1px solid var(--rule);max-width:80ch}
.qa details{border-bottom:1px solid var(--rule)}
.qa summary{list-style:none;cursor:pointer;padding:24px 0;font-family:var(--display);font-size:21px;line-height:1.3;color:var(--ink);display:flex;justify-content:space-between;gap:28px;align-items:baseline}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:"+";font-family:var(--mono);font-size:17px;color:var(--copper-2);flex:none}
.qa details[open] summary::after{content:"–"}
.qa details p{font-size:16px;line-height:1.74;color:var(--ink-2);margin:0 0 20px;max-width:70ch}
.qa details p:last-child{padding-bottom:8px}

/* Non-interactive variant of the treatment table (agendas, schedules) */
.tt-row--static{cursor:default}
.tt-row--static:hover{padding-left:0}

/* Long drawer — the multi-page nav does not fit at the original scale */
.mob-nav{overflow-y:auto;gap:13px;padding-bottom:44px;-webkit-overflow-scrolling:touch}
.mob-nav a{font-size:20px;letter-spacing:.05em}
.mob-nav .grp{font-family:var(--mono);font-size:9.5px;letter-spacing:.24em;color:var(--copper);text-transform:uppercase;margin-top:12px}
.mob-nav .grp:first-of-type{margin-top:0}

@media (max-width:980px){
  .hero--page{grid-template-columns:1fr}
  .hero--page .hero-body{padding:56px 24px 52px}
  .hero--page .hero-figure{min-height:46vh}
  .hero--plain .hero-body{padding:56px 24px 48px}
  .rail{grid-template-columns:1fr;gap:44px}
  .qa summary{font-size:19px}
}

/* ─────────────────────────────────────────────────────────────────────────
   Sub-page components — page mastheads, membership plans, numbered stacks,
   page-level forms, journal index, disclosures. Same tokens and rhythm as
   the sections above; added when the prototype went multi-page.
   ───────────────────────────────────────────────────────────────────────── */

/* Section index strip beneath the masthead */
nav
nav
nav
nav
nav

/* Drawer: scrollable, with a secondary link scale */
.mob-nav{overflow-y:auto;gap:16px}
.mob-nav a.sm{font-family:var(--sans);font-size:13px;letter-spacing:.14em;color:rgba(245,247,250,.7);text-transform:uppercase;padding:2px 0}
.mob-nav a.sm:hover{color:var(--bone)}
.mob-nav .grp{font-family:var(--mono);font-size:9.5px;letter-spacing:.26em;color:var(--copper);text-transform:uppercase;margin-top:10px}

/* Page masthead */
.ph{background:var(--bone-2);padding:92px 40px 72px;border-bottom:1px solid var(--rule)}
.ph-wrap{max-width:1280px;margin:0 auto}
.ph-h1{font-family:var(--display);font-weight:400;font-size:clamp(42px,5vw,78px);line-height:1.06;color:var(--ink);margin-bottom:26px;max-width:20ch}
.ph-h1 em{font-family:var(--serif);font-style:italic;font-weight:400;color:var(--copper-2)}
.ph-lede{font-family:var(--serif);font-style:italic;font-size:21px;line-height:1.55;color:var(--ink-2);max-width:58ch}
.ph-crumb{font-family:var(--mono);font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-4);margin-top:34px}
.ph-crumb a{color:var(--ink-4);text-decoration:none}
.ph-crumb a:hover{color:var(--copper-2)}

/* Membership plans */
.plan-grid{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--rule);background:var(--bone);margin-bottom:24px}
.plan{padding:40px 32px;border-right:1px solid var(--rule);display:flex;flex-direction:column}
.plan:last-child{border-right:none}
.plan-tier{font-family:var(--mono);font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--copper-2);margin-bottom:20px}
.plan-name{font-family:var(--display);font-size:29px;line-height:1.12;color:var(--ink);margin-bottom:18px;letter-spacing:.005em}
.plan-name em{font-family:var(--serif);font-style:italic;color:var(--copper-2);font-weight:400}
.plan-price{font-family:var(--display);font-size:42px;color:var(--ink);line-height:1;margin-bottom:10px;letter-spacing:.01em}
.plan-price em{font-family:var(--mono);font-style:normal;font-size:11px;letter-spacing:.18em;color:var(--ink-4);text-transform:uppercase;margin-left:8px}
.plan-sub{font-family:var(--serif);font-style:italic;font-size:15px;line-height:1.6;color:var(--ink-3);margin-bottom:26px;padding-bottom:24px;border-bottom:1px dashed var(--rule-2)}
.plan-list{list-style:none;display:flex;flex-direction:column;gap:13px;margin-bottom:30px}
.plan-list li{font-size:14.5px;line-height:1.6;color:var(--ink-2);padding-left:19px;position:relative}
.plan-list li::before{content:"◆";position:absolute;left:0;top:0;font-size:7px;color:var(--copper);line-height:2.7}
.plan-list li b{font-weight:600;color:var(--ink)}
.plan-foot{margin-top:auto;font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-4);border-top:1px solid var(--rule);padding-top:18px;line-height:1.7}

/* Numbered vertical stack */
.stack{border-top:1px solid var(--rule)}
.stack-item{display:grid;grid-template-columns:150px 1fr;gap:44px;padding:42px 0;border-bottom:1px solid var(--rule)}
.stack-n{font-family:var(--mono);font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--copper-2);padding-top:8px}
.stack-n b{display:block;font-family:var(--display);font-size:32px;color:var(--ink);letter-spacing:.02em;margin-bottom:10px;font-weight:400}
.stack-h{font-family:var(--display);font-size:28px;line-height:1.15;color:var(--ink);margin-bottom:16px;letter-spacing:.005em}
.stack-h em{font-family:var(--serif);font-style:italic;color:var(--copper-2);font-weight:400}
.stack-b p{font-size:15.5px;line-height:1.75;color:var(--ink-2);max-width:64ch;margin-bottom:14px}
.stack-b p:last-child{margin-bottom:0}
.stack-b p em{font-family:var(--serif);font-style:italic;color:var(--copper-2);font-weight:500}
.stack-b b{font-weight:600;color:var(--ink)}

/* Note / caution panel */
.note{border-left:2px solid var(--copper);background:var(--paper);padding:28px 32px;margin-bottom:28px}
.note:last-child{margin-bottom:0}
.note h3{font-family:var(--display);font-size:21px;color:var(--ink);margin-bottom:14px;font-weight:400;letter-spacing:.01em}
.note p{font-size:15px;line-height:1.75;color:var(--ink-2);max-width:68ch;margin-bottom:12px}
.note p:last-child{margin-bottom:0}
.note b{font-weight:600;color:var(--ink)}
.note ul{list-style:none;display:flex;flex-direction:column;gap:10px;margin-top:6px}
.note ul li{font-size:15px;line-height:1.65;color:var(--ink-2);padding-left:19px;position:relative}
.note ul li::before{content:"◆";position:absolute;left:0;top:0;font-size:7px;color:var(--copper);line-height:2.9}
.sec.dark .note{background:rgba(245,247,250,.05);border-left-color:var(--copper-soft)}
.sec.dark .note h3{color:var(--bone)}
.sec.dark .note p,.sec.dark .note ul li{color:rgba(245,247,250,.78)}
.sec.dark .note b{color:var(--bone)}

/* Page-level forms */
.form-card{background:var(--bone);border:1px solid var(--rule);padding:44px}
.form-sec{font-family:var(--mono);font-size:10px;letter-spacing:.26em;text-transform:uppercase;color:var(--copper-2);border-bottom:1px solid var(--rule);padding-bottom:14px;margin:0 0 28px;font-weight:500}
.form-sec.next{margin-top:46px}
.fld-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px 26px}
.fld{display:flex;flex-direction:column}
.fld.full{grid-column:1/-1}
.fld label{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-3);margin-bottom:9px}
.fld label .req{color:var(--copper-2)}
.fld input,.fld select,.fld textarea{width:100%;padding:14px;background:var(--paper);border:1px solid var(--rule-2);font-family:var(--sans);font-size:16px;line-height:1.5;color:var(--ink);min-height:48px;border-radius:0}
.fld textarea{min-height:150px;resize:vertical}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:none;border-color:var(--copper)}
.fld .hint{font-family:var(--sans);font-size:13px;line-height:1.65;color:var(--ink-3);margin-top:10px}
.fld fieldset{border:none}
.fld legend{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-3);margin-bottom:12px;padding:0}
.opt-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.opt{display:flex;align-items:flex-start;gap:11px;border:1px solid var(--rule-2);background:var(--paper);padding:15px 16px;font-size:14.5px;line-height:1.45;color:var(--ink-2);cursor:pointer;min-height:52px;transition:border-color .2s,background .2s}
.opt:hover{border-color:var(--copper);background:var(--bone)}
.opt input{width:17px;height:17px;margin-top:2px;accent-color:var(--copper-2);flex:none}
.consent{display:flex;align-items:flex-start;gap:13px;font-size:14.5px;line-height:1.65;color:var(--ink-2);margin:32px 0 26px;cursor:pointer;max-width:66ch}
.consent input{width:18px;height:18px;margin-top:2px;accent-color:var(--copper-2);flex:none}
.form-ok{display:none;margin-top:26px;border-left:2px solid var(--copper);background:var(--paper);padding:24px 28px;font-size:15px;line-height:1.75;color:var(--ink-2)}
.form-ok.on{display:block}
.form-ok b{display:block;font-family:var(--display);font-size:21px;color:var(--ink);margin-bottom:10px;font-weight:400}

/* Form + rail layout */
.split-rail{display:grid;grid-template-columns:1.6fr .85fr;gap:60px;align-items:start}
.rail{position:sticky;top:28px;display:flex;flex-direction:column;gap:26px}

/* Key/value data rows */
.kv{list-style:none;border-top:1px solid var(--rule)}
.kv li{display:flex;justify-content:space-between;gap:24px;padding:15px 0;border-bottom:1px solid var(--rule);font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);line-height:1.5}
.kv li b{color:var(--ink);font-weight:500;text-align:right;flex:none}
.kv li b s{color:var(--ink-4);font-weight:400;margin-right:8px}

/* Journal index */
.post-list{border-top:1px solid var(--rule)}
.post{display:grid;grid-template-columns:290px 1fr 60px;gap:44px;align-items:center;padding:34px 0;border-bottom:1px solid var(--rule);text-decoration:none;transition:padding .35s ease}
.post:hover{padding-left:14px}
.post-fig{aspect-ratio:4/3;overflow:hidden;background:var(--bone-2)}
.post-fig img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.post:hover .post-fig img{transform:scale(1.04)}
.post-kicker{font-family:var(--mono);font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--copper-2);margin-bottom:14px}
.post-h{font-family:var(--display);font-size:29px;line-height:1.15;color:var(--ink);margin-bottom:14px;letter-spacing:.005em}
.post-h em{font-family:var(--serif);font-style:italic;color:var(--copper-2);font-weight:400}
.post-p{font-family:var(--serif);font-style:italic;font-size:16px;line-height:1.6;color:var(--ink-3);max-width:62ch}
.post-arrow{width:32px;height:1px;background:var(--ink-3);justify-self:end;transition:width .3s,background .3s}
.post:hover .post-arrow{width:48px;background:var(--copper)}

/* Disclosure list */
.faq{border-top:1px solid var(--rule)}
.faq details{border-bottom:1px solid var(--rule)}
.faq summary{list-style:none;cursor:pointer;padding:24px 0;font-family:var(--display);font-size:21px;line-height:1.3;color:var(--ink);display:flex;justify-content:space-between;gap:28px;align-items:baseline;min-height:44px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--mono);font-size:17px;color:var(--copper-2);flex:none}
.faq details[open] summary::after{content:"–"}
.faq .ans{padding:0 0 28px}
.faq .ans p{font-size:15.5px;line-height:1.75;color:var(--ink-2);max-width:70ch;margin-bottom:13px}
.faq .ans p:last-child{margin-bottom:0}

@media (max-width:980px){
  nav
  .ph{padding:56px 22px 48px}
  .ph-lede{font-size:18px}
  .plan-grid{grid-template-columns:1fr}
  .plan{border-right:none;border-bottom:1px solid var(--rule);padding:32px 24px}
  .plan:last-child{border-bottom:none}
  .stack-item{grid-template-columns:1fr;gap:18px;padding:34px 0}
  .stack-n{padding-top:0}
  .stack-n b{font-size:26px;margin-bottom:6px}
  .stack-h{font-size:24px}
  .form-card{padding:28px 22px}
  .fld-grid{grid-template-columns:1fr;gap:20px}
  .opt-grid{grid-template-columns:1fr}
  .split-rail{grid-template-columns:1fr;gap:44px}
  .rail{position:static}
  .post{grid-template-columns:1fr;gap:20px;padding:30px 0}
  .post:hover{padding-left:0}
  .post-arrow{display:none}
  .post-h{font-size:24px}
  .note{padding:24px 22px}
  .faq summary{font-size:19px}
}

/* ─── Journal: article mastheads, bylines, figures and related-reading rows ──
   Added for the three journal notes. Reuses the existing palette + type scale;
   nothing here overrides an earlier rule. */
.yeti-bar .mid{flex:1;text-align:center;padding:0 20px;color:rgba(245,247,250,.42);font-size:10px;letter-spacing:.14em;text-transform:uppercase}
.post-byline{display:flex;flex-wrap:wrap;gap:10px 26px;align-items:center;margin-top:36px;padding-top:22px;border-top:1px solid var(--rule);font-family:var(--mono);font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-4)}
.post-byline b{color:var(--copper-2);font-weight:500}
.post-fig{position:relative;overflow:hidden;background:var(--ink-2);max-width:1280px;margin:0 auto;aspect-ratio:21/9}
.post-fig img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.post-fig figcaption{position:absolute;left:0;bottom:0;background:var(--ink);color:rgba(245,247,250,.72);font-family:var(--mono);font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;padding:11px 20px}
.related{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--rule-2);border-top:1px solid var(--rule-2);border-bottom:1px solid var(--rule-2)}
.related a{background:var(--bone);padding:36px 32px 40px;text-decoration:none;display:block;transition:background .3s}
.related a:hover{background:var(--paper)}
.related .k{font-family:var(--mono);font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--copper-2);margin-bottom:15px}
.related .t{font-family:var(--display);font-size:22px;line-height:1.22;color:var(--ink)}
.related .d{font-family:var(--serif);font-style:italic;font-size:14.5px;line-height:1.55;color:var(--ink-3);margin-top:12px}
.legend{display:flex;flex-wrap:wrap;gap:8px 28px;font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-4);margin-bottom:22px}
.legend b{color:var(--copper-2);font-weight:500}
@media (max-width:980px){
  .yeti-bar .mid{display:none}
  .related{grid-template-columns:1fr}
  .post-fig{aspect-ratio:16/10}
  .post-byline{gap:8px 18px;font-size:9.5px}
}

/* Agenda variant of the treatment table — keeps its detail column on small screens */
@media (max-width:980px){
  .tt-table--agenda .tt-row{grid-template-columns:62px 1fr;gap:6px 16px;padding:22px 0}
  .tt-table--agenda .tt-desc{display:block;grid-column:2;padding-top:4px}
  .tt-table--agenda .tt-meta{display:block;grid-column:2;text-align:left;padding-top:10px}
  .tt-table--agenda .tt-price{display:none}
  .tt-table--agenda .tt-num{padding-top:4px}
}

/* ─── Interior pages (portfolio-med-spa/) — nav sub-row, drawer overflow, table + grid variants ─── */
nav.site-nav.nav-full{row-gap:16px}
nav.site-nav a[aria-current="page"]{color:var(--ink)}
nav.site-nav a[aria-current="page"]::after{right:0}
.mob-nav{overflow-y:auto}
.mob-sub{display:flex;flex-direction:column;gap:2px;border-top:1px solid var(--rule-bone);padding-top:14px}
.mob-nav .mob-sub a{font-family:var(--mono);font-size:12px;letter-spacing:.14em;color:rgba(245,247,250,.72);display:flex;align-items:center;min-height:44px}
.tt-row.static{cursor:default}
.tt-row.static:hover{padding-left:0}
.cf.cf-4{grid-template-columns:repeat(4,1fr)}
.tt-group{margin-bottom:64px}
.tt-group:last-child{margin-bottom:0}
.prose-block{border-top:1px solid var(--rule);padding-top:40px;margin-top:40px}
.prose-block:first-of-type{border-top:none;padding-top:0;margin-top:0}
@media (max-width:980px){
  .cf.cf-4{grid-template-columns:1fr}
}

/* ─── Journal index (journal.html) — the .post entry figure is declared above the
   article-figure rules, which then win on cascade and give it a 21/9 letterbox
   and a centering max-width meant for a full-bleed masthead. Put the entry
   proportions back inside a .post row only. ─── */
.post .post-fig{max-width:none;margin:0;aspect-ratio:4/3}
.post .post-h{font-family:var(--display);font-weight:400}
@media (max-width:980px){
  /* Stacked full-width, a 4:3 entry figure runs away with the row at tablet
     widths. Widen the ratio rather than capping height — a max-height would
     make aspect-ratio shrink the figure's width and strand it in the column. */
  .post .post-fig{aspect-ratio:16/9}
}

/* ─── Treatment pages (injectables / skin-treatments / laser-ipl) ───────────
   .hero-figure img is stretched to fill the panel but never had a crop rule,
   so a portrait source distorts inside the landscape masthead. Cover it.
   Applies to every page using the .hero / .hero--page figure. ─── */
.hero-figure img{object-fit:cover}

/* ─── Reading rail: restore the two-column layout ───────────────────────────
   The form-sidebar rule above (".rail{position:sticky;display:flex;flex-direction:
   column}", added for consultation-request.html) also lands on the article reading
   rail declared earlier, collapsing running text + data column into one stacked
   sticky block on every page that uses it. The form sidebar is nested inside
   .split-rail; the reading rail is always a direct child of .sec-wrap — so put the
   documented grid back there only, and leave the form sidebar alone. ─── */
.sec-wrap > .rail{display:grid;grid-template-columns:1.4fr .8fr;gap:76px;align-items:start;position:static}
@media (max-width:980px){
  .sec-wrap > .rail{grid-template-columns:1fr;gap:44px}
}

/* ═══════════════════════════════════════════════════════════════════════
   NAV — grouped. A sixteen-page site cannot hang sixteen links in one bar;
   the old one wrapped into soup on desktop and buried everything on phones.
   Group heads are real links, so every page stays one hover (or one tap)
   away and the crawler sees the whole graph without opening anything.
   ═══════════════════════════════════════════════════════════════════════ */
nav.site-nav{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  gap:20px;padding:24px 40px;background:var(--bone);border-bottom:1px solid var(--rule);
  position:relative;z-index:8500}
.nav-l,.nav-r{display:flex;align-items:center;gap:32px;min-width:0}
.nav-r{justify-content:flex-end}
nav.site-nav .nav-l>a,nav.site-nav .nav-head{white-space:nowrap}

.nav-group{position:relative;display:flex;align-items:center}
.nav-head{display:inline-flex;align-items:center;gap:7px;cursor:pointer}
.nav-caret{width:0;height:0;border-left:3.5px solid transparent;border-right:3.5px solid transparent;
  border-top:4px solid currentColor;opacity:.5;transition:transform .25s,opacity .25s;flex:none}
.nav-group:hover .nav-caret,.nav-group.is-open .nav-caret,.nav-group:focus-within .nav-caret{transform:rotate(180deg);opacity:1}
.nav-group.is-here>.nav-head{color:var(--copper-2)}

.nav-drop{position:absolute;top:100%;left:-18px;padding-top:16px;min-width:214px;
  opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .22s ease,transform .22s ease,visibility .22s;z-index:20}
.nav-r .nav-drop{left:auto;right:-18px}
.nav-group:hover>.nav-drop,.nav-group:focus-within>.nav-drop,.nav-group.is-open>.nav-drop{
  opacity:1;visibility:visible;transform:translateY(0)}
.nav-drop-in{background:var(--paper);border:1px solid var(--rule);padding:14px 18px;
  display:flex;flex-direction:column;gap:2px;box-shadow:0 24px 48px rgba(26,39,64,.14)}
nav.site-nav .nav-drop a{display:block;padding:9px 0;font-size:10.5px;letter-spacing:.15em;
  color:var(--ink-3);white-space:nowrap}
nav.site-nav .nav-drop a::after{display:none}
nav.site-nav .nav-drop a:hover,nav.site-nav .nav-drop a[aria-current="page"]{color:var(--copper-2)}

.nav-toggle{display:none;background:none;border:0;cursor:pointer;padding:10px;margin-right:-10px;
  width:44px;height:44px;align-items:center;justify-content:center;color:var(--ink)}
.nav-burger,.nav-burger::before,.nav-burger::after{display:block;width:22px;height:1.5px;background:currentColor;
  transition:transform .25s ease,opacity .2s ease}
.nav-burger{position:relative}
.nav-burger::before,.nav-burger::after{content:"";position:absolute;left:0}
.nav-burger::before{top:-7px}
.nav-burger::after{top:7px}
[aria-expanded="true"] .nav-burger{background:transparent}
[aria-expanded="true"] .nav-burger::before{transform:translateY(7px) rotate(45deg)}
[aria-expanded="true"] .nav-burger::after{transform:translateY(-7px) rotate(-45deg)}

/* Drawer */
html.nav-locked{overflow:hidden}
.mob-scrim{position:fixed;inset:0;background:rgba(0,0,0,.44);z-index:9600;
  animation:navFade .25s ease}
@keyframes navFade{from{opacity:0}to{opacity:1}}
.mob-nav{position:fixed;top:0;right:0;bottom:0;width:min(360px,88vw);background:var(--ink);
  color:var(--bone);padding:24px 28px 40px;z-index:9700;overflow-y:auto;-webkit-overflow-scrolling:touch;
  transform:translateX(105%);visibility:hidden;
  transition:transform .32s cubic-bezier(.2,.7,.2,1),visibility 0s linear .32s;
  display:flex;flex-direction:column;gap:2px}
.mob-nav.on{transform:translateX(0);visibility:visible;transition:transform .32s cubic-bezier(.2,.7,.2,1),visibility 0s}
.mob-nav .x{align-self:flex-end;background:none;border:0;color:rgba(245,247,250,.58);cursor:pointer;
  font-family:var(--mono);font-size:10px;letter-spacing:.22em;text-transform:uppercase;
  padding:10px 0 10px 10px;margin-bottom:10px}
.mob-nav .x:hover{color:var(--bone)}
.mob-nav a{text-decoration:none;color:var(--bone);display:flex;align-items:center;min-height:44px}
.mob-nav a.lg{font-family:var(--display);font-size:26px;letter-spacing:.05em;text-transform:uppercase;}
.mob-nav a.sm{font-family:var(--mono);font-size:12px;letter-spacing:.14em;
  text-transform:uppercase;color:rgba(245,247,250,.58);min-height:40px;padding-left:2px}
.mob-nav a.sm:hover,.mob-nav a[aria-current="page"]{color:var(--copper-2)}
.mob-nav .grp{font-family:var(--mono);font-size:9.5px;letter-spacing:.26em;text-transform:uppercase;
  color:var(--copper-2);margin:20px 0 6px;padding-top:14px;border-top:1px solid rgba(245,247,250,.14)}
.mob-nav .mob-cta{margin-top:26px;justify-content:center;border:1px solid var(--copper-2);color:var(--copper-2);
  font-family:var(--mono);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;min-height:52px}
.mob-nav .mob-cta:hover{background:var(--copper-2);color:var(--ink)}
.mob-nav .sub{font-family:var(--mono);font-size:9.5px;letter-spacing:.22em;line-height:1.9;
  color:rgba(245,247,250,.58);text-transform:uppercase;margin-top:28px;padding-top:18px;
  border-top:1px solid rgba(245,247,250,.14)}

@media (max-width:1180px){ .nav-l,.nav-r{gap:22px} }
@media (max-width:980px){
  nav.site-nav{grid-template-columns:1fr auto 1fr;padding:16px 20px}
  .nav-l{display:none}
  .nav-r .nav-group{display:none}
  .nav-toggle{display:inline-flex}
}
@media (max-width:600px){
  nav.site-nav .nav-cta{display:none}
}
@media (prefers-reduced-motion:reduce){
  .mob-nav{transition:none}
  .nav-drop{transition:none}
}

/* The wordmark and the CTA are nav destinations too — mark them. */
nav.site-nav .nav-mark[aria-current="page"]{color:var(--copper-2)}
nav.site-nav .nav-cta[aria-current="page"]{background:var(--ink);color:var(--bone)!important;border-color:var(--ink)}
.mob-nav .mob-cta[aria-current="page"]{background:var(--copper);color:var(--ink)}

/* ── Touch targets on phones ─────────────────────────────────────────
   The Yeti framing chrome and the shared link styles were sized for a
   cursor: the band links sat at 14px tall and the case-study CTA at 21.
   Nothing here changes type, colour or spacing above 880px. */
@media (max-width:880px){
  .yeti-bar a,.yeti-link,.yeti-cs-cta{display:inline-flex;align-items:center;min-height:44px}
  .p-band a,.p-cs-cta{display:inline-flex;align-items:center;min-height:44px}
  .site-nav a,.site-nav .nav-mark{display:inline-flex;align-items:center;min-height:44px}
  .modal-x,.booking-close{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px}
  .btn-link,.svc-cta,.insta-link,.feed-link{display:inline-flex;align-items:center;min-height:44px}
  .btn,.btn-fill{display:inline-flex;align-items:center;min-height:44px}
  .booking-cal-nav button,.tt-cats button{min-height:44px}
  .foot-bottom a,.p-foot-bottom a,.p-crumb a{display:inline-block;padding:6px 0}
  /* The band stays one row. Both labels shorten on a phone rather than
     truncating: "Back to Examples" and "Get a site — $950". */
  .yeti-bar,.p-band,.yeti-band-inner{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;justify-content:space-between;gap:12px;padding:0 16px;min-height:52px}
  .yeti-bar .bd-lg,.p-band .bd-lg,.yeti-band .bd-lg{display:none}
  .yeti-bar > a:first-child,.p-band .back,.yeti-band-inner > a:first-child{display:inline-flex;align-items:center;flex:0 1 auto;min-width:0;white-space:nowrap}
  .yeti-bar .right,.p-band .right,.yeti-band .yeti-cta{flex:0 0 auto;align-self:center;text-align:center;white-space:nowrap}
  /* The wordmark bar duplicates the nav mark directly beneath it. One is enough
     on a phone; it carries no links. */
  .shop-top{display:none}
}
/* .nav-l is display:none on a phone, which drops it out of the grid and slides
   the mark and the toggle a column to the left: the hamburger ended up stranded
   mid-row with dead space beside it. Lay the row out with flex instead. */
@media (max-width:980px){
  nav.site-nav{display:flex;align-items:center;justify-content:space-between;gap:12px}
  nav.site-nav .nav-mark{flex:0 1 auto;min-width:0}
  nav.site-nav .nav-r{flex:0 0 auto;margin-left:auto}
}
/* Under 360px there is no room for both band labels; the way back steps aside.
   work.html stays in the drawer and in the panel at the foot of the page. */
@media (max-width:359px){
  .yeti-bar > a:first-child,.p-band .back,.yeti-band-inner > a:first-child{display:none}
  .yeti-bar,.p-band,.yeti-band-inner{justify-content:flex-end}
}


/* ── Nav layout: mark left, one menu in the middle, CTA right ──────────
   Was a three-column grid with the wordmark centred and the links split
   either side of it, which reads as two separate menus rather than one.
   Scoped above the 980px breakpoint so the mobile drawer rules are
   untouched. The auto margins centre the two link groups as a pair. */
@media (min-width:981px){
  nav.site-nav{display:flex;align-items:center;gap:30px}
  nav.site-nav .nav-mark{order:1;flex:0 0 auto}
  nav.site-nav .nav-l{order:2;margin-left:auto}
  nav.site-nav .nav-r{order:3;margin-right:auto;justify-content:flex-start}
  nav.site-nav .nav-cta{order:4;flex:0 0 auto}
  nav.site-nav .nav-toggle{order:5;flex:0 0 auto}
}

/* ── Consult steps: three cards side by side ───────────────────────────
   One step name wraps to two lines and the others do not, which pushed
   the descriptions out of level by 35px. Reserve the second line, and
   floor the timing row so the card bottoms line up too. */
.cf-step{display:flex;flex-direction:column}
.cf-name{min-height:2.1em}
.cf-time{margin-top:auto}

/* ── Mobile footer: two columns, not one ─────────────────
   Stacked into a single column the footer ran past 900px on a phone,
   which is two and a half screens of small print under every page. */
@media (max-width:560px){
  footer{padding:44px 20px 26px}
  .foot-wrap{grid-template-columns:1fr 1fr;gap:24px 18px}
  .foot-wrap > :first-child{grid-column:1 / -1}
  .foot-mark{font-size:30px;margin-bottom:10px}
  .foot-blurb{font-size:13.5px;line-height:1.55;max-width:none}
  .foot-col h3{margin-bottom:10px;font-size:9.5px;letter-spacing:.2em}
  .foot-col ul{gap:9px}
  .foot-col a,.foot-col li{font-size:12.5px;line-height:1.45}
  .foot-bottom{margin-top:30px;padding-top:18px;flex-direction:column;align-items:flex-start;gap:8px}
  .p-foot{padding:44px 20px 26px}
  .p-foot-wrap{grid-template-columns:1fr 1fr;gap:24px 18px}
  .p-foot-wrap > :first-child{grid-column:1 / -1}
  .p-foot-mark{font-size:26px}
  .p-foot-blurb{font-size:13.5px;line-height:1.55;max-width:none}
  .p-foot-wrap h3{margin-bottom:10px;font-size:9.5px;letter-spacing:.2em}
  .p-foot-wrap ul{gap:9px}
  .p-foot-wrap a,.p-foot-wrap li{font-size:12.5px;line-height:1.45}
  .p-foot-bottom{margin-top:30px;padding-top:18px;flex-direction:column;align-items:flex-start;gap:8px}
}

/* ── Mobile drawer: one hierarchy, two steps ─────────────
   Top-level links ran at 26px display against 12px mono children, a jump
   that read as two unrelated menus stacked on top of each other. */
@media (max-width:980px){
  .mob-nav a.lg{font-size:19px;letter-spacing:.04em;min-height:50px}
  .mob-nav a.sm{font-size:13px;letter-spacing:.12em;min-height:46px;padding-left:12px}
  .mob-nav .grp{font-size:9.5px;letter-spacing:.24em;margin:18px 0 4px;padding-top:14px}
  .mob-nav .mob-cta{margin-top:22px;min-height:52px}
  .mob-nav .sub{margin-top:24px;padding-top:16px;line-height:1.8}
}