/* Epoch Homes NW — shared stylesheet
   Palette and type carried over from the approved design.
   Edit here once; every page picks it up. */

:root{
  --black:#0f0f0d;
  --black-deep:#080806;
  --panel:#111110;
  --offwhite:#f5f2ed;
  --cream:#ede8e0;
  --stone:#c8c0b4;
  --warm-grey:#8c8880;
  --ink:#4a4844;
  --gold:#b8975a;
  --gold-light:#d4b57a;
  --sage:#6b7c6e;
  --slate:#7a9eb5;
  --nav-h:64px;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Jost',sans-serif;background:var(--offwhite);color:var(--black);overflow-x:hidden}
a{color:inherit}
img{max-width:100%;display:block}

:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}

/* ── NAV ───────────────────────────────────────────── */
nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;justify-content:space-between;
  align-items:center;padding:1.2rem 3rem;transition:background .4s,padding .4s}
nav.scrolled,nav.solid{background:rgba(15,15,13,.96);backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(184,151,90,.12);padding:.9rem 3rem}
.nav-logo{font-family:'Cormorant Garamond',serif;font-size:1.25rem;font-weight:300;
  letter-spacing:.12em;color:var(--offwhite);white-space:nowrap;text-decoration:none}
.nav-logo span{color:var(--gold)}
.nav-links{display:flex;gap:2rem;align-items:center}
.nav-links a{font-size:.64rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;
  color:rgba(245,242,237,.7);text-decoration:none;transition:color .3s;white-space:nowrap}
.nav-links a:hover,.nav-links a.here{color:var(--gold)}
.nav-cta{border:1px solid var(--gold)!important;color:var(--gold)!important;padding:.5rem 1.2rem;transition:all .3s!important}
.nav-cta:hover{background:var(--gold)!important;color:var(--black)!important}
.nav-toggle{display:none;background:none;border:0;color:var(--offwhite);font-size:1.4rem;
  cursor:pointer;line-height:1;padding:.2rem .4rem}

/* ── BUTTONS ───────────────────────────────────────── */
.btn-gold,.btn-ghost,.btn-dark,.btn-outline{display:inline-block;padding:.9rem 2.2rem;border:none;
  cursor:pointer;font-family:'Jost',sans-serif;font-size:.68rem;font-weight:700;letter-spacing:.2em;
  text-transform:uppercase;text-decoration:none;transition:all .3s}
.btn-gold{background:var(--gold);color:var(--black)}
.btn-gold:hover{background:var(--gold-light);transform:translateY(-2px)}
.btn-ghost{background:transparent;color:rgba(245,242,237,.75);border:1px solid rgba(245,242,237,.3)}
.btn-ghost:hover{border-color:var(--gold);color:var(--gold)}
.btn-outline{background:transparent;color:var(--black);border:1px solid var(--stone)}
.btn-outline:hover{border-color:var(--gold);color:var(--gold)}
.btn-dark{background:var(--black);color:var(--offwhite);width:100%}
.btn-dark:hover{background:var(--gold);color:var(--black)}

/* ── SHARED SECTION FURNITURE ──────────────────────── */
section{padding:6.5rem 4rem}
.section-inner{max-width:1200px;margin:0 auto}
.label{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem}
.label-line{width:26px;height:1px;background:var(--gold);flex-shrink:0}
.label span{font-size:.6rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);font-weight:600}
h1,h2,h3{font-family:'Cormorant Garamond',serif;font-weight:300;line-height:1.15}
h2{font-size:clamp(2rem,3.5vw,3rem)}
h2 em,h1 em{font-style:italic}
.on-dark{background:var(--black)}
.on-dark h2,.on-dark h3{color:var(--offwhite)}
.on-dark p{color:rgba(245,242,237,.5)}
.lede{font-size:.9rem;font-weight:300;line-height:1.9;color:var(--ink);max-width:62ch}
.lede-dark{font-size:.9rem;font-weight:300;line-height:1.9;color:rgba(245,242,237,.5);max-width:62ch}

.reveal{opacity:0;transform:translateY(20px);transition:opacity .8s ease,transform .8s ease}
.reveal.visible{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none}}

