/* Webflow compatibility block. Not part of the approved design; it only makes Webflow render gallery.css
   the way a plain browser does. Deployed ahead of gallery.css in one file (see build.py). ADR-027.
   Tags and form controls go back to browser defaults so Webflow's base CSS and the site's tag styles
   do not leak in. Every styled control in gallery.css is selected through a class.
   The reset also cancels the hidden attribute, which browsers apply as a low-priority style, so
   [hidden] is restated. It is not !important: intake-forms.js shows a result panel with an inline style.
   Removed 2026-09-29: the rules that undid five old site styles (card, nav, logo, hero, form) and the
   rules that put back the focus ring and text selection. The old styles are emptied or deleted and the
   old site-wide code is retired, so neither was doing anything. */
body,h1,h2,h3,h4,h5,h6,p,a,img,ul,ol,li,dl,dt,dd,figure,figcaption,blockquote,label,fieldset,legend,details,summary,section,header,footer,nav,main,button,input,select,textarea,optgroup{all:revert;box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none}

/* Riverpoint Millworks site styles. Direction: Gallery, Charcoal accent (ADR-026).
   One stylesheet for every page. Tokens first, then components. */
/* ---------- tokens ---------- */
:root{
  --white:#FFFFFF; --band:#F3F1EC; --cream:#F7F3EA;
  --char:#25292B; --char-deep:#1A1D1F; --char-soft:#373C3F;
  --brass:#B08D57; --brass-deep:#8F7143; --brass-light:#D4B98A; --brass-pale:#EFE4D0;
  --ink:#1B1F1D; --ink-2:#4A5250; --ink-3:#77807C;
  --rule:#E3DFD6; --rule-strong:#CFC9BD;
  --max:1240px; --gut:clamp(20px,4vw,48px);
  --serif:'Libre Caslon Text',Georgia,'Times New Roman',serif;
  --sans:'Karla','Helvetica Neue',Helvetica,sans-serif;
  --ease:cubic-bezier(.22,.61,.36,1);
  --shadow:0 18px 40px -26px rgba(27,31,29,.45);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--sans);color:var(--ink);background:var(--white);line-height:1.6;font-size:17px;-webkit-font-smoothing:antialiased;overflow-x:clip}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gut)}
h1,h2,h3,.serif{font-family:var(--serif);font-weight:400;line-height:1.12;letter-spacing:-.005em}
h2{font-size:clamp(32px,3.6vw,46px);color:var(--ink)}
h3{font-size:24px;line-height:1.2}
.lead{font-size:18px;color:var(--ink-2);max-width:56ch;line-height:1.65}
.kicker{font-family:var(--sans);font-size:14px;color:var(--brass-deep);font-weight:600;margin-bottom:16px;display:flex;align-items:center;gap:12px}
.kicker::before{content:"";width:28px;height:1px;background:var(--brass)}
.sc{font-family:var(--serif);font-variant-caps:small-caps;letter-spacing:.03em;font-size:15px;color:var(--brass-deep)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:14px 26px;border-radius:2px;font-weight:600;font-size:15px;line-height:1;border:1px solid transparent;transition:background .22s var(--ease),color .22s var(--ease),border-color .22s var(--ease),box-shadow .22s var(--ease),transform .22s var(--ease)}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.btn-dark{background:var(--char);color:var(--cream)}
.btn-dark:hover{background:var(--char-deep);box-shadow:0 10px 22px -14px rgba(37,41,43,.7)}
.btn-brass{background:var(--brass);color:#fff}
.btn-brass:hover{background:var(--brass-deep);box-shadow:0 10px 22px -14px rgba(176,141,87,.8)}
.btn-line{border-color:var(--rule-strong);color:var(--char);background:transparent}
.btn-line:hover{border-color:var(--char);background:rgba(37,41,43,.04)}
.btn-line-light{border-color:rgba(247,243,234,.35);color:var(--cream);background:transparent}
.btn-line-light:hover{border-color:var(--cream);background:rgba(255,255,255,.06)}
.txtlink{font-weight:600;color:var(--char);position:relative;padding-bottom:3px;background:linear-gradient(var(--brass),var(--brass)) no-repeat 0 100%/100% 1px;transition:background-size .28s var(--ease),color .2s}
.txtlink:hover{background-size:100% 2px;color:var(--brass-deep)}

/* ---------- utility + nav ---------- */
.util{background:var(--char);color:rgba(247,243,234,.82);font-size:13px}
.util .wrap{display:flex;justify-content:space-between;align-items:center;height:38px;gap:16px}
.util a{color:var(--cream);transition:color .2s}
.util a:hover{color:var(--brass-light)}
.util a + a{margin-left:24px}
.nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);backdrop-filter:saturate(1.1) blur(10px);border-bottom:1px solid var(--rule)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:88px;gap:24px}
.nav .logo img{height:56px;width:auto}
.nav ul{display:flex;gap:22px;font-size:14.5px;font-weight:500;color:var(--ink-2);white-space:nowrap}
.nav ul a{padding:6px 0;background:linear-gradient(var(--brass),var(--brass)) no-repeat 0 100%/0 1px;transition:background-size .28s var(--ease),color .2s}
.nav ul a:hover{color:var(--char);background-size:100% 1px}
.nav .cta{display:flex;gap:12px;align-items:center}
.nav .cta .btn{padding:12px 20px;font-size:14px}

