/* Shared look for the service and area pages. Same tokens as the homepage. */
:root{
  --bg:#08080a;--bg2:#141417;--ink:#ece6da;--ink2:#a7a092;--ink3:#706a61;
  --gold:#c8a96a;--gold-hi:#ecdaa8;--gold-lo:#7d6234;--on-gold:#15110a;
  --line:rgba(200,169,106,.3);--hair:rgba(236,230,218,.11);--panel:rgba(16,16,19,.74);--glow:rgba(196,124,58,.17);--stars:1;
  --gilt:linear-gradient(135deg,#5b431f 0%,#c7a660 16%,#86672f 32%,#ead6a0 49%,#8c6b34 64%,#c3a15b 82%,#5b431f 100%);
  --serif:"Cormorant Garamond",Garamond,"Times New Roman",serif;--sans:"Inter",system-ui,sans-serif;--mono:"IBM Plex Mono",ui-monospace,monospace;
  --pad:clamp(20px,5vw,72px);color-scheme:dark;
}
@media (prefers-color-scheme:light){:root:not([data-theme=dark]){
  --bg:#eee8dd;--bg2:#f8f4ec;--ink:#1c1a17;--ink2:#575147;--ink3:#857e72;--gold:#7f5f27;--gold-hi:#a7834a;--gold-lo:#5e4519;--on-gold:#fbf7ef;
  --line:rgba(127,95,39,.38);--hair:rgba(28,26,23,.13);--panel:rgba(248,244,236,.8);--glow:rgba(214,158,92,.22);--stars:0;color-scheme:light}}
:root[data-theme=light]{
  --bg:#eee8dd;--bg2:#f8f4ec;--ink:#1c1a17;--ink2:#575147;--ink3:#857e72;--gold:#7f5f27;--gold-hi:#a7834a;--gold-lo:#5e4519;--on-gold:#fbf7ef;
  --line:rgba(127,95,39,.38);--hair:rgba(28,26,23,.13);--panel:rgba(248,244,236,.8);--glow:rgba(214,158,92,.22);--stars:0;color-scheme:light}
*,*::before,*::after{box-sizing:border-box}*{margin:0;padding:0}
html{background:var(--bg);color:var(--ink);-webkit-text-size-adjust:100%}
body{font:300 17px/1.7 var(--sans);-webkit-font-smoothing:antialiased;background:radial-gradient(80% 50% at 80% 0%,var(--glow),transparent 70%),radial-gradient(120% 60% at 70% 0%,var(--bg2),var(--bg) 60%) no-repeat}
a{color:inherit}
img{display:block;max-width:100%}
::selection{background:var(--gold);color:var(--on-gold)}
:focus-visible{outline:1px solid var(--gold);outline-offset:4px}
.stars{position:fixed;inset:0;z-index:-1;opacity:var(--stars);pointer-events:none}
.stars i{position:absolute;width:var(--s);height:var(--s);border-radius:50%;background:#fff8ec;box-shadow:0 0 6px rgba(255,244,220,.8);opacity:var(--a)}
.mono{font:400 10.5px/1.4 var(--mono);letter-spacing:.16em;text-transform:uppercase}
em{font-style:italic;font-weight:300;color:var(--gold-hi)}
:root:not([data-dark]) em{color:var(--gold)}
.wrap{width:100%;max-width:1080px;margin:0 auto;padding:0 var(--pad)}

/* header */
.top{position:sticky;top:0;z-index:10;background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--hair)}
.top .wrap{display:flex;align-items:center;gap:20px;height:64px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand svg{width:28px;height:28px;filter:drop-shadow(0 0 10px var(--glow))}
.word{font:400 10.5px/1 var(--sans);letter-spacing:.34em;text-transform:uppercase}
.top nav{display:flex;align-items:center;gap:22px;margin-left:auto}
.top nav a{color:var(--ink2);text-decoration:none;font-size:14px}
.top nav a:hover{color:var(--ink)}

/* buttons */
.btn{--cut:10px;position:relative;display:inline-flex;align-items:center;justify-content:center;height:50px;padding:0 24px;font:500 11px/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;text-decoration:none;white-space:nowrap;clip-path:polygon(var(--cut) 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%,0 var(--cut));transition:filter .4s}
.btn>*{position:relative}
.btn-gold{color:var(--on-gold);background:linear-gradient(180deg,var(--gold-hi),var(--gold) 55%,var(--gold-lo))}
.btn-gold:hover{filter:brightness(1.1)}
.btn-line{color:var(--ink);background:var(--line)}
.btn-line::before{content:"";position:absolute;inset:1px;background:var(--bg);clip-path:polygon(9.6px 0,100% 0,100% calc(100% - 9.6px),calc(100% - 9.6px) 100%,0 100%,0 9.6px)}
.top .btn{height:38px;padding:0 16px;font-size:10px}
.top nav a.btn-gold,.top nav a.btn-gold:hover{color:var(--on-gold)}

/* hero */
.hero{padding:clamp(56px,9vw,120px) 0 clamp(40px,6vw,72px)}
.crumbs{color:var(--ink3)}
.crumbs a{color:var(--gold);text-decoration:none}
.coach{display:block;width:min(240px,46%);height:1px;margin-top:14px;background:linear-gradient(90deg,var(--gold),transparent)}
h1{margin-top:22px;font:300 clamp(42px,6.4vw,84px)/1 var(--serif);letter-spacing:-.01em;max-width:860px}
.lead{max-width:620px;margin-top:22px;color:var(--ink2);font-size:clamp(16px,1.4vw,19px)}
.ctas{display:flex;flex-wrap:wrap;gap:10px;margin-top:32px}

/* body sections */
.sec{padding:clamp(40px,6vw,72px) 0;border-top:1px solid var(--hair)}
.cols{display:grid;gap:clamp(20px,4vw,64px)}
h2{font:300 clamp(30px,3.6vw,46px)/1.05 var(--serif)}
.sec .tag{color:var(--gold);margin-bottom:12px}
.prose p{color:var(--ink2);max-width:640px}
.prose p+p{margin-top:16px}
.list{display:grid;gap:10px;list-style:none;margin-top:6px}
.list li{display:flex;gap:14px;color:var(--ink2)}
.list li::before{content:"";width:6px;height:6px;flex:none;margin-top:.65em;rotate:45deg;background:var(--gold)}
.list b{color:var(--ink);font-weight:400}

/* sample work */
.work{display:grid;gap:clamp(20px,4vw,56px);align-items:center}
.gilt{position:relative;padding:clamp(9px,1.2vw,14px);background:var(--gilt);box-shadow:inset 0 0 0 1px rgba(255,242,205,.45),inset 0 0 18px rgba(50,32,8,.55),0 40px 80px -40px rgba(0,0,0,.8)}
.liner{padding:5px;background:#16110a;box-shadow:inset 0 0 0 1px rgba(234,214,160,.35)}
.liner img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:top}
.facts{display:flex;gap:36px;margin-top:18px}
.facts span{display:block;color:var(--ink3)}
.facts b{display:block;margin-top:4px;font:300 34px/1 var(--serif)}
.note{margin-top:12px;color:var(--ink3);font-size:13.5px}

/* questions */
.faq details{border-bottom:1px solid var(--hair)}
.faq summary{display:flex;justify-content:space-between;gap:20px;padding:18px 0;cursor:pointer;list-style:none;font:400 21px/1.3 var(--serif)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--gold);font-family:var(--sans);transition:rotate .3s}
.faq details[open] summary::after{rotate:45deg}
.faq details p{padding:0 0 20px;color:var(--ink2);max-width:680px}

/* closing call to action and footer */
.cta{padding:clamp(56px,8vw,110px) 0;text-align:center;border-top:1px solid var(--hair)}
.cta h2{font-size:clamp(36px,5vw,64px)}
.cta .lead{margin:16px auto 0}
.cta .ctas{justify-content:center}
.foot{padding:36px 0 48px;border-top:1px solid var(--hair);font-size:14px;color:var(--ink3)}
.foot .wrap{display:grid;gap:12px}
.foot p{display:flex;flex-wrap:wrap;gap:4px 16px}
.foot .mono{width:72px;color:var(--gold)}
.foot a{color:var(--ink2);text-decoration:none;border-bottom:1px solid var(--hair)}
.foot a:hover{color:var(--ink)}

@media (min-width:860px){
  .cols{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}
  .work{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}
}
@media (max-width:640px){
  .top nav a:not(.btn){display:none}
  .word{font-size:9.5px;letter-spacing:.26em}
  .ctas .btn{flex:1}
}