/* ── STATUS PILLS ──────────────────────────────────── */
.pill{display:inline-block;font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;
  padding:.28rem .85rem;border:1px solid;white-space:nowrap}
.pill-gold{background:rgba(184,151,90,.14);color:var(--gold);border-color:rgba(184,151,90,.35)}
.pill-sage{background:rgba(107,124,110,.14);color:var(--sage);border-color:rgba(107,124,110,.35)}
.pill-slate{background:rgba(122,158,181,.14);color:var(--slate);border-color:rgba(122,158,181,.35)}
.pill-grey{background:rgba(140,136,128,.14);color:var(--warm-grey);border-color:rgba(140,136,128,.35)}
.on-dark .pill-grey{color:#a5a099}

/* ── PAGE HEADER (interior pages) ──────────────────── */
.page-head{background:var(--black);padding:calc(var(--nav-h) + 5rem) 4rem 4rem;position:relative;overflow:hidden}
.page-head::after{content:'';position:absolute;top:-20%;right:16%;width:1px;height:140%;
  transform:rotate(10deg);background:linear-gradient(to bottom,transparent,rgba(184,151,90,.18),transparent)}
.page-head-inner{max-width:1200px;margin:0 auto;position:relative;z-index:1}
.page-head h1{font-size:clamp(2.2rem,5vw,4rem);color:var(--offwhite);margin-bottom:1rem}
.page-head h1 em{color:var(--gold-light)}
.crumb{font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(245,242,237,.35);
  margin-bottom:1.6rem;display:flex;gap:.6rem;align-items:center;flex-wrap:wrap}
.crumb a{color:var(--gold);text-decoration:none}
.crumb a:hover{color:var(--gold-light)}
.head-tags{display:flex;gap:.6rem;flex-wrap:wrap;margin-bottom:1.4rem}

/* ── CARD GRIDS ────────────────────────────────────── */
.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1.5rem}
.card-grid.two{grid-template-columns:repeat(auto-fill,minmax(400px,1fr))}
.card{border:1px solid var(--stone);background:#fff;display:flex;flex-direction:column;
  text-decoration:none;color:inherit;transition:border-color .3s,transform .3s}
.card:hover{border-color:var(--gold);transform:translateY(-3px)}
.card-visual{aspect-ratio:16/10;display:flex;align-items:center;justify-content:center;
  flex-direction:column;gap:.35rem;text-align:center;padding:1.5rem;position:relative}
.card-visual .cv-name{font-family:'Cormorant Garamond',serif;font-size:1.7rem;letter-spacing:.04em}
.card-visual .cv-loc{font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;opacity:.6}
.card-body{padding:1.5rem 1.6rem 1.7rem;display:flex;flex-direction:column;flex:1}
.card-pills{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:.9rem}
.card-headline{font-family:'Cormorant Garamond',serif;font-size:1.1rem;line-height:1.4;margin-bottom:.6rem}
.card-desc{font-size:.78rem;font-weight:300;line-height:1.8;color:var(--warm-grey);flex:1;margin-bottom:1.1rem}
.card-foot{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;
  border-top:1px solid var(--stone);padding-top:.9rem}
.card-price{font-family:'Cormorant Garamond',serif;font-size:1.15rem;color:var(--gold)}
.card-more{font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;color:var(--warm-grey)}
.card:hover .card-more{color:var(--gold)}

/* Dark variant used on the home page */
.on-dark .card{background:var(--panel);border-color:rgba(184,151,90,.16)}
.on-dark .card-headline{color:var(--offwhite)}
.on-dark .card-desc{color:rgba(245,242,237,.42)}
.on-dark .card-foot{border-top-color:rgba(184,151,90,.16)}

/* ── FILTER BAR ────────────────────────────────────── */
.filters{display:flex;gap:.6rem;flex-wrap:wrap;margin-bottom:2.5rem}
.filter-btn{background:transparent;border:1px solid var(--stone);color:var(--warm-grey);
  font-family:'Jost',sans-serif;font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;
  padding:.5rem 1.1rem;cursor:pointer;transition:all .3s}