/* ---------- hero ---------- */
.hero{display:grid;grid-template-columns:minmax(var(--gut),1fr) minmax(0,calc(var(--max)/2 - var(--gut))) minmax(0,calc(var(--max)/2 - var(--gut))) minmax(var(--gut),1fr);min-height:620px;background:var(--white)}
.hero-panel{grid-column:1/3;background:var(--char);color:var(--cream);display:flex;justify-content:flex-end;position:relative;isolation:isolate}
.hero-panel::after{content:"";position:absolute;right:0;top:0;bottom:0;width:1px;background:linear-gradient(180deg,rgba(212,185,138,0),rgba(212,185,138,.55) 30%,rgba(212,185,138,.55) 70%,rgba(212,185,138,0))}
.hero-panel .inner{width:calc(var(--max)/2 - var(--gut));max-width:100%;padding:clamp(56px,7vw,104px) clamp(32px,4.5vw,64px) clamp(120px,12vw,168px) 0;display:flex;flex-direction:column;justify-content:center}
.hero .kicker{color:var(--brass-light)}
.hero .kicker::before{background:var(--brass-light)}
.hero h1{font-size:clamp(38px,4.6vw,62px);line-height:1.1;color:var(--cream);max-width:15ch;margin-bottom:22px;font-weight:400}
.hero h1 em{font-style:normal;color:var(--brass-light)}
.hero .lead{color:rgba(247,243,234,.82);margin-bottom:0}
.hero-photo{grid-column:3/5;position:relative;overflow:hidden;min-height:520px;background:var(--band)}
.hero-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.hero-tag{position:absolute;right:clamp(20px,4vw,48px);bottom:clamp(120px,12vw,168px);background:rgba(255,255,255,.96);padding:12px 16px;font-size:13.5px;color:var(--ink-2);border-left:2px solid var(--brass);z-index:2;box-shadow:0 8px 24px -18px rgba(27,31,29,.5)}
.hero-tag b{color:var(--ink);font-weight:600;display:block;margin-bottom:1px}

/* page-load reveal */
@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes fade{from{opacity:0}to{opacity:1}}
.reveal{opacity:0;animation:rise .8s var(--ease) forwards}
.hero .kicker.reveal{animation-delay:.10s}
.hero h1.reveal{animation-delay:.22s}
.hero .lead.reveal{animation-delay:.36s}
.hero-photo.reveal{animation:fade 1.1s var(--ease) forwards;animation-delay:.05s}
.hero-tag.reveal{animation-delay:.7s}
.door.reveal:nth-child(1){animation-delay:.52s}
.door.reveal:nth-child(2){animation-delay:.64s}
@media (prefers-reduced-motion:reduce){
  .reveal{animation:none;opacity:1}
  *{transition-duration:.01ms !important}
}

