/* Brightwork Remodeling — v3.1 "Warm Gallery" (2026-08-29). Art direction: Brand Director + Website Experience Director (D-115.1/.2/.3); build: Atlas.
   Paper ground, white plates floating across seams, ink bands for gravity, brass as a visual system (seams, rules, numerals, buttons, active states).
   Type: Source Serif 4 (display, identity) · Instrument Sans (body/UI) · Source Serif 4 italic (quotes, numerals, signature). Title Case headings (D-029). */
@font-face{font-family:"Source Serif 4";src:url("/assets/fonts/ss4-var.woff2") format("woff2-variations");font-weight:400 600;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+2018-201D,U+2013-2014,U+00B7,U+2026}
@font-face{font-family:"Source Serif 4";src:url("/assets/fonts/ss4-italic.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap;unicode-range:U+0000-00FF,U+2018-201D,U+2013-2014,U+00B7,U+2026}
@font-face{font-family:"Instrument Sans";src:url("/assets/fonts/instrument-var.woff2") format("woff2-variations");font-weight:400 700;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+2018-201D,U+2013-2014,U+00B7,U+2026}
@font-face{font-family:"SS4 Fallback";src:local("Georgia"),local("Times New Roman");size-adjust:102%;ascent-override:75.5%;descent-override:24.5%;line-gap-override:0%}
@font-face{font-family:"IS Fallback";src:local("Helvetica Neue"),local("Arial");size-adjust:104%;ascent-override:93%;descent-override:24%;line-gap-override:0%}
:root{--cream:#F7F3EC;--cream2:#EFE9DE;--white:#FFFFFF;--plate:#FCFAF6;--sand:#E6DED0;--sand2:#D9CFBD;--ink:#1B2733;--ink-deep:#131B24;--ink2:#4A5560;--ink3:#5C6570;--brass:#B08A4E;--bronze:#7F6130;--brass-light:#D8AE6A;--brass-hover:#9E7B43;--ok:#2F6B4F;--error:#A63D2F;
--on-ink:#F7F3EC;--on-ink-2:rgba(247,243,236,.78);--on-ink-3:rgba(247,243,236,.6);--line-ink:rgba(247,243,236,.18);
--serif:"Source Serif 4","SS4 Fallback",Georgia,serif;--sans:"Instrument Sans","IS Fallback","Helvetica Neue",Arial,sans-serif;
--shadow-1:0 1px 2px rgba(27,39,51,.05),0 10px 28px -14px rgba(27,39,51,.14);--shadow-2:0 2px 4px rgba(27,39,51,.05),0 28px 48px -20px rgba(27,39,51,.24);--shadow-plate:0 1px 0 rgba(27,39,51,.04),0 18px 40px -18px rgba(27,39,51,.22);
--scrim-left:linear-gradient(90deg,rgba(27,39,51,.82) 0%,rgba(27,39,51,.6) 36%,rgba(27,39,51,.08) 68%,transparent 100%);--scrim-foot:linear-gradient(0deg,rgba(27,39,51,.32),transparent 34%);
--wrap:1280px;--pad:24px;--sec:clamp(64px,8vw,112px);--ease:cubic-bezier(.22,1,.36,1);--t-fast:220ms;--t-move:260ms;--t-reveal:750ms;--rv-y:18px;--stagger:110ms}
*{box-sizing:border-box;margin:0;padding:0}
/* D-199 (2026-09-11): html bg = footer's ink, not body's cream. Every page ends in the dark footer, so
   mobile Safari/Chrome's rubber-band overscroll past the bottom now bleeds dark instead of showing the
   browser's unset-white canvas as a jarring blank gap (owner-reported, screenshot-verified). */
html{-webkit-text-size-adjust:100%;scroll-padding-top:100px;background:var(--ink-deep)}
@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
main{overflow-x:clip}
body{font-family:var(--sans);font-size:17px;line-height:1.6;color:var(--ink);background:var(--cream);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
:focus-visible{outline:2px solid var(--brass);outline-offset:3px}
h1,h2,h3,.display{font-family:var(--serif);font-weight:500;font-optical-sizing:auto;letter-spacing:-.008em;text-wrap:balance}
h1{font-size:clamp(38px,4.6vw,56px);line-height:1.05;letter-spacing:-.012em}
.display{font-size:clamp(40px,4.9vw,64px);line-height:1.04;letter-spacing:-.012em}
h2{font-size:clamp(32px,3.6vw,44px);line-height:1.1;max-width:22ch}
h3{font-size:clamp(22px,2vw,26px);line-height:1.2}
.lead{font-size:clamp(18px,1.6vw,21px);line-height:1.5;color:var(--ink2);max-width:52ch}
.body p{max-width:64ch}.body p+p{margin-top:1em}
strong{font-weight:600}
p a,li a,dd a,cite a{text-decoration:none;background-image:linear-gradient(var(--brass),var(--brass));background-size:100% 1px;background-position:0 100%;background-repeat:no-repeat;transition:background-size .18s,color .18s}
p a:hover,li a:hover,dd a:hover,cite a:hover{color:var(--bronze);background-size:100% 2px}
.eyebrow{display:flex;align-items:center;gap:12px;font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--bronze)}
.eyebrow::before{content:"";width:24px;height:1.5px;background:var(--brass);flex:none;transform-origin:left}
.on-ink .eyebrow,.band .eyebrow{color:var(--brass)}
.chip{display:inline-block;transition:transform var(--t-move) var(--ease);font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);background:rgba(247,243,236,.94);padding:6px 10px;line-height:1.2}
.caption{font-family:var(--sans);font-size:13.5px;line-height:1.45;color:var(--ink3)}
.meta{font-family:var(--sans);font-size:13px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--ink3)}
.meta span+span::before{content:"·";margin:0 .5em}
.skip{position:absolute;left:-9999px;top:0;background:var(--ink);color:var(--cream);padding:12px 18px;z-index:300;text-decoration:none}
.skip:focus{left:0}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--pad)}
/* ---- Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:0 28px;background:var(--brass);color:var(--ink);font-family:var(--sans);font-size:15px;font-weight:600;letter-spacing:.01em;text-decoration:none;border:1.5px solid var(--brass);cursor:pointer;transition:background var(--t-fast),border-color var(--t-fast),color var(--t-fast),transform var(--t-move) var(--ease),box-shadow var(--t-move) var(--ease)}
.btn:hover{background:var(--ink);border-color:var(--ink);color:var(--cream);transform:translateY(-2px);box-shadow:0 10px 22px -10px rgba(27,39,51,.5)}
.btn:active{transform:scale(.985)}
.btn.outline{background:transparent;border-color:var(--ink);color:var(--ink)}
.btn.outline:hover{background:var(--ink);color:var(--cream);border-color:var(--ink)}
.on-ink .btn.outline{border-color:rgba(247,243,236,.6);color:var(--cream)}
.on-ink .btn.outline:hover{background:var(--cream);color:var(--ink)}
.btn.lg{min-height:54px;padding:0 32px}
.cta-row{display:flex;align-items:center;flex-wrap:wrap;gap:14px 24px;margin-top:28px}
.tel,.link{font-family:var(--sans);font-size:15px;font-weight:600;text-decoration:none;background-image:linear-gradient(var(--brass),var(--brass));background-size:100% 1px;background-position:0 100%;background-repeat:no-repeat;padding-bottom:2px;transition:color .18s,background-size .18s}
.tel:hover,.link:hover{color:var(--bronze);background-size:100% 2px}
.link.arrow::after{content:"→";margin-left:6px;display:inline-block;transition:transform var(--t-fast) var(--ease)}
.link.arrow:hover::after{transform:translateX(4px)}
.on-ink .tel,.on-ink .link{color:var(--cream)}
.reply{font-family:var(--sans);font-size:14px;color:var(--ink3);margin-top:14px}
/* ---- Header */
header.site{position:sticky;top:0;z-index:50;background:rgba(247,243,236,.96);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:box-shadow .22s}
header.site.scrolled{box-shadow:0 1px 0 var(--sand),0 8px 24px rgba(27,39,51,.06)}
header.site .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:80px}
header.site .logo{flex:none}
header.site .logo img{width:236px;height:auto}
@media(max-width:1100px){header.site nav{gap:18px}header.site nav a.tel span{display:none}header.site nav a.tel svg{width:18px;height:18px}header.site .logo img{width:200px}}
header.site nav{display:flex;align-items:center;gap:26px;font-size:15px;font-weight:500}
header.site nav a{text-decoration:none;padding:6px 0;border-bottom:2px solid transparent;white-space:nowrap;transition:border-color .18s,color .18s}
header.site nav a:not(.btn){position:relative}
header.site nav a:not(.btn)::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--brass);transform:scaleX(0);transform-origin:left;transition:transform var(--t-fast) var(--ease)}
header.site nav a:not(.btn):hover::after,header.site nav a[aria-current]::after{transform:scaleX(1)}
header.site nav a:hover{color:var(--bronze)}
header.site nav a.tel{display:inline-flex;align-items:center;gap:8px;font-weight:600;background:none;border-bottom:2px solid transparent;padding-bottom:6px}
header.site nav a.tel svg{width:15px;height:15px}
header.site nav .btn{min-height:44px;padding:0 20px;border-bottom:0}
header.site nav .btn:hover{color:var(--cream)}
.on-ink .btn:hover{background:var(--cream);border-color:var(--cream);color:var(--ink)}
header.site .phone-icon{display:none}
header.site nav a.nav-home{display:none}  /* mobile discoverability only: the logo stays the desktop route home */
/* ---- Hero: layered (default) */
.hero{position:relative;padding-top:24px;overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:repeat(12,1fr);align-items:center;max-width:none;padding-left:max(var(--pad),calc((100vw - var(--wrap)) / 2 + var(--pad)));padding-right:0}
.hero figure{grid-column:5/-1;grid-row:1;margin:0;position:relative;height:clamp(600px,78vh,740px)}
.hero figure img{width:100%;height:100%;object-fit:cover;object-position:55% 50%}
@media(max-width:1280px){.hero figure img{object-position:42% 50%}}
.hero figure .chip{position:absolute;right:24px;top:20px}
.hero figure::after{content:"";position:absolute;inset:auto 0 0 0;height:36%;background:var(--scrim-foot);pointer-events:none}
.hero .panel{grid-column:1/7;grid-row:1;z-index:2;background:var(--cream);padding:clamp(28px,3vw,40px);box-shadow:var(--shadow-plate);border-top:3px solid var(--brass);align-self:center;margin-bottom:112px}
.hero .panel .eyebrow{margin-bottom:18px}
.hero .display{margin-bottom:18px}
.hero .lead{max-width:44ch}
.hero .sig{font-family:var(--serif);font-style:italic;font-size:17px;color:var(--ink2);margin-top:14px}
.hero .cta-row{margin-top:24px}
/* Hero variant: classic (the owner's preferred original: full photograph, subtle veil, atmospheric fade into paper, transparent header) */
.hero.classic{padding:0;display:flex;align-items:center;justify-content:center;text-align:center;min-height:min(92svh,980px);color:var(--cream);background:var(--ink)}
.hero.classic figure{position:absolute;inset:0;margin:0;z-index:0;height:auto}
.hero.classic figure img{width:100%;height:100%;object-fit:cover;object-position:50% 50%}
.hero.classic::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(27,39,51,.44) 0%,rgba(27,39,51,.62) 14%,rgba(27,39,51,.72) 26%,rgba(27,39,51,.72) 66%,rgba(27,39,51,.40) 84%,rgba(27,39,51,.18) 100%)}
.hero.classic::after{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(180deg,rgba(247,243,236,0) 80%,rgba(247,243,236,.55) 93%,var(--cream) 100%)}
.hero.classic .wrap{display:block;position:relative;z-index:3;padding:150px var(--pad) 150px;max-width:var(--wrap)}
.hero.classic .panel{background:none;box-shadow:none;border:0;padding:0;margin:0 auto;max-width:860px;text-align:center}
.hero.classic .eyebrow{justify-content:center;color:var(--brass);margin-bottom:18px}
.hero.classic .display{color:var(--cream);margin:0 auto 24px;max-width:860px;font-weight:560;line-height:1.08;letter-spacing:-.01em}
.hero.classic .lead{color:#E7E0D2;margin:0 auto;max-width:600px}
.hero.classic .sig{color:#D9D2C4;margin-top:14px}
.hero.classic .cta-row{justify-content:center}
.hero.classic .tel{color:var(--cream)}
.hero.classic .btn:hover{background:var(--cream);border-color:var(--cream);color:var(--ink)}
.hero.classic .btn.outline{border-color:rgba(247,243,236,.7);color:var(--cream)}
.hero.classic .btn.outline:hover{background:var(--cream);color:var(--ink);border-color:var(--cream)}
.hero.classic .reply{color:rgba(247,243,236,.72)}
/* Hero entrance: html.hero-motion is set by a 90-byte inline head script before first paint (reduced-motion gated), so the copy never paints then jumps back. Transform/opacity only; the LCP image is never opacity-animated. */
html.hero-motion .hero.classic .panel>*{animation:rise-in var(--t-reveal) var(--ease) both}
html.hero-motion .hero.classic .panel>:nth-child(2){animation-delay:.08s}html.hero-motion .hero.classic .panel>:nth-child(3){animation-delay:.16s}html.hero-motion .hero.classic .panel>:nth-child(4){animation-delay:.22s}html.hero-motion .hero.classic .panel>:nth-child(5){animation-delay:.30s}html.hero-motion .hero.classic .panel>:nth-child(6){animation-delay:.38s}
html.hero-motion .hero.classic .panel{animation:none}
html.hero-motion .hero.classic .eyebrow::before{transform-origin:left;animation:drawx .45s var(--ease) .25s both}
html.hero-motion .hero.classic figure img{animation:atmos 1.2s var(--ease) both}
html.hero-motion .facts-card{animation:risefade var(--t-reveal) var(--ease) .35s both}
html.hero-motion .facts-card::before{animation:drawx .5s var(--ease) .6s both}
body.has-hero header.site{position:fixed;left:0;right:0;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;border-bottom:0;box-shadow:none}
body.has-hero header.site .logo-rev{display:block}body.has-hero header.site .logo-std{display:none}
.logo-rev{display:none}
body.has-hero header.site:not(.scrolled) nav a:not(.btn){color:var(--cream)}
body.has-hero header.site:not(.scrolled) nav a:hover{color:var(--brass-light)}
body.has-hero header.site:not(.scrolled) nav a[aria-current]::after{background:var(--brass-light)}
body.has-hero header.site.scrolled{background:rgba(247,243,236,.96);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
body.has-hero header.site.scrolled .logo-rev{display:none}body.has-hero header.site.scrolled .logo-std{display:block}
/* facts card overlapping the hero edge */
.facts-card{position:relative;z-index:3;margin-top:-80px;background:var(--white);border:1px solid var(--sand);box-shadow:0 2px 4px rgba(27,39,51,.06),0 28px 56px -24px rgba(27,39,51,.38);display:grid;grid-template-columns:1fr 1.35fr 1fr 1.35fr}
.facts-card::before{content:"";position:absolute;left:-1px;right:-1px;top:-1px;height:3px;background:var(--brass);transform-origin:50%}
.facts-card li{list-style:none;padding:20px 24px;border-right:1px solid var(--sand)}
.facts-card li:last-child{border-right:0}
.facts-card strong{display:block;font-family:var(--serif);font-weight:500;font-size:17px;line-height:1.25;margin-bottom:6px;text-wrap:balance}
.facts-card span{display:block;font-size:13.5px;line-height:1.45;color:var(--ink2)}
.facts-card .proofcell span{font-family:var(--serif);font-style:italic;font-size:14.5px;color:var(--ink)}
.facts-card .proofcell small{display:block;font-family:var(--sans);font-size:11.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink3);margin-top:8px;font-style:normal}
.hero.classic + .wrap{padding-bottom:32px}
.sec.after-hero{padding-top:80px}
/* Hero variant: split (v3.0) */
.hero.split .wrap{grid-template-columns:6fr 6fr;column-gap:56px;align-items:stretch;padding-right:0}
.hero.split figure{grid-column:2;grid-row:1;height:auto;min-height:560px}
.hero.split .panel{grid-column:1;grid-row:1;box-shadow:none;border-top:0;background:none;padding:0;margin:0;align-self:center}
/* Hero variant: immersive (full-bleed + restrained overlay) */
.hero.immersive{padding-top:0}
.hero.immersive .wrap{display:block}
.hero.immersive figure{margin:0;height:clamp(560px,84vh,760px);width:100%}
.hero.immersive figure::after{height:100%;background:var(--scrim-left)}
.hero.immersive figure .chip{display:none}
.hero.immersive .panel{position:absolute;inset:0;background:none;box-shadow:none;border:0;margin:0;padding:0;display:flex;align-items:center;z-index:2}
.hero.immersive .panel .in{max-width:var(--wrap);margin:0 auto;padding:0 var(--pad);width:100%}
.hero.immersive .panel .in>*{max-width:560px}
.hero.immersive .display,.hero.immersive .lead,.hero.immersive .sig,.hero.immersive .reply{color:var(--cream)}
.hero.immersive .lead{color:var(--on-ink-2)}
.hero.immersive .eyebrow{color:var(--brass)}
.hero.immersive .tel{color:var(--cream)}
.hero.immersive .btn.outline{border-color:rgba(247,243,236,.6);color:var(--cream)}
/* ---- Sections */
.sec{padding:var(--sec) 0}
.sec.white{background:var(--white)}
.sec.cream2{background:var(--cream2)}
.sec.ink{background:var(--ink);color:var(--cream)}
.head{display:grid;grid-template-columns:5fr 7fr;column-gap:64px;row-gap:14px;margin-bottom:clamp(36px,4vw,56px);align-items:end}
.head .eyebrow{grid-column:1/-1;margin-bottom:6px}
.head h2{grid-column:1}
.head .deck{grid-column:2;font-size:clamp(17px,1.5vw,19px);line-height:1.55;color:var(--ink2);max-width:52ch}
.on-ink .head .deck,.sec.ink .head .deck{color:var(--on-ink-2)}
.head.single{grid-template-columns:1fr}.head.single .deck{grid-column:1}
/* ---- Pillars */
.pillars-grid{display:grid;grid-template-columns:5fr 7fr;column-gap:64px;align-items:start}
.pillars{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:20px}
.pillars.row4{grid-template-columns:repeat(4,1fr)}
.pillars li{background:var(--plate);border:1px solid var(--sand);padding:26px 26px 28px;position:relative}
.pillars li::before{content:"";display:block;width:24px;height:2px;background:var(--brass);margin-bottom:18px;transform-origin:left}
.pillars h3{font-size:22px;margin-bottom:10px}
.pillars p{color:var(--ink2);font-size:15.5px;line-height:1.55}
/* ---- Service cards */
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.card{position:relative;background:var(--white);border:1px solid var(--sand);box-shadow:var(--shadow-1);transform:translateY(var(--hover-y,0px));transition:transform var(--t-move) var(--ease),box-shadow var(--t-move) var(--ease),border-color var(--t-move)}
a.card:not(.quiet)::after{content:"";position:absolute;left:-1px;right:-1px;top:-1px;height:3px;background:var(--brass);transform:scaleX(0);transform-origin:left;transition:transform var(--t-move) var(--ease);pointer-events:none}
a.card{display:block;text-decoration:none;background-image:none}
.card a.ph{display:block}.card h3 a{text-decoration:none;background-image:none}
@media(hover:hover){a.card:hover,.card:hover{--hover-y:-6px;box-shadow:var(--shadow-2);border-color:var(--sand2)}a.card:hover .ph img,.card:hover .ph img{--zoom:1.03}a.card:hover .link{color:var(--bronze)}a.card:not(.quiet):hover::after{transform:scaleX(1)}}
.card .ph{overflow:hidden;aspect-ratio:4/3;background:var(--cream2)}
.card .ph{position:relative;--curtain:var(--white)}
.card .ph img{width:100%;height:100%;object-fit:cover;transform:scale(var(--zoom,1));transition:transform var(--t-reveal) var(--ease)}
.card .bd{padding:24px 26px 26px}
.card h3{font-size:22px;margin-bottom:8px}
.card .pov{font-size:15.5px;line-height:1.55;color:var(--ink2)}
.card .link{display:inline-block;margin-top:14px;font-size:14px}
.card.quiet{grid-column:1/-1;background:var(--cream2);border-color:var(--sand);box-shadow:none;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px 40px;padding:26px 30px}
.card.quiet::before{content:"";width:24px;height:2px;background:var(--brass);transform-origin:left}
.card.quiet h3{margin:0}
.card.quiet .pov{max-width:60ch}
.card.quiet .link{margin:0;white-space:nowrap}
.card .sub{display:block;margin-top:10px;font-size:14px}
/* ---- Mosaic */
.mosaic{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:236px;gap:22px}
.mosaic a{position:relative;display:block;overflow:hidden;background:var(--cream2);text-decoration:none;background-image:none}
.mosaic a img{width:100%;height:100%;object-fit:cover;transform:scale(var(--zoom,1));transition:transform var(--t-reveal) var(--ease)}
.mosaic a::before,.tiles figure::before{content:"";position:absolute;inset:12px;z-index:2;border:1px solid var(--brass);opacity:0;transform:scale(.97);transition:opacity var(--t-move) var(--ease),transform var(--t-move) var(--ease);pointer-events:none}
@media(hover:hover){.mosaic a:hover img,.tiles figure:hover img{--zoom:1.03}.mosaic a:hover::before,.tiles figure:hover::before{opacity:.9;transform:none}.mosaic a:hover .chip,.tiles figure:hover .chip{transform:translateY(-3px)}}
.mosaic a .chip{position:absolute;left:16px;bottom:16px;z-index:3}
.sec.cream2 .mosaic,.sec.cream2 .tiles,.sec.cream2 .row figure{--curtain:var(--cream2)}
.mosaic .lead-tile{grid-column:span 2;grid-row:span 2}
.mosaic .tall{grid-row:span 2}
.mosaic .wide{grid-column:span 2}
.more{margin-top:36px}
/* ---- Process rail (ink) */
.sec.process{padding-bottom:var(--sec)}
.rail{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:0 40px;position:relative;padding-top:28px}
.rail::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--line-ink);transform-origin:left}
.rail li{position:relative}
.rail li::before{content:"";position:absolute;left:0;top:-34px;width:12px;height:12px;background:var(--brass)}
.rail .num{font-family:var(--serif);font-style:italic;font-size:44px;line-height:1;color:var(--brass);display:block;margin-bottom:14px}
.rail h3{font-size:24px;color:var(--cream);margin-bottom:10px}
.rail p{color:var(--on-ink-2);font-size:15.5px;line-height:1.55}
.rail .have{margin-top:14px;padding-top:12px;border-top:1px solid var(--line-ink);font-size:13.5px;color:var(--on-ink-2)}
.rail .have span{font-weight:600;letter-spacing:.1em;text-transform:uppercase;font-size:11.5px;color:var(--brass);margin-right:6px}
.rail.compact .num{font-size:34px}.rail.compact h3{font-size:20px}.rail.compact p{font-size:15px}
.after{margin-top:36px;max-width:64ch;color:var(--on-ink-2)}
.sec.ink .after a{color:var(--cream)}
/* ---- Proof */
.sec.proof{padding-top:var(--sec)}
.reviews{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;position:relative;z-index:2}
.review{position:relative;background:var(--white);border:1px solid var(--sand);border-top:3px solid var(--brass);box-shadow:var(--shadow-plate);padding:30px 30px 28px;display:flex;flex-direction:column}
.stars{display:flex;gap:3px;margin-bottom:14px}
.stars svg{width:13px;height:13px;fill:var(--brass-light)}
.review blockquote{margin:0;flex:1}
.review blockquote p{font-family:var(--serif);font-style:italic;font-size:20px;line-height:1.4;text-wrap:pretty}
.review cite{display:block;font-style:normal;font-size:12.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink3);margin-top:18px}
.review cite a{color:var(--ink);background-size:100% 1px}
.proof-row{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:24px}
.tt{background:var(--white);border:1px solid var(--sand);padding:22px 26px;display:grid;grid-template-columns:auto 1fr auto;gap:8px 20px;align-items:center;min-height:96px}
.tt .stars{margin:0}.tt .stars:not(.on){display:none}
.tt .stars svg.off{fill:none;stroke:var(--sand2);stroke-width:1.5}
.tt .line{font-weight:600;font-size:15px}
.tt .lnk{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-size:14px;font-weight:600;white-space:nowrap}
.tt .lnk img{width:86px;height:13px}
.tt .note{grid-column:1/-1;font-size:13px;color:var(--ink3)}
.gplate{background:var(--white);border:1px solid var(--sand);padding:22px 26px;display:flex;flex-direction:column;justify-content:center;gap:6px}
.gplate strong{font-family:var(--serif);font-weight:500;font-size:18px}
.gplate .caption{margin-top:0}
.creds{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:24px}
.cred{background:var(--plate);border:1px solid var(--sand);padding:24px 26px}
.cred::before{content:"";display:block;width:24px;height:2px;background:var(--brass);margin-bottom:16px;transform-origin:left}
.cred h3{font-size:20px;margin-bottom:8px}
.cred p{font-size:15px;color:var(--ink2);line-height:1.5}
.capline{margin-top:24px}
/* ---- Photo band (where we work) */
.photo-band{position:relative;min-height:520px;display:flex;align-items:center;overflow:hidden;color:var(--cream)}
.photo-band img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:60% 50%}
.photo-band::after{content:"";position:absolute;inset:0;background:var(--scrim-left)}
.photo-band .wrap{position:relative;z-index:2;padding-top:72px;padding-bottom:72px}
.photo-band h2{color:var(--cream);max-width:18ch}
.photo-band .plate-t{position:relative;background:var(--cream);color:var(--ink);border-top:3px solid var(--brass);box-shadow:var(--shadow-plate);padding:clamp(28px,3vw,44px);max-width:640px}
.photo-band .plate-t h2{color:var(--ink);max-width:16ch}
.photo-band .towns{margin-top:18px;font-size:15px;line-height:1.6;color:var(--ink2)}
.photo-band .towns strong{color:var(--ink);font-weight:500}
.photo-band::after{background:linear-gradient(90deg,rgba(27,39,51,.28) 0%,rgba(27,39,51,.12) 50%,rgba(27,39,51,.04) 100%)}
/* ---- Closing plate */
.closing-sec{padding:var(--sec) 0}
.plate-cta{position:relative;background:var(--white);border:1px solid var(--sand);border-top:3px solid var(--brass);box-shadow:var(--shadow-plate);padding:clamp(32px,4vw,56px);display:grid;grid-template-columns:7fr 5fr;gap:48px;align-items:center}
.plate-cta h2{max-width:20ch}
.plate-cta .lead{margin-top:14px;max-width:48ch}
.plate-cta .rows{list-style:none;border-left:1px solid var(--sand);padding-left:40px}
.plate-cta .rows li{display:flex;gap:12px;align-items:flex-start;padding:10px 0;font-size:15px}
.plate-cta .rows svg{width:16px;height:16px;flex:none;margin-top:4px;color:var(--brass)}
.plate-cta .rows a{text-decoration:none;font-weight:600}
.plate-cta .rows small{display:block;color:var(--ink3);font-size:13px}
/* ---- Service page top */
.top{padding-top:0;position:relative}
.top .wrap{display:grid;grid-template-columns:6fr 6fr;gap:clamp(32px,4vw,64px);align-items:start}
.top .copy{padding-top:clamp(40px,5vw,64px);padding-bottom:40px}
.top .breadcrumb{font-size:12.5px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--ink3);margin-bottom:22px}
.top .breadcrumb ol{list-style:none;display:flex;flex-wrap:wrap}
.top .breadcrumb a{text-decoration:none}
.top .breadcrumb li+li::before{content:"/";margin:0 .6em;color:var(--sand2)}
.top .breadcrumb li[aria-current]{color:var(--bronze);font-weight:600}  /* the page label is a brand label, sibling to .eyebrow — not navigation chrome */
.top h1{margin-bottom:18px}
.top .lead-result{font-family:var(--serif);font-size:clamp(22px,2.3vw,28px);line-height:1.25;font-weight:500;max-width:22ch;margin-bottom:16px}
.top .deck{color:var(--ink2);font-size:18px;line-height:1.55;max-width:54ch}
.top .plate-wrap{position:relative;margin-right:calc(-1 * (max(0px,(100vw - var(--wrap)) / 2) + var(--pad)))}
.top .plate-wrap img{width:100%;height:auto;aspect-ratio:4/5;max-height:680px;object-fit:cover}
.top .plate-wrap.land img{aspect-ratio:3/2;max-height:none}
.top .plate-wrap .chip{position:absolute;left:20px;top:20px}
.minifacts{list-style:none;position:absolute;left:-56px;bottom:-32px;width:min(560px,70%);background:var(--white);border:1px solid var(--sand);border-top:3px solid var(--brass);box-shadow:var(--shadow-plate);display:grid;grid-template-columns:repeat(3,1fr);z-index:2}
.minifacts li{padding:16px 18px;border-right:1px solid var(--sand);font-size:13px;line-height:1.35}
.minifacts li:last-child{border-right:0}
.minifacts strong{display:block;font-family:var(--serif);font-weight:500;font-size:15px;margin-bottom:4px}
.top.single .wrap{grid-template-columns:1fr}
.top.single .lead-result{max-width:30ch}
.method{display:grid;grid-template-columns:7fr 5fr;gap:clamp(32px,4vw,64px);align-items:start}
.method h2{font-size:clamp(24px,2.2vw,28px);margin-bottom:12px;max-width:none}
.method .blk+.blk{margin-top:36px}
.method p{max-width:56ch}
.method .ph2 img{width:100%;aspect-ratio:3/2;object-fit:cover}
.method .ph2 .caption{margin-top:10px}
.method.single{grid-template-columns:1fr}
.method.single>div{display:grid;grid-template-columns:1fr 1fr;gap:48px}
.method.single .blk+.blk{margin-top:0}
.scope{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:12px 40px}
.scope li{position:relative;padding-left:22px;font-size:16px;line-height:1.5;max-width:52ch}
.scope li::before{content:"";position:absolute;left:0;top:10px;width:8px;height:8px;background:var(--brass)}
.products{font-size:14px;color:var(--ink3);margin-top:28px}
.home-rules{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:0 40px}
.home-rules li{position:relative;padding:14px 0 14px 22px;border-bottom:1px solid var(--sand)}
.home-rules li::before{content:"";position:absolute;left:0;top:22px;width:8px;height:8px;background:var(--brass)}
.faq{border-top:1px solid var(--sand)}
.faq div{padding:22px 0;border-bottom:1px solid var(--sand)}
.faq dt{font-family:var(--serif);font-size:22px;font-weight:500;margin-bottom:8px;max-width:40ch}
.faq dd{color:var(--ink2);max-width:64ch}
.closing-grid{display:grid;grid-template-columns:5fr 7fr;gap:clamp(32px,4vw,64px);align-items:center}
.closing-grid .review{border:1px solid var(--sand);background:var(--plate);box-shadow:none}
.closing{font-family:var(--serif);font-size:clamp(22px,2.2vw,28px);line-height:1.3;font-weight:500;max-width:26ch}
/* ---- Hub rows */
.rows{display:grid;gap:clamp(56px,7vw,96px)}
.row{display:grid;grid-template-columns:repeat(12,1fr);align-items:center}
.row figure{grid-column:1/8;grid-row:1;margin:0}
.row figure img{width:100%;aspect-ratio:4/5;max-height:600px;object-fit:cover;transform:scale(var(--zoom,1));transition:transform var(--t-reveal) var(--ease)}
.row .plate{position:relative;grid-column:7/13;grid-row:1;z-index:2;background:var(--white);border:1px solid var(--sand);border-top:3px solid var(--brass);box-shadow:var(--shadow-plate);padding:clamp(28px,3vw,44px)}
.row.alt figure{grid-column:6/13}
.row.alt .plate{grid-column:1/7}
.row h2{font-size:clamp(28px,3vw,36px);margin:10px 0 14px}
.row p{color:var(--ink2);max-width:46ch}
.row .links{margin-top:22px;display:flex;flex-wrap:wrap;gap:14px 24px;align-items:center}
.row.compact{display:block}
.row.compact .plate{background:var(--cream2);border-top:3px solid var(--brass);box-shadow:none}
.row .caption{margin-top:10px}
@media(min-width:901px){.row .plate .caption{display:none}}
/* ---- Our work groups */
.subnav{position:sticky;top:80px;z-index:40;background:rgba(247,243,236,.96);backdrop-filter:blur(8px);border-bottom:1px solid var(--sand)}
.subnav ul{list-style:none;display:flex;gap:28px;overflow-x:auto;padding:14px 0;font-family:var(--sans);font-size:12.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;scrollbar-width:none}
.subnav ul::-webkit-scrollbar{display:none}
.subnav a{text-decoration:none;white-space:nowrap;padding-bottom:4px;border-bottom:2px solid transparent}
.subnav a:hover{border-bottom-color:var(--brass)}
.subnav a,.top .breadcrumb a{display:inline-block;padding:6px 0;margin:-6px 0}
.group{scroll-margin-top:140px}
.group+.group{margin-top:clamp(64px,8vw,112px)}
.group .head{margin-bottom:28px}
.group .chips{margin-top:8px}
.group .prov{font-size:13.5px;color:var(--ink3);margin-top:10px}
.tiles{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:220px;gap:20px;grid-auto-flow:dense}
.tiles figure{margin:0;position:relative;overflow:hidden;background:var(--cream2)}
.tiles figure a{display:block;height:100%;text-decoration:none;background-image:none}
.tiles img{width:100%;height:100%;object-fit:cover;transform:scale(var(--zoom,1));transition:transform var(--t-reveal) var(--ease)}
.tiles .chip{position:absolute;left:14px;bottom:14px;z-index:3}
.tiles .lead-tile{grid-column:span 2;grid-row:span 2}
.tiles .tall{grid-row:span 2}
.tiles .wide{grid-column:span 2}
.tiles.one{grid-template-columns:1fr 1fr;grid-auto-rows:300px}
.tiles.two{grid-template-columns:1fr 1fr}
dialog.lb{border:0;padding:0;background:transparent;max-width:min(96vw,1400px);max-height:96vh;opacity:0;transition:opacity .24s}
dialog.lb.open{opacity:1}
dialog.lb::backdrop{background:rgba(19,27,36,.94)}
dialog.lb figure{margin:0}
dialog.lb img{max-height:86vh;width:auto;max-width:96vw;transform:scale(.97);transition:transform .32s var(--ease)}
dialog.lb.open img{transform:none}
dialog.lb figcaption{color:var(--cream);text-align:center;margin-top:12px;font-size:14px}
dialog.lb button{position:fixed;top:16px;right:16px;background:var(--cream);color:var(--ink);border:0;width:44px;height:44px;font-size:22px;cursor:pointer;font-family:var(--sans)}
/* ---- About */
.about-top{display:grid;grid-template-columns:7fr 5fr;gap:clamp(32px,4vw,64px);align-items:start}
.about-top figure{margin:0;margin-right:calc(-1 * (max(0px,(100vw - var(--wrap)) / 2) + var(--pad)))}
.about-top figure img{width:100%;aspect-ratio:4/5;max-height:640px;object-fit:cover}
/* D-199 (2026-09-11): the wordmark plate reuses .about-top's photo figure slot but is a logo, not a
   photo -- it must never take the 4:5/3:2 photo crop or object-fit:cover (which blew the wordmark up
   and cut off its edges, caught on visual QA before this shipped). Specificity (0,2,2) beats both the
   base and mobile-breakpoint photo rules regardless of source order. */