.filter-btn:hover{border-color:var(--gold);color:var(--gold)}
.filter-btn.active{background:var(--black);border-color:var(--black);color:var(--offwhite)}
.empty-note{font-size:.85rem;color:var(--warm-grey);padding:2rem 0}

/* ── DETAIL PAGE BODY ──────────────────────────────── */
.detail{display:grid;grid-template-columns:1.4fr 1fr;gap:4rem;align-items:start}
.detail-body p{font-size:.9rem;font-weight:300;line-height:1.95;color:var(--ink);margin-bottom:1.1rem}
.detail-body h3{font-size:1.4rem;margin:2.5rem 0 1rem}
.sidebar{border:1px solid var(--stone);background:#fff;padding:1.8rem;position:sticky;top:calc(var(--nav-h) + 1.5rem)}
.sidebar h3{font-size:1.2rem;margin-bottom:1.2rem}
.spec-list{list-style:none;display:grid;gap:.65rem;margin-bottom:1.6rem}
.spec-list li{display:flex;gap:.7rem;font-size:.8rem;line-height:1.5;color:var(--ink)}
.spec-line{width:14px;height:1px;background:var(--gold);flex-shrink:0;margin-top:.6rem}
.fact-row{display:flex;justify-content:space-between;gap:1rem;font-size:.78rem;
  padding:.6rem 0;border-bottom:1px solid var(--cream)}
.fact-row dt{color:var(--warm-grey);letter-spacing:.06em}
.fact-row dd{text-align:right;font-weight:500}
.sidebar .btn-gold{width:100%;text-align:center;margin-top:1.4rem}
.side-note{font-size:.7rem;line-height:1.7;color:var(--warm-grey);margin-top:.9rem;text-align:center}

/* ── PLAN + DIVISION BITS ──────────────────────────── */
.plan-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));
  gap:1px;background:var(--stone);border:1px solid var(--stone);margin:2rem 0}
.plan-stat{background:#fff;padding:1.3rem 1rem;text-align:center}
.plan-stat .v{font-family:'Cormorant Garamond',serif;font-size:1.8rem;color:var(--gold);display:block}
.plan-stat .k{font-size:.55rem;letter-spacing:.2em;text-transform:uppercase;color:var(--warm-grey);margin-top:.3rem;display:block}
.opt-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:1rem;margin-top:1.2rem}
.opt{border:1px solid var(--stone);background:#fff;padding:1.1rem 1.2rem}
.opt-name{font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;margin-bottom:.35rem}
.opt-desc{font-size:.74rem;line-height:1.6;color:var(--warm-grey)}
.where-list{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1rem}
.where-list a{font-size:.65rem;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;
  border:1px solid var(--stone);padding:.45rem 1rem;color:var(--ink);transition:all .3s}
.where-list a:hover{border-color:var(--gold);color:var(--gold)}

.div-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1px;background:rgba(184,151,90,.12)}
.div-card{background:var(--panel);padding:2.4rem 1.9rem;text-decoration:none;display:flex;
  flex-direction:column;transition:background .3s}