/* doors: white cards overlapping the hero bottom edge */
.doors-band{position:relative;z-index:3;margin-top:calc(-1 * clamp(84px,9vw,120px))}
.doors{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.door{background:var(--white);border:1px solid var(--rule);border-top:3px solid var(--brass);padding:30px 30px 28px;display:flex;flex-direction:column;gap:10px;box-shadow:var(--shadow);transition:transform .32s var(--ease),box-shadow .32s var(--ease),border-color .32s var(--ease)}
.door:hover{transform:translateY(-3px);box-shadow:0 30px 50px -30px rgba(27,31,29,.5);border-color:var(--rule-strong);border-top-color:var(--brass)}
.door .who{font-family:var(--serif);font-variant-caps:small-caps;letter-spacing:.03em;font-size:15px;color:var(--brass-deep)}
.door h3{font-size:26px;color:var(--ink)}
.door p{font-size:15.5px;color:var(--ink-2)}
.door .row{display:flex;gap:18px;align-items:center;margin-top:10px;flex-wrap:wrap}
.door .row .btn{padding:12px 20px;font-size:14px}

/* ---------- why ---------- */
.why{padding:clamp(80px,9vw,128px) 0 clamp(72px,8vw,104px);background:var(--white)}
.why-head{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:end;margin-bottom:56px}
.why-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 64px}
.why-item{padding:30px 0 40px;border-top:1px solid var(--brass);display:grid;grid-template-columns:52px 1fr;gap:6px 18px;align-items:start}
.why-item .num{font-family:var(--serif);font-size:20px;color:var(--brass);line-height:1.2;grid-row:1/3;padding-top:2px}
.why-item h3{font-size:24px;margin-bottom:6px}
.why-item p{font-size:15.5px;color:var(--ink-2);max-width:40ch}
.stats{margin-top:40px;background:var(--char);color:var(--cream);padding:40px clamp(28px,4vw,56px);display:grid;grid-template-columns:repeat(4,1fr);gap:24px;position:relative}
.stats::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--brass)}
.stat{padding-left:20px;border-left:1px solid rgba(212,185,138,.35)}
.stat b{display:block;font-family:var(--serif);font-size:46px;font-weight:400;line-height:1;margin-bottom:10px;color:var(--brass-light)}
.stat span{font-size:14px;color:rgba(247,243,234,.8)}

/* ---------- categories ---------- */
.cats{background:var(--band);padding:clamp(80px,9vw,128px) 0}
.cats-head{display:flex;justify-content:space-between;align-items:end;gap:32px;margin-bottom:44px}
.cat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.cat{position:relative;background:var(--white);border:1px solid var(--rule);display:flex;flex-direction:column;transition:box-shadow .32s var(--ease),transform .32s var(--ease)}
.cat:hover{box-shadow:var(--shadow);transform:translateY(-3px)}
.cat .ph{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--band)}
.cat img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.cat:hover img{transform:scale(1.04)}
.cat .lab{padding:20px 22px 24px;position:relative}
.cat .lab::before{content:"";position:absolute;left:22px;top:0;width:36px;height:1px;background:var(--brass);transition:width .4s var(--ease)}
.cat:hover .lab::before{width:calc(100% - 44px)}
.cat .lab h3{font-size:24px;margin:2px 0 6px}
.cat .lab p{font-size:14px;color:var(--ink-2)}
.cat .flag{position:absolute;top:14px;left:14px;background:rgba(255,255,255,.96);color:var(--brass-deep);font-family:var(--serif);font-variant-caps:small-caps;letter-spacing:.03em;font-size:14px;padding:6px 12px;z-index:2;border-left:2px solid var(--brass)}

/* ---------- cabinet lines ---------- */
.lines{padding:clamp(80px,9vw,128px) 0;background:var(--white)}
.lines-head{max-width:64ch;margin-bottom:48px}
.tiers{display:grid;grid-template-columns:1.15fr 1fr 1fr;gap:20px;align-items:stretch}
.tier{background:var(--white);border:1px solid var(--rule);border-top:3px solid var(--brass);display:flex;flex-direction:column;transition:box-shadow .32s var(--ease),transform .32s var(--ease)}
.tier:hover{box-shadow:var(--shadow);transform:translateY(-3px)}
.tier .head{padding:28px 28px 0}
.tier.flag .head{background:var(--char);color:var(--cream);padding:28px 28px 26px;margin-top:-1px}
.tier .who{font-family:var(--serif);font-variant-caps:small-caps;letter-spacing:.03em;font-size:15px;color:var(--brass-deep);margin-bottom:10px;display:block}
.tier.flag .who{color:var(--brass-light)}
.tier h3{font-size:27px;margin-bottom:0}
.tier.flag h3{color:var(--cream)}
.tier .copy{padding:14px 28px 30px;display:flex;flex-direction:column;flex:1}
.tier.flag .copy{padding-top:24px}
.tier p{font-size:15.5px;color:var(--ink-2)}
.tier dl{display:grid;grid-template-columns:1fr 1fr;gap:16px 20px;margin-top:auto;padding-top:22px;border-top:1px solid var(--rule);font-size:14px}
.tier .copy p{margin-bottom:22px}
.tier dt{color:var(--ink-3);font-size:12.5px;margin-bottom:3px}
.tier dd{font-weight:600;color:var(--ink)}

