/* DESIGNAURA – refreshed site
   Layout idea: an architect's drawing set. Ruled rows like a door schedule,
   full-bleed photography, quiet paper ground, outline wordmark as signature. */

/* ---------- Fonts (self-hosted, no third-party requests) ---------- */
@font-face{font-family:"Cormorant";font-style:normal;font-weight:300;font-display:swap;src:url(/fonts/cormorant-garamond-latin-300-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Cormorant";font-style:normal;font-weight:300;font-display:swap;src:url(/fonts/cormorant-garamond-latin-ext-300-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Cormorant";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/cormorant-garamond-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Cormorant";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/cormorant-garamond-latin-ext-400-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Cormorant";font-style:italic;font-weight:300;font-display:swap;src:url(/fonts/cormorant-garamond-latin-300-italic.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Cormorant";font-style:italic;font-weight:300;font-display:swap;src:url(/fonts/cormorant-garamond-latin-ext-300-italic.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Jost";font-style:normal;font-weight:300;font-display:swap;src:url(/fonts/jost-latin-300-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Jost";font-style:normal;font-weight:300;font-display:swap;src:url(/fonts/jost-latin-ext-300-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Jost";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/jost-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Jost";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/jost-latin-ext-400-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Jost";font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/jost-latin-500-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Jost";font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/jost-latin-ext-500-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"DA Logo";font-style:normal;font-weight:400;font-display:block;src:url(/fonts/designaura-logo.woff2) format("woff2")}

/* ---------- Tokens ---------- */
:root{
  --paper:#f7f6f2;      /* warm limewash white */
  --ink:#221e20;        /* soft charcoal, existing brand ink */
  --stone:#a8a89e;      /* taupe, existing footer tone */
  --mist:#ecebe4;       /* pale plaster band */
  --clay:#745152;       /* walnut accent, used sparingly */
  --muted:#6b6861;
  --line:rgba(34,30,32,.22);
  --serif:"Cormorant","Cormorant Garamond",Garamond,"Times New Roman",serif;
  --sans:"Jost","Helvetica Neue",Helvetica,Arial,sans-serif;
  --logo:"DA Logo","Jost","Helvetica Neue",Arial,sans-serif;
  --gutter:clamp(16px,4vw,56px);
  --hdr:76px;
  --bar:52px;
  --ease:cubic-bezier(.2,.7,.2,1);
}

/* ---------- Base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-weight:300;font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
p{margin:0}
h1,h2,h3{margin:0;font-family:var(--serif);font-weight:300;text-wrap:balance}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
:focus-visible{outline:1px solid var(--ink);outline-offset:4px}
.wrap{padding-left:max(var(--gutter),env(safe-area-inset-left,0px));padding-right:max(var(--gutter),env(safe-area-inset-right,0px))}
.label{font-family:var(--sans);font-weight:400;font-size:12px;letter-spacing:.18em;text-transform:uppercase}
.caps{text-transform:uppercase;letter-spacing:-.01em}
.skip{position:absolute;left:-9999px;top:0}
.skip:focus{left:16px;top:16px;z-index:100;background:var(--paper);padding:8px 12px}

/* ---------- Header ---------- */
.site-header{position:fixed;inset:0 0 auto;z-index:50;height:calc(var(--hdr) + env(safe-area-inset-top,0px));padding-top:env(safe-area-inset-top,0px);display:flex;align-items:center;justify-content:space-between;gap:24px;color:var(--ink);transition:background .35s var(--ease),color .35s var(--ease),border-color .35s;border-bottom:1px solid transparent}
.site-header.is-solid{background:rgba(247,246,242,.94);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.site-header.on-hero:not(.is-solid){color:#fff}
.logo{font-family:var(--logo);font-size:30px;line-height:1;letter-spacing:.02em;white-space:nowrap}
.nav{display:flex;align-items:center;gap:clamp(18px,2.4vw,36px)}
.nav a{font-size:12px;font-weight:400;letter-spacing:.2em;text-transform:uppercase;position:relative;padding-block:6px}
.nav a::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:1px;background:currentColor;transition:right .35s var(--ease)}
.nav a:hover::after,.nav a[aria-current="page"]::after{right:0}
.menu-btn{display:none;width:34px;height:20px;position:relative}
.menu-btn span{position:absolute;left:0;right:0;height:1px;background:currentColor;transition:transform .3s var(--ease),top .3s var(--ease)}
.menu-btn span:nth-child(1){top:3px}.menu-btn span:nth-child(2){top:10px}.menu-btn span:nth-child(3){top:17px}
@media (max-width:900px){
  .nav{display:none}
  .menu-btn{display:block}
  .logo{font-size:24px}
}

/* Mobile menu overlay */
.menu{position:fixed;inset:0;z-index:60;background:var(--paper);display:flex;flex-direction:column;padding-top:calc(env(safe-area-inset-top,0px) + 20px);padding-bottom:calc(env(safe-area-inset-bottom,0px) + 28px);opacity:0;visibility:hidden;transition:opacity .35s var(--ease),visibility .35s}
.menu.is-open{opacity:1;visibility:visible}
.menu-top{display:flex;justify-content:space-between;align-items:center;height:56px}
.menu-close{width:28px;height:28px;position:relative}
.menu-close::before,.menu-close::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:var(--ink);transform:rotate(45deg)}
.menu-close::after{transform:rotate(-45deg)}
.menu ul{list-style:none;margin:28px 0 0;padding:0;border-top:1px solid var(--line)}
.menu li{border-bottom:1px solid var(--line)}
.menu li a{display:flex;justify-content:space-between;align-items:baseline;padding:16px 0;font-family:var(--serif);font-size:30px;line-height:1.1;text-transform:uppercase;letter-spacing:-.01em}
.menu li a small{font-family:var(--sans);font-size:11px;letter-spacing:.18em;color:var(--muted)}
.menu-foot{margin-top:auto;font-size:13px;color:var(--muted);display:grid;gap:2px}

/* ---------- Home hero (as on the original site) ---------- */
.hero{position:relative;height:100svh;min-height:520px;max-height:1100px;overflow:hidden;color:var(--ink);background:#d9cfc6}
.hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:40% 50%;filter:blur(14px);transform:scale(1.08);animation:heroIn 1.6s var(--ease) .1s forwards}
@keyframes heroIn{to{filter:blur(0);transform:scale(1)}}
.hero-tag{position:absolute;z-index:1;right:max(var(--gutter),env(safe-area-inset-right,0px));top:calc(var(--hdr) + env(safe-area-inset-top,0px) - 6px);font-family:var(--serif);font-weight:300;font-size:clamp(30px,3.9vw,58px);line-height:1;letter-spacing:-.03em}
.hero-logo{position:absolute;z-index:1;left:50%;top:42%;transform:translate(-50%,-50%);width:min(64vw,940px);margin:0}
.hero-logo img{width:100%;height:auto}
@media (max-width:700px){
  .hero{height:88svh}
  .hero-tag{left:max(var(--gutter),env(safe-area-inset-left,0px));right:auto;font-size:30px}
  .hero-logo{width:calc(100vw - 2*var(--gutter))}
}
@media (prefers-reduced-motion:reduce){.hero>img{filter:none;transform:none}}

/* ---------- Statement ---------- */
.statement{padding-block:clamp(48px,6vw,88px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,3fr);gap:32px;align-items:start}
.statement h2{font-size:clamp(22px,2.3vw,34px);line-height:1.2;letter-spacing:-.005em;max-width:30ch}
.statement .more{margin-top:20px;display:inline-flex;gap:12px;align-items:center}
@media (max-width:760px){.statement{grid-template-columns:1fr}}

/* ---------- Link with arrow ---------- */
.arrow-link{display:inline-flex;align-items:center;gap:14px;font-size:12px;font-weight:400;letter-spacing:.2em;text-transform:uppercase}
.arrow-link svg{width:34px;height:10px;transition:transform .35s var(--ease)}
.arrow-link:hover svg{transform:translateX(6px)}

/* ---------- Project index ---------- */
#projects{scroll-margin-top:calc(var(--hdr) + env(safe-area-inset-top,0px))}
.index-head{display:flex;justify-content:space-between;align-items:center;gap:16px 24px;flex-wrap:wrap;padding-block:clamp(28px,3.5vw,48px) clamp(24px,3vw,40px)}
.index-head h2{font-size:clamp(24px,2.4vw,34px);line-height:1;text-transform:uppercase;letter-spacing:-.02em}
.filters{display:flex;gap:6px;flex-wrap:wrap}
.filters button{border:1px solid var(--line);border-radius:999px;padding:8px 16px;font-size:12px;font-weight:400;letter-spacing:.14em;text-transform:uppercase;transition:background .25s,color .25s,border-color .25s}
.filters button sup{font-size:9px;margin-left:4px;letter-spacing:0}
.filters button:hover{border-color:var(--ink)}
.filters button[aria-pressed="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.projects{display:grid;gap:clamp(28px,3.5vw,48px)}
.proj{position:relative}
.proj-bar{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1.4fr) 40px;align-items:center;gap:16px;min-height:var(--bar);border-top:1px solid var(--line)}
.proj-title{font-family:var(--serif);font-size:clamp(19px,1.8vw,27px);line-height:1;text-transform:uppercase;letter-spacing:-.015em}
.proj-cat{text-align:center}
.proj-loc{font-family:var(--serif);font-size:clamp(16px,1.5vw,22px);text-transform:uppercase;text-align:right;letter-spacing:-.01em}
.proj-bar svg{justify-self:end;width:30px;height:12px;transition:transform .35s var(--ease)}
.proj:hover .proj-bar svg{transform:translateX(6px)}
.proj-media{position:relative;overflow:hidden;height:clamp(280px,44vw,560px);background:var(--mist)}
.proj-media img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease),opacity .9s var(--ease)}
.proj:hover .proj-media img{transform:scale(1.035)}
/* Hover test: second photo fades in (desktop with mouse only, so touch devices never load it) */
.proj-media .alt{display:none}
@media (hover:hover) and (pointer:fine){
  .proj-media .alt{display:block;position:absolute;inset:0;opacity:0}
  .proj:hover .proj-media .alt,.proj a:focus-visible .proj-media .alt{opacity:1}
}
.proj[hidden]{display:none}
@media (max-width:760px){
  .proj-bar{grid-template-columns:minmax(0,1fr) auto;row-gap:2px;padding-block:12px}
  .proj-cat{display:none}
  .proj-loc{grid-column:1;text-align:left;font-family:var(--sans);font-size:11px;letter-spacing:.18em}
  .proj-bar svg{grid-row:1/3;grid-column:2}
  .proj-media{height:auto;aspect-ratio:4/3}
}

/* ---------- Healthcare teaser band ---------- */
.band{background:var(--stone);color:#fff;padding-block:clamp(64px,9vw,128px)}
.band-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(32px,6vw,96px);align-items:center}
.band h2{font-size:clamp(40px,5.6vw,84px);line-height:.95;text-transform:uppercase;letter-spacing:-.02em;margin-top:14px}
.band p{font-size:17px;max-width:56ch;margin-top:24px}
.band .arrow-link{margin-top:36px}
.band figure{margin:0;aspect-ratio:4/5;overflow:hidden}
.band figure img{width:100%;height:100%;object-fit:cover}
@media (max-width:860px){.band-grid{grid-template-columns:1fr}.band figure{aspect-ratio:3/2}}

/* ---------- Generic page head ---------- */
main{display:block}
.page-head{padding-top:calc(var(--hdr) + env(safe-area-inset-top,0px) + clamp(32px,5vw,72px));padding-bottom:clamp(24px,3vw,44px)}
.page-head h1{font-size:clamp(32px,4.2vw,60px);line-height:1;text-transform:uppercase;letter-spacing:-.025em}
.page-head .label{display:block;margin-bottom:22px;color:var(--muted)}

/* ---------- Project detail ---------- */
.p-hero{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);min-height:min(86svh,820px)}
.p-hero-text{display:flex;flex-direction:column;justify-content:flex-end;padding-top:calc(var(--hdr) + env(safe-area-inset-top,0px) + 48px);padding-bottom:clamp(32px,4vw,56px);gap:28px}
.p-hero h1{font-size:clamp(34px,4vw,62px);line-height:.98;text-transform:uppercase;letter-spacing:-.025em}
.p-hero-top{display:flex;justify-content:space-between;align-items:baseline;gap:16px}
.lang{display:flex;gap:14px}
.lang a{color:var(--muted);padding-block:4px;border-bottom:1px solid transparent;transition:color .25s,border-color .25s}
.lang a:hover{color:var(--ink)}
.lang a[aria-current]{color:var(--ink);border-bottom-color:var(--ink)}
.p-hero-meta{display:flex;justify-content:space-between;gap:16px;border-top:1px solid var(--ink);padding-top:14px;color:var(--ink)}
.p-hero-img{position:relative;overflow:hidden;background:var(--mist)}
.p-hero-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
@media (max-width:860px){
  .p-hero{grid-template-columns:1fr;min-height:0}
  .p-hero-text{padding-bottom:28px}
  .p-hero-img{aspect-ratio:4/5}
  .p-hero-img img{position:static}
}
.p-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,96px);padding-block:clamp(56px,7vw,104px);align-items:end}
.p-intro p{font-family:var(--serif);font-size:clamp(21px,2vw,29px);line-height:1.3;letter-spacing:-.005em;max-width:24ch}
.p-intro figure{margin:0}
@media (max-width:760px){.p-intro{grid-template-columns:1fr}}