.div-card:hover{background:#17170f}
.div-icon{font-size:1.3rem;color:var(--gold);opacity:.65;margin-bottom:1.1rem}
.div-title{font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  color:var(--offwhite);margin-bottom:.9rem;line-height:1.45}
.div-desc{font-size:.78rem;font-weight:300;line-height:1.8;color:rgba(245,242,237,.42);flex:1}
.div-does{list-style:none;margin-top:1.4rem;border-top:1px solid rgba(184,151,90,.15);padding-top:1rem;
  display:grid;gap:.4rem}
.div-does li{font-size:.7rem;letter-spacing:.02em;color:rgba(245,242,237,.5);
  display:flex;gap:.55rem;line-height:1.5}
.div-does li::before{content:'';width:9px;height:1px;background:var(--gold);flex-shrink:0;margin-top:.55rem}
.div-card:hover .div-does li{color:rgba(245,242,237,.66)}
.footer-social a{color:var(--gold);text-decoration:none}
.footer-social a:hover{color:var(--gold-light)}

/* ── CONTACT ───────────────────────────────────────── */
.contact-split{display:grid;grid-template-columns:1fr 1fr}
.contact-left{background:var(--black);padding:6rem 4rem;display:flex;flex-direction:column;justify-content:center}
.contact-left h2{color:var(--offwhite);margin-bottom:1.3rem}
.contact-left h2 em{color:var(--gold-light)}
.contact-left>div>p{font-size:.88rem;font-weight:300;line-height:1.9;color:rgba(245,242,237,.48);margin-bottom:3rem}
.contact-info{display:flex;flex-direction:column;gap:1.5rem}
.ci-label{font-size:.57rem;letter-spacing:.26em;text-transform:uppercase;color:var(--gold);margin-bottom:.22rem}
.ci-value{font-size:.85rem;font-weight:300;color:rgba(245,242,237,.68)}
.ci-value a{color:inherit;text-decoration:none;border-bottom:1px solid rgba(184,151,90,.4)}
.contact-right{background:var(--cream);padding:6rem 4rem}
.contact-right h3{font-size:1.4rem;margin-bottom:2.5rem}
.form-group{margin-bottom:1.2rem}
.form-label{display:block;font-size:.58rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--warm-grey);margin-bottom:.4rem}
.form-input,.form-select,.form-textarea{width:100%;padding:.85rem 1rem;background:#fff;
  border:1px solid var(--stone);font-family:'Jost',sans-serif;font-size:.85rem;color:var(--black);
  outline:none;transition:border-color .3s;appearance:none}
.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:var(--gold)}
.form-textarea{height:110px;resize:vertical}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.form-note{font-size:.68rem;color:var(--warm-grey);margin-top:.9rem;line-height:1.6}
.form-status{display:none;padding:2.5rem;background:rgba(107,124,110,.1);border:1px solid var(--sage);text-align:center}
.form-status.show{display:block}
.form-status.error{background:rgba(184,90,90,.08);border-color:#a35f5f}
.form-status .check{font-family:'Cormorant Garamond',serif;font-size:2rem;color:var(--sage);margin-bottom:.6rem}
.form-status h4{font-size:1.1rem;margin-bottom:.5rem}
.form-status p{font-size:.8rem;color:var(--warm-grey);line-height:1.7}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ── FOOTER ────────────────────────────────────────── */
footer{background:var(--black-deep);padding:3.5rem 4rem;border-top:1px solid rgba(184,151,90,.1)}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:3rem;margin-bottom:3rem}
.footer-logo{font-family:'Cormorant Garamond',serif;font-size:1.5rem;letter-spacing:.15em;
  color:rgba(245,242,237,.6);margin-bottom:1rem;text-decoration:none;display:inline-block}
.footer-logo span{color:var(--gold)}
.footer-desc{font-size:.78rem;font-weight:300;line-height:1.9;color:rgba(245,242,237,.28)}
.footer-col-title{font-size:.58rem;letter-spacing:.25em;text-transform:uppercase;color:var(--gold);margin-bottom:1.2rem}
.footer-col-item{font-size:.72rem;color:rgba(245,242,237,.3);margin-bottom:.55rem;line-height:1.5}
.footer-col-item a{text-decoration:none;transition:color .3s}
.footer-col-item a:hover{color:var(--gold)}
.footer-bottom{border-top:1px solid rgba(184,151,90,.08);padding-top:2rem;display:flex;
  justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}
.footer-copy{font-size:.62rem;letter-spacing:.08em;color:rgba(245,242,237,.2);line-height:1.9}
.footer-links{display:flex;gap:1.6rem;flex-wrap:wrap}
.footer-links a{font-size:.6rem;letter-spacing:.15em;text-transform:uppercase;
  color:rgba(245,242,237,.22);text-decoration:none;transition:color .3s}
.footer-links a:hover{color:var(--gold)}