/* ---------- how it works ---------- */
.how{background:var(--band);padding:clamp(80px,9vw,128px) 0}
.how-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:44px}
.path{background:var(--white);border:1px solid var(--rule);padding:36px 34px 34px;display:flex;flex-direction:column}
.path .who{font-family:var(--serif);font-variant-caps:small-caps;letter-spacing:.03em;font-size:15px;color:var(--brass-deep);margin-bottom:10px}
.path h3{font-size:27px;margin-bottom:26px;padding-bottom:20px;border-bottom:1px solid var(--brass)}
.path ol{display:flex;flex-direction:column;gap:20px}
.path li{display:grid;grid-template-columns:40px 1fr;gap:16px;align-items:start}
.path li .n{width:36px;height:36px;border-radius:50%;border:1px solid var(--brass);display:grid;place-items:center;font-family:var(--serif);font-size:15px;color:var(--brass-deep);background:var(--white)}
.path li b{display:block;font-weight:600;margin-bottom:2px;color:var(--ink)}
.path li span{font-size:15px;color:var(--ink-2)}
.path .btn{margin-top:30px;align-self:flex-start}

/* ---------- showroom ---------- */
.show{padding:clamp(80px,9vw,128px) 0;background:var(--white)}
.show-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.show-photo{position:relative;aspect-ratio:4/5;background:var(--band);margin:16px 0 0 16px}
.show-photo::before{content:"";position:absolute;inset:0;transform:translate(-16px,-16px);border:1px solid var(--brass);pointer-events:none;transition:transform .4s var(--ease)}
.show-photo:hover::before{transform:translate(-10px,-10px)}
.show-photo img{width:100%;height:100%;object-fit:cover;position:relative}
.show h2{margin-bottom:18px}
.show .lead{margin-bottom:26px}
.facts{display:grid;grid-template-columns:1fr 1fr;gap:20px 28px;margin:30px 0 34px;padding-top:26px;border-top:1px solid var(--brass)}
.facts dt{font-size:12.5px;color:var(--ink-3);margin-bottom:3px}
.facts dd{font-weight:600;font-size:15.5px;color:var(--ink)}
.show .actions{display:flex;gap:14px;flex-wrap:wrap}

/* ---------- proof ---------- */
.proof{background:var(--band);padding:clamp(64px,7vw,96px) 0}
.proof-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:64px;align-items:center}
.quote-wrap{position:relative;padding-left:36px}
.quote-wrap::before{content:"\201C";position:absolute;left:-6px;top:-22px;font-family:var(--serif);font-size:96px;line-height:1;color:var(--brass);opacity:.7}
.quote{font-family:var(--serif);font-size:clamp(22px,2.4vw,30px);line-height:1.38;color:var(--ink)}
.quote + p{margin-top:18px;font-size:14px;color:var(--ink-3);padding-left:0}
.brands{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.brands div{background:var(--white);border:1px solid var(--rule);height:88px;display:grid;place-items:center;padding:16px;transition:border-color .25s var(--ease)}
.brands div:hover{border-color:var(--brass)}
.brands img{max-height:40px;max-width:80%;filter:grayscale(1);opacity:.7;transition:opacity .25s,filter .25s}
.brands div:hover img{filter:none;opacity:1}

/* ---------- final ---------- */
.final{background:var(--char);color:var(--cream);padding:clamp(72px,8vw,112px) 0;position:relative}
.final::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--brass)}
.final-card{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center}
.final h2{font-size:clamp(34px,3.8vw,50px);margin-bottom:14px;color:var(--cream)}
.final p{color:rgba(247,243,234,.8);max-width:44ch}
.final .two{display:grid;gap:12px}
.final .two .btn{justify-content:space-between;width:100%;padding:16px 22px}