.facts{border-top:1px solid var(--ink)}
.facts div{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,3fr);gap:16px;align-items:baseline;border-bottom:1px solid var(--ink);padding-block:14px}
.facts dt{font-size:12px;font-weight:400;letter-spacing:.18em;text-transform:uppercase}
.facts dd{margin:0;font-family:var(--serif);font-size:clamp(17px,1.6vw,24px);line-height:1.1;text-transform:uppercase;letter-spacing:-.01em}
.facts{margin:0}
.facts .mat{align-items:center}
.swatches{list-style:none;margin:0;padding:0;display:flex;gap:clamp(14px,2vw,28px);flex-wrap:wrap}
.swatches li{display:grid;gap:8px;justify-items:center;font-family:var(--sans);font-size:11px;line-height:1.2;font-weight:400;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.swatches img{width:clamp(64px,7vw,96px);height:clamp(64px,7vw,96px);object-fit:cover;box-shadow:0 1px 2px rgba(34,30,32,.12),0 8px 18px -10px rgba(34,30,32,.35)}
@media (max-width:600px){.facts div{grid-template-columns:1fr;gap:4px}}

.p-body{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(32px,6vw,96px);padding-block:clamp(56px,7vw,104px);align-items:center}
.p-body p{font-size:17px;max-width:44ch}
.p-body figure{margin:0}
@media (max-width:760px){.p-body{grid-template-columns:1fr}.p-body p{order:2}}

.gallery{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(12px,2vw,28px);padding-bottom:clamp(56px,7vw,104px)}
.gallery button{display:block;overflow:hidden;background:var(--mist);cursor:zoom-in}
.gallery img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.gallery button:hover img{transform:scale(1.03)}
.gallery .g-a{grid-column:1/8;aspect-ratio:4/5}
.gallery .g-b{grid-column:8/13;aspect-ratio:4/5;margin-top:22%}
.gallery .g-c{grid-column:2/13;aspect-ratio:16/9}
.gallery .g-d{grid-column:1/6;aspect-ratio:3/4}
.gallery .g-e{grid-column:6/13;aspect-ratio:3/4;margin-top:-12%}
@media (max-width:700px){
  .gallery{grid-template-columns:1fr}
  .gallery .g-a,.gallery .g-b,.gallery .g-c,.gallery .g-d,.gallery .g-e{grid-column:1;margin-top:0;aspect-ratio:4/3}
}

.pager{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink)}
.pager a{display:grid;gap:10px;padding:clamp(24px,4vw,48px) var(--gutter)}
.pager a+a{border-left:1px solid var(--ink);text-align:right;justify-items:end}
.pager strong{font-family:var(--serif);font-weight:300;font-size:clamp(20px,2vw,30px);line-height:1;text-transform:uppercase;letter-spacing:-.015em;transition:color .3s}
.pager a:hover strong{color:var(--clay)}
.pager .label{color:var(--muted)}
@media (max-width:600px){.pager{grid-template-columns:1fr}.pager a+a{border-left:0;border-top:1px solid var(--ink)}}