/* ── MOBILE ────────────────────────────────────────── */
@media (max-width:860px){
  nav{padding:1rem 1.5rem}
  nav.scrolled,nav.solid{padding:.85rem 1.5rem}
  .nav-toggle{display:block}
  .nav-links{position:fixed;top:0;right:0;bottom:0;width:min(78vw,300px);background:rgba(12,12,10,.985);
    backdrop-filter:blur(12px);flex-direction:column;justify-content:center;gap:1.8rem;
    transform:translateX(100%);transition:transform .35s ease;border-left:1px solid rgba(184,151,90,.15)}
  .nav-links.open{transform:none}
  .nav-links a{font-size:.75rem}
  section{padding:4rem 1.5rem}
  .page-head{padding:calc(var(--nav-h) + 3.5rem) 1.5rem 3rem}
  .detail{grid-template-columns:1fr;gap:2.5rem}
  .sidebar{position:static}
  .contact-split{grid-template-columns:1fr}
  .contact-left,.contact-right{padding:3.5rem 1.5rem}
  .footer-grid{grid-template-columns:1fr 1fr;gap:2rem}
  footer{padding:2.5rem 1.5rem}
  .card-grid,.card-grid.two{grid-template-columns:1fr}
}
@media (max-width:520px){
  .footer-grid{grid-template-columns:1fr}
  .form-row{grid-template-columns:1fr}
}

/* Phone in the nav — hidden on small screens where the menu takes over */
.nav-phone{font-size:.64rem;font-weight:500;letter-spacing:.14em;color:var(--gold);
  text-decoration:none;white-space:nowrap}
.nav-phone:hover{color:var(--gold-light)}
@media (max-width:860px){.nav-phone{font-size:.8rem;letter-spacing:.08em}}

/* ═══════════════════════════════════════════════════════════════
   HOMEPAGE UPDATE — reusable components
   ═══════════════════════════════════════════════════════════════ */

/* ── Image placeholders ────────────────────────────────────────
   Wrap any future photo in .ph. Drop an <img> inside and it fills
   the same box at the same aspect ratio; the placeholder art sits
   behind it and simply stops showing. No layout change either way. */
.ph{position:relative;overflow:hidden;background:linear-gradient(135deg,#23221a,#131310);
  border:1px solid rgba(184,151,90,.18);display:flex;align-items:center;justify-content:center}
.ph::before{content:'';position:absolute;top:-25%;right:22%;width:1px;height:150%;
  transform:rotate(10deg);background:linear-gradient(to bottom,transparent,rgba(184,151,90,.28),transparent)}
.ph::after{content:'';position:absolute;top:-25%;right:34%;width:1px;height:150%;
  transform:rotate(10deg);background:linear-gradient(to bottom,transparent,rgba(184,151,90,.14),transparent)}
.ph>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:2}
.ph-mark{position:relative;z-index:1;text-align:center;padding:1.5rem;
  display:flex;flex-direction:column;align-items:center;gap:.5rem}
.ph-roof{width:44px;height:26px;flex-shrink:0}
.ph-label{font-size:.55rem;letter-spacing:.3em;text-transform:uppercase;
  color:rgba(184,151,90,.55);line-height:1.8}
.ph-16x10{aspect-ratio:16/10}
.ph-4x3{aspect-ratio:4/3}
.ph-3x4{aspect-ratio:3/4}
.ph-1x1{aspect-ratio:1/1}

/* ── Proof bar ─────────────────────────────────────────────── */
.proof{background:#0a0a08;border-top:1px solid rgba(184,151,90,.18);
  display:grid;grid-template-columns:repeat(4,1fr);gap:1px}
.proof-item{padding:1.6rem 1.2rem;text-align:center;background:#0a0a08}
.proof-v{font-family:'Cormorant Garamond',serif;font-size:1.55rem;font-weight:300;
  color:var(--gold);display:block;line-height:1.2}
.proof-v.small{font-size:1rem;letter-spacing:.06em;padding-top:.28rem}
.proof-k{font-size:.55rem;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(245,242,237,.34);margin-top:.45rem;display:block;line-height:1.6}

/* ── Featured project cards (homepage) ─────────────────────── */
.feature-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.8rem}
.feature-card{border:1px solid rgba(184,151,90,.2);background:var(--panel);
  text-decoration:none;color:inherit;display:flex;flex-direction:column;
  transition:border-color .3s,transform .3s}
.feature-card:hover{border-color:var(--gold);transform:translateY(-3px)}
.feature-body{padding:1.8rem;display:flex;flex-direction:column;flex:1}
.feature-pills{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1rem}
.feature-name{font-family:'Cormorant Garamond',serif;font-size:1.75rem;
  color:var(--gold);line-height:1.15}