.about-top figure.about-wordmark-plate img{width:70%;height:auto;aspect-ratio:auto;max-width:360px;max-height:none;object-fit:contain}
.founder-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,4vw,64px);align-items:start}
.nameplate{background:var(--white);border:1px solid var(--sand);border-top:3px solid var(--brass);padding:22px 26px;margin-top:24px;display:inline-block;min-width:280px}
.nameplate .name{font-family:var(--serif);font-size:24px;font-weight:500}
.nameplate .role{font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--bronze);margin-top:4px}
.nameplate .hic{font-size:13px;color:var(--ink3);margin-top:8px}
.plate img{width:100%;aspect-ratio:3/2;object-fit:cover}
.believe{list-style:none}
.believe li{position:relative;font-family:var(--serif);font-size:clamp(20px,2vw,24px);font-weight:500;padding:16px 0 16px 28px;border-bottom:1px solid var(--sand)}
.believe li::before{content:"";position:absolute;left:0;top:26px;width:10px;height:10px;background:var(--brass)}
.steps{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:0 48px}
.steps li{position:relative;padding:22px 0 22px 64px;border-top:1px solid var(--line-ink)}
.steps li .num{position:absolute;left:0;top:24px;font-family:var(--serif);font-style:italic;color:var(--brass);font-size:26px}
.steps h3{font-size:22px;margin-bottom:6px;color:var(--cream)}
.steps p{color:var(--on-ink-2);max-width:52ch}
/* ---- Contact */
.contact-grid{display:grid;grid-template-columns:7fr 5fr;gap:clamp(28px,4vw,56px);align-items:start}
.form-card{background:var(--white);border:1px solid var(--sand);border-top:3px solid var(--brass);box-shadow:var(--shadow-1);padding:clamp(24px,3vw,40px)}
.form label{display:block;font-size:14px;font-weight:600;margin:22px 0 8px}
.form label:first-of-type{margin-top:0}
.form .help{font-size:13.5px;color:var(--ink3);margin-top:6px}
.form input,.form select,.form textarea{width:100%;font-family:var(--sans);font-size:16px;padding:0 14px;min-height:50px;border:1px solid var(--sand2);background:var(--white);color:var(--ink);border-radius:0;-webkit-appearance:none;appearance:none;transition:border-color .18s}
.form input:hover,.form select:hover,.form textarea:hover{border-color:var(--ink2)}
.form select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%23B08A4E' stroke-width='1.6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:40px}
.form textarea{min-height:150px;padding:14px;line-height:1.5}
.form input:focus,.form select:focus,.form textarea:focus{outline:2px solid var(--brass);outline-offset:2px;border-color:var(--ink)}
.form .chain{margin:28px 0 0;padding:20px 22px;background:var(--cream);border-left:3px solid var(--brass);font-size:14px;color:var(--ink2)}
.form .chain strong{display:block;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--bronze);margin-bottom:10px}
.form .chain ol{list-style:none}
.form .chain li{position:relative;padding-left:20px}
.form .chain li::before{content:"";position:absolute;left:0;top:9px;width:7px;height:7px;background:var(--brass)}
.form .chain li+li{margin-top:6px}
.form .btn{margin-top:24px;width:100%}
.form .fine{font-size:13px;color:var(--ink3);margin-top:14px}
.aside{background:var(--cream2);border:1px solid var(--sand);padding:clamp(24px,3vw,36px)}
.aside h2{font-size:26px;margin:8px 0 12px}
.aside p{max-width:44ch}
.rows-c{list-style:none;margin-top:18px}
.rows-c li{display:flex;gap:12px;align-items:flex-start;padding:12px 0;border-top:1px solid var(--sand);font-size:15px}
.rows-c svg{width:16px;height:16px;flex:none;margin-top:3px;color:var(--brass)}
.rows-c a{text-decoration:none;font-weight:600}
.aside h3{font-size:22px;margin:32px 0 10px}
.aside .small{font-size:14px;color:var(--ink3)}
.m-only{display:none;font-size:15px;font-weight:600;margin-top:16px}
.thanks-page main .wrap{max-width:760px}
.simple .wrap{max-width:760px}.simple h2{font-size:24px;margin:32px 0 10px}
/* ---- Footer */
footer.site{background:var(--ink-deep);color:var(--cream);padding:clamp(56px,6vw,80px) 0 40px;border-top:3px solid var(--brass)}
footer.site a{color:inherit;text-decoration:none}
footer.site a:hover{color:var(--brass-light)}
.foot{display:grid;grid-template-columns:5fr 2.3fr 2.3fr 3fr;gap:40px;font-size:15px}
.foot .promise{font-family:var(--serif);font-style:italic;font-size:19px;margin:22px 0 10px}
.foot .blurb{color:var(--on-ink-3);max-width:36ch;line-height:1.5}
.foot .h{font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--brass);margin-bottom:16px}
.foot ul{list-style:none}
.foot li+li{margin-top:9px}
.foot .c li{display:flex;gap:10px;align-items:flex-start}
.foot .c svg{width:15px;height:15px;flex:none;margin-top:3px;color:var(--brass)}
.foot .c small{display:block;color:var(--on-ink-3);font-size:13px;margin-top:2px}
.foot-online{margin-top:44px;padding-top:26px;border-top:1px solid var(--line-ink)}
.foot-online .h{display:block;margin:0 0 18px;font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--brass)}
.foot-online .online{list-style:none;display:flex;flex-wrap:wrap;gap:4px 30px}  /* wraps instead of overflowing; the 9 marks cannot shrink (flex:none + nowrap) */
.foot-online .online a{display:inline-flex;align-items:center;gap:10px;min-height:44px;color:var(--on-ink-2);font-size:13.5px;transition:color .18s;background-image:none}
.foot-online .online a:hover{color:var(--brass-light)}
.foot-online .online a:focus-visible{outline:2px solid var(--brass-light);outline-offset:4px}
.foot-online .online svg{width:20px;height:20px;flex:none;fill:currentColor}
.foot-online .online a.wm svg{width:auto;height:11px}
.foot-online .online span{white-space:nowrap}
.crest{display:flex;align-items:center;gap:16px;margin:40px auto 32px;max-width:360px}
.crest::before,.crest::after{content:"";flex:1;height:1px;background:var(--line-ink)}
.crest span{width:10px;height:10px;background:var(--brass);display:block}
.bar{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px 24px;font-size:12.5px;color:var(--on-ink-3);letter-spacing:.02em}
/* ---- Sticky (mobile) */
.sticky{display:none}
/* ---- Motion */
/* ================= Motion system (D-115.5): one curve, three tempos. Every hidden state lives under html.motion (scroll reveals, set by the deferred script) or html.hero-motion (first paint, inline head script); both are reduced-motion gated, so without them the page is simply complete. Transform/opacity/clip only; no loops; nothing autonomous after the 7s hero settle. */
html.motion [data-rv]{opacity:0;translate:0 var(--rv-y);transition:opacity var(--t-reveal) var(--ease),translate var(--t-reveal) var(--ease);transition-delay:calc(var(--i,0)*var(--stagger))}
html.motion [data-rv].in{opacity:1;translate:none}
html.motion [data-rv].instant,html.motion [data-rv].instant *,html.motion [data-rv].instant::before,html.motion [data-rv].instant::after,html.motion [data-rv].instant *::before,html.motion [data-rv].instant *::after{transition:none!important}
.rail,.reviews{--stagger:120ms}
html.hero-motion .hero:not(.classic) .panel{animation:rise-in var(--t-reveal) var(--ease) both}
html.hero-motion .hero:not(.classic) figure img{animation:atmos 1.2s var(--ease) both}
/* Curtain reveals: a paper-colored plane lifts off each photograph while the image settles from 1.03 to 1 (owner zoom cap, v1.9). Below 720px the plane fades rather than wipes. */
html.motion .mosaic a,html.motion .tiles figure,html.motion .row figure{position:relative;overflow:hidden}
html.motion .card[data-rv] .ph::after,html.motion .mosaic a[data-rv]::after,html.motion .tiles figure[data-rv]::after,html.motion .row[data-rv] figure::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:var(--curtain,var(--cream));transform:scaleY(1);transform-origin:top;transition:transform calc(var(--t-reveal) - 80ms) var(--ease) calc(var(--i,0)*var(--stagger) + 80ms),opacity calc(var(--t-reveal) - 80ms) var(--ease) calc(var(--i,0)*var(--stagger) + 80ms)}
html.motion .card[data-rv].in .ph::after,html.motion .mosaic a[data-rv].in::after,html.motion .tiles figure[data-rv].in::after,html.motion .row[data-rv].in figure::after{transform:scaleY(0)}
html.motion .card[data-rv]:not(.in) .ph img,html.motion .mosaic a[data-rv]:not(.in) img,html.motion .tiles figure[data-rv]:not(.in) img,html.motion .row[data-rv]:not(.in) figure img{--zoom:1.03}
/* Brass rules draw from the left once their host lands. */
.eyebrow::before,.pillars li::before,.card.quiet::before,.cred::before{transition:transform calc(var(--t-reveal) - 300ms) var(--ease) calc(var(--i,0)*var(--stagger) + 180ms)}
html.motion [data-rv]:not(.in) .eyebrow::before,html.motion .pillars li[data-rv]:not(.in)::before,html.motion .card.quiet[data-rv]:not(.in)::before,html.motion .cred[data-rv]:not(.in)::before{transform:scaleX(0)}
/* Plate seams draw from the center. */
html.motion .review,html.motion .plate-cta,html.motion .row .plate,html.motion .photo-band .plate-t{border-top-color:transparent}
html.motion .review::before,html.motion .plate-cta::before,html.motion .row .plate::before,html.motion .photo-band .plate-t::before{content:"";position:absolute;left:-1px;right:-1px;top:-3px;height:3px;background:var(--brass);transform-origin:50%;transition:transform calc(var(--t-reveal) - 220ms) var(--ease) calc(var(--i,0)*var(--stagger) + 160ms)}
html.motion .photo-band .plate-t::before{left:0;right:0}
html.motion .review[data-rv]:not(.in)::before,html.motion .plate-cta[data-rv]:not(.in)::before,html.motion .row[data-rv]:not(.in) .plate::before,html.motion [data-rv]:not(.in) .plate-t::before{transform:scaleX(0)}
/* Process rail: the line draws, the squares pop in order, the steps rise in sequence. */
.rail::before{transition:transform var(--t-reveal) var(--ease)}
html.motion .rail:not(.in)::before{transform:scaleX(0)}
.rail li::before{transition:transform calc(var(--t-reveal) - 380ms) var(--ease) calc(var(--i,0)*var(--stagger) + 200ms)}
html.motion .rail li[data-rv]:not(.in)::before{transform:scale(0)}
/* Reviews: the card lands; the stars never animate — evidence never performs (Soft-close law, D-095 Q6). */
@keyframes rise{from{transform:translateY(18px)}to{transform:none}}
@keyframes rise-in{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes atmos{from{transform:scale(1.03)}to{transform:none}}
@keyframes drawx{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes risefade{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes atmos-m{from{transform:scale(1.03)}to{transform:none}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
/* ================= Responsive ================= */
@media(max-width:1279px){.facts-card{grid-template-columns:1fr 1fr}.facts-card li:nth-child(2n){border-right:0}.facts-card li:nth-child(-n+2){border-bottom:1px solid var(--sand)}}
@media(max-width:1100px){.pillars.row4{grid-template-columns:1fr 1fr}.proof-row{grid-template-columns:minmax(0,1fr)}.hero figure{grid-column:4/-1}.hero .panel{grid-column:1/8}.minifacts{position:static;width:100%;margin-top:16px;left:0}.svc-grid{grid-template-columns:1fr 1fr}.reviews{grid-template-columns:1fr;gap:20px}.creds{grid-template-columns:1fr}.proof-row{grid-template-columns:1fr}.foot{grid-template-columns:1fr 1fr}.rail{grid-template-columns:1fr 1fr;gap:36px 40px}.rail li::before{top:-10px}.rail::before{display:none}.rail li{padding-top:14px;border-top:1px solid var(--line-ink)}}
@media(max-width:900px){
 .hero{padding-top:0}
 .hero .wrap{display:block;padding:0;max-width:none}
 .hero.classic{min-height:min(88svh,900px)}
 .hero.classic .wrap{padding:110px var(--pad) 120px}
 .hero.classic figure img{aspect-ratio:auto;height:100%}
 .hero.classic::before{background:linear-gradient(180deg,rgba(27,39,51,.5) 0%,rgba(27,39,51,.7) 16%,rgba(27,39,51,.78) 30%,rgba(27,39,51,.78) 68%,rgba(27,39,51,.42) 86%,rgba(27,39,51,.2) 100%)}
 .hero.classic::after{background:linear-gradient(180deg,rgba(247,243,236,0) 84%,rgba(247,243,236,.55) 95%,var(--cream) 100%)}
 html.hero-motion .hero.classic figure img{animation-name:atmos-m;animation-duration:1.2s}
 .hero.classic .display{font-size:40px}
 .hero.classic .cta-row .btn{flex:1 1 100%}
 body.has-hero header.site,header.site{position:sticky;background:var(--cream);backdrop-filter:none;-webkit-backdrop-filter:none}
 body.has-hero header.site .logo-rev{display:none}body.has-hero header.site .logo-std{display:block}
 body.has-hero header.site:not(.scrolled) nav a:not(.btn){color:var(--ink)}
 .hero figure{margin:0;height:auto}
 .hero figure img{aspect-ratio:1/1;height:auto;object-position:50% 45%}
 .hero .panel{margin:-40px 16px 0;padding:28px 22px 30px;position:relative}
 .hero .display{font-size:40px}
 .hero .cta-row .btn{flex:1 1 100%}
 .hero.split .wrap,.hero.immersive .wrap{display:block}
 .hero.split figure{min-height:0}
 .hero.immersive figure{height:auto}.hero.immersive figure img{aspect-ratio:4/5}.hero.immersive figure::after{background:var(--scrim-foot);height:70%}
 .hero.immersive .panel{position:relative;inset:auto;padding:24px 20px 0;display:block}
 .hero.immersive .display,.hero.immersive .lead,.hero.immersive .sig,.hero.immersive .tel{color:var(--ink)}.hero.immersive .lead{color:var(--ink2)}.hero.immersive .btn.outline{border-color:var(--ink);color:var(--ink)}
 .facts-card{margin:-48px 0 0;grid-template-columns:1fr}
 .facts-card li{border-right:0;border-bottom:1px solid var(--sand);padding:14px 18px}
 .facts-card .proofcell{border-bottom:0;background:var(--plate)}
 .hero.classic + .wrap{padding-bottom:24px}
 .sec.after-hero{padding-top:var(--sec)}
 .head,.pillars-grid,.method,.closing-grid,.about-top,.founder-grid,.contact-grid,.plate-cta{grid-template-columns:1fr}
 .head .deck,.head h2{grid-column:1}
 .pillars{grid-template-columns:1fr 1fr;gap:16px;margin-top:8px}
 .mosaic{grid-template-columns:1fr 1fr;grid-auto-rows:170px;gap:14px}
 .top .wrap{grid-template-columns:1fr;gap:0}
 .top .plate-wrap{margin:0 calc(-1 * var(--pad));order:-1}
 .top .plate-wrap img{aspect-ratio:4/3;max-height:none}
 .top .copy{padding-top:28px}
 .scope,.home-rules{grid-template-columns:1fr}
 .row,.row.alt{display:block}
 .row figure img{aspect-ratio:3/2;max-height:none}
 .row .plate{margin:-32px 16px 0;position:relative}
 .row figure .caption{display:none}
 .tiles{grid-template-columns:1fr 1fr;grid-auto-rows:160px;gap:12px}
 .about-top figure{margin:0 calc(-1 * var(--pad));order:-1}.about-top figure img{aspect-ratio:3/2;max-height:none}
 .about-top figure .caption{padding:0 var(--pad)}  /* the figure goes full-bleed; its caption stays on the content grid */
 .steps{grid-template-columns:1fr}
 .plate-cta .rows{border-left:0;padding-left:0;border-top:1px solid var(--sand);padding-top:12px}
 .photo-band{min-height:0}
 .m-only{display:block}
}
@media(max-width:900px){
 header.site .wrap{flex-wrap:wrap;min-height:0;padding-top:12px;padding-bottom:0;gap:0}
 header.site .logo{flex:1}header.site .logo img{width:200px}
 header.site .phone-icon{display:inline-flex;width:44px;height:44px;align-items:center;justify-content:center;margin-right:-8px}
 header.site .phone-icon svg{width:20px;height:20px}
 header.site nav{width:100%;justify-content:space-between;gap:0;font-size:14.5px;padding:10px 0 0}
 header.site nav a.nav-home{display:inline-block}
 header.site nav a.tel,header.site nav .btn{display:none}
 header.site nav a{padding:10px 0 12px}
 .subnav{top:0}
}
@media(max-width:720px){
 :root{--pad:20px;--t-reveal:650ms}
 /* The curtain fades instead of wiping below 720: a full-height scaleY edge on a phone-width photograph runs ~18x
    the reveal velocity across the largest object on screen, and its speed is set by image height, so no duration
    fixes it. Same paper plane, same colour, zero edge velocity. */
 html.motion .card[data-rv] .ph::after,html.motion .mosaic a[data-rv]::after,html.motion .tiles figure[data-rv]::after,html.motion .row[data-rv] figure::after{transform:none;opacity:1}
 html.motion .card[data-rv].in .ph::after,html.motion .mosaic a[data-rv].in::after,html.motion .tiles figure[data-rv].in::after,html.motion .row[data-rv].in figure::after{transform:none;opacity:0}
 /* 130x130 service thumbnails: 3% is 3.9px — below craft, above fuss. The large media keeps its settle. */
 html.motion .card[data-rv]:not(.in) .ph img{--zoom:1}
 .svc-grid{grid-template-columns:1fr;gap:14px}
 .svc-grid .card:not(.quiet){display:grid;grid-template-columns:120px 1fr;align-items:center}
 .svc-grid .card.quiet{grid-template-columns:1fr;gap:10px;padding:22px}
 .svc-grid .card .ph{aspect-ratio:1/1;height:100%}
 .svc-grid .card .bd{padding:16px 18px}
 .svc-grid .card h3{font-size:19px;margin-bottom:4px}
 .svc-grid .card .pov{display:none}
 .svc-grid .card .link{margin-top:6px}
 .svc-grid .card .sub{display:none}
 .pillars{grid-template-columns:1fr}
 .rail,.rail.compact{grid-template-columns:1fr;gap:28px;padding-left:28px;padding-top:0}
 .rail::before{display:block;left:6px;right:auto;top:0;bottom:0;width:1px;height:auto}
 .rail li{border-top:0;padding-top:0}
 .rail li::before{left:-28px;top:14px}
 .rail::before{transform-origin:top}
 html.motion .rail:not(.in)::before{transform:none}
 .tiles{grid-template-columns:1fr 1fr;grid-auto-rows:150px}
 .tt{grid-template-columns:auto 1fr}.tt .lnk{grid-column:1/-1;white-space:normal}
 .subnav{position:static}
 .method.single>div{grid-template-columns:1fr;gap:0}.method.single .blk+.blk{margin-top:36px}
 .foot{grid-template-columns:1fr;gap:36px}
 .foot-online .online{display:grid;grid-template-columns:repeat(3,1fr);gap:8px 16px}
 .foot-online .online a{font-size:13px}
 .bar{flex-direction:column}
 body.has-sticky{padding-bottom:calc(58px + env(safe-area-inset-bottom))}
 body.has-sticky:not(.sticky-on){padding-bottom:0}
 .sticky{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:60;height:calc(58px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);background:var(--ink);transform:translateY(100%);visibility:hidden;transition:transform .25s ease-out;box-shadow:0 -8px 24px rgba(27,39,51,.18)}
 body.sticky-on .sticky{transform:none;visibility:visible}
 .sticky a{flex:1;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:600;text-decoration:none;color:var(--cream)}
 .sticky a.tel{flex:0 0 36%;border-right:1px solid var(--line-ink);background:none;padding:0}
 .sticky a.go{background:var(--brass);color:var(--ink)}
}
@media(max-width:360px){header.site nav{font-size:13.5px}}
@media print{header.site,.sticky,footer .foot-online{display:none}html.motion [data-rv]{opacity:1;transform:none;translate:none}html.motion [data-rv]:not(.in)::before,html.motion [data-rv]:not(.in) *::before,html.motion .rail:not(.in)::before,html.motion .rail li[data-rv]:not(.in)::before{transform:none!important}html.motion .card .ph::after,html.motion .mosaic a::after,html.motion .tiles figure::after,html.motion .row figure::after{display:none!important}html.motion [data-rv] img,html.motion [data-rv] .ph img{--zoom:1}}

/* ---------- Guides (Content Engine, D-116) — inside the v3.2 language ---------- */
.g-top .copy{padding-bottom:28px}
.g-top h1{max-width:20ch}
.g-top .lead-result{max-width:40ch}
.g-meta{margin-top:18px;letter-spacing:.05em;text-transform:none;font-size:13.5px;line-height:1.7}
.g-meta a{text-decoration:none;border-bottom:1px solid var(--sand2)}
.g-col{max-width:760px;margin-left:auto;margin-right:auto}
.g-hero{margin:0 0 34px}
.g-hero img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
.g-hero .caption{margin-top:10px}
.g-label{font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--bronze);margin-bottom:10px}
.g-answer{background:var(--cream2);border-left:3px solid var(--brass);padding:22px 26px;margin:0 0 26px}
.g-answer p{font-size:17.5px;line-height:1.6;color:var(--ink)}
.g-answer p+p{margin-top:10px}
.g-early{font-size:16px;color:var(--ink2);margin:0 0 26px}
.g-toc{border-top:1px solid var(--sand);border-bottom:1px solid var(--sand);padding:18px 0;margin:0 0 34px}
.g-toc ol{list-style:none;columns:2;column-gap:32px}
.g-toc li{position:relative;padding-left:18px;margin:6px 0;break-inside:avoid;font-family:var(--sans);font-size:15px}
.g-toc li::before{content:"";position:absolute;left:0;top:9px;width:7px;height:7px;background:var(--brass)}
.g-toc a{text-decoration:none;color:var(--ink)}
.g-toc a:hover{color:var(--bronze)}
.g-body{font-size:18px;line-height:1.65}
.g-body p{max-width:66ch;margin:0 0 1em}
.g-body p:last-child{margin-bottom:0}
.g-sec{padding:10px 0 22px}
.g-sec h2{font-size:clamp(26px,2.4vw,32px);line-height:1.2;margin:1.6em 0 .6em;max-width:26ch}
.g-sec:first-child h2{margin-top:.4em}
.g-body h3{font-size:22px;margin:1.4em 0 .5em;max-width:30ch}
.g-body ul,.g-body ol{margin:0 0 1.2em;padding-left:0;list-style:none;max-width:66ch}
.g-body ul li,.g-body ol li{position:relative;padding-left:22px;margin:6px 0}
.g-body ul li::before{content:"";position:absolute;left:0;top:11px;width:8px;height:8px;background:var(--brass)}
.g-body ol{counter-reset:g}
.g-body ol li{padding-left:30px}
.g-body ol li::before{counter-increment:g;content:counter(g,decimal-leading-zero);position:absolute;left:0;top:2px;font-family:var(--serif);font-style:italic;color:var(--brass);font-size:17px}
.g-body blockquote{border-left:3px solid var(--brass);padding:4px 0 4px 22px;margin:0 0 1.2em;font-family:var(--serif);font-size:20px;line-height:1.45;color:var(--ink2)}
.g-body hr{border:0;border-top:1px solid var(--sand);margin:2em 0}
.g-body code{font-family:var(--sans);font-size:.92em;background:var(--cream2);padding:1px 6px}
.g-note{background:var(--white);border:1px solid var(--sand);border-top:3px solid var(--brass);padding:20px 24px;margin:0 0 1.4em;font-size:16.5px}
.g-note p{max-width:60ch}
.g-check{background:var(--cream2);padding:20px 24px;margin:0 0 1.4em}
.g-check ul li::before{width:9px;height:9px;top:10px}
.g-table{overflow-x:auto;margin:0 0 1.4em}
.g-table table{width:100%;border-collapse:collapse;font-family:var(--sans);font-size:15px;line-height:1.5}
.g-table th{text-align:left;font-weight:600;font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink3);padding:10px 12px 10px 0;border-bottom:2px solid var(--brass)}
.g-table td{padding:12px 12px 12px 0;border-bottom:1px solid var(--sand);vertical-align:top}
.g-table td:first-child{font-family:var(--serif);font-size:17px;font-weight:500}
.g-fig{margin:1.6em 0}
.g-fig img{width:100%;height:auto}
.g-fig figcaption{margin-top:10px;font-family:var(--sans);font-size:13.5px;color:var(--ink3)}
.g-faq{padding:18px 0;border-bottom:1px solid var(--sand)}
.g-faq:first-of-type{border-top:1px solid var(--sand)}
.g-faq h3{font-size:21px;margin:0 0 8px;max-width:40ch}
.g-faq p{color:var(--ink2);font-size:17px}
.g-cta{background:var(--cream2);border-left:3px solid var(--brass);padding:22px 26px;margin:1.8em 0}
.g-cta p{font-size:17px;max-width:56ch;margin-bottom:14px}
.g-cta .cta-row{display:flex;flex-wrap:wrap;gap:12px 18px;align-items:center}
.g-disclaimer{margin:34px 0 0;font-family:var(--serif);font-style:italic;font-size:18px;color:var(--ink2);max-width:60ch}
.g-sources{margin-top:30px;border-top:1px solid var(--sand);padding-top:26px}
.g-sources h2{font-size:22px;margin:0 0 14px}
.g-sources p{font-size:15.5px;color:var(--ink2);max-width:66ch;margin-bottom:12px}
.g-srclist{padding-left:22px;font-family:var(--sans);font-size:14.5px;line-height:1.6;color:var(--ink2);margin:0 0 12px}
.g-srclist li{margin:4px 0}
.g-srclist .acc{color:var(--ink3)}
.g-reviewed{font-size:14.5px!important;color:var(--ink3)!important}
.g-svc .card.quiet{grid-template-columns:1fr auto}
.g-cards{display:grid;gap:22px}
.g-cards.three{grid-template-columns:repeat(3,1fr)}
.g-card .bd .meta{margin-bottom:10px;font-size:12px}
.g-card h3{font-size:21px;line-height:1.25}
.g-card h3 a{text-decoration:none;background-image:none;color:var(--ink)}
.g-card h3 a:hover{color:var(--bronze)}
.g-card h3 a::after{content:"";position:absolute;inset:0;z-index:1}  /* stretched link: .card is already position:relative. Same anchor, same destination, same focus ring — only the hit area grows. */
.g-featured .plate h2 a{text-decoration:none;background-image:none;color:var(--ink)}
.g-featured .plate .meta{margin-top:12px}
.g-featured figure{margin:0}
.g-featured figure img{aspect-ratio:4/5;max-height:600px;object-fit:cover;width:100%}
@media(max-width:1100px){.g-cards.three{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){.g-body{font-size:17px;line-height:1.6}.g-toc ol{columns:1}.g-cards.three{grid-template-columns:1fr 1fr}}
@media(max-width:720px){.g-cards.three{grid-template-columns:1fr}.g-table table,.g-table thead,.g-table tbody,.g-table tr,.g-table td{display:block}.g-table thead{display:none}.g-table tr{border-bottom:1px solid var(--sand);padding:10px 0}.g-table td{border:0;padding:4px 0}.g-table td[data-label]:not([data-label=""])::before{content:attr(data-label);display:block;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink3)}.g-table td:first-child{padding-top:0}.g-answer,.g-cta,.g-note{padding:18px 20px}}
@media print{.g-toc,.g-related,.g-projects,.g-svc,.closing-sec,.sticky{display:none!important}}