/* Lightbox */
.lb{position:fixed;inset:0;z-index:80;background:rgba(24,20,20,.96);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}
.lb.is-open{opacity:1;visibility:visible}
.lb img{max-width:calc(100vw - 32px);max-height:calc(100svh - 120px);width:auto;height:auto;object-fit:contain}
.lb button{position:absolute;color:#fff;font-size:12px;letter-spacing:.2em;text-transform:uppercase;padding:14px}
.lb .lb-close{top:calc(env(safe-area-inset-top,0px) + 12px);right:calc(env(safe-area-inset-right,0px) + 12px)}
.lb .lb-prev{left:calc(env(safe-area-inset-left,0px) + 8px);top:50%;transform:translateY(-50%)}
.lb .lb-next{right:calc(env(safe-area-inset-right,0px) + 8px);top:50%;transform:translateY(-50%)}
.lb .lb-count{position:absolute;bottom:calc(env(safe-area-inset-bottom,0px) + 18px);left:0;right:0;text-align:center;color:rgba(255,255,255,.7);font-size:12px;letter-spacing:.2em}

/* ---------- Healthcare page ---------- */
.hc-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,72px);padding-bottom:clamp(48px,6vw,88px)}
.hc-intro p{font-size:17px}
.hc-intro .lead{font-family:var(--serif);font-size:clamp(20px,1.9vw,28px);line-height:1.25;grid-column:1/-1;max-width:34ch;margin-bottom:12px}
.hc-intro .pdf-link{grid-column:1/-1;margin-top:8px}
.contact-info .pdf-link{justify-self:start}
@media (max-width:760px){.hc-intro{grid-template-columns:1fr}}
.quote{background:var(--mist);padding-block:clamp(48px,6vw,88px)}
.quote-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,3fr);gap:clamp(24px,5vw,72px)}
.quote blockquote{margin:0;font-family:var(--serif);font-size:clamp(19px,1.7vw,25px);line-height:1.3;display:grid;gap:.8em}
.quote blockquote::before{content:"\201C";font-size:3.4em;line-height:.6;color:var(--clay);display:block;height:.45em}
.quote figcaption{margin-top:40px;display:grid;gap:18px;font-size:15px;color:var(--muted);max-width:60ch}
.quote figcaption img{width:min(320px,70%);height:auto}
.quote figure{margin:0}
@media (max-width:760px){.quote-grid{grid-template-columns:1fr}}
.hc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,2vw,28px);padding-block:clamp(48px,7vw,96px)}
.hc-grid figure{margin:0;overflow:hidden;aspect-ratio:4/3;background:var(--mist)}
.hc-grid figure:first-child{grid-row:span 2;aspect-ratio:auto}
.hc-grid img{width:100%;height:100%;object-fit:cover}
@media (max-width:700px){.hc-grid{grid-template-columns:1fr}.hc-grid figure:first-child{grid-row:auto;aspect-ratio:4/5}}