.feature-loc{font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;
  color:rgba(245,242,237,.4);margin:.3rem 0 1rem}
.feature-headline{font-family:'Cormorant Garamond',serif;font-size:1.2rem;
  line-height:1.4;color:var(--offwhite);margin-bottom:.8rem}
.feature-desc{font-size:.82rem;font-weight:300;line-height:1.85;
  color:rgba(245,242,237,.45);flex:1;margin-bottom:1.4rem}
.feature-foot{display:flex;justify-content:space-between;align-items:baseline;
  gap:1rem;border-top:1px solid rgba(184,151,90,.18);padding-top:1rem}
.feature-price{font-family:'Cormorant Garamond',serif;font-size:1.5rem;color:var(--gold)}
.feature-cta{font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}

/* ── Founder / credibility band ────────────────────────────── */
.founder{display:grid;grid-template-columns:0.85fr 1.15fr;gap:4rem;align-items:center}
.founder-copy p{font-size:.9rem;font-weight:300;line-height:1.95;color:var(--ink);margin-bottom:1.1rem}
.founder-copy strong{font-weight:600}
.pull{font-family:'Cormorant Garamond',serif;font-size:clamp(1.3rem,2.2vw,1.75rem);
  font-weight:300;font-style:italic;line-height:1.45;color:var(--black);
  border-left:2px solid var(--gold);padding:.3rem 0 .3rem 1.6rem;margin:2rem 0}