/* ---------- footer ---------- */
footer{background:var(--white);border-top:1px solid var(--rule);padding:60px 0 28px;font-size:14px}
.foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr 1.2fr;gap:32px}
footer img{height:54px;width:auto;margin-bottom:18px}
footer h4{font-family:var(--serif);font-variant-caps:small-caps;letter-spacing:.03em;font-weight:400;font-size:15px;color:var(--brass-deep);margin-bottom:14px}
footer li{margin-bottom:9px;color:var(--ink-2)}
footer li a{transition:color .2s}
footer li a:hover{color:var(--char)}
footer p{color:var(--ink-2);max-width:32ch}
.foot-bottom{margin-top:48px;padding-top:20px;border-top:1px solid var(--rule);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;color:var(--ink-3);font-size:13px}

/* ---------- responsive ---------- */
@media (max-width:980px){
  .hero{grid-template-columns:1fr;min-height:0}
  .hero-panel{grid-column:1;justify-content:flex-start}
  .hero-panel::after{display:none}
  .hero-panel .inner{width:100%;padding:56px var(--gut) 56px}
  .hero-photo{grid-column:1;min-height:420px;aspect-ratio:16/10}
  .hero-tag{bottom:auto;top:20px;right:20px}
  .doors-band{margin-top:calc(-1 * clamp(56px,8vw,84px))}
  .why-head,.show-grid,.proof-grid,.final-card{grid-template-columns:1fr}
  .why-head{gap:24px}
  .why-grid{gap:0 40px}
  .stats,.cat-grid{grid-template-columns:1fr 1fr}
  .tiers,.how-grid{grid-template-columns:1fr}
  .show-grid{gap:44px}
  .foot-grid{grid-template-columns:1fr 1fr}
  .nav > .wrap > ul{display:none}
}
@media (max-width:600px){
  .doors,.cat-grid,.stats,.why-grid,.foot-grid,.facts,.tier dl{grid-template-columns:1fr}
  .util .wrap{font-size:12px}
  .util span:first-child{display:none}
  .nav .wrap{height:76px}
  .nav .logo img{height:44px}
  .nav .cta .btn-line{display:none}
  .hero h1{font-size:34px}
  .hero-photo{min-height:300px}
  .doors-band{margin-top:-48px}
  .door{padding:24px 22px}
  .why-item{grid-template-columns:40px 1fr}
  .stat{padding-left:16px}
  .cats-head{flex-direction:column;align-items:flex-start}
  .path{padding:28px 22px}
  .final .two .btn{padding:14px 18px}
  .show-photo{margin:12px 0 0 12px}
  .show-photo::before{transform:translate(-12px,-12px)}
}

.nav .logo{flex-shrink:0}
.nav .cta .btn{white-space:nowrap}

/* =====================================================================
   SHARED COMPONENTS FOR INNER PAGES
   Everything above this line came from the approved Gallery home page.
   Everything below is the same system extended to the other pages.
   ===================================================================== */

/* nav: current page + small-screen menu */
.nav ul a[aria-current="page"]{color:var(--char);background-size:100% 1px}
.mnav{display:none;position:relative}
.mnav summary{list-style:none;cursor:pointer;font-weight:600;font-size:14px;padding:11px 16px;border:1px solid var(--rule-strong);border-radius:2px;color:var(--char)}
.mnav summary::-webkit-details-marker{display:none}
.mnav[open] summary{border-color:var(--char)}
.mnav ul{position:absolute;right:0;top:calc(100% + 10px);display:flex !important;flex-direction:column;gap:0 !important;background:var(--white);border:1px solid var(--rule);box-shadow:var(--shadow);min-width:230px;padding:8px 0;z-index:60}
.mnav ul a{display:block;padding:11px 20px;background:none}
.mnav ul a:hover{background:var(--band)}
@media (max-width:980px){.mnav{display:block}.nav .cta .btn-line{display:none}}

/* focus */
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--brass-deep);outline-offset:3px}