/* ---------- Customers ---------- */
.voices{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:clamp(24px,3vw,48px);row-gap:0;padding-bottom:clamp(56px,7vw,104px);border-top:1px solid var(--ink);padding-top:clamp(32px,4vw,56px)}
.voice{display:grid;grid-row:span 5;grid-template-rows:subgrid;align-content:start;text-align:center;justify-items:center;padding-bottom:48px}
.voice img{aspect-ratio:4/5;width:100%;object-fit:cover;margin-bottom:22px}
.voice-pre{font-size:11px;font-weight:400;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);align-self:end;margin-bottom:4px}
.voice h3{font-family:var(--serif);font-size:clamp(22px,1.9vw,27px);line-height:1.1}
.voice .role{font-size:13px;color:var(--muted);line-height:1.45;margin-top:8px;max-width:28ch}
.voice blockquote{margin:18px 0 0;display:grid;gap:12px;font-size:15px;line-height:1.6;align-content:start;max-width:36ch}
@supports not (grid-template-rows:subgrid){.voice{grid-row:auto;grid-template-rows:none}}
@media (max-width:1000px){.voices{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.voices{grid-template-columns:1fr}}

/* ---------- About ---------- */
.about-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:min(86svh,800px)}
.about-hero .txt{display:flex;flex-direction:column;justify-content:center;padding-top:calc(var(--hdr) + env(safe-area-inset-top,0px) + 32px);padding-bottom:48px;gap:18px}
.about-hero h1{font-size:clamp(32px,4vw,60px);line-height:1;text-transform:uppercase;letter-spacing:-.025em}
.about-hero .ph{position:relative;overflow:hidden}
.about-hero .ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
@media (max-width:860px){.about-hero{grid-template-columns:1fr;min-height:0}.about-hero .ph{aspect-ratio:4/5}.about-hero .ph img{position:static}}
.rows{border-top:1px solid var(--ink)}
.rows>div{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,3fr);gap:16px;border-bottom:1px solid var(--ink);padding-block:clamp(20px,3vw,40px);align-items:baseline}
.rows h2{font-size:clamp(20px,2vw,30px);line-height:1.25;letter-spacing:-.01em}
.rows .stack{display:grid;gap:.6em}
@media (max-width:600px){.rows>div{grid-template-columns:1fr}}
.pair{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(12px,2vw,28px);padding-block:clamp(56px,7vw,104px)}
.pair figure{margin:0;overflow:hidden}
.pair figure img{width:100%;height:100%;object-fit:cover}
.pair figure:first-child{grid-column:2/7;aspect-ratio:3/4}
.pair figure:last-child{grid-column:8/12;aspect-ratio:3/4;margin-top:24%}
@media (max-width:700px){.pair{grid-template-columns:1fr}.pair figure:first-child,.pair figure:last-child{grid-column:1;margin-top:0}}