/* ── Capability cards (homepage summary of services) ───────── */
.cap-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:1px;background:rgba(184,151,90,.14);margin-top:2.5rem}
.cap{background:var(--panel);padding:1.9rem 1.5rem;display:flex;flex-direction:column}
.cap-name{font-size:.68rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--gold);margin-bottom:.8rem;line-height:1.5}
.cap-desc{font-size:.78rem;font-weight:300;line-height:1.8;color:rgba(245,242,237,.44)}
.cap.lead{background:#16150f;border-top:2px solid var(--gold)}
.cap.lead .cap-name{color:var(--offwhite)}

/* ── The Work gallery ──────────────────────────────────────── */
.work-grid{display:grid;grid-template-columns:1.5fr 1fr;grid-template-rows:auto auto;
  gap:1.2rem;margin-top:3rem}
.work-grid>*:nth-child(1){grid-row:span 2}
.work-grid>*:nth-child(4){grid-column:span 2}
.work-grid .ph{aspect-ratio:auto;min-height:220px}
.work-grid>*:nth-child(1).ph{min-height:460px}
.work-grid>*:nth-child(4).ph{min-height:260px}

@media (max-width:860px){
  .proof{grid-template-columns:1fr 1fr}
  .feature-grid{grid-template-columns:1fr;gap:1.4rem}
  .founder{grid-template-columns:1fr;gap:2.5rem}
  .cap-grid{grid-template-columns:1fr}
  .work-grid{grid-template-columns:1fr 1fr;gap:.8rem}
  .work-grid>*:nth-child(1){grid-row:span 1;grid-column:span 2}
  .work-grid>*:nth-child(4){grid-column:span 2}
  .work-grid .ph,.work-grid>*:nth-child(1).ph,.work-grid>*:nth-child(4).ph{min-height:180px}
  .pull{font-size:1.15rem;padding-left:1.1rem}
}

/* ── Hero (moved out of inline styles) ─────────────────────── */
.hero{min-height:100vh;background:var(--black);display:flex;flex-direction:column;
  justify-content:flex-end;position:relative;overflow:hidden;padding:0 4rem 5rem}
.hero-rule{position:absolute;top:-20%;width:1px;height:140%;transform:rotate(10deg);pointer-events:none}
.hero-ridge{position:absolute;bottom:0;left:0;right:0;opacity:.09;pointer-events:none}
.hero-content{position:relative;z-index:2;max-width:860px}
.hero-eyebrow{display:flex;align-items:center;gap:.8rem;margin-bottom:1.6rem}
.hero-eyebrow-line{width:36px;height:1px;background:var(--gold);flex-shrink:0}
.hero-eyebrow span{font-size:.58rem;letter-spacing:.28em;text-transform:uppercase;color:var(--gold)}
.hero h1{font-family:'Cormorant Garamond',serif;font-size:clamp(2.6rem,6vw,5.4rem);
  font-weight:300;line-height:1.06;color:var(--offwhite);margin-bottom:1.6rem}
.hero h1 em{color:var(--gold-light);font-style:italic}
.hero-sub{font-size:.86rem;font-weight:300;line-height:1.9;color:rgba(245,242,237,.52);
  max-width:560px;margin-bottom:1rem}
.hero-sub+.hero-sub{margin-bottom:2.4rem}
.hero-btns{display:flex;gap:1.2rem;flex-wrap:wrap}
@media (max-width:860px){
  .hero{padding:calc(var(--nav-h) + 3rem) 1.5rem 3.5rem;min-height:auto}
  .hero h1{font-size:clamp(2.2rem,9vw,3rem)}
  .hero-sub{font-size:.84rem}
  .hero-eyebrow span{font-size:.55rem;letter-spacing:.2em}
}

/* ── Services page blocks ──────────────────────────────────── */
.svc-block{display:grid;grid-template-columns:1fr 1.6fr;gap:3rem;padding:2.8rem 0;
  border-top:1px solid var(--stone);align-items:start}
.svc-block:first-of-type{border-top:none;padding-top:1rem}
.svc-block.lead .svc-head h3{color:var(--gold)}
.svc-head h3{font-size:1.7rem;margin-bottom:.8rem}
.svc-desc{font-size:.85rem;font-weight:300;line-height:1.8;color:var(--warm-grey)}
.svc-detail p{font-size:.9rem;font-weight:300;line-height:1.95;color:var(--ink);margin-bottom:1.4rem}
.svc-inc-label{font-size:.55rem;letter-spacing:.25em;text-transform:uppercase;
  color:var(--gold);margin-bottom:.9rem}
.svc-inc{list-style:none;display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.6rem}
.svc-inc li{font-size:.72rem;letter-spacing:.04em;color:var(--ink);
  border:1px solid var(--stone);background:#fff;padding:.4rem .85rem}

/* ── Primary project image ─────────────────────────────────── */
.primary-img{margin-bottom:3rem}
.ph-21x9{aspect-ratio:21/9}
.ph-sub{font-size:.52rem;letter-spacing:.22em;text-transform:uppercase;
  color:rgba(184,151,90,.4);margin-top:.2rem}
.extras-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;margin-top:1.2rem}
.extras-grid .ph{aspect-ratio:4/3}

/* ── Card spec chips ───────────────────────────────────────── */
.card-specs{list-style:none;display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1.2rem}
.card-specs li{font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;
  color:rgba(245,242,237,.55);border:1px solid rgba(184,151,90,.22);padding:.28rem .6rem}
.feature-card.compact .feature-desc{font-size:.78rem}
.feature-grid.three{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}

/* capability cards are links now */
a.cap{text-decoration:none;transition:background .3s}
a.cap:hover{background:#17170f}

@media (max-width:860px){
  .svc-block{grid-template-columns:1fr;gap:1.4rem;padding:2rem 0}
  .extras-grid{grid-template-columns:1fr}
  .ph-21x9{aspect-ratio:16/10}
}

/* ── Social icon links ─────────────────────────────────────── */
.footer-social{display:flex;gap:.9rem;align-items:center;margin-top:.9rem}
.footer-social a{display:inline-flex;width:30px;height:30px;align-items:center;justify-content:center;
  border:1px solid rgba(184,151,90,.3);color:rgba(245,242,237,.5);
  transition:color .3s,border-color .3s,transform .3s}
.footer-social a:hover{color:var(--gold);border-color:var(--gold);transform:translateY(-2px)}
.footer-social svg{width:15px;height:15px;display:block}

/* A placeholder that has a real image in it */
.ph.has-img{background:var(--offwhite);border-color:var(--stone)}
.ph.has-img::before,.ph.has-img::after{display:none}
.ph.has-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;
  object-position:center;background:var(--black)}
.extras-grid .ph.has-img img{object-fit:contain;background:var(--offwhite)}