/* page hero: the home hero without the overlapping doors */
.hero.hero-page{min-height:500px}
.hero.hero-page .hero-panel .inner{padding-bottom:clamp(56px,7vw,96px)}
.hero.hero-page h1{max-width:17ch}
.hero.hero-page .hero-tag{bottom:clamp(24px,4vw,48px)}
.hero-actions{display:flex;gap:14px 18px;flex-wrap:wrap;align-items:center;margin-top:32px}
.hero-actions.reveal{animation-delay:.5s}
.crumbs.reveal{animation-delay:.04s}
.split .copy .ticks + p{margin-top:18px}
.hero .txtlink{color:var(--cream)}
.hero .txtlink:hover{color:var(--brass-light)}
.crumbs{font-size:13.5px;color:rgba(247,243,234,.7);margin-bottom:26px}
.crumbs a{color:rgba(247,243,234,.9);background:linear-gradient(var(--brass-light),var(--brass-light)) no-repeat 0 100%/0 1px;transition:background-size .28s var(--ease)}
.crumbs a:hover{background-size:100% 1px}
.crumbs span{margin:0 8px;color:var(--brass-light)}
/* text-only hero for utility pages (contact, portal) */
.hero-plain{background:var(--char);color:var(--cream);padding:clamp(56px,7vw,96px) 0 clamp(48px,6vw,80px);position:relative}
.hero-plain::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--brass)}
.hero-plain h1{font-size:clamp(36px,4.2vw,56px);color:var(--cream);max-width:20ch;margin-bottom:18px}
.hero-plain h1 em{font-style:normal;color:var(--brass-light)}
.hero-plain .lead{color:rgba(247,243,234,.82)}
.hero-plain .kicker{color:var(--brass-light)}
.hero-plain .kicker::before{background:var(--brass-light)}

/* generic sections */
.sec{padding:clamp(72px,8vw,120px) 0;background:var(--white)}
.sec.band{background:var(--band)}
.sec.tight{padding:clamp(48px,6vw,80px) 0}
.sec-head{max-width:64ch;margin-bottom:44px}
.sec-head h2{margin-bottom:14px}
.sec-head.row{max-width:none;display:flex;justify-content:space-between;align-items:end;gap:32px}

/* spec strip: facts about a category, brass rule on top */
.spec{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:24px 32px;padding:28px 0;border-top:1px solid var(--brass);border-bottom:1px solid var(--rule)}
.spec dt{font-size:12.5px;color:var(--ink-3);margin-bottom:4px}
.spec dd{font-weight:600;font-size:15.5px;color:var(--ink);overflow-wrap:anywhere}