/* ---------- Contact ---------- */
.contact{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(32px,6vw,96px);padding-bottom:clamp(72px,10vw,150px);border-top:1px solid var(--ink);padding-top:clamp(32px,4vw,56px)}
.contact-info{display:grid;align-content:start;gap:28px}
.contact-info p{font-size:17px}
.contact-info .lead{font-family:var(--serif);font-size:clamp(20px,1.9vw,28px);line-height:1.25}
.contact-info address{font-style:normal;display:grid;gap:4px}
.contact-info address a{border-bottom:1px solid var(--line);justify-self:start}
form{display:grid;grid-template-columns:1fr 1fr;gap:28px 24px}
.field{display:grid;gap:8px}
.field.full{grid-column:1/-1}
.field label{font-size:11px;font-weight:400;letter-spacing:.18em;text-transform:uppercase}
.field input,.field textarea{font:inherit;font-weight:300;font-size:17px;color:var(--ink);background:transparent;border:0;border-bottom:1px solid var(--ink);border-radius:0;padding:8px 0;width:100%}
.field textarea{min-height:140px;resize:vertical}
.field input:focus,.field textarea:focus{outline:none;border-bottom-color:var(--clay);box-shadow:0 1px 0 var(--clay)}
.field input[type=file]{border:1px dashed var(--line);padding:16px;font-size:14px}
.hp{position:absolute;left:-9999px}
.form-foot{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
.form-foot small{font-size:12px;color:var(--muted);max-width:52ch;line-height:1.5}
.form-foot small a{text-decoration:underline}
.submit{background:var(--ink);color:var(--paper);padding:16px 30px;font-size:12px;font-weight:400;letter-spacing:.22em;text-transform:uppercase;display:inline-flex;gap:14px;align-items:center;transition:background .3s}
.submit:hover{background:var(--clay)}
@media (max-width:860px){.contact{grid-template-columns:1fr}}
@media (max-width:560px){form{grid-template-columns:1fr}}

/* ---------- Legal ---------- */
.legal{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,3fr);gap:clamp(24px,5vw,72px);padding-bottom:clamp(72px,10vw,150px);border-top:1px solid var(--ink);padding-top:clamp(32px,4vw,56px)}
.legal nav{position:sticky;top:calc(var(--hdr) + 24px);align-self:start;display:grid;gap:10px}
.legal nav a{font-size:12px;letter-spacing:.18em;text-transform:uppercase}
.legal article{max-width:72ch;display:grid;gap:14px;font-size:15px}
.legal article h2{font-size:clamp(24px,2.4vw,36px);text-transform:uppercase;letter-spacing:-.015em;margin-top:48px;scroll-margin-top:calc(var(--hdr) + 24px)}
.legal article h2:first-child{margin-top:0}
.legal article h3{font-family:var(--sans);font-size:13px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;margin-top:22px}
.legal ul{margin:0;padding-left:1.2em;display:grid;gap:4px}
.legal a{text-decoration:underline;text-underline-offset:3px}
@media (max-width:760px){.legal{grid-template-columns:1fr}.legal nav{position:static;display:flex;flex-wrap:wrap;gap:16px}}

