/* Clarity Construction — v2.1 "seamless" design system (concept, Oct 2026)
   Brand palette refined: warm white paper, deep umber ink, muted brass, sage as the quiet second accent.
   Fewer boxes: photos and hairlines carry the structure instead of cards and bands. */
:root{
  --paper:#FBF8F1; --paper-2:#F3EEE2; --stone:#E6DFD0; --line:rgba(36,26,18,.13); --line-2:rgba(36,26,18,.26);
  --ink:#241A12; --ink-2:#4B4036; --ink-3:#7B7064;
  --brass:#D9B96F; --brass-2:#C6A45A; --brass-ink:#8A6B2A;
  --gold:var(--brass); --gold-2:var(--brass-2); --gold-ink:var(--brass-ink);
  --on-dark:#F8F5EE; --on-dark-2:rgba(248,245,238,.74); --line-dark:rgba(248,245,238,.16);
  --f-display:'Roboto',system-ui,-apple-system,'Helvetica Neue',Arial,sans-serif;
  --f-body:'Roboto',system-ui,-apple-system,'Helvetica Neue',Arial,sans-serif;
  --f-mono:'Roboto',system-ui,-apple-system,'Helvetica Neue',Arial,sans-serif;
  --maxw:1280px; --gut:clamp(20px,4vw,48px); --rad:2px; --rad-l:4px;
  --sec:clamp(64px,9vw,120px); --gap:clamp(14px,1.8vw,24px);
  --hdr:72px; --ease:cubic-bezier(.2,.7,.2,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--hdr) + 12px)}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--f-body);font-size:1.0625rem;line-height:1.6;-webkit-font-smoothing:antialiased}
img,picture,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none}
p{margin:0 0 1em}
h1,h2,h3,h4{font-family:var(--f-display);font-weight:700;line-height:1.08;letter-spacing:-.012em;margin:0 0 .45em;text-wrap:balance}
h1{font-size:clamp(2.5rem,1.4rem + 4.4vw,4.6rem)}
h2{font-size:clamp(1.9rem,1.3rem + 2.2vw,2.9rem)}
h3{font-size:clamp(1.15rem,1.05rem + .5vw,1.4rem);font-variation-settings:"opsz" 48}
h4{font-size:1.05rem;font-family:var(--f-body);font-weight:700;letter-spacing:0}
ul{margin:0;padding:0;list-style:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:var(--on-dark);padding:.6rem 1rem;z-index:100}
.skip:focus{left:8px}
:focus-visible{outline:2px solid var(--brass-2);outline-offset:3px}

/* layout */
.wrap{width:min(100% - 2*var(--gut),var(--maxw));margin-inline:auto}
.wrap--n{width:min(100% - 2*var(--gut),760px);margin-inline:auto}
.sec{padding-block:var(--sec)}
.sec--tight{padding-block:calc(var(--sec)*.55)}
.sec--alt{background:transparent}
.sec--rule{border-top:1px solid var(--line)}
.sec--dark{background:var(--ink);color:var(--on-dark)}
.sec--dark .eyebrow{color:var(--brass)}
.sec--dark .lede,.sec--dark .muted{color:var(--on-dark-2)}
.sec--sage{background:var(--paper-2)}
.sec--photo{position:relative;isolation:isolate;color:var(--on-dark);background-size:cover;background-position:center}
.sec--photo::before{content:"";position:absolute;inset:0;background:rgba(30,25,21,.82);z-index:-1}
.sec--photo .eyebrow{color:var(--brass)}
.sec--photo .promise__i{border-top-color:var(--line-dark)}
.sec--photo .promise__i h3{color:var(--on-dark)}
.sec--photo .promise__i p{color:var(--on-dark-2)}
.head{max-width:62ch;margin-bottom:clamp(24px,3.5vw,44px)}
.head--c{text-align:center;margin-inline:auto}
.head--c .eyebrow{justify-content:center}.head--c .eyebrow::before{display:none}
.head--row{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;max-width:none}
.head--row>div{max-width:62ch}
.head h2:last-child{margin-bottom:0}
.lede{font-size:clamp(1.05rem,1rem + .35vw,1.22rem);color:var(--ink-2);max-width:60ch;line-height:1.55}
.muted{color:var(--ink-3)}
.body-w{max-width:62ch}
.eyebrow{font-family:var(--f-mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--brass-ink);display:flex;align-items:center;gap:.7rem;margin:0 0 .9rem}
.eyebrow::before{content:"";width:22px;height:1px;background:var(--brass-2)}
.mono{font-family:var(--f-mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
.grid{display:grid;gap:var(--gap)}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:1000px){.g4{grid-template-columns:repeat(2,minmax(0,1fr))}.g3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.g4,.g3,.g2{grid-template-columns:minmax(0,1fr)}.g3--tiles,.g4--cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.g4--cards .card__body{padding:10px 0 0;gap:2px}.g4--cards .card__body h3{font-size:1rem}.g4--cards .card__body p{display:none}.g4--cards .card__meta{padding-top:4px;font-size:.6rem}.g3--tiles .tile__cap{font-size:.6rem;flex-direction:column;gap:2px}}
.center{text-align:center}
.mt{margin-top:clamp(24px,3vw,40px)}
.actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.bleed{width:100vw;margin-left:calc(50% - 50vw)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;font-weight:700;font-size:.94rem;line-height:1;padding:1rem 1.4rem;border-radius:var(--rad);border:1.5px solid transparent;transition:transform .25s var(--ease),background .25s,color .25s,border-color .25s;white-space:nowrap}
.btn svg{width:16px;height:16px;flex:none}
.btn:hover{transform:translateY(-1px)}
.btn--p{background:var(--brass);color:var(--ink);border-color:var(--brass)}
.btn--p:hover{background:var(--brass-2);border-color:var(--brass-2)}
.btn--s{border-color:var(--line-2);color:var(--ink);background:transparent}
.btn--s:hover{border-color:var(--ink)}
.btn--d{background:var(--ink);color:var(--on-dark);border-color:var(--ink)}
.btn--d:hover{background:#3A2D22}
.sec--dark .btn--s,.on-photo .btn--s{border-color:rgba(244,241,234,.5);color:var(--on-dark)}
.sec--dark .btn--s:hover,.on-photo .btn--s:hover{border-color:var(--on-dark)}
.btn--wide{width:100%}
.btn--sm{padding:.7rem 1rem;font-size:.86rem}
.link{display:inline-flex;align-items:center;gap:.45rem;font-weight:700;font-size:.95rem;border-bottom:1.5px solid var(--brass);padding-bottom:2px}
.link svg{width:15px;height:15px;transition:transform .25s var(--ease)}
.link:hover svg{transform:translateX(3px)}

/* header */
.hdr{position:sticky;top:0;z-index:50;height:var(--hdr);background:rgba(251,248,241,.88);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid transparent;transition:border-color .3s,background .3s}
.hdr.stuck{border-bottom-color:var(--line);background:rgba(251,248,241,.96)}
.hdr__in{height:100%;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:20px;padding:0 clamp(14px,1.6vw,24px)}
.brand{display:flex;align-items:center;gap:10px;justify-self:start;color:#B5852B}
.brand__mark{width:44px;height:44px;flex:none}
.brand__t{display:flex;flex-direction:column;line-height:1;gap:3px;padding-top:2px}
.brand__n{font-family:Georgia,'Times New Roman',serif;font-weight:600;font-size:1.05rem;letter-spacing:.14em;text-transform:uppercase}
.brand__n--2{font-size:.66rem;letter-spacing:.2em}
.brand__s{display:none}
.nav{display:flex;gap:2px;align-items:center;justify-self:center}
.nav>a,.nav>.has-sub>a{white-space:nowrap;display:inline-flex;align-items:center;gap:.35rem;padding:.6rem .75rem;font-weight:600;font-size:.94rem;border-radius:var(--rad);color:var(--ink-2)}
.nav>a:hover,.nav>.has-sub:hover>a,.nav a[aria-current=page]{color:var(--ink)}
.nav a[aria-current=page]{box-shadow:inset 0 -2px 0 var(--brass)}
.has-sub{position:relative}
.has-sub>a svg{width:12px;height:12px;opacity:.6}
.sub{position:absolute;top:calc(100% + 8px);left:0;min-width:300px;background:var(--paper);border:1px solid var(--line);border-radius:var(--rad-l);box-shadow:0 18px 40px -20px rgba(30,25,21,.35);padding:8px;display:none;grid-template-columns:1fr 1fr;gap:2px}
.has-sub:hover .sub,.has-sub:focus-within .sub{display:grid}
.sub a{display:block;padding:.6rem .7rem;border-radius:var(--rad);font-size:.92rem;font-weight:600;color:var(--ink-2)}
.sub a:hover{background:var(--paper-2);color:var(--ink)}
.sub a span{display:block;font-family:var(--f-mono);font-size:.64rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);margin-top:2px}
.hdr__cta{display:flex;align-items:center;gap:14px;justify-self:end}
.tel{display:inline-flex;align-items:center;gap:.5rem;font-weight:700;font-size:.94rem;white-space:nowrap}
.tel svg{width:16px;height:16px}
.burger{display:none;width:44px;height:44px;align-items:center;justify-content:center;border-radius:var(--rad)}
.burger svg{width:24px;height:24px}
@media(max-width:1120px){.hdr__in{grid-template-columns:auto auto}.nav{display:none}.burger{display:inline-flex}.hdr__cta .btn{display:none}}
@media(max-width:600px){html{font-size:15px}:root{--sec:48px;--gut:18px}.hero{min-height:min(74vh,640px)}.hero h1{font-size:clamp(1.9rem,1.2rem + 4.6vw,2.5rem)}.hero--page{min-height:300px}.hero--short{min-height:360px}.hero__in{padding-block:36px 40px}.head{margin-bottom:20px}.btn{padding:.9rem 1.15rem;font-size:.9rem}}
@media(max-width:560px){:root{--hdr:58px}.brand__mark{width:34px;height:34px}.brand__n{font-size:.9rem}.brand__n--2{font-size:.56rem}.tel span{display:none}.tel{width:44px;height:44px;justify-content:center;border:1.5px solid var(--line-2);border-radius:var(--rad)}}
/* drawer */
.drawer{position:fixed;inset:0;z-index:80;display:none}
.drawer.open{display:block}
.drawer__scrim{position:absolute;inset:0;background:rgba(30,25,21,.5)}
.drawer__panel{position:absolute;top:0;right:0;bottom:0;width:min(420px,92vw);background:var(--paper);padding:20px var(--gut) 32px;overflow:auto;display:flex;flex-direction:column}
.drawer__top{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.drawer nav a{display:block;padding:.85rem 0;border-bottom:1px solid var(--line);font-family:var(--f-display);font-size:1.5rem;font-weight:500}
.drawer nav a.d-sub{font-family:var(--f-body);font-size:1rem;font-weight:600;padding:.55rem 0 .55rem 1rem;border-bottom:0;color:var(--ink-2)}
.drawer__foot{margin-top:auto;padding-top:24px;display:grid;gap:10px}
.drawer__meta{font-size:.9rem;color:var(--ink-3);margin-top:14px}
/* mobile sticky bar */
.mbar{display:none;position:fixed;left:0;right:0;bottom:0;z-index:60;background:rgba(251,248,241,.96);backdrop-filter:blur(10px);border-top:1px solid var(--line);padding:10px var(--gut) calc(10px + env(safe-area-inset-bottom));grid-template-columns:1fr 1.5fr;gap:10px}
@media(max-width:900px){.mbar{display:grid}body{padding-bottom:70px}}

/* hero */
.hero{position:relative;min-height:min(86vh,800px);display:flex;align-items:flex-end;color:var(--on-dark);isolation:isolate}
.hero--short{min-height:min(60vh,560px)}
.hero--page{min-height:min(54vh,500px)}
.hero__media,.hero__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.hero__scrim{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(30,25,21,.12) 0%,rgba(30,25,21,.08) 40%,rgba(30,25,21,.7) 100%)}
.hero__in{padding-block:clamp(48px,7vw,96px) clamp(48px,7vw,96px)}
.hero__in>*{max-width:760px}
.hero .eyebrow{color:var(--brass)}
.hero h1{color:#fff;margin-bottom:.4em}
.hero .lede{color:rgba(255,255,255,.86);max-width:52ch}
.hero__acts{margin-top:26px}
.hero__trust{margin-top:26px;display:flex;flex-wrap:wrap;gap:8px 22px;font-family:var(--f-mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.78)}
.hero__trust b{color:#fff;font-weight:600}
.crumbs{display:flex;gap:.6rem;flex-wrap:wrap;font-family:var(--f-mono);font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);padding:14px 0 0}
.crumbs a:hover{color:var(--ink)}

/* proof row (plain, under the hero) */
.proof{border-bottom:1px solid var(--line)}
.proof__in{display:grid;grid-template-columns:repeat(4,1fr)}
.proof__i{display:flex;align-items:center;gap:14px;padding:20px 24px 20px 0;color:var(--ink)}
.proof__seal{width:40px;height:40px;flex:none;display:grid;place-items:center}
.proof__seal svg{width:40px;height:40px}
.proof__i b{display:block;font-size:.96rem;line-height:1.2}
.proof__i em{display:block;font-style:normal;font-family:var(--f-mono);font-size:.64rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);margin-top:3px}
@media(max-width:900px){.proof__in{grid-template-columns:1fr 1fr}.proof__i{padding:16px 12px 16px 0}}

/* stat strip */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}
.stat b{display:block;font-family:var(--f-display);font-size:clamp(2rem,1.5rem+2vw,3rem);line-height:1;color:var(--ink)}
.stat span{display:block;margin-top:8px;color:var(--ink-2)}
@media(max-width:600px){.stats{grid-template-columns:1fr 1fr}}

/* photo tiles / cards: no boxes, image + text */
.tile{display:block;position:relative}
.tile__img{display:block;aspect-ratio:1/1;overflow:hidden;background:var(--stone);border-radius:var(--rad)}
.tile--43 .tile__img{aspect-ratio:4/3}
.tile__img img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.tile:hover .tile__img img{transform:scale(1.04)}
.tile__cap{display:flex;justify-content:space-between;gap:12px;align-items:baseline;padding:10px 0 0;font-family:var(--f-mono);font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
.tile__cap b{color:var(--ink);font-weight:500}
.card{display:flex;flex-direction:column}
.card__img{display:block;aspect-ratio:4/3;overflow:hidden;background:var(--stone);border-radius:var(--rad)}
.card__img img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.card:hover .card__img img{transform:scale(1.04)}
.card__body{display:flex;flex-direction:column;gap:4px;padding:14px 0 0;flex:1}
.card__body h3{margin:0;font-size:1.2rem}
.card__body p{margin:0;color:var(--ink-2);font-size:.95rem}
.card__meta{margin-top:auto;padding-top:8px;display:flex;justify-content:space-between;align-items:center;font-family:var(--f-mono);font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
.card__meta svg{width:14px;height:14px}
.card--lite{border-top:1px solid var(--line);padding-top:16px}
.card--lite .card__body{padding:0}

/* promise (numbered) on dark */
.promise{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap)}
.promise__i{border-top:1px solid var(--line-dark);padding-top:20px}
.promise--cols{gap:0;border:1px solid var(--line-dark);border-left:0;border-right:0}
.promise--cols .promise__i{border-top:0;border-right:1px solid var(--line-dark);padding:40px 36px 36px}
.promise--cols .promise__i:first-child{padding-left:36px}
.promise--cols .promise__i:last-child{border-right:0}
.promise__n{font-family:var(--f-mono);font-size:.7rem;letter-spacing:.14em;color:var(--brass);display:block;margin-bottom:14px}
.promise__i h3{color:var(--on-dark);font-size:1.3rem;max-width:12ch}
.promise__i p{color:var(--on-dark-2);font-size:.96rem;margin:0}
@media(max-width:1000px){.promise{grid-template-columns:1fr 1fr}.promise--cols .promise__i{padding:28px 24px}.promise--cols .promise__i:nth-child(2){border-right:0}.promise--cols .promise__i:nth-child(-n+2){border-bottom:1px solid var(--line-dark)}}
@media(max-width:560px){.promise{grid-template-columns:1fr}.promise--cols .promise__i{border-right:0;border-bottom:1px solid var(--line-dark);padding:24px 0}.promise--cols .promise__i:last-child{border-bottom:0}}

/* process strip */
.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--gap)}
.steps--line{position:relative;gap:clamp(16px,2.4vw,36px)}
.steps--line::before{content:"";position:absolute;left:0;right:0;top:7px;height:1px;background:var(--line-2)}
.steps--line .step{border-top:0;padding-top:30px}
.steps--line .step::before{display:none}
.step__dot{position:absolute;top:0;left:0;width:15px;height:15px;border-radius:50%;background:var(--paper);border:2px solid var(--brass-2);box-shadow:0 0 0 4px var(--paper)}
.steps--line .step:first-child .step__dot{background:var(--brass)}
.step{border-top:1px solid var(--line);padding-top:18px;position:relative}
.step::before{content:"";position:absolute;top:-1px;left:0;width:36px;height:2px;background:var(--brass)}
.step__n{font-family:var(--f-mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--brass-ink);display:block;margin-bottom:10px}
.step h3{font-size:1.15rem;margin-bottom:.4em}
.step p{font-size:.94rem;color:var(--ink-2);margin:0}
@media(max-width:1000px){.steps{grid-template-columns:repeat(2,1fr)}.steps--line::before{display:none}.steps--line .step{padding-left:30px;padding-top:0}.step__dot{top:4px}}
@media(max-width:560px){.steps{grid-template-columns:1fr}}
.steps--v{grid-template-columns:1fr;gap:0}
.steps--v .step{display:grid;grid-template-columns:140px 1fr;gap:24px;padding:30px 0;border-top:1px solid var(--line)}
.steps--v .step::before{display:none}
.steps--v .step h3{font-size:1.5rem}
@media(max-width:600px){.steps--v .step{grid-template-columns:1fr;gap:6px}}

