/* AH Architecture | Interior Design — shared styles */
:root{
  --black:#0a0a0a;
  --white:#ffffff;
  --paper:#ffffff;
  --grey:#7a7a76;
  --grey-dark:#4a4a48;
  --line:#dcdcd8;
  --line-dark:#2a2a2a;
  --font-display:'Archivo',sans-serif;
  --font-body:'Inter',sans-serif;
  --gutter:clamp(20px,4vw,56px);
  --header-h:128px;
  --ease:cubic-bezier(.22,.61,.36,1);
}
@media (max-width:600px){ :root{ --header-h:84px; } }

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0; background:var(--paper); color:var(--black);
  font-family:var(--font-body); font-size:16px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3,h4{ font-family:var(--font-display); font-weight:700; line-height:1.08; margin:0 0 .5em; letter-spacing:-.01em; }
p{ margin:0 0 1em; color:var(--grey-dark); max-width:62ch; }
ul{ margin:0; padding:0; list-style:none; }
button{ font-family:inherit; cursor:pointer; }
input,select{ font-family:inherit; }

.icon{ display:inline-flex; width:1em; height:1em; }
.icon svg{ width:100%; height:100%; }

/* ===== Buttons ===== */
.btn{ display:inline-flex; align-items:center; gap:10px; padding:16px 30px; font-family:var(--font-display); font-weight:600; font-size:14px; letter-spacing:.02em; text-transform:uppercase; border:1px solid var(--black); background:transparent; color:var(--black); transition:background .3s var(--ease),color .3s var(--ease); }
.btn:hover{ background:var(--black); color:var(--white); }
.btn-solid{ background:var(--black); color:var(--white); }
.btn-solid:hover{ background:#222; }
.btn-invert{ border-color:var(--white); color:var(--white); }
.btn-invert:hover{ background:var(--white); color:var(--black); }

/* ===== Header ===== */
.site-header{ position:fixed; top:0; left:0; right:0; height:var(--header-h); z-index:500; display:flex; align-items:center; justify-content:space-between; padding:0 var(--gutter); transition:background .35s var(--ease),border-color .35s var(--ease); }
.site-header.theme-dark{ background:transparent; border-bottom:1px solid transparent; }
.site-header.theme-dark .brand,.site-header.theme-dark .menu-btn{ color:var(--white); }
.site-header.theme-light{ background:var(--paper); border-bottom:1px solid var(--line); }
.site-header.theme-light .brand,.site-header.theme-light .menu-btn{ color:var(--black); }
.brand{ display:flex; align-items:center; }
.brand img{ height:92px; width:auto; transition:opacity .2s; }
@media (max-width:600px){ .brand img{ height:56px; } }
.menu-btn{ display:flex; align-items:center; gap:12px; background:none; border:0; padding:8px 0; font-family:var(--font-display); font-weight:600; font-size:13px; letter-spacing:.08em; text-transform:uppercase; }
.menu-btn .bars{ display:flex; flex-direction:column; gap:5px; width:26px; }
.menu-btn .bars span{ display:block; height:2px; background:currentColor; transition:transform .3s var(--ease),opacity .3s var(--ease); }
.menu-btn.open .bars span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.menu-btn.open .bars span:nth-child(2){ opacity:0; }
.menu-btn.open .bars span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* ===== Fullscreen Nav Overlay ===== */
.nav-overlay{ position:fixed; inset:0; background:var(--black); color:var(--white); z-index:600; transform:translateY(-100%); transition:transform .55s var(--ease); overflow-y:auto; }
.nav-overlay.open{ transform:translateY(0); }
.nav-overlay-inner{ display:grid; grid-template-columns:1fr; min-height:100%; }
@media (min-width:900px){ .nav-overlay-inner{ grid-template-columns:1.1fr 1fr; } }
.nav-links{ display:flex; flex-direction:column; justify-content:center; padding:calc(var(--header-h) + 16px) var(--gutter) 24px; gap:0; min-height:calc(100vh - var(--header-h) - 120px); max-height:calc(100vh - 80px); overflow-y:auto; }
.nav-link{ font-family:var(--font-display); font-weight:700; font-size:clamp(20px,4.4vw,42px); color:var(--white); opacity:.5; padding:6px 0; transition:opacity .25s; display:flex; align-items:baseline; gap:14px; line-height:1.15; }
.nav-link .num{ font-size:12px; font-weight:500; opacity:.6; font-family:var(--font-body); }
@media (max-height:700px){ .nav-link{ font-size:clamp(18px,4vw,30px); padding:4px 0; } }
.nav-link:hover,.nav-link.active{ opacity:1; }
.nav-visual{ position:relative; display:none; }
@media (min-width:900px){ .nav-visual{ display:block; } }
.nav-frame{ position:absolute; inset:0; background-size:cover; background-position:center; opacity:0; transition:opacity .5s var(--ease); }
.nav-frame.active{ opacity:1; }
.nav-footer{ padding:24px var(--gutter) 40px; display:flex; flex-wrap:wrap; gap:24px 40px; border-top:1px solid rgba(255,255,255,.15); font-size:14px; color:rgba(255,255,255,.7); }
.nav-footer a:hover{ color:#fff; }
.nav-footer .nf-item{ display:flex; align-items:center; gap:10px; }

/* ===== Page hero (inner pages) ===== */
.page-hero{ padding:calc(var(--header-h) + 64px) var(--gutter) 48px; border-bottom:1px solid var(--line); }
.page-hero .eyebrow{ font-family:var(--font-display); font-size:13px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--grey); margin-bottom:14px; display:block; }
.page-hero h1{ font-size:clamp(38px,6vw,72px); }
.page-hero p{ max-width:none; font-size:clamp(15px,1.6vw,18px); }

.section{ padding:96px var(--gutter); }
.section-tight{ padding:56px var(--gutter); }

/* ===== Footer ===== */
.site-footer{ background:var(--black); color:rgba(255,255,255,.85); }
.foot-cta{ padding:80px var(--gutter); border-bottom:1px solid rgba(255,255,255,.12); display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:32px; }
.foot-cta h2{ color:#fff; font-size:clamp(24px,3.4vw,40px); max-width:34ch; flex:1 1 320px; margin:0; }
.foot-cta .foot-cta-actions{ display:flex; gap:14px; flex-wrap:wrap; }
.foot-main{ padding:64px var(--gutter); display:grid; grid-template-columns:1fr; gap:40px; }
@media (min-width:800px){ .foot-main{ grid-template-columns:1.3fr 1fr 1fr 1.3fr; gap:32px; } }
.foot-brand img{ height:48px; margin-bottom:18px; }
.foot-brand p{ color:rgba(255,255,255,.6); font-size:14px; max-width:32ch; }
.foot-social{ display:flex; gap:12px; margin-top:18px; }
.foot-social a{ width:38px; height:38px; border-radius:50%; border:1px solid rgba(255,255,255,.25); display:flex; align-items:center; justify-content:center; transition:background .25s,border-color .25s; }
.foot-social a:hover{ background:#fff; color:#000; border-color:#fff; }
.foot-social .icon{ width:16px; height:16px; }
.foot-col h4{ color:#fff; font-size:13px; letter-spacing:.1em; text-transform:uppercase; margin-bottom:16px; }
.foot-col a{ display:block; color:rgba(255,255,255,.65); font-size:15px; padding:6px 0; transition:color .2s; }
.foot-col a:hover{ color:#fff; }
.foot-contact li{ display:flex; align-items:flex-start; gap:10px; color:rgba(255,255,255,.65); font-size:15px; padding:6px 0; }
.foot-contact .icon{ margin-top:3px; flex-shrink:0; color:rgba(255,255,255,.5); }
.foot-bottom{ padding:22px var(--gutter); border-top:1px solid rgba(255,255,255,.12); display:flex; flex-wrap:wrap; justify-content:space-between; gap:10px; font-size:13px; color:rgba(255,255,255,.5); }
.foot-bottom a{ color:rgba(255,255,255,.75); }
.foot-bottom a:hover{ color:#fff; }

/* ===== WhatsApp widget ===== */
.wa-fab{ position:fixed; right:24px; bottom:24px; width:60px; height:60px; border-radius:50%; background:var(--black); color:#fff; display:flex; align-items:center; justify-content:center; border:0; z-index:400; box-shadow:0 8px 24px rgba(0,0,0,.25); transition:transform .25s; }
.wa-fab:hover{ transform:scale(1.06); }
.wa-fab .icon{ width:26px; height:26px; }
.wa-panel{ position:fixed; right:24px; bottom:96px; width:min(340px,calc(100vw - 48px)); background:#fff; border:1px solid var(--line); box-shadow:0 20px 50px rgba(0,0,0,.18); z-index:400; display:none; flex-direction:column; overflow:hidden; }
.wa-panel.open{ display:flex; }
.wa-head{ background:var(--black); color:#fff; padding:16px 18px; display:flex; align-items:center; justify-content:space-between; }
.wa-head strong{ font-family:var(--font-display); font-size:15px; }
.wa-head button{ background:none; border:0; color:#fff; width:24px; height:24px; }
.wa-body{ padding:18px; max-height:360px; overflow-y:auto; display:flex; flex-direction:column; gap:10px; }
.wa-msg{ background:#f2f2f0; padding:10px 14px; border-radius:14px 14px 14px 2px; font-size:14px; max-width:88%; }
.wa-choices{ display:flex; flex-wrap:wrap; gap:8px; }
.wa-choices button{ border:1px solid var(--line); background:#fff; padding:8px 14px; font-size:13px; border-radius:20px; transition:.2s; }
.wa-choices button:hover{ background:var(--black); color:#fff; border-color:var(--black); }
.wa-input-row{ display:flex; gap:8px; padding:12px 18px; border-top:1px solid var(--line); }
.wa-input-row input{ flex:1; border:1px solid var(--line); padding:10px 12px; font-size:14px; }
.wa-input-row button{ background:var(--black); color:#fff; border:0; padding:0 16px; }

/* ===== Lightbox (shared) ===== */
.lightbox{ position:fixed; inset:0; background:rgba(10,10,10,.97); z-index:900; display:none; align-items:center; justify-content:center; }
.lightbox.open{ display:flex; }
.lightbox img{ max-width:88vw; max-height:82vh; object-fit:contain; }
.lightbox .lb-close{ position:absolute; top:24px; right:24px; background:none; border:1px solid rgba(255,255,255,.3); color:#fff; width:44px; height:44px; border-radius:50%; display:flex; align-items:center; justify-content:center; }
.lightbox .lb-nav{ position:absolute; top:50%; transform:translateY(-50%); background:none; border:1px solid rgba(255,255,255,.3); color:#fff; width:48px; height:48px; border-radius:50%; display:flex; align-items:center; justify-content:center; }
.lightbox .lb-prev{ left:24px; }
.lightbox .lb-next{ right:24px; }
.lightbox .lb-prev .icon{ transform:rotate(180deg); }
.lightbox .lb-count{ position:absolute; bottom:24px; left:50%; transform:translateX(-50%); color:rgba(255,255,255,.6); font-size:13px; letter-spacing:.05em; }

/* ===== Home: intro ===== */
.intro{ background:var(--black); padding:calc(var(--header-h) + 64px) var(--gutter) 80px; text-align:center; display:flex; flex-direction:column; align-items:center; }
.intro img{ width:min(46vw,300px); margin-bottom:32px; opacity:0; transform:scale(.25); animation:introLogoZoom 1.3s cubic-bezier(.2,.7,.2,1) forwards; }
@keyframes introLogoZoom{ to{ opacity:1; transform:scale(1); } }
.intro h1{ font-size:clamp(22px,3.2vw,40px); max-width:820px; color:#fff; }
.intro h1 .cursor{ display:inline-block; width:2px; background:#fff; margin-left:2px; animation:blink 1s step-end infinite; }
@keyframes blink{ 50%{ opacity:0; } }
.intro .manifesto{ color:rgba(255,255,255,.7); max-width:640px; margin-top:22px; font-size:clamp(14px,1.4vw,17px); }
.intro .manifesto strong{ color:#fff; }

/* ===== Home: scroll slider ===== */
.scroll-slider{ position:relative; height:420vh; background:var(--black); }
.scroll-slider-sticky{ position:sticky; top:0; height:100vh; overflow:hidden; }
.ss-slide{ position:absolute; inset:0; opacity:0; transition:opacity .6s var(--ease); }
.ss-slide.active{ opacity:1; }
.ss-slide picture{ display:block; width:100%; height:100%; }
.ss-slide img{ width:100%; height:100%; object-fit:cover; object-position:center; }
.ss-scrim{ position:absolute; inset:0; background:linear-gradient(to top,rgba(0,0,0,.75),rgba(0,0,0,.05) 45%); pointer-events:none; }
.ss-content{ position:absolute; left:var(--gutter); bottom:64px; color:#fff; max-width:640px; }
.ss-content .eyebrow{ font-family:var(--font-display); font-size:13px; letter-spacing:.12em; text-transform:uppercase; color:rgba(255,255,255,.7); display:block; margin-bottom:12px; }
.ss-content h3{ color:#fff; font-size:clamp(26px,4vw,48px); margin-bottom:16px; }
.ss-content .view-link{ display:inline-flex; align-items:center; gap:10px; font-family:var(--font-display); font-weight:600; text-transform:uppercase; font-size:13px; letter-spacing:.05em; color:#fff; border-bottom:1px solid rgba(255,255,255,.5); padding-bottom:4px; }
.ss-progress{ position:absolute; right:var(--gutter); bottom:64px; display:flex; align-items:center; gap:14px; color:#fff; }
.ss-progress .ss-count{ font-family:var(--font-display); font-size:14px; }
.ss-progress .ss-track{ width:120px; height:2px; background:rgba(255,255,255,.25); position:relative; }
.ss-progress .ss-track-fill{ position:absolute; left:0; top:0; height:100%; background:#fff; transition:width .2s; }
.ss-all{ position:absolute; top:64px; right:var(--gutter); }
@media (max-width:700px){ .ss-all{ display:none; } .ss-progress{ display:none; } .ss-content{ bottom:40px; max-width:calc(100% - 2*var(--gutter)); } }

/* ===== Home: services (What we do) ===== */
.svc-panels{ display:grid; grid-template-columns:1fr; }
@media (min-width:800px){ .svc-panels{ grid-template-columns:1fr 1fr; } }
.svc-panel{ position:relative; display:block; aspect-ratio:4/3; overflow:hidden; background:#000; }
@media (min-width:800px){ .svc-panel{ aspect-ratio:1/1; } }
.svc-panel img{ width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease); }
.svc-panel:hover img{ transform:scale(1.05); }
.svc-panel-scrim{ position:absolute; inset:0; background:linear-gradient(to top,rgba(0,0,0,.7),rgba(0,0,0,.1) 55%); }
.svc-panel-body{ position:absolute; left:0; right:0; bottom:0; padding:32px; color:#fff; }
.svc-panel-body .num{ font-family:var(--font-display); font-size:13px; color:rgba(255,255,255,.65); }
.svc-panel-body h3{ color:#fff; font-size:clamp(24px,3vw,36px); margin:10px 0 12px; }
.svc-panel-body p{ color:rgba(255,255,255,.75); font-size:14px; max-width:36ch; }
.svc-panel-body .link{ display:inline-flex; align-items:center; gap:8px; margin-top:14px; font-family:var(--font-display); font-weight:600; text-transform:uppercase; font-size:13px; }
.svc-head{ padding:96px var(--gutter) 48px; text-align:center; }
.svc-head .eyebrow{ font-family:var(--font-display); font-size:13px; letter-spacing:.12em; text-transform:uppercase; color:var(--grey); display:block; margin-bottom:14px; }
.svc-head h2{ font-size:clamp(28px,4.5vw,52px); max-width:22ch; margin:0 auto; }

/* ===== Home: testimonials ===== */
.testimonials{ background:var(--black); padding:96px var(--gutter); }
.testimonials .svc-head .eyebrow{ color:rgba(255,255,255,.6); }
.testimonials .svc-head h2{ color:#fff; }
.t-grid{ display:grid; grid-template-columns:1fr; gap:24px; margin-top:48px; }
@media (min-width:700px){ .t-grid{ grid-template-columns:1fr 1fr; } }
@media (min-width:1100px){ .t-grid{ grid-template-columns:repeat(4,1fr); } }
.t-card{ border:1px solid rgba(255,255,255,.15); padding:28px 24px; }
.t-quote{ color:rgba(255,255,255,.85); font-size:15px; line-height:1.7; margin-bottom:20px; }
.t-name{ color:#fff; font-family:var(--font-display); font-weight:700; font-size:15px; }
.t-role{ color:rgba(255,255,255,.5); font-size:13px; margin-top:2px; }

/* ===== Projects grid ===== */
.proj-toolbar{ padding:40px var(--gutter) 24px; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:16px; }
.proj-filters{ display:flex; flex-wrap:wrap; gap:10px; }
.proj-filters button{ border:1px solid var(--line); background:#fff; padding:9px 18px; font-size:13px; font-family:var(--font-display); font-weight:600; text-transform:uppercase; letter-spacing:.03em; border-radius:30px; transition:.2s; }
.proj-filters button.active,.proj-filters button:hover{ background:var(--black); border-color:var(--black); color:#fff; }
.proj-count{ font-size:14px; color:var(--grey); }
.proj-grid{ padding:0 var(--gutter) 96px; display:grid; grid-template-columns:repeat(2,1fr); gap:20px; }
@media (min-width:700px){ .proj-grid{ grid-template-columns:repeat(3,1fr); gap:28px; } }
.proj-card{ position:relative; display:block; overflow:hidden; background:#eee; }
.proj-thumb{ position:relative; aspect-ratio:4/3; overflow:hidden; }
.proj-thumb img{ width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease); }
.proj-card:hover .proj-thumb img{ transform:scale(1.06); }
.proj-scrim{ position:absolute; inset:0; background:linear-gradient(to top,rgba(0,0,0,.65),rgba(0,0,0,0) 55%); }
.proj-cat-pill{ position:absolute; top:14px; left:14px; background:rgba(255,255,255,.92); color:#000; font-size:11px; font-family:var(--font-display); font-weight:600; text-transform:uppercase; letter-spacing:.04em; padding:5px 12px; border-radius:20px; }
.proj-meta{ position:absolute; left:16px; bottom:14px; right:16px; color:#fff; }
.proj-meta .pname{ font-family:var(--font-display); font-weight:700; font-size:clamp(15px,1.6vw,19px); }
.proj-meta .ploc{ display:flex; align-items:center; gap:6px; font-size:12.5px; color:rgba(255,255,255,.8); margin-top:4px; }
.proj-meta .ploc .icon{ width:12px; height:12px; }
.proj-group-label{ padding:56px var(--gutter) 8px; }
.proj-group-label h3{ font-size:clamp(20px,2.4vw,28px); }

/* ===== Project detail template ===== */
.proj-top{ padding:calc(var(--header-h) + 56px) var(--gutter) 40px; border-bottom:1px solid var(--line); }
.proj-top .cat-pill{ display:inline-block; font-family:var(--font-display); font-size:12px; font-weight:600; text-transform:uppercase; letter-spacing:.05em; border:1px solid var(--line); padding:6px 14px; border-radius:20px; margin-bottom:20px; color:var(--grey-dark); }
.proj-top h1{ font-size:clamp(34px,6vw,68px); }
.proj-top p{ max-width:none; font-size:clamp(15px,1.5vw,18px); margin-top:14px; }
.proj-shell{ display:grid; grid-template-columns:1fr; gap:0; padding:0 var(--gutter); }
@media (min-width:1180px){ .proj-shell{ grid-template-columns:260px 1fr 260px; gap:40px; align-items:start; } }
.proj-details{ padding:40px 0; }
@media (min-width:1180px){ .proj-details{ position:sticky; top:calc(var(--header-h) + 24px); } }
.fact-item{ padding:16px 0; border-top:1px solid var(--line); }
.fact-item:last-of-type{ border-bottom:1px solid var(--line); }
.fact-item .label{ font-size:12px; text-transform:uppercase; letter-spacing:.08em; color:var(--grey); margin-bottom:4px; }
.fact-item .value{ font-family:var(--font-display); font-weight:600; font-size:16px; }
.proj-details .btn{ margin-top:28px; width:100%; justify-content:center; }
.proj-essay{ padding:40px 0; display:flex; flex-direction:column; gap:28px; }
.essay-img{ position:relative; overflow:hidden; }
.essay-img img{ width:100%; height:auto; cursor:zoom-in; }
.expand-hint{ position:absolute; top:16px; right:16px; width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,.9); display:flex; align-items:center; justify-content:center; opacity:0; transition:opacity .25s; pointer-events:none; }
.essay-img:hover .expand-hint{ opacity:1; }
.proj-related{ padding:40px 0 60px; }
@media (min-width:1180px){ .proj-related{ position:sticky; top:calc(var(--header-h) + 24px); } }
.proj-related h4{ font-size:13px; text-transform:uppercase; letter-spacing:.1em; color:var(--grey); margin-bottom:18px; }
.related-card{ position:relative; display:block; aspect-ratio:4/3; overflow:hidden; margin-bottom:14px; }
.related-card img{ width:100%; height:100%; object-fit:cover; filter:grayscale(1) contrast(1.02); transition:filter .4s var(--ease), transform .5s var(--ease); }
.related-card .rc-overlay{ position:absolute; inset:0; background:rgba(0,0,0,.35); display:flex; align-items:flex-end; padding:14px; opacity:0; transition:opacity .3s; }
.related-card .rc-overlay span{ color:#fff; font-family:var(--font-display); font-weight:600; font-size:14px; }
.related-card:hover img{ filter:grayscale(0) contrast(1); transform:scale(1.04); }
.related-card:hover .rc-overlay{ opacity:1; }

/* ===== Service pages (architecture / interiors) ===== */
.svc-hero{ margin-top:var(--header-h); height:58vh; min-height:360px; background-size:cover; background-position:center; position:relative; display:flex; align-items:flex-end; }
.svc-hero-scrim{ position:absolute; inset:0; background:linear-gradient(to top,rgba(0,0,0,.7),rgba(0,0,0,.05) 60%); }
.svc-hero-body{ position:relative; padding:48px var(--gutter); color:#fff; }
.svc-hero-body .eyebrow{ font-family:var(--font-display); font-size:13px; letter-spacing:.12em; text-transform:uppercase; color:rgba(255,255,255,.75); display:block; margin-bottom:12px; }
.svc-hero-body h1{ color:#fff; font-size:clamp(34px,5.5vw,62px); }
.svc-intro{ padding:80px var(--gutter); display:grid; grid-template-columns:1fr; gap:48px; }
@media (min-width:900px){ .svc-intro{ grid-template-columns:1fr 1fr; } }
.svc-intro .lede{ font-family:var(--font-display); font-weight:600; font-size:clamp(20px,2.4vw,28px); max-width:none; color:var(--black); }
.svc-list{ display:flex; flex-direction:column; gap:24px; }
.svc-list-item{ display:flex; gap:18px; padding-bottom:24px; border-bottom:1px solid var(--line); }
.svc-list-item:last-child{ border-bottom:0; }
.svc-list-item .icon{ width:26px; height:26px; flex-shrink:0; margin-top:4px; }
.svc-list-item h4{ font-size:17px; margin-bottom:6px; }
.svc-list-item p{ font-size:14.5px; margin:0; }
.svc-showcase{ padding:0 var(--gutter) 96px; }
.svc-cta{ background:var(--black); color:#fff; padding:80px var(--gutter); text-align:center; }
.svc-cta h2{ color:#fff; font-size:clamp(24px,3.6vw,40px); max-width:36ch; margin:0 auto 28px; }
.svc-cta-actions{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }

/* ===== About ===== */
.about-hero{ padding:calc(var(--header-h) + 64px) var(--gutter) 0; }
.about-grid{ display:grid; grid-template-columns:1fr; gap:56px; padding:56px var(--gutter) 96px; }
@media (min-width:900px){ .about-grid{ grid-template-columns:1fr 1.2fr; align-items:start; } }
.about-visual{ }
@media (min-width:900px){ .about-visual{ position:sticky; top:calc(var(--header-h) + 24px); } }
.about-visual-frame{ aspect-ratio:4/5.4; overflow:hidden; background:#eee; }
.about-visual-frame img{ width:100%; height:100%; object-fit:cover; }
.about-visual figcaption{ margin-top:14px; font-size:13.5px; color:var(--grey); }
.about-copy h2{ font-size:clamp(24px,3vw,34px); margin-top:36px; }
.about-copy h2:first-child{ margin-top:0; }
.about-copy blockquote{ font-family:var(--font-display); font-weight:600; font-size:clamp(19px,2.2vw,26px); border-left:2px solid var(--black); padding-left:24px; margin:28px 0; max-width:none; }
.stat-band{ display:grid; grid-template-columns:repeat(2,1fr); gap:24px; margin:40px 0; padding:32px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
@media (min-width:600px){ .stat-band{ grid-template-columns:repeat(4,1fr); } }
.stat-band .stat b{ display:block; font-family:var(--font-display); font-size:clamp(24px,3vw,34px); }
.stat-band .stat span{ font-size:13px; color:var(--grey); }
.principles{ display:grid; grid-template-columns:1fr; gap:28px; margin:36px 0; }
@media (min-width:700px){ .principles{ grid-template-columns:repeat(3,1fr); } }
.principle .icon{ width:28px; height:28px; margin-bottom:14px; }
.principle h4{ font-size:16px; margin-bottom:8px; }
.principle p{ font-size:14px; }
.team-note{ background:#f6f6f4; padding:32px; margin-top:36px; font-style:italic; }

/* ===== Awards ===== */
.awards-grid{ padding:0 var(--gutter) 96px; display:grid; grid-template-columns:1fr; gap:28px; }
@media (min-width:700px){ .awards-grid{ grid-template-columns:1fr 1fr; } }
@media (min-width:1080px){ .awards-grid{ grid-template-columns:repeat(3,1fr); } }
.award-card{ border:1px solid var(--line); }
.award-card-img{ aspect-ratio:3/4; background:#f6f6f4; display:flex; align-items:center; justify-content:center; overflow:hidden; cursor:zoom-in; }
.award-card-img img{ width:100%; height:100%; object-fit:contain; }
.award-card-body{ padding:20px; }
.award-card-body .yr{ font-size:12px; color:var(--grey); text-transform:uppercase; letter-spacing:.08em; }
.award-card-body h3{ font-size:18px; margin:8px 0 4px; }
.award-card-body .org{ font-size:13.5px; color:var(--grey-dark); }

/* ===== Calculator ===== */
.calc-wrap{ padding:calc(var(--header-h) + 40px) var(--gutter) 96px; display:grid; grid-template-columns:1fr; gap:32px; }
@media (min-width:1000px){ .calc-wrap{ grid-template-columns:1.5fr 1fr; align-items:start; } }
.calc-card{ background:#fff; border:1px solid var(--line); padding:36px; }
.calc-step{ padding:28px 0; border-bottom:1px solid var(--line); }
.calc-step:last-child{ border-bottom:0; }
.calc-step .step-label{ display:flex; align-items:center; gap:12px; font-family:var(--font-display); font-weight:700; font-size:17px; margin-bottom:18px; }
.calc-step .step-label .stepnum{ width:28px; height:28px; border-radius:50%; background:var(--black); color:#fff; display:flex; align-items:center; justify-content:center; font-size:13px; flex-shrink:0; }
.option-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
.option-grid.cols-3{ grid-template-columns:repeat(3,1fr); }
@media (max-width:480px){ .option-grid,.option-grid.cols-3{ grid-template-columns:repeat(2,1fr); } }
.opt-card{ border:1.5px solid var(--line); background:#fff; padding:18px 14px; text-align:center; transition:.2s; }
.opt-card .icon{ width:24px; height:24px; margin:0 auto 10px; }
.opt-card .opt-label{ font-family:var(--font-display); font-weight:600; font-size:13.5px; }
.opt-card.active{ border-color:var(--black); background:var(--black); color:#fff; }
.sqft-block{ display:flex; flex-direction:column; gap:14px; }
.sqft-input{ font-family:var(--font-display); font-weight:700; font-size:clamp(28px,6vw,44px); border:0; border-bottom:2px solid var(--black); width:100%; padding:6px 0; }
.sqft-input:focus{ outline:none; }
input[type=range]{ width:100%; }
.calc-result{ background:linear-gradient(160deg,#0a0a0a,#232320); color:#fff; padding:36px; position:sticky; top:calc(var(--header-h) + 24px); }
@media (max-width:1000px){ .calc-result{ position:static; } }
.calc-result .rlabel{ font-size:13px; text-transform:uppercase; letter-spacing:.1em; color:rgba(255,255,255,.6); }
.result-amount{ font-family:var(--font-display); font-weight:700; font-size:clamp(30px,5vw,46px); margin:10px 0 24px; }
.breakdown{ display:flex; flex-direction:column; gap:0; border-top:1px solid rgba(255,255,255,.15); }
.breakdown-row{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:14px 0; border-bottom:1px solid rgba(255,255,255,.15); font-size:14px; }
.breakdown-row .brow-label{ display:flex; align-items:center; gap:10px; color:rgba(255,255,255,.8); }
.breakdown-row .icon{ width:16px; height:16px; }
.calc-note{ font-size:12.5px; color:rgba(255,255,255,.45); margin-top:20px; }
.calc-result .btn{ width:100%; justify-content:center; margin-top:24px; }

/* ===== Contact ===== */
.contact-wrap{ padding:calc(var(--header-h) + 40px) var(--gutter) 96px; display:grid; grid-template-columns:1fr; gap:48px; }
@media (min-width:900px){ .contact-wrap{ grid-template-columns:1fr 1fr; } }
.contact-info li{ display:flex; gap:16px; padding:18px 0; border-bottom:1px solid var(--line); }
.contact-info .icon{ width:22px; height:22px; margin-top:2px; color:var(--grey-dark); flex-shrink:0; }
.contact-info .ci-label{ font-size:12px; text-transform:uppercase; letter-spacing:.08em; color:var(--grey); margin-bottom:4px; }
.contact-info .ci-value{ font-family:var(--font-display); font-weight:600; font-size:16px; }
.map-frame{ margin-top:24px; border:1px solid var(--line); }
.map-frame iframe{ width:100%; height:280px; border:0; filter:grayscale(1) contrast(1.05); display:block; }
.form-field{ margin-bottom:18px; }
.form-field label{ display:block; font-size:13px; margin-bottom:6px; color:var(--grey-dark); }
.form-field input,.form-field textarea{ width:100%; border:1px solid var(--line); padding:13px 14px; font-size:15px; background:#fff; }
.form-field textarea{ min-height:120px; resize:vertical; }
.form-field input:focus,.form-field textarea:focus{ outline:none; border-color:var(--black); }

/* ===== Generic layout helpers ===== */
.container{ padding:0 var(--gutter); }
.text-center{ text-align:center; }
.mt-0{ margin-top:0; }