/* ---------- Simple message pages ---------- */
.msg{min-height:72svh;display:flex;flex-direction:column;justify-content:center;gap:24px;padding-top:calc(var(--hdr) + 48px);padding-bottom:72px}
.msg h1{font-size:clamp(32px,4.2vw,60px);line-height:1;text-transform:uppercase;letter-spacing:-.025em}
.msg p{font-size:17px;max-width:48ch}

/* ---------- Footer ---------- */
.site-footer{background:var(--stone);color:#fff;padding-top:clamp(40px,6vw,88px);overflow:hidden;min-height:calc(100svh - var(--hdr) - env(safe-area-inset-top,0px));display:flex;flex-direction:column}
.site-footer>.wrap{flex:1;display:flex;flex-direction:column}
.foot-grid{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px;align-items:start;padding-bottom:clamp(24px,3vw,40px)}
.foot-grid h2{font-family:var(--serif);font-size:clamp(20px,1.9vw,28px);line-height:1.2;max-width:22ch}
.foot-grid ul{list-style:none;margin:0;padding:0;display:grid;gap:10px;font-size:14px}
.foot-grid .label{display:block;margin-bottom:14px;opacity:.8}
.foot-grid a:hover{text-decoration:underline;text-underline-offset:4px}
.foot-word{font-family:var(--logo);font-size:clamp(44px,min(12vw,24svh),220px);line-height:1;white-space:nowrap;text-align:center;margin-top:auto;padding-top:48px;margin-bottom:.14em;letter-spacing:.005em}
.foot-base{display:flex;justify-content:center;gap:16px;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.4);padding-block:18px calc(18px + env(safe-area-inset-bottom,0px));font-size:12px;letter-spacing:.14em;text-transform:uppercase}
@media (max-width:760px){.foot-grid{grid-template-columns:1fr}}

/* ---------- Reveal ---------- */
.reveal{opacity:1;transform:none}
.js .reveal.pre{opacity:0;transform:translateY(24px)}
.js .reveal{transition:opacity 1s var(--ease),transform 1s var(--ease)}