/* reviews: open quotes, no boxes */
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,4vw,56px)}
.quotes--2{grid-template-columns:1fr 1fr;max-width:900px}
.quote{display:flex;flex-direction:column;gap:14px;position:relative;padding-top:34px}
.quote::before{content:"\201C";position:absolute;top:-8px;left:-4px;font-family:var(--f-display);font-size:4.2rem;line-height:1;color:var(--brass);opacity:.9}
.stars{display:flex;gap:3px;color:var(--brass-2)}
.stars svg{width:14px;height:14px}
.quote blockquote{margin:0;font-size:1.04rem;line-height:1.55;color:var(--ink)}
.quote figcaption{margin-top:auto;display:flex;flex-direction:column;gap:2px;font-size:.9rem}
.quote figcaption b{font-weight:700}
.quote figcaption .mono{font-size:.64rem}
@media(max-width:1000px){.quotes{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.quotes{grid-template-columns:1fr;gap:32px}}
.rating{display:flex;flex-wrap:wrap;align-items:center;gap:18px 28px;margin-top:8px}
.grating{display:inline-flex;align-items:center;gap:14px;background:#fff;border-radius:12px;padding:12px 18px 12px 14px;box-shadow:0 1px 2px rgba(36,26,18,.06),0 10px 28px -18px rgba(36,26,18,.25)}
.grating__g{width:40px;height:40px;flex:none}
.grating__t{display:flex;flex-direction:column;line-height:1.15}
.grating__t small{font-size:.74rem;color:var(--ink-3);font-weight:600;letter-spacing:.01em}
.grating__row{display:flex;align-items:center;gap:8px}
.grating__row b{font-family:var(--f-display);font-size:1.6rem;line-height:1}
.grating__row .rv__stars svg{width:15px;height:15px}
.grating__n{font-size:.8rem;color:var(--ink-3)}
.grating .link{margin-left:8px;font-size:.86rem}
.plats{display:block;margin:8px 0 0;font-size:.92rem;color:var(--ink-2)}
.plats a{border-bottom:1px solid var(--brass)}
.plats b{color:var(--ink)}

/* split */
.split{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(28px,5vw,80px);align-items:center}
.split--flip>.split__media{order:2}
.split__media{display:block;position:relative;overflow:hidden;aspect-ratio:4/3;background:var(--stone);border-radius:var(--rad)}
.split__media img{width:100%;height:100%;object-fit:cover}
.split__media--bleed{margin-left:calc(-1*var(--gut));width:calc(100% + var(--gut));border-radius:0}
.split--flip .split__media--bleed{margin-left:0;margin-right:calc(-1*var(--gut))}
.split__tag{position:absolute;left:14px;bottom:14px;background:rgba(251,248,241,.94);padding:6px 10px;border-radius:var(--rad);font-family:var(--f-mono);font-size:.64rem;letter-spacing:.1em;text-transform:uppercase}
@media(max-width:900px){.split{grid-template-columns:1fr}.split--flip>.split__media{order:0}.split__media--bleed,.split--flip .split__media--bleed{margin:0;width:100%}}
.checks{display:grid;gap:12px;margin-top:22px}
.checks li{display:flex;gap:12px;align-items:flex-start}
.checks svg{width:20px;height:20px;flex:none;color:var(--brass-ink);margin-top:3px}

/* chips & areas */
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;padding:.5rem .85rem;border:1px solid var(--line-2);border-radius:999px;font-size:.9rem;font-weight:600;color:var(--ink-2);background:transparent}
a.chip:hover{border-color:var(--ink);color:var(--ink)}
.chip--muted{border-style:dashed;color:var(--ink-3);font-weight:500}
.areas{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(20px,3vw,40px)}
.areas h3{font-family:var(--f-mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--brass-ink);margin-bottom:12px;font-weight:500}
@media(max-width:700px){.areas{grid-template-columns:1fr}}

/* faq */
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:20px 0;font-family:var(--f-display);font-size:1.2rem;font-weight:500}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--f-mono);font-size:1.3rem;color:var(--brass-ink);transition:transform .3s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq__a{padding:0 0 22px;max-width:70ch;color:var(--ink-2)}
.faq__a p{margin:0}