/* split: text beside a framed photo */
.split{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.split.rev > :first-child{order:2}
.split h2{margin-bottom:18px}
.split .lead{margin-bottom:22px}
.split p + p{margin-top:14px}
.split .copy p{color:var(--ink-2);max-width:54ch}
.frame{position:relative;aspect-ratio:4/3;background:var(--band);margin:16px 0 0 16px}
.frame.tall{aspect-ratio:4/5}
.frame::before{content:"";position:absolute;inset:0;transform:translate(-16px,-16px);border:1px solid var(--brass);pointer-events:none}
.frame img{width:100%;height:100%;object-fit:cover;position:relative}

/* cards: one level only, never nested */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.cards.two{grid-template-columns:repeat(2,1fr)}
.cards.four{grid-template-columns:repeat(4,1fr)}
.card{background:var(--white);border:1px solid var(--rule);border-top:3px solid var(--brass);padding:28px 28px 30px;display:flex;flex-direction:column;gap:8px;transition:box-shadow .32s var(--ease),transform .32s var(--ease)}
a.card:hover{box-shadow:var(--shadow);transform:translateY(-3px)}
.card .who{font-family:var(--serif);font-variant-caps:small-caps;letter-spacing:.03em;font-size:15px;color:var(--brass-deep)}
.card h3{font-size:24px}
.card p{font-size:15.5px;color:var(--ink-2)}
.card .txtlink{margin-top:auto;align-self:flex-start;font-size:15px}
.card p + .txtlink{margin-top:14px}

/* plates: photo grid with captions */
.plates{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.plates.two{grid-template-columns:repeat(2,1fr)}
.plate .ph{aspect-ratio:4/3;overflow:hidden;background:var(--band)}
.plate .ph img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.plate:hover .ph img{transform:scale(1.03)}
.plates.four{grid-template-columns:repeat(4,1fr)}
.plate .ph.tall{aspect-ratio:4/5}
.plate .ph.wide{aspect-ratio:16/9}
.plate figcaption p{margin-top:6px;max-width:44ch}
.plate figcaption .for{display:block;margin-top:10px;font-size:13.5px;color:var(--ink-3)}
/* draft-only: photo still to be shot */
.ph.empty{display:grid;place-items:center;text-align:center;padding:20px;background:var(--band);color:var(--ink-3);font-size:13.5px}
.plate .mark{height:30px;width:auto;max-width:150px;object-fit:contain;margin:4px 0 10px}
.plate figcaption{padding-top:12px;font-size:14px;color:var(--ink-2)}
.plate figcaption b{display:block;font-family:var(--serif);font-weight:400;font-size:19px;color:var(--ink);margin-bottom:2px}

/* rows: numbered plain list, same look as the home Why section */
.rows{display:grid;grid-template-columns:1fr 1fr;gap:0 64px}
.rows.one{grid-template-columns:1fr}

/* ticks: short plain list */
.ticks{display:grid;gap:12px;margin:22px 0 0}
.ticks li{position:relative;padding-left:28px;color:var(--ink-2);font-size:16px}
.ticks li::before{content:"";position:absolute;left:0;top:.72em;width:16px;height:1px;background:var(--brass)}
.ticks li b{color:var(--ink);font-weight:600}

/* FAQ */
.faq{border-top:1px solid var(--brass);max-width:860px}
.faq details{border-bottom:1px solid var(--rule)}
.faq summary{list-style:none;cursor:pointer;padding:22px 44px 22px 0;font-family:var(--serif);font-size:21px;line-height:1.3;color:var(--ink);position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:6px;top:18px;font-family:var(--sans);font-size:24px;color:var(--brass-deep);transition:transform .25s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 44px 24px 0;color:var(--ink-2);max-width:68ch}

/* forms */
.form{background:var(--white);border:1px solid var(--rule);border-top:3px solid var(--brass);padding:clamp(24px,3.5vw,40px)}
.form h3{margin-bottom:6px}
.form .hint{font-size:14.5px;color:var(--ink-2);margin-bottom:24px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px 20px}
.field{display:flex;flex-direction:column;gap:6px}
.field.full{grid-column:1/-1}
.field label,.field legend{font-size:14px;font-weight:600;color:var(--ink)}
.field .opt{font-weight:400;color:var(--ink-3)}
.field input,.field select,.field textarea{font:inherit;font-size:16px;color:var(--ink);background:var(--white);border:1px solid var(--rule-strong);border-radius:2px;padding:12px 14px;width:100%;transition:border-color .2s}
.field textarea{min-height:130px;resize:vertical}
.field input:hover,.field select:hover,.field textarea:hover{border-color:var(--ink-3)}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--char);outline:2px solid var(--brass-deep);outline-offset:2px}
fieldset.field{border:0}
.choices{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:4px}
.choices label{display:flex;gap:10px;align-items:flex-start;font-weight:500;font-size:15px;color:var(--ink-2);border:1px solid var(--rule);padding:12px 14px;border-radius:2px;cursor:pointer}
.choices label:hover{border-color:var(--rule-strong)}
.choices input{width:auto;margin-top:4px;accent-color:var(--char)}
.check{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--ink-2)}
.check input{width:auto;margin-top:4px;accent-color:var(--char)}
.form .btn{margin-top:24px;cursor:pointer;font-family:inherit}
.form .step + .step{margin-top:32px;padding-top:28px;border-top:1px solid var(--rule)}
.form .step > h4{font-family:var(--serif);font-weight:400;font-size:20px;margin-bottom:16px;color:var(--ink)}
/* wizard: one step at a time. Without script the form stays flat and fully usable. */
.wiz-top{display:flex;align-items:center;gap:16px;margin-bottom:28px;font-size:13.5px;font-weight:600;color:var(--ink-3)}
.wiz-track{flex:1;height:2px;background:var(--rule);position:relative}
.wiz-track i{position:absolute;left:0;top:0;bottom:0;width:0;background:var(--brass);transition:width .35s var(--ease)}
.form.wiz .step{display:none;margin-top:0;padding-top:0;border-top:0}
.form.wiz .step.on{display:block;animation:rise .45s var(--ease)}
.wiz-bar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:30px;padding-top:22px;border-top:1px solid var(--rule)}
.form .wiz-bar .btn{margin-top:0}
.wiz-bar .push{margin-left:auto}
.wiz-skip{font:inherit;font-size:14.5px;font-weight:600;color:var(--ink-2);background:none;border:0;padding:6px 2px;cursor:pointer;text-decoration:underline;text-decoration-color:var(--brass);text-underline-offset:4px}
.wiz-skip:hover{color:var(--char)}
.wiz-err{margin-top:16px;font-size:14.5px;font-weight:600;color:#9B3A25}
.wiz-top[hidden],.wiz-bar[hidden],.wiz-bar [hidden],.wiz-err[hidden]{display:none}
@media (prefers-reduced-motion:reduce){.form.wiz .step.on{animation:none}}
.form-msg{border:1px solid var(--rule);border-left:3px solid var(--brass);background:var(--band);padding:20px 22px;margin-top:20px;font-size:15.5px;color:var(--ink-2)}
.form-msg.err{border-left-color:#B4472F}
/* honeypot and screen-reader-only text */
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.vh{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.form-side{display:grid;grid-template-columns:.85fr 1.15fr;gap:64px;align-items:start}

/* contact blocks */
.contact-list{display:grid;gap:22px;margin-top:28px;padding-top:26px;border-top:1px solid var(--brass)}
.contact-list dt{font-size:12.5px;color:var(--ink-3);margin-bottom:3px}
.contact-list dd{font-weight:600;font-size:16px;color:var(--ink)}
.contact-list dd a{background:linear-gradient(var(--brass),var(--brass)) no-repeat 0 100%/100% 1px}
.map{aspect-ratio:16/7;background:var(--band);border:1px solid var(--rule);display:grid;place-items:center;color:var(--ink-3);font-size:14px;text-align:center;padding:24px}

/* rhythm between components stacked inside one section */
.sec .wrap > * + .cards,.sec .wrap > * + .plates,.sec .wrap > * + .spec,.sec .wrap > * + .map,.sec .wrap > * + .split,.sec .wrap > * + .rows,.sec .wrap > * + .stats,.sec .wrap > * + .tiers,.sec .wrap > * + .brands{margin-top:40px}
.sec .wrap > .sec-head + *{margin-top:0}
.card .ticks{margin-top:10px}

/* button row in any section */
.actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px}

/* links inside running copy */
.sec p a:not(.btn):not(.txtlink),.faq p a,.spec dd a,.facts dd a,.ticks a{color:var(--char);font-weight:600;background:linear-gradient(var(--brass),var(--brass)) no-repeat 0 100%/100% 1px;transition:color .2s}
.sec p a:not(.btn):not(.txtlink):hover,.faq p a:hover,.spec dd a:hover,.facts dd a:hover,.ticks a:hover{color:var(--brass-deep)}

/* anchors clear the sticky nav */
[id]{scroll-margin-top:112px}

/* draft-only marker: copy that needs a real fact before it ships.
   Invisible by default. Add class "review" to <html> to tint the flagged copy. */
html.review [data-ph]{background:rgba(180,71,47,.09);box-shadow:0 0 0 4px rgba(180,71,47,.09);border-radius:2px}

@media (max-width:980px){
  .split,.form-side{grid-template-columns:1fr;gap:40px}
  .split.rev > :first-child{order:0}
  .cards,.cards.four,.plates,.plates.four{grid-template-columns:1fr 1fr}
  .rows{gap:0 40px}
  .sec-head.row{flex-direction:column;align-items:flex-start}
}
@media (max-width:600px){
  .cards,.cards.two,.cards.four,.plates,.plates.two,.plates.four,.rows,.form-grid,.choices{grid-template-columns:1fr}
  .frame{margin:12px 0 0 12px}
  .frame::before{transform:translate(-12px,-12px)}
  .hero-photo{aspect-ratio:auto}
  .nav .wrap{gap:12px}
  .nav .cta{gap:8px}
  .faq summary{font-size:19px}
  .hero-actions .btn{width:100%}
}
@media (max-width:440px){
  .nav .logo img{height:38px}
  .nav .cta .btn{padding:10px 10px;font-size:12.5px}
  .mnav summary{padding:9px 10px;font-size:13px}
}