/* cta + form: a soft sage band, no boxes */
.cta__grid{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(32px,5vw,96px);align-items:start}
@media(max-width:940px){.cta__grid{grid-template-columns:1fr}}
.ways{display:grid;gap:0;margin-top:26px;border-top:1px solid var(--line)}
.way{display:flex;gap:14px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line)}
.way svg{width:20px;height:20px;flex:none;color:var(--brass-ink)}
.way b{display:block;font-size:1.02rem}
.way span{display:block;font-size:.88rem;color:var(--ink-3)}
.next{margin-top:28px;display:grid;gap:12px}
.next li{display:grid;grid-template-columns:34px 1fr;gap:12px;align-items:start;font-size:.95rem;color:var(--ink-2)}
.next li b{font-family:var(--f-mono);font-size:.7rem;letter-spacing:.1em;color:var(--brass-ink);padding-top:4px}
.form{padding:0}
.field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.field label{font-size:.86rem;font-weight:700}
.field input,.field select,.field textarea{font:inherit;font-size:1rem;color:var(--ink);background:#fff;border:1px solid var(--line-2);border-radius:var(--rad);padding:.85rem .9rem;width:100%}
.field textarea{min-height:120px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-color:var(--brass-2);box-shadow:0 0 0 3px rgba(201,168,104,.28)}
.form__row{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
@media(max-width:560px){.form__row{grid-template-columns:1fr}}
.form__note{font-size:.84rem;color:var(--ink-3);margin:12px 0 0}
.req{color:var(--brass-ink)}

/* footer */
.ftr{background:var(--ink);color:var(--on-dark-2);padding:clamp(48px,6vw,80px) 0 28px;font-size:.92rem}
.ftr a:hover{color:var(--on-dark)}
.ftr__grid{display:grid;grid-template-columns:1.5fr .9fr .8fr 1fr 1.15fr;gap:clamp(24px,4vw,64px)}
.ftr__tel{font-family:var(--f-display);font-size:1.45rem;color:var(--on-dark);display:block;margin-bottom:8px}
.ftr h2{font-family:var(--f-mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--brass);font-weight:500;margin-bottom:16px}
.ftr li{margin-bottom:10px}
.ftr .brand{color:#D9B96F;margin-bottom:20px}
.ftr .brand__mark{width:52px;height:52px}
.ftr .brand__n{font-size:1.15rem}.ftr .brand__n--2{font-size:.72rem}
.ftr p{max-width:40ch}
.ftr .brand__s{color:var(--on-dark-2)}
.ftr__lic{display:flex;gap:8px;align-items:center;margin-top:18px;font-family:var(--f-mono);font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--on-dark)}
.ftr__lic svg{width:16px;height:16px;color:var(--brass)}
.ftr__cities{columns:2;gap:24px}
.ftr__bot{margin-top:clamp(32px,4vw,56px);padding-top:22px;border-top:1px solid var(--line-dark);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:.82rem}
@media(max-width:1000px){.ftr__grid{grid-template-columns:1fr 1fr 1fr}}
@media(max-width:760px){.ftr__grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.ftr__grid{grid-template-columns:1fr}.ftr__cities{columns:2}}

/* ---------- portfolio: the reel ---------- */
.ptabs{position:sticky;top:var(--hdr);z-index:30;background:rgba(251,248,241,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.ptabs__in{display:flex;gap:clamp(14px,3vw,36px);overflow-x:auto;scrollbar-width:none;min-height:56px;align-items:stretch}
.ptabs__in::-webkit-scrollbar{display:none}
.ptab{flex:none;display:inline-flex;align-items:center;font-weight:600;font-size:.94rem;color:var(--ink-3);border-bottom:2px solid transparent;padding:4px 0;white-space:nowrap}
.ptab:hover{color:var(--ink)}
.ptab[aria-selected=true]{color:var(--ink);border-bottom-color:var(--brass)}
.ptabs__n{margin-left:auto;align-self:center;flex:none}
.reels{padding-top:8px}
.reel{display:grid;grid-template-columns:minmax(220px,300px) minmax(0,1fr);gap:clamp(20px,3vw,48px);padding:clamp(28px,4vw,48px) 0;border-top:1px solid var(--line);align-items:start}
.reel:first-child{border-top:0}
.reel[hidden]{display:none}
.reel__meta{position:sticky;top:calc(var(--hdr) + 72px)}
.reel__meta .mono{display:block;margin-bottom:10px}
.reel__meta h2{font-size:clamp(1.35rem,1.1rem + 1vw,1.9rem);margin:0 0 .5em}
.reel__meta p{font-size:.95rem;color:var(--ink-2);margin:0 0 14px;max-width:34ch}
.reel__meta .mono.n{color:var(--ink-3);margin:0 0 16px}
.reel__meta .actions{gap:8px 18px}
.reel__track{overflow:hidden;min-width:0;margin-right:calc(-1*var(--gut))}
.reel__strip{display:flex;gap:6px;will-change:transform}
.ph{flex:none;position:relative;width:clamp(220px,24vw,320px);aspect-ratio:1/1;overflow:hidden;background:var(--stone);display:block}
.ph img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.ph:hover img{transform:scale(1.04)}
.ph__cap{position:absolute;left:0;right:0;bottom:0;padding:34px 12px 10px;font-family:var(--f-mono);font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;color:#fff;background:linear-gradient(180deg,transparent,rgba(30,25,21,.7));opacity:0;transition:opacity .3s}
.ph:hover .ph__cap,.ph--tag .ph__cap{opacity:1}
.ph--more{display:grid;place-items:center;background:var(--paper-2);color:var(--ink);font-family:var(--f-display);font-size:1.3rem;text-align:center;padding:20px}
.ph--more small{display:block;font-family:var(--f-mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);margin-top:8px}
@media(hover:none),(pointer:coarse){
  .reel__track{overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .reel__track::-webkit-scrollbar{display:none}
  .reel__strip{transform:none!important}
  .ph{scroll-snap-align:start}
}
@media(max-width:900px){
  .reel{grid-template-columns:1fr;gap:12px;padding:18px 0}
  .reel__meta{position:static}
  .reel__meta h2{font-size:1.2rem;margin-bottom:.3em}
  .reel__meta p{display:none}
  .reel__meta .mono{font-size:.62rem;margin-bottom:6px}
  .reel__meta .mono.n{margin-bottom:8px}
  .reel__meta .link{font-size:.86rem}
  .reel__track{margin-left:calc(-1*var(--gut));margin-right:calc(-1*var(--gut));padding-left:var(--gut)}
  .ph{width:min(56vw,260px)}
  .ptabs__in{min-height:48px;gap:18px}
  .ptab{font-size:.86rem}
}
/* theater */
.th{border:0;padding:0;margin:0;background:transparent;max-width:none;max-height:none;width:100%;height:100%;inset:0;color:#fff}
.th::backdrop{background:rgba(18,14,11,.96)}
.th__in{position:fixed;inset:0;display:grid;grid-template-rows:auto 1fr auto;grid-template-columns:minmax(0,1fr);background:#15110E}
.th__top,.th__bot,.th__stage{min-width:0}
.th__top{display:flex;align-items:center;gap:16px;padding:16px var(--gut)}
.th__top .mono{color:rgba(255,255,255,.6)}
.th__top h2{font-size:1.1rem;margin:0;color:#fff}
.th__top>div{flex:1;min-width:0}
.th__top h2{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.th__top .link{flex:none;margin-left:auto;color:#fff;border-bottom-color:var(--brass);font-size:.86rem}
.th__x{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;color:#fff;border:1px solid rgba(255,255,255,.2)}
.th__x svg{width:18px;height:18px}
.th__stage{position:relative;min-height:0}
.th__stage img{position:absolute;inset:0 clamp(60px,6vw,90px);width:calc(100% - 2*clamp(60px,6vw,90px));height:100%;object-fit:contain;transition:opacity .25s}
.th__btn{position:absolute;top:50%;transform:translateY(-50%);width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.08);color:#fff;display:grid;place-items:center}
.th__btn svg{width:20px;height:20px}
.th__prev{left:var(--gut)}.th__next{right:var(--gut)}
.th__bot{display:flex;align-items:center;gap:16px;padding:12px var(--gut) calc(14px + env(safe-area-inset-bottom))}
.th__cap{display:none}
.th__thumbs{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin-left:auto;min-width:0}
.th__thumbs::-webkit-scrollbar{display:none}
.th__thumbs button{flex:none;width:56px;height:56px;overflow:hidden;opacity:.45;transition:opacity .2s;border-radius:2px}
.th__thumbs button img{width:100%;height:100%;object-fit:cover}
.th__thumbs button[aria-current=true]{opacity:1;outline:2px solid var(--brass)}
@media(max-width:700px){.th__top{padding:10px 14px}.th__top h2{font-size:.9rem}.th__top .link{display:none}.th__btn{display:none}.th__thumbs{margin-left:0}.th__thumbs button{width:44px;height:44px}.th__stage img{inset:0;width:100%;object-fit:cover}.th.fit .th__stage img{object-fit:contain}.th__bot{padding:10px 14px calc(10px + env(safe-area-inset-bottom))}}

/* reviews slider: platform-style cards */
.rslider{position:relative}
.rtrack{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:0 calc(-1*var(--gut));padding:6px var(--gut) 18px}
.rtrack::-webkit-scrollbar{display:none}
.rv{flex:none;width:min(86vw,400px);scroll-snap-align:start;margin:0;background:#fff;border-radius:12px;padding:20px 22px 22px;box-shadow:0 1px 2px rgba(30,25,21,.06),0 10px 28px -18px rgba(30,25,21,.25);display:flex;flex-direction:column;gap:12px}
.rv__top{display:flex;align-items:center;gap:12px}
.rv__av{width:40px;height:40px;border-radius:50%;color:#fff;display:grid;place-items:center;font-weight:700;font-size:1rem;flex:none}
.rv__who{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.rv__who b{font-size:.98rem}
.rv__who span{font-size:.82rem;color:var(--ink-3)}
.rv__src{margin-left:auto;flex:none;font-size:.72rem;font-weight:700;letter-spacing:.02em;padding:5px 9px;border-radius:999px;color:#fff;background:var(--ink-3)}
.rv__src--thumbtack{background:#009FD9}.rv__src--google{background:#4285F4}.rv__src--yelp{background:#D32323}.rv__src--houzz{background:#4DBC15}
.rv__stars{display:flex;gap:2px;color:#F5B301}
.rv__stars svg{width:16px;height:16px}
.rv blockquote{margin:0;font-size:.98rem;line-height:1.55;color:var(--ink)}
.rnav{display:flex;gap:8px;align-items:center;margin-top:4px}
.rnav__dots{display:flex;gap:6px;margin-right:auto}
.rnav__dots i{width:6px;height:6px;border-radius:50%;background:var(--line-2);display:block}
.rnav__dots i.on{background:var(--brass-2)}
.rbtn{width:40px;height:40px;border-radius:50%;border:1px solid var(--line-2);display:grid;place-items:center}
.rbtn svg{width:16px;height:16px}

/* project page */
.ba{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.ba figure{margin:0;position:relative;overflow:hidden;aspect-ratio:4/3;background:var(--stone)}
.ba img{width:100%;height:100%;object-fit:cover}
.ba figcaption{position:absolute;top:12px;left:12px;background:rgba(251,248,241,.94);font-family:var(--f-mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;padding:5px 9px;border-radius:var(--rad)}
@media(max-width:600px){.ba{grid-template-columns:1fr}}
.gal{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px 6px}
@media(max-width:900px){.gal{grid-template-columns:repeat(2,minmax(0,1fr))}}
.gal figure{margin:0}
.gal a{display:block;aspect-ratio:1/1;overflow:hidden;background:var(--stone)}
.gal img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.gal a:hover img{transform:scale(1.04)}
.gal figcaption{padding:8px 0 14px;font-family:var(--f-mono);font-size:.64rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
.gal__room{grid-column:1/-1;display:flex;align-items:baseline;gap:14px;margin-top:22px;padding-bottom:6px}
.gal__room:first-child{margin-top:0}
.gal__room h3{margin:0}
.gal__room span{font-family:var(--f-mono);font-size:.64rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3)}
.prevnext{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap)}
.pn{display:flex;gap:16px;align-items:center;padding:16px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.pn--next{flex-direction:row-reverse;text-align:right}
.pn img{width:120px;height:90px;object-fit:cover;flex:none}
.pn small{display:block;font-family:var(--f-mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);margin-bottom:4px}
.pn b{font-family:var(--f-display);font-weight:500;font-size:1.1rem}
@media(max-width:600px){.prevnext{grid-template-columns:1fr}.pn img{width:90px;height:68px}}
.infocard{padding:0}
.infocard__row{display:flex;gap:14px;align-items:flex-start;padding:16px 0;border-bottom:1px solid var(--line)}
.infocard__row:first-child{border-top:1px solid var(--line)}
.infocard__row svg{width:20px;height:20px;flex:none;color:var(--brass-ink);margin-top:3px}
.infocard__row b{display:block}
.infocard__row span{display:block;font-size:.9rem;color:var(--ink-3)}
.hours{display:grid;grid-template-columns:auto 1fr;gap:4px 18px;font-size:.92rem}
.hours dt{color:var(--ink-3)}.hours dd{margin:0;font-weight:600}

/* service page extras */
.incl{display:grid;grid-template-columns:1fr 1fr;gap:0 40px}
.incl li{display:flex;gap:12px;align-items:flex-start;padding:12px 0;border-bottom:1px solid var(--line);font-size:.97rem}
.incl svg{width:18px;height:18px;flex:none;color:var(--brass-ink);margin-top:4px}
@media(max-width:700px){.incl{grid-template-columns:1fr}}
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,40px)}
.tier{border-top:2px solid var(--line);padding:22px 0 0;display:flex;flex-direction:column;gap:10px;position:relative}
.tier::before{content:"";position:absolute;top:-2px;left:0;width:36px;height:2px;background:var(--brass)}
.tier--hi::before{width:100%}
.tier small{font-family:var(--f-mono);font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;color:var(--brass-ink)}
.tier h3{margin:0;font-size:1.3rem}
.tier .price{font-family:var(--f-display);font-size:1.7rem;line-height:1}
.tier p{margin:0;color:var(--ink-2);font-size:.95rem}
@media(max-width:900px){.tiers{grid-template-columns:1fr}}

/* about / people */
.person{display:grid;grid-template-columns:320px 1fr;gap:clamp(24px,4vw,64px);align-items:center}
.person__ph{aspect-ratio:4/5;overflow:hidden;background:var(--stone);display:grid;place-items:center;text-align:center;color:var(--ink-3);font-family:var(--f-mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;padding:20px}
@media(max-width:800px){.person{grid-template-columns:1fr}.person__ph{max-width:360px}}
.badges{display:grid;gap:0;border-top:1px solid var(--line)}
.badge{display:flex;align-items:center;gap:14px;padding:14px 0;border-bottom:1px solid var(--line)}
.badge .proof__seal{width:36px;height:36px}.badge .proof__seal svg{width:36px;height:36px}
.badge b{display:block;font-size:.95rem;line-height:1.15}
.badge em{display:block;font-style:normal;font-family:var(--f-mono);font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);margin-top:3px}

/* contact */
.contact{display:grid;grid-template-columns:1.15fr .9fr;gap:clamp(28px,5vw,80px);align-items:start}
@media(max-width:940px){.contact{grid-template-columns:1fr}}

/* 404 */
.nf{min-height:60vh;display:grid;place-items:center;text-align:center}
.nf h1{font-size:clamp(3rem,10vw,7rem);margin:0}
.nf .nf__n{font-family:var(--f-mono);letter-spacing:.2em;color:var(--brass-ink);font-size:.8rem}

/* motion */
[data-rise]{opacity:0;transform:translateY(12px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
[data-rise].in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}[data-rise]{opacity:1;transform:none}}

/* lightbox */
.lb{border:0;padding:0;background:transparent;max-width:none;max-height:none;width:100vw;height:100vh}
.lb::backdrop{background:rgba(20,14,10,.92)}
.lb__in{position:fixed;inset:0;display:grid;place-items:center}
.lb img{max-width:min(94vw,1600px);max-height:86vh;object-fit:contain}
.lb__btn{position:fixed;width:46px;height:46px;border-radius:50%;background:rgba(251,248,241,.12);color:#fff;display:grid;place-items:center}
.lb__btn svg{width:20px;height:20px}
.lb__x{top:16px;right:16px}.lb__prev{left:16px;top:50%;transform:translateY(-50%)}.lb__next{right:16px;top:50%;transform:translateY(-50%)}
.lb__cap{position:fixed;bottom:18px;left:0;right:0;text-align:center;color:rgba(255,255,255,.8);font-family:var(--f-mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase}

/* before/after comparison sliders */
.cmps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,2.5vw,28px)}
.cmps--1{grid-template-columns:minmax(0,1fr)}.cmps--1 .cmp{max-width:960px;margin:0 auto;width:100%}
@media(max-width:760px){.cmps{grid-template-columns:1fr}}
.cmp{margin:0;min-width:0}
.cmp__box{position:relative;aspect-ratio:3/2;overflow:hidden;background:var(--stone);user-select:none;-webkit-user-select:none;max-width:100%}
.cmp--p .cmp__box{aspect-ratio:4/5;max-width:520px}
.cmp__after,.cmp__before{position:absolute;inset:0}
.cmp__box picture{display:block;width:100%;height:100%}
.cmp__box img{display:block;width:100%;height:100%;object-fit:cover}
.cmp__before{clip-path:inset(0 calc(100% - var(--pos,50%)) 0 0)}
.cmp__lab{position:absolute;top:12px;font-family:var(--f-mono);font-size:.62rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:#fff;background:rgba(30,25,21,.62);padding:5px 9px;pointer-events:none;z-index:2}
.cmp__lab--b{left:12px}.cmp__lab--a{right:12px}
.cmp__line{position:absolute;top:0;bottom:0;left:var(--pos,50%);width:2px;margin-left:-1px;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.18);pointer-events:none;z-index:2}
.cmp__knob{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:46px;height:46px;border-radius:50%;background:#fff;color:var(--ink);display:flex;align-items:center;justify-content:center;box-shadow:0 2px 12px rgba(0,0,0,.35)}
.cmp__knob svg{width:15px;height:15px}
.cmp__range{position:absolute;inset:0;width:100%;height:100%;margin:0;padding:0;opacity:0;cursor:ew-resize;touch-action:pan-y;-webkit-appearance:none;appearance:none;background:transparent;z-index:3}
.cmp__range::-webkit-slider-thumb{-webkit-appearance:none;width:46px;height:46px}
.cmp__range::-moz-range-thumb{width:46px;height:46px;border:0}
.cmp__box:has(.cmp__range:focus-visible){outline:3px solid var(--brass);outline-offset:3px}
.cmp figcaption{font-family:var(--f-mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);margin-top:8px}

picture{display:block;width:100%;height:100%}
.brand__img{display:block;height:44px;width:auto}
.ftr .brand__img{height:52px}
@media(max-width:560px){.brand__img{height:34px}}
.form__ok{display:none;padding:28px 0;max-width:46ch}
.form__ok svg{width:36px;height:36px;color:var(--brass-ink);margin-bottom:12px}
.form.is-sent .form__body{display:none}.form.is-sent .form__ok{display:block}
.form__err{display:none;color:#8A2E2E;font-size:.9rem;margin-top:10px}.form.is-err .form__err{display:block}
[hidden]{display:none!important}
@media(max-width:600px){.ptabs__in{flex-wrap:wrap;gap:2px 18px;padding:8px 0;min-height:0}.ptab{font-size:.86rem;padding:3px 0}.ptabs__n{display:none}}
.person__ph--img{padding:0;display:block}.person__ph--img picture,.person__ph--img img{width:100%;height:100%;object-fit:cover;object-position:50% 30%;display:block}
/* ---- proposal-matched details (Oct 22): Roboto, gold bands, outlined fields, numbered circles, official badge marks ---- */
:root{--band:#C9AD7C}
.field label{font-family:var(--f-body);font-size:.92rem;font-weight:500;letter-spacing:0;text-transform:none;color:var(--ink)}
.field label em{font-style:normal;font-weight:400;color:var(--ink-3);font-size:.84rem;margin-left:4px}
.field{gap:7px;margin-bottom:16px}
.field input,.field select,.field textarea{border:1px solid var(--band);border-radius:6px;background:#fff;font-size:1rem;padding:.9rem 1rem;min-height:52px}
.field input::placeholder,.field textarea::placeholder{color:#A39684}
.field textarea{min-height:120px}
.sel{position:relative;display:block}
.sel select{appearance:none;-webkit-appearance:none;padding-right:2.6rem;cursor:pointer}
.sel::after{content:"";position:absolute;right:16px;top:50%;width:9px;height:9px;border-right:1.5px solid var(--brass-ink);border-bottom:1.5px solid var(--brass-ink);transform:translateY(-70%) rotate(45deg);pointer-events:none}
.form__hint{font-size:.95rem;color:var(--ink-3);margin:0 0 18px}
[aria-invalid=true]{border-color:#8A2E2E!important}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--brass-ink);box-shadow:0 0 0 3px rgba(201,173,124,.3)}
.infocard{padding:0;border:1px solid var(--line);border-radius:4px;overflow:hidden;background:#fff}
.infocard__hd{background:var(--band);color:#fff;font-weight:700;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;padding:11px 18px}
.infocard__bd{padding:8px 18px 12px}
.infocard__bd .facts{padding:8px 0}
.infocard__bd .infocard__row:last-child{border-bottom:0}
/* the five steps as the live site's stepping-stone timeline, tightened: centre line, dots, steps alternate left/right */
.tl{position:relative;max-width:880px;margin:0 auto;padding:6px 0 2px}
.tl__line{position:absolute;left:50%;top:10px;bottom:14px;width:1px;background:var(--line-2);transform:translateX(-.5px)}
.tl__i{position:relative;display:grid;grid-template-columns:1fr 1fr;column-gap:64px;padding:0 0 28px}
.tl__i:last-child{padding-bottom:0}
.tl__dot{position:absolute;left:50%;top:4px;width:13px;height:13px;border-radius:50%;background:var(--paper);border:1px solid var(--brass-2);transform:translateX(-50%);box-shadow:0 0 0 4px var(--paper)}
.tl__line + .tl__i .tl__dot{background:var(--brass)}
.tl__i--l .tl__body{grid-column:1;text-align:right}
.tl__i--l .tl__body p{margin-left:auto}
.tl__i--r .tl__body{grid-column:2}
.tl__body .step__n{font-family:var(--f-body);font-size:.68rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--brass-ink);display:block;margin:0 0 6px}
.tl__body h3{font-size:1.18rem;margin:0 0 6px}
.tl__body p{font-size:.93rem;line-height:1.6;color:var(--ink-2);margin:0;max-width:38ch}
.tl__body .tl__sub{font-weight:500;color:var(--ink);margin-bottom:4px}
@media(max-width:700px){.tl{padding-left:0}.tl__line{left:6px;transform:none}.tl__i{grid-template-columns:1fr;padding:0 0 22px 28px}.tl__dot{left:6px;transform:translateX(-50%)}.tl__i--l .tl__body,.tl__i--r .tl__body{grid-column:1;text-align:left}.tl__i--l .tl__body p{margin-left:0}}
.proof__in{grid-template-columns:repeat(4,1fr)}
.proof__i{border-left:1px solid var(--line);padding:18px 18px}
.proof__i:first-child{border-left:0}
.proof__seal{width:64px;height:48px;flex:none;display:flex;align-items:center;justify-content:center}
.proof__seal img,.proof__seal svg{max-width:100%;max-height:100%;width:auto;height:auto;display:block}
.mk--hz,.mk--tt{width:40px;height:40px}.mk--dc{width:48px}.mk--bbb{width:61px;height:40px}
.badges .proof__seal{width:64px;height:48px}
@media(max-width:760px){.proof__in{grid-template-columns:1fr 1fr}.proof__i{padding:14px 10px}.proof__i:nth-child(odd){border-left:0}.proof__seal{width:56px;height:44px}.mk--hz,.mk--tt{width:34px;height:34px}.mk--dc{width:42px}}
/* Roboto Bold runs larger than the serif it replaced: trim the biggest headings a little */
h1{font-size:clamp(2.2rem,1.3rem + 3.6vw,3.9rem)}
h2{font-size:clamp(1.55rem,1.15rem + 1.5vw,2.4rem)}
@media(max-width:600px){.hero h1{font-size:clamp(1.8rem,1.2rem + 4.2vw,2.3rem)}}
/* header lockup at the live site's size */
.brand__img{height:54px}
.ftr .brand__img{height:58px}
@media(max-width:600px){.brand__img{height:42px}}
.drawer__top .brand__img{height:44px}
.infocard__bd .facts{display:grid;grid-template-columns:1fr 1fr;gap:14px 18px;padding:8px 0 4px}
.infocard__bd .facts dt{font-family:var(--f-body);font-size:.68rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);margin:0 0 4px}
.infocard__bd .facts dd{margin:0;font-weight:500;color:var(--ink)}

/* ---- contact page (Oct 22, build g): lighter details list, showroom with map, no sticky bar ---- */
.cdet{display:grid;border-top:1px solid var(--line)}
.cdet__i{display:flex;gap:14px;align-items:flex-start;padding:16px 0;border-bottom:1px solid var(--line);color:inherit;text-decoration:none}
.cdet__i svg{width:20px;height:20px;flex:none;color:var(--brass-ink);margin-top:3px}
.cdet__i b{display:block;font-weight:600;line-height:1.35}
.cdet__i small{display:block;font-size:.9rem;color:var(--ink-3);margin-top:2px;line-height:1.5}
a.cdet__i:hover b{color:var(--brass-ink)}
.cdet__after{margin-top:22px;font-size:.95rem}
@media(min-width:941px){.contact>div:last-child{padding-top:46px}}
.visit{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(28px,5vw,72px);align-items:center}
.visit__facts{list-style:none;padding:0;margin:22px 0 0;display:grid;gap:14px}
.visit__facts li{display:flex;gap:12px;align-items:flex-start;line-height:1.55}
.visit__facts svg{width:20px;height:20px;flex:none;color:var(--brass-ink);margin-top:3px}
.visit__facts address{font-style:normal}
.visit__map{position:relative;aspect-ratio:4/3;border-radius:8px;overflow:hidden;border:1px solid var(--line);background:var(--stone)}
.visit__map iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
@media(max-width:860px){.visit{grid-template-columns:1fr}.visit__map{aspect-ratio:16/11}}

/* About: four commitments - 4 columns on desktop, 2 on tablet, 1 on phone (was an inline style that ignored the breakpoints) */
.steps--4{grid-template-columns:repeat(4,1fr)}
@media(max-width:1000px){.steps--4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.steps--4{grid-template-columns:1fr}}
/* section headings with a side link: stack on phones so the link never wraps beside the title */
.head--row .link{white-space:nowrap}
@media(max-width:600px){.head--row{display:block}.head--row .link,.head--row .grating{margin-top:12px}.head--row>.grating{display:inline-flex}}
/* Services dropdown: wide enough that every service and its price range sit on one line */
.sub{min-width:560px;padding:10px;gap:2px 8px}
.sub a{white-space:nowrap;padding:.55rem .8rem}
.sub a span{letter-spacing:.04em}
@media(max-width:1100px){.sub{min-width:520px}}
/* form: a short hint when required fields are missing (the fields also outline in red) */
.form__need{display:none;color:#8A2E2E;font-size:.9rem;margin-top:10px}.form.is-missing .form__need{display:block}
/* footer: give the city list and contact column a little more room so names and the email stay on one line */
@media(min-width:1001px){.ftr__grid{grid-template-columns:1.35fr .85fr .7fr 1.15fr 1.2fr;gap:clamp(20px,3vw,48px)}}
.ftr__cities a{white-space:nowrap}

/* ---- Oct 23 (build i): section tones with real contrast, symmetrical blocks, portfolio sliders, slider labels ---- */
:root{--paper-2:#F3EADA;--paper-3:#EDE3D0}
.sec--alt{background:var(--paper-2)}
.sec--sage{background:var(--paper-3)}
.sec--alt .rv,.sec--alt .grating{box-shadow:0 1px 2px rgba(36,26,18,.05),0 12px 30px -20px rgba(36,26,18,.3)}
.ph--more{background:var(--paper-3)}
.rv__src--houzz{background:#4DBC15;color:#fff}
/* before / after labels sit inside their own layer: the before label is clipped with the before photo, the after label is covered by it */
.cmp__after,.cmp__before{position:absolute;inset:0}
.cmp__after{z-index:0}.cmp__before{z-index:1}
.cmp__lab{top:12px;z-index:auto}
/* previous / next: the same layout on both sides */
.pn--next{flex-direction:row;text-align:left}
.prevnext{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,3vw,40px)}
@media(max-width:600px){.prevnext{grid-template-columns:1fr}}
/* About: four commitments as numbered rows in two columns */
.cmts{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,3vw,40px) clamp(24px,4vw,64px)}
.cmt{display:grid;grid-template-columns:44px 1fr;gap:16px;align-items:start;padding-top:22px;border-top:1px solid var(--line)}
.cmt__n{width:36px;height:36px;border-radius:50%;border:1px solid var(--brass-ink);color:var(--brass-ink);display:grid;place-items:center;font-size:.8rem;font-weight:500;margin-top:2px}
.cmt h3{font-size:1.12rem;margin:6px 0 6px}
.cmt p{margin:0;color:var(--ink-2);font-size:.98rem;line-height:1.55}
@media(max-width:700px){.cmts{grid-template-columns:1fr;gap:4px}.cmt{padding:16px 0}}
/* About: credentials as two matching columns of four rows */
.cred{display:grid;grid-template-columns:1fr 1fr;gap:0 clamp(24px,4vw,64px)}
.cred__col{display:grid;align-content:start}
.cred__i{display:flex;gap:16px;align-items:center;min-height:78px;padding:14px 0;border-top:1px solid var(--line);color:inherit;text-decoration:none}
.cred__col .cred__i:last-child{border-bottom:1px solid var(--line)}
.cred__i b{display:block;font-weight:600}
.cred__i em{display:block;font-style:normal;font-family:var(--f-body);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);margin-top:3px}
.cred__ic{width:64px;height:48px;display:grid;place-items:center;flex:none;color:var(--brass-ink)}
.cred__ic svg{width:26px;height:26px}
a.cred__i:hover b{color:var(--brass-ink)}
@media(max-width:760px){.cred{grid-template-columns:1fr}.cred__col:first-child .cred__i:last-child{border-bottom:0}}
/* Portfolio: each row is its own slider */
.reel__meta h2 a.reel__t{color:inherit;text-decoration:none}
.reel__meta h2 a.reel__t:hover{color:var(--brass-ink)}
.reel__wrap{position:relative;min-width:0}
.reel__track{overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;scrollbar-width:none;-webkit-overflow-scrolling:touch;cursor:grab}
.reel__track::-webkit-scrollbar{display:none}
.reel__track:active{cursor:grabbing}
.reel__strip{transform:none!important}
.ph{scroll-snap-align:start}
.reel__arr{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;border:1px solid var(--line-2);background:rgba(251,248,241,.94);color:var(--ink);display:grid;place-items:center;cursor:pointer;z-index:2;box-shadow:0 4px 14px -6px rgba(36,26,18,.35)}
.reel__arr svg{width:16px;height:16px}
.reel__arr--l{left:10px}.reel__arr--r{right:calc(var(--gut) + 10px)}
.reel__arr:hover{background:#fff;border-color:var(--ink)}
.reel__arr[hidden]{display:none}
@media(max-width:900px){.reel__arr--r{right:10px}}
@media(hover:none),(pointer:coarse){.reel__arr{display:none}}  /* phones and tablets swipe the row */
/* review slider: a counter instead of twenty dots */
.rnav__count{font-family:var(--f-body);font-size:.78rem;letter-spacing:.06em;color:var(--ink-3);margin-right:auto}

/* ---- Oct 23 (build i): Cormorant Garamond everywhere, per Chris ("change font everywhere to look like this") ---- */
:root{--f-display:'Cormorant Garamond',Georgia,'Times New Roman',serif;--f-body:'Cormorant Garamond',Georgia,'Times New Roman',serif;--f-mono:'Cormorant Garamond',Georgia,'Times New Roman',serif}
body{font-size:1.16rem;line-height:1.5;font-weight:500}
h1,h2,h3,h4{font-weight:600;letter-spacing:0;line-height:1.06}
h1{font-size:clamp(2.7rem,1.5rem + 4.4vw,4.8rem)}
h2{font-size:clamp(2rem,1.35rem + 2.1vw,3.1rem)}
h3{font-size:clamp(1.3rem,1.15rem + .6vw,1.65rem)}
@media(max-width:600px){.hero h1{font-size:clamp(2.2rem,1.4rem + 5vw,2.9rem)}}
.lede{font-size:clamp(1.22rem,1.1rem + .45vw,1.45rem);line-height:1.5}
.eyebrow{font-size:.84rem;font-weight:600;letter-spacing:.16em}
.mono,.step__n,.tl__body .step__n,.sub a span,.pn small,.ph__cap,.gal figcaption,.tile__cap b,.tile__cap span,.hero__meta,.hero__stats span,.rv__who span,.rnav__count,.cred__i em,.proof__i em,.badge em,.infocard__bd .facts dt,.form__ok p small{font-weight:600;letter-spacing:.1em}
.mono{font-size:.8rem}.step__n,.tl__body .step__n{font-size:.78rem}
.btn{font-size:1.08rem;font-weight:600;letter-spacing:.02em;padding:.95rem 1.4rem}
.nav>a,.nav>.has-sub>a{font-size:1.1rem;font-weight:600}
.sub a{font-size:1.08rem;font-weight:600}.sub a span{font-size:.74rem}
.tel span{font-size:1.1rem;font-weight:600}
.drawer nav a{font-size:1.35rem}
.field label{font-size:1.08rem;font-weight:600}.field label em{font-size:.92rem}
.field input,.field select,.field textarea{font-size:1.12rem;font-weight:500}
.form__hint,.form__note,.form__need,.form__err{font-size:1.02rem}
.rv blockquote{font-size:1.1rem;line-height:1.5}.rv__who b{font-size:1.1rem}.rv__who span{font-size:.86rem}.rv__src{font-family:var(--f-body);font-weight:700;font-size:.8rem}
.cdet__i b,.cred__i b,.proof__i b,.badge b{font-size:1.12rem;font-weight:600}
.cdet__i small,.visit__facts,.cdet__after{font-size:1.02rem}
.cred__i em,.proof__i em,.badge em{font-size:.78rem}
.infocard__hd{font-size:.86rem;font-weight:700;letter-spacing:.1em}
.infocard__bd .facts dt{font-size:.78rem}.infocard__bd .facts dd{font-size:1.08rem}
.tl__body p{font-size:1.06rem}.tl__sub{font-size:1.12rem!important}
.cmt p,.promise__i p{font-size:1.06rem}
.card p,.svc p{font-size:1.02rem}
.ftr{font-size:1.06rem}.ftr h2{font-size:.84rem;font-weight:700;letter-spacing:.14em}
.ftr__tel{font-size:1.6rem}
.faq summary{font-size:1.3rem;font-weight:600}.faq__a p{font-size:1.08rem}
.ptab{font-size:1.1rem;font-weight:600}.ptabs__n{font-size:.86rem}
.reel__meta p{font-size:1.06rem}.reel__meta h2{font-size:clamp(1.6rem,1.25rem + 1.1vw,2.2rem)}
.ph--more{font-size:1.45rem;font-weight:600}
.cmp__lab{font-size:.74rem;font-weight:700;letter-spacing:.14em}
.crumbs{font-size:.84rem;font-weight:600;letter-spacing:.1em}
.chip{font-size:1rem;font-weight:600}
.price{font-weight:600}.tier h3{font-weight:600}
.grating small{font-size:.8rem;font-weight:600}.grating b{font-size:1.5rem}
.pill,.rv__src{letter-spacing:.04em}
/* Services menu: no dead gap between the label and the panel, and it stays open while the pointer crosses over */
.has-sub::after{content:"";position:absolute;left:0;right:0;top:100%;height:14px}
.has-sub.is-open .sub{display:grid}
/* header: a bigger logo with room around it */
:root{--hdr:88px}
.brand__img{height:66px}
.ftr .brand__img{height:64px}
@media(max-width:600px){:root{--hdr:72px}.brand__img{height:50px}}
.drawer__top .brand__img{height:50px}
/* proof bar: one quiet row, no boxes - marks and words sit on a single hairline band */
.proof{border-bottom:1px solid var(--line);border-top:1px solid var(--line);background:var(--paper)}
.proof__in{display:flex;justify-content:space-between;align-items:center;gap:clamp(12px,2vw,32px);padding:0 clamp(4px,1vw,16px)}
.proof__i{border-left:0;padding:16px 0;flex:1 1 0;justify-content:center;gap:14px}
.proof__i b{font-size:1.1rem;font-weight:600;line-height:1.15}
.proof__i em{font-size:.74rem;letter-spacing:.1em;margin-top:2px}
.proof__seal{width:52px;height:44px}
@media(max-width:900px){.proof__in{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}.proof__i{justify-content:flex-start;padding:12px 0}.proof__i b{font-size:1rem}}
/* hero: a stronger scrim on the left where the words sit, fading out to the right */
.hero__scrim{background:linear-gradient(90deg,rgba(30,25,21,.72) 0%,rgba(30,25,21,.5) 36%,rgba(30,25,21,.12) 70%,rgba(30,25,21,.05) 100%),linear-gradient(180deg,rgba(30,25,21,.05) 0%,rgba(30,25,21,0) 50%,rgba(30,25,21,.55) 100%)}
.hero h1,.hero .lede{text-shadow:0 1px 18px rgba(0,0,0,.25)}

/* ---- homepage redesign (home_v3, Oct 23 mockup) ---- */
.hero--v3{min-height:min(82vh,760px);display:flex;flex-direction:column;justify-content:center}
.hero--v3 .hero__in{padding-bottom:110px}
.hero__seals{position:absolute;left:0;right:0;bottom:0;background:rgba(24,18,13,.55);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-top:1px solid rgba(255,255,255,.14)}
.hseals{display:flex;justify-content:space-between;align-items:center;gap:clamp(12px,2vw,36px);padding:12px 0}
.hseal{display:flex;align-items:center;gap:12px;color:#fff;text-decoration:none;flex:1 1 0;justify-content:center}
.hseal b{display:block;font-size:1.02rem;font-weight:600;line-height:1.15}
.hseal em{display:block;font-style:normal;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.72);margin-top:2px;font-weight:600}
.hseal .proof__seal{width:44px;height:38px}
.hseal:hover b{color:var(--brass)}
@media(max-width:900px){.hero--v3 .hero__in{padding-bottom:150px}.hseals{display:grid;grid-template-columns:1fr 1fr;gap:6px 14px;padding:10px 0}.hseal{justify-content:flex-start}.hseal em{display:none}.hseal b{font-size:.92rem}}
.intro__in{display:grid;grid-template-columns:5fr 7fr;gap:clamp(28px,5vw,80px);align-items:start}
.intro__in h2{font-size:clamp(1.9rem,1.3rem + 1.9vw,2.9rem)}
.intro__txt p{font-size:1.2rem;line-height:1.55}
.intro__facts{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.5vw,36px);margin-top:28px;border-top:1px solid var(--line);padding-top:22px}
.intro__facts b{display:block;font-size:2.2rem;font-weight:600;line-height:1;color:var(--ink)}
.intro__facts span{display:block;font-size:.98rem;color:var(--ink-3);margin-top:6px;line-height:1.35}
@media(max-width:860px){.intro__in{grid-template-columns:1fr}.intro__facts{grid-template-columns:1fr 1fr 1fr;gap:12px}.intro__facts b{font-size:1.8rem}}
@media(max-width:520px){.intro__facts{grid-template-columns:1fr}}
.svcs{display:grid;grid-template-columns:5fr 7fr;gap:clamp(28px,5vw,80px);align-items:start}
.svcs__media{position:sticky;top:calc(var(--hdr) + 24px);aspect-ratio:4/5;overflow:hidden;border-radius:6px}
.svcs__media picture,.svcs__media img{width:100%;height:100%;object-fit:cover;display:block}
.svcrows{display:grid;border-top:1px solid var(--line);margin-top:8px}
.svcrow{display:grid;grid-template-columns:minmax(150px,1.1fr) 2fr auto 18px;gap:18px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line);color:inherit;text-decoration:none}
.svcrow__n{font-size:1.22rem;font-weight:600;color:var(--ink)}
.svcrow__d{font-size:1.02rem;color:var(--ink-2)}
.svcrow__p{font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;font-weight:600;color:var(--ink-3);white-space:nowrap}
.svcrow svg{width:16px;height:16px;color:var(--brass-ink);opacity:0;transition:opacity .2s,transform .2s}
.svcrow:hover svg{opacity:1;transform:translateX(3px)}
.svcrow:hover .svcrow__n{color:var(--brass-ink)}
@media(max-width:860px){.svcs{grid-template-columns:1fr}.svcs__media{position:static;aspect-ratio:16/10}.svcrow{grid-template-columns:1fr auto;gap:4px 12px}.svcrow__d{grid-column:1/-1;order:3}.svcrow svg{display:none}}
.fw .head{margin-bottom:22px}
.fw__wrap{position:relative;padding-left:var(--gut)}
.fw__track{overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;scrollbar-width:none;-webkit-overflow-scrolling:touch;cursor:grab;padding-right:var(--gut)}
.fw__track::-webkit-scrollbar{display:none}
.fw__strip{display:flex;gap:14px;width:max-content}
.fw__i{flex:none;width:clamp(240px,26vw,380px);display:block;color:inherit;text-decoration:none;scroll-snap-align:start}
.fw__i picture,.fw__i img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:4px;background:var(--stone)}
.fw__cap{display:flex;justify-content:space-between;gap:12px;padding:10px 2px 0;font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;font-weight:600;color:var(--ink-3)}
.fw__cap b{color:var(--ink);font-weight:600}
.fw .reel__arr--l{left:calc(var(--gut) + 8px)}.fw .reel__arr--r{right:12px}

/* build k: no sticky phone bar; the body no longer reserves room for it */
@media(max-width:900px){body{padding-bottom:0}}
/* What we build: photo as tall as the list */
.svcs{align-items:stretch}
.svcs__media{position:relative;top:auto;aspect-ratio:auto;height:100%;min-height:420px}
.svcs__media picture{position:absolute;inset:0}
@media(max-width:860px){.svcs__media{height:auto;min-height:0;aspect-ratio:16/10}.svcs__media picture{position:static}}
/* hero credentials on phones: one slim line you can slide, not a block of four */
@media(max-width:900px){.hero--v3 .hero__in{padding-bottom:92px}.hseals{display:flex;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;gap:22px;padding:10px 0;justify-content:flex-start}.hseals::-webkit-scrollbar{display:none}.hseal{flex:none;gap:9px}.hseal .proof__seal{width:30px;height:28px}.hseal b{font-size:.92rem;white-space:nowrap}.hseal em{display:none}}
/* videos (project walkthroughs, company video): 16:9 frame, poster first, click to load */
.vid{position:relative;aspect-ratio:16/9;background:#1a1410;border-radius:6px;overflow:hidden}
.vid video,.vid img,.vid iframe{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover;border:0}
.vid__play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:76px;height:76px;border-radius:50%;border:0;background:rgba(251,248,241,.94);color:var(--ink);display:grid;place-items:center;cursor:pointer;box-shadow:0 10px 30px -10px rgba(0,0,0,.5)}
.vid__play svg{width:30px;height:30px;margin-left:4px}
.vid__play:hover{background:#fff}
.vid__cap{font-size:1rem;color:var(--ink-3);margin:12px 0 0}

/* ---- build l (Oct 23, night) ---- */
/* lining figures everywhere: Cormorant's old-style numerals made phone numbers, license numbers and prices look uneven */
html{font-variant-numeric:lining-nums proportional-nums}
/* hero trust line: one size, one weight, even spacing */
.hero__trust{margin-top:28px;gap:10px 26px;font-size:.84rem;font-weight:600;letter-spacing:.12em;color:rgba(255,255,255,.82);align-items:center}
.hero__trust span{display:inline-flex;align-items:center;gap:.5em}.hero__trust b{font-weight:600;color:#fff;letter-spacing:.12em}
.hero__trust span + span::before{content:"";width:4px;height:4px;border-radius:50%;background:var(--brass);display:inline-block}
@media(max-width:600px){.hero__trust{font-size:.76rem;gap:8px 18px}}
/* home hero without the credentials strip */
.hero--v3-plain .hero__in{padding-bottom:0}
@media(max-width:900px){.hero--v3-plain .hero__in{padding-bottom:0}}
/* prices: bolder and darker wherever they appear */
.svcrow__p{font-size:.9rem;font-weight:700;color:var(--ink);letter-spacing:.06em}
.sub a span{font-size:.82rem;font-weight:700;color:var(--ink-2);letter-spacing:.04em;margin-top:3px}
.card__meta,.card__price,.svc__price{font-weight:700;color:var(--ink-2)}
.tier .price{font-weight:700}
/* a service page with a single matching project: one wide feature instead of a card in an empty grid */
.g1--feature .card{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:clamp(20px,3vw,44px);align-items:center}
.g1--feature .card__img{aspect-ratio:3/2}
.g1--feature .card__body{padding:0}
.g1--feature .card__body h3{font-size:clamp(1.5rem,1.2rem + 1vw,2rem)}
.g1--feature .card__body p{font-size:1.1rem}
@media(max-width:760px){.g1--feature .card{grid-template-columns:1fr}.g1--feature .card__body{padding:14px 0 0}}
.card__meta{font-size:.84rem;font-weight:700;color:var(--ink-2);letter-spacing:.06em}

/* ---- type pass (build l): one scale for the whole site, applied by role so sizes stop drifting ----
   label  = small uppercase, letter-spaced       .82rem / 600 / .12em
   price  = label, but heavier and darker        .88rem / 700 / .06em
   body-s = secondary sentence-case lines        1rem   / 500 / ink-3
   title  = names and row titles                 1.15rem/ 600
   body   = 1.16rem / 500, lede 1.3rem, h3 1.45rem, h2/h1 by clamp                                               */
.eyebrow,.mono,.step__n,.tl__body .step__n,.crumbs,.crumbs a,.tile__cap,.tile__cap b,.tile__cap span,.ph__cap,.gal figcaption,.fw__cap,.fw__cap b,.cred__i em,.proof__i em,.badge em,.hseal em,.infocard__hd,.infocard__bd .facts dt,.cmp__lab,.ptabs__n,.rnav__count,.pn small,.svcs__tag,.reel__meta .mono,.reel__meta .mono.n,.hero__trust,.hero__trust b,.ftr h2,.drawer__meta,.grating small,.th__top .mono,.lb__cap,.cmps figcaption,.gal__room span,.form__ok small,.pill,.chip--muted{font-family:var(--f-body);font-size:.82rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;font-style:normal}
.tile__cap b,.fw__cap b,.hero__trust b{color:var(--ink)}
.hero__trust,.hero__trust b{color:#fff}
.cred__i em,.proof__i em,.badge em,.hseal em,.gal figcaption,.ph__cap,.cmps figcaption,.gal__room span,.reel__meta .mono.n,.pn small,.crumbs,.crumbs a,.ptabs__n,.rnav__count,.infocard__bd .facts dt,.grating small,.drawer__meta{color:var(--ink-3)}
.eyebrow,.step__n,.tl__body .step__n,.ftr h2{color:var(--brass-ink)}
.sec--dark .eyebrow,.hero .eyebrow,.ftr h2{color:var(--brass)}
.ph__cap,.cmp__lab,.svcs__tag,.th__top .mono,.lb__cap{color:#fff}
.svcrow__p,.sub a span,.card__meta,.card__meta span{font-family:var(--f-body);font-size:.88rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2)}
.cdet__i small,.vid__cap,.form__note,.form__hint,.form__need,.form__err,.intro__facts span,.rv__who span,.rv blockquote,.visit__facts,.cdet__after,.muted,.faq__a p,.tl__body p,.cmt p,.promise__i p,.card p,.card__body p,.svcrow__d,.tier p,.reel__meta p,.infocard__bd .facts dd,.ftr,.ftr p,.ftr li,.note{font-size:1.02rem;font-weight:500;line-height:1.5}
.rv blockquote{font-size:1.08rem}
.cdet__i small,.form__note,.form__hint,.intro__facts span,.rv__who span,.vid__cap,.muted,.ftr p{color:var(--ink-3)}
.form__need,.form__err{color:#8A2E2E}
.cdet__i b,.cred__i b,.proof__i b,.badge b,.hseal b,.rv__who b,.svcrow__n,.pn b,.tier h3,.promise__i h3,.cmt h3,.tl__body h3,.card__body h3,.intro__facts b,.incl b,.checks b,.visit__facts address,.cdet__i,.cred__i{font-weight:600}
.cdet__i b,.cred__i b,.proof__i b,.badge b,.hseal b,.rv__who b,.svcrow__n,.pn b,.tier h3,.promise__i h3,.cmt h3,.tl__body h3,.card__body h3{font-size:1.18rem;line-height:1.25}
.faq summary{font-size:1.28rem;font-weight:600}
.intro__facts b{font-size:2.2rem}
h3{font-size:clamp(1.3rem,1.15rem + .6vw,1.6rem)}
.lede,.intro__txt p{font-size:clamp(1.22rem,1.1rem + .45vw,1.42rem)}
.tl__sub{font-size:1.1rem!important;font-weight:600}
.btn{font-size:1.05rem}
/* project page facts - the three candidate treatments (mockup, Oct 23) */
.pfacts{display:flex;flex-wrap:wrap;gap:10px 26px;align-items:center;padding:0 0 22px;margin:0 0 34px;border-bottom:1px solid var(--line);font-size:1.02rem;font-weight:600;color:var(--ink)}
.pfacts span{display:inline-flex;align-items:center;gap:26px}.pfacts span + span::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--brass-ink);display:inline-block}
.pstats{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2.5vw,40px);padding:22px 0;margin:0 0 36px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.pstats b{display:block;font-size:2rem;font-weight:600;line-height:1;color:var(--ink)}
.pstats span{display:block;font-size:.82rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);margin-top:8px}
@media(max-width:700px){.pstats{grid-template-columns:1fr 1fr;gap:16px}.pstats b{font-size:1.6rem}}
.prail{margin:0;display:grid;border-top:1px solid var(--line)}
.prail div{padding:14px 0;border-bottom:1px solid var(--line)}
.prail dt{font-size:.82rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);margin:0 0 4px}
.prail dd{margin:0;font-size:1.18rem;font-weight:600;color:var(--ink)}
@media(min-width:941px){.prail{margin-top:46px}}
.ptext{max-width:74ch}.ptext .body-w{max-width:none}
/* project pages: related links as one quiet line at the very bottom, above the footer */
.plinks{border-top:1px solid var(--line);background:var(--paper)}
.plinks .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px 28px;padding-top:18px;padding-bottom:18px}
.plinks__l{font-size:.82rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.plinks a{font-size:1.08rem;font-weight:600;color:var(--ink);text-decoration:none;display:inline-flex;align-items:center;gap:28px}
.plinks a + a::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--brass-ink);display:inline-block}
.plinks a:hover{color:var(--brass-ink)}
@media(max-width:600px){.plinks .wrap{flex-direction:column;gap:8px}.plinks a + a::before{display:none}}

/* ---------------------------------------------------------------- build n (Oct 23) */
/* What we build: two full-width photos stacked in the media column, no tag */
.svcs__media--2{display:grid;grid-template-rows:minmax(0,1fr) minmax(0,1fr);gap:10px;border-radius:0;overflow:visible}
.svcs__media--2 picture{position:relative;inset:auto;min-height:0;height:100%;overflow:hidden;border-radius:4px;background:var(--stone)}
@media(max-width:860px){.svcs__media--2{display:block;aspect-ratio:16/10}.svcs__media--2 picture{position:static;height:100%}.svcs__media--2 picture + picture{display:none}}
/* no tags on photos: the portfolio rows only mark before / in-progress shots, small, top left */
.ph__cap{display:none}
.ph__lab{position:absolute;left:10px;top:10px;font-family:var(--f-body);font-size:.74rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#fff;background:rgba(30,25,21,.62);padding:5px 9px;pointer-events:none}
/* the photos carry the Clarity mark bottom right: every crop keeps that corner whole */
.fw__i img,.tile__img img,.card__img img,.ph img,.gal img,.pn img,.svcs__media img,.split__media img,.cmp__box img{object-position:100% 100%}
/* Why the name: the lead on the left, the four commitments as one numbered list on the right */
.why__in{display:grid;grid-template-columns:5fr 7fr;gap:clamp(32px,6vw,110px);align-items:start}
.why__lead{position:sticky;top:calc(var(--hdr) + 32px)}
.why__lead h2{max-width:14ch}
.why__after{margin:26px 0 0;padding-top:18px;border-top:1px solid var(--line-dark);font-family:var(--f-body);font-size:.82rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--brass)}
.why__list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line-dark)}
.why__list li{display:grid;grid-template-columns:64px 1fr;gap:18px;padding:28px 0;border-bottom:1px solid var(--line-dark)}
.why__n{font-family:var(--f-body);font-size:1.02rem;font-weight:600;letter-spacing:.12em;color:var(--brass);padding-top:7px}
.why__list h3{color:var(--on-dark);font-size:clamp(1.3rem,1.15rem + .5vw,1.55rem);margin:0 0 8px;max-width:none}
.why__list p{color:var(--on-dark-2);font-size:1.06rem;margin:0;max-width:54ch}
@media(max-width:900px){.why__in{grid-template-columns:1fr;gap:26px}.why__lead{position:static}.why__after{display:none}.why__list li{grid-template-columns:44px 1fr;gap:12px;padding:20px 0}.why__list li:last-child{border-bottom:0}}
/* footer phone: same size family as the other footer text, one colour, lining figures */
.ftr__tel{font-family:var(--f-body);font-size:1.3rem;font-weight:600;letter-spacing:.01em;color:var(--on-dark);margin-bottom:10px;font-variant-numeric:lining-nums tabular-nums;text-decoration:none}
.ftr__tel:hover{color:var(--brass)}
.rtrack{scroll-padding-inline:var(--gut)}
/* header: no phone or button up top. On the home page the header sits on the hero photo, logo centred,
   menu beneath it; once the hero scrolls away the compact cream bar every other page has slides in. */
.hdr__cta{gap:0}
.pg-home .hdr{position:absolute;top:0;left:0;right:0;height:auto;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;border-bottom:0}
.pg-home .hdr::before{content:"";position:absolute;inset:0 0 auto 0;height:250px;background:linear-gradient(180deg,rgba(20,14,10,.6),rgba(20,14,10,0));pointer-events:none;z-index:-1}
.pg-home .hdr__in{display:flex;flex-direction:column;align-items:center;gap:6px;height:auto;padding:24px clamp(14px,1.6vw,24px) 12px;position:relative}
.pg-home .hdr .brand__img{height:118px}
.pg-home .hdr .brand__img--d{display:none}
.pg-home .nav>a,.pg-home .nav>.has-sub>a{color:rgba(255,255,255,.9);font-size:1.14rem;padding:.6rem .9rem}
.pg-home .nav>a:hover,.pg-home .nav>.has-sub:hover>a,.pg-home .nav a[aria-current=page]{color:#fff}
.pg-home .burger{color:#fff}
.pg-home .hdr__cta{position:absolute;right:clamp(14px,1.6vw,24px);top:50%;transform:translateY(-50%)}
.pg-home .hdr.stuck{position:fixed;height:var(--hdr);background:rgba(251,248,241,.96);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line);animation:hdrin .32s ease}
@keyframes hdrin{from{transform:translateY(-100%)}to{transform:none}}
.pg-home .hdr.stuck::before{display:none}
.pg-home .hdr.stuck .hdr__in{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:20px;height:100%;padding:0 clamp(14px,1.6vw,24px)}
.pg-home .hdr.stuck .brand__img{height:66px}
.pg-home .hdr.stuck .brand__img--d{display:block}.pg-home .hdr.stuck .brand__img--l{display:none}
.pg-home .hdr.stuck .nav>a,.pg-home .hdr.stuck .nav>.has-sub>a{color:var(--ink-2);font-size:1.1rem;padding:.6rem .75rem}
.pg-home .hdr.stuck .nav>a:hover,.pg-home .hdr.stuck .nav>.has-sub:hover>a,.pg-home .hdr.stuck .nav a[aria-current=page]{color:var(--ink)}
.pg-home .hdr.stuck .burger{color:inherit}
.pg-home .hdr.stuck .hdr__cta{position:static;transform:none}
.pg-home .hero--v3{min-height:min(94vh,880px);padding-top:196px}
.pg-home .hero__scrim{background:linear-gradient(90deg,rgba(30,25,21,.72) 0%,rgba(30,25,21,.5) 36%,rgba(30,25,21,.14) 70%,rgba(30,25,21,.08) 100%),linear-gradient(180deg,rgba(30,25,21,.3) 0%,rgba(30,25,21,0) 30%,rgba(30,25,21,.55) 100%)}
@media(max-width:1120px){.pg-home .hdr__in{flex-direction:row;justify-content:space-between;padding:14px clamp(14px,1.6vw,24px)}.pg-home .hdr .brand__img{height:68px}.pg-home .hdr__cta{position:static;transform:none}.pg-home .hero--v3{padding-top:104px}.pg-home .hdr.stuck .hdr__in{display:flex}}
@media(max-width:600px){.pg-home .hdr .brand__img{height:56px}.pg-home .hdr.stuck .brand__img{height:50px}.pg-home .hero--v3{padding-top:88px;min-height:min(82vh,700px)}}
/* ---- phone pass (Oct 23, build n) */
/* project pages: brief intro, then the photos. On phones the gallery is a two-column grid and the sliders are square */
.pbrief .wrap{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,5vw,80px);align-items:start}
.pbrief .pfacts{order:2;display:grid;grid-template-columns:1fr;gap:9px;border:0;padding:4px 0 0;margin:0;font-size:1.04rem}
.pbrief .pfacts span{gap:0}.pbrief .pfacts span + span::before{display:none}
.pbrief__p{order:1;margin:0;max-width:none;font-size:1.12rem}
@media(max-width:860px){.pbrief .wrap{grid-template-columns:1fr;gap:0}.pbrief .pfacts{order:1;padding-bottom:18px;margin-bottom:20px;border-bottom:1px solid var(--line)}.pbrief__p{order:2}}
@media(max-width:600px){.gal{grid-template-columns:1fr 1fr;gap:8px}.gal__room{grid-column:1/-1}.gal figure a{aspect-ratio:1/1;display:block;overflow:hidden}.gal figure a img{width:100%;height:100%;object-fit:cover}.gal figcaption{display:none}.cmp--p .cmp__box{aspect-ratio:1/1}.pbrief .pfacts{gap:7px;font-size:1rem}}
/* five steps on phones: the same centre line, step one left, step two right. The one-line summary carries the step; the detail stays on larger screens */
@media(max-width:700px){
.tl{padding:6px 0 2px}
.tl__line{left:50%;transform:translateX(-.5px)}
.tl__i{grid-template-columns:1fr 1fr;column-gap:30px;padding:0 0 26px}
.tl__dot{left:50%;transform:translateX(-50%)}
.tl__i--l .tl__body{grid-column:1;text-align:right}
.tl__i--l .tl__body p{margin-left:auto}
.tl__i--r .tl__body{grid-column:2;text-align:left}
.tl__body h3{font-size:1.12rem;margin:0 0 4px}
.tl__body .tl__sub{font-size:1rem!important;line-height:1.35}
.tl__body p:not(.tl__sub){font-size:.94rem;line-height:1.5;margin-top:6px}
.tl__body .step__n{font-size:.74rem;margin-bottom:4px}
}
/* footer on phones: centred, services and company side by side, cities in one wrapped line */
@media(max-width:760px){
.ftr{padding:40px 0 22px;text-align:center}
.ftr__grid{grid-template-columns:1fr 1fr;gap:28px 16px}
.ftr__grid>div:first-child,.ftr__grid>div:nth-child(4),.ftr__grid>div:nth-child(5){grid-column:1/-1}
.ftr .brand{justify-content:center;margin-bottom:14px}
.ftr__grid>div:first-child p{max-width:36ch;margin-inline:auto}
.ftr__lic{justify-content:center}
.ftr h2{margin-bottom:10px}
.ftr li{margin-bottom:7px}
.ftr__cities{columns:auto;display:flex;flex-wrap:wrap;justify-content:center;gap:4px 16px;max-width:34ch;margin-inline:auto}
.ftr__cities li{margin:0}
.ftr__bot{flex-direction:column;align-items:center;gap:6px;text-align:center;margin-top:30px;padding-top:18px}
}
/* home hero on phones: logo centred up top, the words down at the bottom left of a portrait crop of the photo */
@media(max-width:1120px){.pg-home .hdr__in{justify-content:center}.pg-home .hdr__cta{position:absolute;right:clamp(14px,1.6vw,24px);top:50%;transform:translateY(-50%)}.pg-home .hdr.stuck .hdr__in{justify-content:space-between}.pg-home .hdr.stuck .hdr__cta{position:static;transform:none}}
@media(max-width:700px){
.pg-home .hero--v3{min-height:0;height:min(100svh,186vw);max-height:860px;justify-content:flex-end;padding-top:0}
.pg-home .hero--v3 .hero__in{padding-bottom:30px}
.pg-home .hero--v3 .lede{font-size:1.04rem;max-width:33ch;margin-bottom:18px}
.pg-home .hero__scrim{background:linear-gradient(180deg,rgba(30,25,21,.42) 0%,rgba(30,25,21,0) 26%,rgba(30,25,21,0) 50%,rgba(30,25,21,.8) 100%)}
.pg-home .hdr::before{height:200px}
}
@media(max-width:600px){.pg-home .hdr .brand__img{height:62px}.pg-home .hdr__in{padding:16px 14px}.pg-home .hero--v3 h1{font-size:clamp(1.9rem,1.1rem + 4.6vw,2.4rem);margin-bottom:10px}}
/* intro facts on phones: three tidy rows, figure left, line right */
@media(max-width:520px){.intro__facts{grid-template-columns:1fr;gap:0;padding-top:0;margin-top:24px}.intro__facts div{display:grid;grid-template-columns:104px 1fr;align-items:baseline;gap:14px;padding:12px 0;border-bottom:1px solid var(--line)}.intro__facts b{font-size:1.7rem}.intro__facts span{margin-top:0;font-size:.98rem}}
/* contact band on phones: the two ways to reach us, then the form; the repeated promise line goes */
@media(max-width:700px){.cta__grid>div:first-child>p.muted{display:none}.ways{margin-bottom:4px}}
/* hero credentials line on phones: one line, no orphaned dot */
@media(max-width:600px){.hero__trust,.hero__trust b{font-size:.68rem;letter-spacing:.08em}.hero__trust{gap:6px 12px;margin-top:22px}.hero__trust span{gap:.4em}.hero__trust span + span::before{width:3px;height:3px}}
/* ---- build o (Oct 23): his notes on build n */
/* the menu sits in the true middle of the bar: equal side columns, logo at the start, burger at the end */
.hdr__in{grid-template-columns:1fr auto 1fr}
.hdr__in>.brand{justify-self:start}
.hdr__cta{justify-self:end}
.pg-home .hdr.stuck .hdr__in{grid-template-columns:1fr auto 1fr}
@media(max-width:1120px){.hdr__in{grid-template-columns:auto auto}}
/* footer phone: the same size as the rest of the footer, just heavier */
.ftr__tel{font-size:1.08rem;font-weight:700;letter-spacing:.02em;margin-bottom:8px}
/* home header carries the logo as drawn (mark over the words), bigger on phones too */
.pg-home .hdr .brand__img--l{height:192px;width:auto}
.pg-home .hdr__in{gap:4px;padding-top:22px;padding-bottom:10px}
.pg-home .hero--v3{padding-top:276px}
@media(max-width:1120px){.pg-home .hdr .brand__img--l{height:140px}.pg-home .hdr__in{padding:14px clamp(14px,1.6vw,24px) 10px}.pg-home .hero--v3{padding-top:170px}}
@media(max-width:600px){.pg-home .hdr .brand__img--l{height:134px}.pg-home .hdr__in{padding:14px 14px 8px}.pg-home .hdr::before{height:240px}.pg-home .hdr.stuck .brand__img{height:50px}}
/* intro facts on phones: three columns like the desktop, nothing boxed */
@media(max-width:520px){.intro__facts{grid-template-columns:1fr 1fr 1fr;gap:10px;padding-top:20px;margin-top:24px;border-top:1px solid var(--line);text-align:center}.intro__facts div{display:block;padding:0;border:0}.intro__facts b{font-size:1.5rem}.intro__facts span{margin-top:6px;font-size:.84rem;line-height:1.3}}
/* ratings: one card per platform under the reviews heading; a row on desktop, a slider on phones */
.ratings{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:0 0 26px}
.ratings .grating{display:flex;align-items:center;min-width:0}
.ratings .grating .mk{width:40px;height:40px;flex:none;border-radius:8px}
.ratings .grating__t{min-width:0}
.ratings .grating small{white-space:nowrap}
@media(max-width:1000px){.ratings{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.ratings{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;gap:10px;margin:0 calc(-1*var(--gut)) 22px;padding:4px var(--gut) 10px;scroll-padding-inline:var(--gut)}.ratings::-webkit-scrollbar{display:none}.ratings .grating{flex:none;width:min(70vw,250px);scroll-snap-align:start}}
/* phone menu: full-height panel sliding in, big links on hairlines, Services opens into its list (name + price), items settle in one after another */
.drawer{display:block;pointer-events:none}
.drawer__scrim{opacity:0;transition:opacity .3s ease}
.drawer__panel{width:min(440px,100vw);transform:translateX(100%);transition:transform .38s cubic-bezier(.22,.8,.3,1);padding:18px var(--gut) 28px;box-shadow:-20px 0 50px -30px rgba(30,25,21,.5)}
.drawer.open{pointer-events:auto}
.drawer.open .drawer__scrim{opacity:1}
.drawer.open .drawer__panel{transform:none}
.drawer__top{margin-bottom:8px}
.drawer__x{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;border:1px solid var(--line)}
.dnav{display:flex;flex-direction:column}
.drawer nav .dnav__a,.drawer .dnav__a{display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%;padding:15px 0;border:0;border-bottom:1px solid var(--line);background:none;font-family:var(--f-display);font-size:1.55rem;font-weight:600;color:var(--ink);text-decoration:none;text-align:left;cursor:pointer;line-height:1.1}
.dnav__a:hover,.dnav__t[aria-expanded=true]{color:var(--brass-ink)}
.dnav__t svg{width:20px;height:20px;transition:transform .32s ease;color:var(--brass-ink)}
.dnav__g.is-open .dnav__t svg{transform:rotate(180deg)}
.dnav__g.is-open .dnav__t{border-bottom-color:transparent}
.dnav__sub{display:grid;grid-template-rows:0fr;transition:grid-template-rows .36s ease}
.dnav__sub>div{overflow:hidden;visibility:hidden;transition:visibility 0s .36s}
.dnav__g.is-open .dnav__sub{grid-template-rows:1fr;border-bottom:1px solid var(--line)}
.dnav__g.is-open .dnav__sub>div{visibility:visible;transition:none;padding-bottom:10px}
.drawer nav .dnav__sub a{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:9px 0 9px 16px;border-bottom:0;font-family:var(--f-body);font-size:1.1rem;font-weight:600;color:var(--ink-2);text-decoration:none;border-left:2px solid var(--line)}
.drawer nav .dnav__sub a:hover{color:var(--ink);border-left-color:var(--brass)}
.drawer nav .dnav__sub a small{font-size:.8rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--brass-ink);white-space:nowrap}
.drawer__foot{padding-top:22px;gap:14px}
.drawer__tel{display:inline-flex;align-items:center;gap:10px;font-size:1.25rem;font-weight:600;color:var(--ink);text-decoration:none;justify-content:center}
.drawer__tel svg{width:18px;height:18px;color:var(--brass-ink)}
.drawer__meta{margin-top:0;text-align:center}
@media(prefers-reduced-motion:no-preference){
.drawer.open .dnav>*{animation:dIn .45s cubic-bezier(.22,.8,.3,1) both}
.drawer.open .dnav>*:nth-child(2){animation-delay:.05s}.drawer.open .dnav>*:nth-child(3){animation-delay:.1s}.drawer.open .dnav>*:nth-child(4){animation-delay:.15s}.drawer.open .dnav>*:nth-child(5){animation-delay:.2s}
.drawer.open .drawer__foot{animation:dIn .45s .25s cubic-bezier(.22,.8,.3,1) both}
@keyframes dIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
}