/* ==========================================================
   AR CONSTRUCTION — Design System
   Theme: Technical / Blueprint. Civil engineering precision
   over decorative flourish.
   ========================================================== */

@import url('https://fonts.googleapis.com/css2?family=Big+Shoulders+Display:wght@600;700;800&family=IBM+Plex+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root{
  /* Color */
  --ink:        #12181f;   /* near-black navy — dark sections, primary text */
  --ink-soft:   #1c2530;   /* raised dark surface */
  --paper:      #f4f2ec;   /* warm off-white — light sections */
  --paper-dim:  #e8e5db;   /* light section secondary surface */
  --steel:      #3c6e91;   /* primary accent — steel blue */
  --steel-dark: #2a4f6b;
  --amber:      #d99e2b;   /* signature accent — safety amber, used sparingly */
  --rust:       #8a4a3a;   /* tertiary — iron oxide, very sparing */
  --concrete:   #6b7078;   /* muted secondary text on light */
  --concrete-lt:#9aa0a8;   /* muted secondary text on dark */
  --line:       rgba(18,24,31,0.12);
  --line-dark:  rgba(244,242,236,0.14);

  /* Radius */
  --radius:     16px;
  --radius-sm:  9px;

  /* Type */
  --display: 'Big Shoulders Display', sans-serif;
  --body: 'IBM Plex Sans', sans-serif;
  --mono: 'IBM Plex Mono', monospace;

  --container: 1180px;
}

*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *{ animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important; scroll-behavior:auto !important; }
}

body{
  min-height:100vh;
  display:flex;
  flex-direction:column;
  font-family:var(--body);
  color:var(--ink);
  background:var(--paper);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; }
button{ font-family:inherit; cursor:pointer; }

.wrap{ max-width:var(--container); margin:0 auto; padding:0 32px; }
@media (max-width:640px){ .wrap{ padding:0 20px; } }

.eyebrow{
  font-family:var(--mono);
  font-size:12.5px;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--amber);
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:18px;
}
.eyebrow::before{
  content:"";
  width:22px; height:2px;
  background:var(--amber);
  display:inline-block;
}

.eyebrow--lg{ font-size:16px; letter-spacing:0.1em; }
.eyebrow--lg::before{ width:28px; height:3px; }

h1,h2,h3,h4{ font-family:var(--display); font-weight:800; line-height:1.02; letter-spacing:-0.01em; }
h2{ font-size:clamp(30px,4.4vw,52px); }
h3{ font-size:clamp(20px,2.2vw,26px); font-weight:700; }

.section{ padding:110px 0; position:relative; }
.section--tight{ padding:80px 0; }
.section--dark{ background:var(--ink); color:var(--paper); }
.section--dim{ background:var(--paper-dim); }
@media (max-width:768px){
  .section{ padding:70px 0; }
  .section--tight{ padding:56px 0; }
}

.btn{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--mono); font-size:13px; letter-spacing:0.06em; text-transform:uppercase;
  padding:15px 26px;
  border:1px solid currentColor;
  border-radius:var(--radius-sm);
  transition:transform .35s cubic-bezier(.2,.7,.2,1), background .35s, color .35s;
  white-space:nowrap;
}
.btn--solid{ background:var(--amber); border-color:var(--amber); color:var(--ink); }
.btn--solid:hover{ background:var(--ink); color:var(--amber); border-color:var(--ink); transform:translateY(-2px); }
.btn--outline{ background:transparent; color:var(--paper); }
.btn--outline:hover{ background:var(--paper); color:var(--ink); transform:translateY(-2px); }
.btn--outline-dark{ background:transparent; color:var(--ink); }
.btn--outline-dark:hover{ background:var(--ink); color:var(--paper); transform:translateY(-2px); }
.btn svg{ width:14px; height:14px; transition:transform .3s; }
.btn:hover svg{ transform:translateX(3px); }

/* ---------------- NAV ---------------- */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:100;
  padding:20px 0;
  transition:background .4s ease, padding .4s ease, border-color .4s ease;
  border-bottom:1px solid transparent;
}
.nav.is-scrolled{
  background:rgba(18,24,31,0.92);
  backdrop-filter:blur(10px);
  padding:14px 0;
  border-color:var(--line-dark);
}
.nav--light:not(.is-scrolled) .nav__brand span,
.nav--light:not(.is-scrolled) .nav__links a{ color:var(--ink); }
.nav--light:not(.is-scrolled) .nav__links a:hover,
.nav--light:not(.is-scrolled) .nav__links a.is-active{ color:var(--steel); }
.nav--light:not(.is-scrolled) .nav__toggle span{ background:var(--ink); }
.nav .wrap{ display:flex; align-items:center; justify-content:space-between; }
.nav__brand{ display:flex; align-items:center; gap:10px; }
.nav__brand img{ height:34px; width:auto; }
.nav__brand span{ font-family:var(--display); font-weight:800; font-size:19px; color:var(--paper); letter-spacing:-0.01em; }
.nav__links{ display:flex; align-items:center; gap:38px; }
.nav__links a{
  font-family:var(--mono); font-size:12.5px; letter-spacing:0.08em; text-transform:uppercase;
  color:var(--concrete-lt); transition:color .25s; position:relative;
}
.nav__links a:hover, .nav__links a.is-active{ color:var(--paper); }
.nav__links a.is-active::after{
  content:""; position:absolute; left:0; right:0; bottom:-6px; height:1px; background:var(--amber);
}
.nav__cta{ font-family:var(--mono); font-size:12px; letter-spacing:0.08em; text-transform:uppercase; color:var(--paper); background:var(--amber); padding:11px 20px; border-radius:var(--radius-sm); transition:transform .3s, background .3s, color .3s, box-shadow .3s ease; }
.nav__links a.nav__cta,
.nav__links a.nav__cta:hover,
.nav__links a.nav__cta:focus,
.nav__links a.nav__cta:visited{
  color:var(--paper) !important;
}
.nav__cta:hover,
.nav__links a.nav__cta:hover{
  background:var(--steel-dark);
  color:var(--paper) !important;
  transform:translateY(-2px);
  box-shadow:0 12px 18px rgba(18,24,31,0.18);
}
.nav--light:not(.is-scrolled) .nav__links a.nav__cta{ color:var(--paper); }
.nav__toggle{ display:none; flex-direction:column; gap:5px; background:none; border:none; padding:6px; }
.nav__toggle span{ width:22px; height:2px; background:var(--paper); }

@media (max-width:900px){
  .nav__links{
    position:fixed; inset:0 0 0 auto; width:78%; max-width:320px; height:100vh;
    background:var(--ink); flex-direction:column; align-items:flex-start; justify-content:center;
    gap:28px; padding:40px; transform:translateX(100%); transition:transform .45s cubic-bezier(.2,.7,.2,1);
    border-left:1px solid var(--line-dark);
  }
  .nav__links.is-open{ transform:translateX(0); }
  .nav__toggle{ display:flex; z-index:110; }
  .nav__links a{ font-size:15px; }
  .nav__links a.nav__cta{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:auto;
    color:var(--paper) !important;
    background:var(--amber);
    padding:11px 18px;
    border-radius:var(--radius-sm);
    margin-top:6px;
  }
  .nav__links a.nav__cta:hover,
  .nav__links a.nav__cta:focus,
  .nav__links a.nav__cta:visited{
    color:var(--paper) !important;
  }
}

/* ---------------- HERO ---------------- */
.hero{
  position:relative; background:var(--ink); color:var(--paper);
  min-height:86vh; display:flex; flex-direction:column; justify-content:center;
  padding-top:150px; overflow:hidden;
}
.hero__bg{ position:absolute; inset:0; z-index:0; }
.hero__bg img{ width:100%; height:100%; object-fit:cover; opacity:0.75; }
.hero__bg::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(18,24,31,0.25), rgba(18,24,31,0.7) 65%, var(--ink) 100%); }
.hero__grid{
  position:absolute; inset:0;
  background-image:
    linear-gradient(var(--line-dark) 1px, transparent 1px),
    linear-gradient(90deg, var(--line-dark) 1px, transparent 1px);
  background-size:56px 56px;
  mask-image:linear-gradient(to bottom, rgba(0,0,0,0.9), transparent 85%);
  opacity:0.55;
}
.hero__content{ position:relative; z-index:2; padding-bottom:40px; }
.hero__content .wrap{ display:grid; grid-template-columns:1.3fr 1fr; gap:44px; align-items:end; }
.hero h1, .hero__lede, .hero__actions{ opacity:0; animation:heroUp .9s cubic-bezier(.2,.7,.2,1) forwards; }
.hero h1{ font-size:clamp(40px,6vw,78px); margin-bottom:22px; animation-delay:.1s; }
.hero__lede{ font-size:16px; color:var(--concrete-lt); max-width:420px; animation-delay:.3s; }
.hero__actions{ margin-top:34px; display:flex; gap:16px; flex-wrap:wrap; animation-delay:.5s; }
@keyframes heroUp{ from{ opacity:0; transform:translateY(22px); } to{ opacity:1; transform:translateY(0); } }

.hero__blueprint{ position:relative; z-index:2; width:100%; aspect-ratio:480/400; }
.hero__blueprint svg{ width:100%; height:100%; display:block; }
@media (max-width:900px){ .hero__blueprint{ aspect-ratio:480/300; } }
.bp-line{
  fill:none; stroke:var(--concrete-lt); stroke-width:1.4;
  stroke-dasharray:1400; stroke-dashoffset:1400;
  animation:draw 4.4s cubic-bezier(.3,.8,.3,1) forwards;
}
.bp-line--amber{ stroke:var(--amber); stroke-width:1.8; }
.bp-fill{ opacity:0; animation:fadeInBp 1s ease forwards; animation-delay:1.8s; }
.bp-dot{ fill:var(--amber); opacity:0; animation:fadeInBp .6s ease forwards; }
.bp-label{ font-family:var(--mono); font-size:12px; letter-spacing:1.5px; fill:var(--concrete-lt); opacity:0; animation:fadeInBp .8s ease forwards; }
.bp-arrow{ fill:var(--amber); opacity:0; animation:fadeInBp .6s ease forwards; }
.bp-dash{ fill:none; stroke:var(--concrete-lt); stroke-width:1.4; opacity:0.5; }
@keyframes draw{ to{ stroke-dashoffset:0; } }
@keyframes fadeInBp{ to{ opacity:1; } }

@media (max-width:900px){
  .hero{ padding-top:120px; }
  .hero__content .wrap{ grid-template-columns:1fr; gap:34px; }
  .hero__blueprint{ order:-1; }
}

/* ---------------- DEPARTMENTS TICKER ---------------- */
.ticker{
  background:var(--ink); border-top:1px solid var(--line-dark); border-bottom:1px solid var(--line-dark);
  overflow:hidden; padding:22px 0;
}
.ticker__label{
  font-family:var(--mono); font-size:16px; letter-spacing:0.12em; text-transform:uppercase;
  color:var(--amber); text-align:center; margin-bottom:18px; font-weight:500;
}
.ticker__track{ display:flex; width:max-content; animation:scroll-left 32s linear infinite; }
.ticker__track span{
  font-family:var(--mono); font-size:15px; color:var(--concrete-lt);
  padding:0 34px; white-space:nowrap; border-right:1px solid var(--line-dark);
}
@keyframes scroll-left{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

/* ---------------- REVEAL ---------------- */
.reveal{ opacity:0; transform:translateY(28px); transition:opacity .8s cubic-bezier(.2,.7,.2,1), transform .8s cubic-bezier(.2,.7,.2,1); }
.reveal.is-visible{ opacity:1; transform:translateY(0); }
.reveal-stagger > *{ opacity:0; transform:translateY(24px); transition:opacity .7s ease, transform .7s ease; }
.reveal-stagger.is-visible > *{ opacity:1; transform:translateY(0); }
.reveal-stagger.is-visible > *:nth-child(1){ transition-delay:0s; }
.reveal-stagger.is-visible > *:nth-child(2){ transition-delay:.12s; }
.reveal-stagger.is-visible > *:nth-child(3){ transition-delay:.24s; }
.reveal-stagger.is-visible > *:nth-child(4){ transition-delay:.36s; }
.reveal-stagger.is-visible > *:nth-child(5){ transition-delay:.48s; }

/* ---------------- SECTION HEADER ---------------- */
.sec-head{ display:flex; justify-content:space-between; align-items:flex-end; gap:40px; margin-bottom:56px; flex-wrap:wrap; }
.sec-head p{ color:var(--concrete); max-width:360px; font-size:15px; }
.sec-head--dark p{ color:var(--concrete-lt); }

/* ---------------- STACKING PROJECT CARDS ---------------- */
.stack{ position:relative; }
.stack__card{
  position:sticky; top:110px;
  background:var(--paper); color:var(--ink); border:1px solid var(--line);
  border-radius:var(--radius); overflow:hidden;
  display:grid; grid-template-columns:1fr 1fr;
  min-height:440px;
  margin-bottom:32px;
  box-shadow:0 24px 50px -30px rgba(18,24,31,0.22);
}
.stack__card:nth-child(1){ top:96px; }
.stack__card:nth-child(2){ top:118px; }
.stack__card:nth-child(3){ top:140px; }
.stack__media{ position:relative; overflow:hidden; }
.stack__media img{ width:100%; height:100%; object-fit:cover; }
.stack__body{ padding:44px; display:flex; flex-direction:column; justify-content:center; }
.stack__body .eyebrow{ color:var(--steel); }
.stack__body .eyebrow::before{ background:var(--steel); }
.stack__body h3{ font-size:clamp(24px,2.6vw,32px); margin-bottom:14px; }
.stack__meta{ font-family:var(--mono); font-size:12.5px; color:var(--concrete); margin-bottom:18px; text-transform:uppercase; letter-spacing:0.05em; }
.stack__body p.desc{ color:var(--concrete); margin-bottom:26px; font-size:15px; }
.stack__link{ font-family:var(--mono); font-size:13px; letter-spacing:0.06em; text-transform:uppercase; display:inline-flex; align-items:center; gap:8px; color:var(--ink); border-bottom:1px solid var(--ink); width:fit-content; }
.stack__link svg{ width:13px; height:13px; }

@media (max-width:800px){
  .stack__card{ grid-template-columns:1fr; min-height:auto; top:80px !important; }
  .stack__media{ height:220px; }
  .stack__body{ padding:30px; }
}

/* ---------------- CAPABILITY / DID YOU KNOW ---------------- */
.cap-grid{ display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); }
.cap-item{ padding:40px 30px 36px; border-right:1px solid var(--line); transition:background .35s, transform .35s; }
.cap-item:hover{ background:var(--paper-dim); transform:translateY(-6px); }
.cap-item:last-child{ border-right:none; }
.cap-item svg{ width:34px; height:34px; color:var(--steel); margin-bottom:20px; transition:color .3s; }
.cap-item:hover svg{ color:var(--amber); }
.cap-item h4{ font-family:var(--display); font-size:20px; font-weight:700; margin-bottom:10px; }
.cap-item p{ color:var(--concrete); font-size:14.5px; }
@media (max-width:800px){
  .cap-grid{ grid-template-columns:1fr; }
  .cap-item{ border-right:none; border-bottom:1px solid var(--line); padding-bottom:34px; margin-bottom:34px; }
}

/* ---------------- EXPERIENCE / DARK STATEMENT ---------------- */
.statement{ display:grid; grid-template-columns:0.9fr 1.1fr; gap:80px; align-items:center; }
.statement__media{ position:relative; aspect-ratio:4/5; overflow:hidden; border-radius:var(--radius); }
.statement__media img{ width:100%; height:100%; object-fit:cover; transition:transform 1.2s cubic-bezier(.2,.7,.2,1); }
.statement:hover .statement__media img{ transform:scale(1.03); }
.statement h2{ margin-bottom:26px; }
.statement p{ color:var(--concrete-lt); font-size:16px; max-width:520px; margin-bottom:32px; }
@media (max-width:800px){ .statement{ grid-template-columns:1fr; gap:36px; } }

/* ---------------- EXPERIENCE / DOOR SPLIT ---------------- */
.experience{ text-align:center; }
.experience .eyebrow{ justify-content:center; }
.experience__stage{
  position:relative; margin-top:44px;
  aspect-ratio:16/8; overflow:hidden; border-radius:var(--radius);
  background:var(--ink);
}
.experience__text{
  position:absolute; inset:0; z-index:1; display:flex; flex-direction:column;
  align-items:center; justify-content:center; text-align:center; padding:40px;
}
.experience__text h2{ color:var(--paper); max-width:640px; margin-bottom:18px; }
.experience__text p{ color:var(--concrete-lt); max-width:560px; margin-bottom:28px; font-size:15.5px; }
.door{
  position:absolute; top:0; height:100%; width:50%; z-index:2;
  background-repeat:no-repeat; background-size:200% 100%;
  transition:transform 3.4s cubic-bezier(.19,.85,.24,1);
}
.door--left{ left:0; background-position:left center; }
.door--right{ right:0; background-position:right center; }
.experience__stage.is-open .door--left{ transform:translateX(-100%); }
.experience__stage.is-open .door--right{ transform:translateX(100%); }
.experience__stage::after{
  content:""; position:absolute; inset:0; z-index:3; pointer-events:none;
  background:radial-gradient(ellipse at center, rgba(18,24,31,0.6), rgba(18,24,31,0.2) 62%);
  opacity:1; transition:opacity 1.2s ease;
}
.experience__stage.is-open::after{ opacity:0; }
@media (max-width:800px){
  .experience__stage{ aspect-ratio:4/5; }
}

/* ---------------- CTA SPLIT ---------------- */
.cta-split-wrap{ padding:90px 0; }
.cta-split{ display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.cta-split__panel{
  padding:56px; min-height:320px; display:flex; flex-direction:column; justify-content:space-between;
  border-radius:var(--radius); background:var(--paper-dim); color:var(--ink); border:1px solid var(--line);
  box-shadow:0 26px 50px -26px rgba(18,24,31,0.28);
  transition:transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s;
}
.cta-split__panel:hover{ transform:translateY(-6px); box-shadow:0 32px 60px -22px rgba(18,24,31,0.34); }
.cta-split__panel--media{ position:relative; overflow:hidden; }
.cta-split__panel--media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0.22; }
.cta-split__panel--media > *{ position:relative; z-index:1; }
.cta-split h3{ font-size:clamp(24px,3vw,34px); margin-bottom:16px; }
.cta-split p{ font-size:15px; opacity:0.85; max-width:380px; }
@media (max-width:800px){ .cta-split{ grid-template-columns:1fr; } .cta-split__panel{ padding:40px 30px; min-height:auto; } }

/* Single centered CTA panel (services.html — replaces the 2-panel cta-split there) */
.cta-single{
  background:var(--ink); border-radius:var(--radius); padding:100px 60px;
  text-align:center; display:flex; flex-direction:column; align-items:center;
}
.cta-single .eyebrow{ justify-content:center; }
.cta-single h3{ color:var(--paper); font-size:clamp(30px,4vw,46px); max-width:16ch; margin:18px 0 16px; }
.cta-single p{ color:var(--concrete-lt); font-size:16px; max-width:46ch; margin-bottom:34px; }
@media (max-width:800px){ .cta-single{ padding:60px 30px; } }

/* ---------------- FOOTER ---------------- */
.footer{ background:var(--ink); color:var(--paper); padding-top:80px; margin-top:auto; }
.footer__top{ display:grid; grid-template-columns:1.1fr 1fr 1fr 1fr; gap:50px; padding-bottom:60px; border-bottom:1px solid var(--line-dark); }
.footer__label{ font-family:var(--mono); font-size:11.5px; letter-spacing:0.12em; text-transform:uppercase; color:var(--amber); margin-bottom:14px; }
.footer__top p, .footer__top a{ color:var(--concrete-lt); font-size:14.5px; margin-bottom:8px; display:block; }
.footer__top a:hover{ color:var(--paper); }
.footer__social{ display:flex; gap:12px; margin-top:2px; }
.footer__social a{
  width:38px; height:38px; display:flex; align-items:center; justify-content:center;
  border:1px solid var(--line-dark); border-radius:var(--radius-sm);
  color:var(--concrete-lt); transition:background .3s, color .3s, border-color .3s, transform .3s;
}
.footer__social a:hover{ background:var(--amber); border-color:var(--amber); color:var(--ink); transform:translateY(-3px); }
.footer__social svg{ width:17px; height:17px; }
.footer__wordmark{ font-family:var(--display); font-weight:800; font-size:clamp(60px,11vw,150px); line-height:0.85; padding:40px 0 30px; color:var(--paper); display:flex; align-items:center; gap:20px; }
.footer__wordmark img{ height:0.7em; width:auto; }
.footer__bottom{ display:flex; justify-content:space-between; padding:22px 0; border-top:1px solid var(--line-dark); font-family:var(--mono); font-size:12px; color:var(--concrete-lt); }
@media (max-width:900px){
  .footer__top{ grid-template-columns:1fr 1fr; gap:34px; }
}
@media (max-width:700px){
  .footer__top{ grid-template-columns:1fr; gap:34px; }
  .footer__bottom{ flex-direction:column; gap:8px; }
}

/* ---------------- PAGE HEADER (inner pages) ---------------- */
.page-head{ background:var(--ink); color:var(--paper); padding:200px 0 90px; position:relative; overflow:hidden; }
.page-head--sticky{ position:sticky; top:0; z-index:1; }
.page-head .wrap{ position:relative; z-index:2; }
.page-head .wrap:has(.page-head__blueprint){ display:grid; grid-template-columns:1.2fr 1fr; gap:40px; align-items:center; }
.page-head h1{ font-size:clamp(38px,6vw,68px); }
.page-head p{ color:var(--concrete-lt); max-width:520px; margin-top:18px; font-size:16px; }
.page-head__crumb{ font-family:var(--mono); font-size:12px; color:var(--concrete-lt); text-transform:uppercase; letter-spacing:0.08em; margin-bottom:22px; display:flex; gap:8px; align-items:center; }
.page-head__crumb a:hover{ color:var(--amber); }
.page-head__crumb, .page-head h1, .page-head p{ opacity:0; animation:heroUp .9s cubic-bezier(.2,.7,.2,1) forwards; }
.page-head__crumb{ animation-delay:0s; }
.page-head h1{ animation-delay:.15s; }
.page-head p{ animation-delay:.3s; }
.page-head__blueprint{ position:relative; z-index:2; width:100%; }
.page-head__blueprint svg{ width:100%; height:auto; display:block; }
@media (max-width:900px){
  .page-head .wrap:has(.page-head__blueprint){ grid-template-columns:1fr; }
  .page-head__blueprint{ display:none; }
}

/* ---------------- ABOUT PAGE SPECIFIC ---------------- */
.about-transition{ position:relative; }
.overlap-reveal{
  position:relative; z-index:2; background:var(--paper);
  border-radius:36px 36px 0 0;
  box-shadow:0 -40px 70px -20px rgba(18,24,31,0.35);
  margin-top:-36px;
}
.intro-row{ display:grid; grid-template-columns:0.85fr 1.15fr; gap:70px; align-items:start; }
.intro-row__label{ display:flex; flex-direction:column; align-items:flex-start; gap:10px; }
.intro-row__sketch{ margin-top:20px; width:100%; max-width:230px; }
.intro-row__sketch img, .intro-row__sketch svg{ width:100%; height:auto; display:block; }
@media (max-width:800px){ .intro-row{ grid-template-columns:1fr; gap:30px; } }

/* Light variant of the inner-page header (used on Contact) */
.page-head--light{ background:var(--paper); color:var(--ink); padding:130px 0 50px; }
.page-head--light .page-head__crumb, .page-head--light .page-head p{ color:var(--concrete); }
.page-head--light .page-head__crumb a:hover{ color:var(--steel); }
.page-head--light .hero__grid{
  background-image:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
}
.page-head--light .bp-line{ stroke:var(--concrete); }
.page-head--light .bp-dash{ stroke:var(--concrete); }

.mosaic{ display:grid; grid-template-columns:repeat(6,1fr); grid-auto-rows:110px; gap:14px; margin-top:60px; }
.mosaic a{ position:relative; overflow:hidden; grid-column:span 2; grid-row:span 2; }
.mosaic a:nth-child(1){ grid-column:span 3; grid-row:span 3; }
.mosaic a:nth-child(2){ grid-column:span 3; grid-row:span 2; }
.mosaic a:nth-child(3){ grid-column:span 3; grid-row:span 2; }
.mosaic a:nth-child(4){ grid-column:span 2; grid-row:span 2; }
.mosaic a:nth-child(5){ grid-column:span 2; grid-row:span 2; }
.mosaic img{ width:100%; height:100%; object-fit:cover; transition:transform .7s cubic-bezier(.2,.7,.2,1); }
.mosaic a:hover img{ transform:scale(1.08); }
@media (max-width:700px){
  .mosaic{ grid-template-columns:repeat(2,1fr); grid-auto-rows:150px; }
  .mosaic a, .mosaic a:nth-child(1), .mosaic a:nth-child(2), .mosaic a:nth-child(3){ grid-column:span 1; grid-row:span 1; }
}

.vm-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.vm-item{ background:var(--paper); padding:44px; position:relative; border:1px solid var(--line); border-radius:var(--radius); transition:transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s; }
.vm-item:hover{ transform:translateY(-6px); box-shadow:0 24px 45px -24px rgba(18,24,31,0.22); z-index:2; }
.vm-item .eyebrow{ color:var(--steel); }
.vm-item .eyebrow::before{ background:var(--steel); }
.vm-item p{ color:var(--concrete); font-size:15.5px; }
@media (max-width:900px){ .vm-grid{ grid-template-columns:1fr; } }

.process-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.process-item{ background:var(--paper); padding:34px 28px; border:1px solid var(--line); border-radius:var(--radius); transition:transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s; }
.process-item:hover{ transform:translateY(-6px); box-shadow:0 24px 45px -24px rgba(18,24,31,0.22); z-index:2; position:relative; }
.process-item .icon{ width:32px; height:32px; color:var(--amber); margin-bottom:22px; display:block; }
.process-item h4{ font-family:var(--display); font-size:19px; font-weight:700; margin-bottom:10px; }
.process-item p{ color:var(--concrete); font-size:14px; }
@media (max-width:800px){ .process-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:500px){ .process-grid{ grid-template-columns:1fr; } }

.founder{ display:grid; grid-template-columns:0.55fr 1.45fr; gap:60px; align-items:center; }
.founder__media{ aspect-ratio:3/4; overflow:hidden; border-radius:var(--radius); }
.founder__media img{ width:100%; height:100%; object-fit:cover; transform:scale(1.15); transition:transform 1.1s cubic-bezier(.16,.8,.24,1); }
.founder.is-visible .founder__media img{ transform:scale(1); }
.founder__body .role{ font-family:var(--mono); color:var(--steel); font-size:13px; text-transform:uppercase; letter-spacing:0.06em; margin:8px 0 20px; }
.founder__body p{ color:var(--concrete); font-size:15.5px; max-width:560px; }
.founder__quote{
  margin-top:26px; padding-left:22px; border-left:3px solid var(--amber);
  font-family:var(--display); font-weight:700; font-style:italic;
  font-size:clamp(17px,1.8vw,21px); color:var(--ink); max-width:520px; line-height:1.35;
}
.founder__quote span{ display:block; margin-top:10px; font-family:var(--mono); font-weight:400; font-style:normal; font-size:12.5px; letter-spacing:0.06em; text-transform:uppercase; color:var(--concrete); }
@media (max-width:800px){ .founder{ grid-template-columns:1fr; } .founder__media{ max-width:280px; } }

.trust-list{ display:grid; grid-template-columns:0.6fr 1.4fr; gap:16px 40px; }
.trust-list .cat{ font-family:var(--display); font-weight:700; font-size:19px; padding-top:2px; }
.trust-list .items{ border-top:1px solid var(--line); }
.trust-list .items div{ padding:16px 0; border-bottom:1px solid var(--line); font-size:14.5px; color:var(--concrete); font-family:var(--mono); }
.trust-list .cat{ border-top:1px solid var(--line); padding-top:22px; }
@media (max-width:700px){ .trust-list{ grid-template-columns:1fr; } }

/* ---------------- SERVICES PAGE ---------------- */
.services-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:32px; background:transparent; border:none; padding-bottom:70px; margin-bottom:70px; border-bottom:1px solid var(--line); }
.service-card{ background:var(--paper); padding:50px; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; box-shadow:0 6px 24px rgba(18,24,31,0.06); transition:background .4s, box-shadow .4s; }
.service-card:hover{ background:var(--paper-dim); box-shadow:0 10px 32px rgba(18,24,31,0.1); }
.service-card__icon{ width:44px; height:44px; color:var(--steel); margin-bottom:26px; }
.service-card h3{ margin-bottom:14px; }
.service-card p{ color:var(--concrete); font-size:15px; margin-bottom:20px; }
.service-card__media{ margin-top:30px; aspect-ratio:16/9; overflow:hidden; border-radius:var(--radius-sm); }
.service-card__media img{ width:100%; height:100%; object-fit:cover; transition:transform .7s; }
.service-card:hover .service-card__media img{ transform:scale(1.035); }
@media (max-width:800px){ .services-grid{ grid-template-columns:1fr; } .service-card{ padding:36px 26px; } }

/* ---------------- PROJECTS PAGE ---------------- */
.filter-bar{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:50px; justify-content:flex-end; }
.filter-bar button{
  font-family:var(--mono); font-size:12.5px; letter-spacing:0.06em; text-transform:uppercase;
  padding:11px 20px; background:transparent; border:1px solid var(--line); color:var(--concrete);
  border-radius:var(--radius-sm);
  transition:all .3s;
}
.filter-bar button.is-active, .filter-bar button:hover{ background:var(--ink); color:var(--paper); border-color:var(--ink); }

.project-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:16px; background:transparent; border:none; }
.project-card{ background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; transition:transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s; }
.project-card:hover{ transform:translateY(-6px); box-shadow:0 24px 45px -24px rgba(18,24,31,0.25); }
.project-card__media{ position:relative; aspect-ratio:4/3; overflow:hidden; }
.project-card__media img{ width:100%; height:100%; object-fit:cover; transition:transform .7s cubic-bezier(.2,.7,.2,1); }
.project-card:hover .project-card__media img{ transform:scale(1.045); }
.project-card__tag{ position:absolute; top:18px; left:18px; font-family:var(--mono); font-size:11px; letter-spacing:0.06em; text-transform:uppercase; background:var(--ink); color:var(--paper); padding:7px 14px; border-radius:5px; }
.project-card__body{ padding:30px 30px 34px; }
.project-card__body .meta{ font-family:var(--mono); font-size:12px; color:var(--concrete); text-transform:uppercase; letter-spacing:0.05em; margin-bottom:10px; }
.project-card__body h3{ font-size:22px; margin-bottom:8px; }
@media (max-width:800px){ .project-grid{ grid-template-columns:1fr; } }

.who-grid{ display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line-dark); }
.who-item{ padding:44px 30px 38px; border-right:1px solid var(--line-dark); text-align:left; transition:background .35s, transform .35s; }
.who-item:hover{ background:rgba(244,242,236,0.05); transform:translateY(-6px); }
.who-item:last-child{ border-right:none; }
.who-item svg{ width:32px; height:32px; color:var(--amber); margin-bottom:20px; }
.who-item h4{ font-family:var(--display); font-size:19px; font-weight:700; margin-bottom:10px; }
.who-item p{ color:var(--concrete-lt); font-size:14px; }
@media (max-width:800px){ .who-grid{ grid-template-columns:1fr; } .who-item{ border-right:none; border-bottom:1px solid var(--line-dark); padding-bottom:30px; margin-bottom:30px; } }

.why-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; background:transparent; border:none; margin-top:40px; }
.why-item{
  background:var(--paper); padding:34px; border:1px solid var(--line); border-radius:var(--radius);
  box-shadow:0 20px 40px -28px rgba(18,24,31,0.2);
  transition:transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s;
}
.why-item:hover{ transform:translateY(-6px); box-shadow:0 30px 55px -22px rgba(18,24,31,0.3); }
.why-item .tag{ font-family:var(--mono); font-size:11.5px; letter-spacing:0.06em; text-transform:uppercase; border:1px solid var(--line); border-radius:var(--radius-sm); padding:6px 10px; display:inline-block; margin-bottom:18px; }
.why-item p{ color:var(--concrete); font-size:14.5px; }
@media (max-width:800px){ .why-grid{ grid-template-columns:1fr; } }

/* ---------------- PROJECT DETAIL ---------------- */
.detail-hero{ position:relative; height:72vh; min-height:420px; background:var(--ink); overflow:hidden; }
.detail-hero img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0.6; }
.detail-hero__overlay{ position:absolute; inset:0; background:linear-gradient(0deg, rgba(18,24,31,0.95), rgba(18,24,31,0.15)); }
.detail-hero__body{ position:absolute; left:0; right:0; bottom:0; z-index:2; padding:70px 0; color:var(--paper); }
.detail-hero__body h1{ font-size:clamp(34px,5.4vw,60px); margin-top:14px; }

.detail-meta{ display:grid; grid-template-columns:repeat(5,1fr); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.detail-meta div{ padding:26px 22px; border-right:1px solid var(--line); }
.detail-meta div:last-child{ border-right:none; }
.detail-meta .lbl{ font-family:var(--mono); font-size:11px; letter-spacing:0.08em; text-transform:uppercase; color:var(--concrete); margin-bottom:8px; display:block; }
.detail-meta .val{ font-family:var(--display); font-weight:700; font-size:18px; }
@media (max-width:800px){ .detail-meta{ grid-template-columns:repeat(2,1fr); } .detail-meta div{ border-right:none; border-bottom:1px solid var(--line); } }

.detail-body{ display:grid; grid-template-columns:1.5fr 1fr; gap:70px; }
.detail-body p{ color:var(--concrete); font-size:16px; margin-bottom:20px; }
.detail-stats{ display:grid; grid-template-columns:1fr 1fr; gap:10px; background:transparent; border:none; align-self:start; }
.detail-stats div{ background:var(--paper-dim); padding:28px 22px; border-radius:var(--radius-sm); }
.detail-stats .num{ font-family:var(--display); font-weight:800; font-size:34px; color:var(--steel); }
.detail-stats .lbl{ font-family:var(--mono); font-size:11.5px; text-transform:uppercase; color:var(--concrete); margin-top:6px; display:block; }
@media (max-width:800px){ .detail-body{ grid-template-columns:1fr; gap:36px; } }

.detail-gallery{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.detail-gallery img{ width:100%; height:220px; object-fit:cover; }
@media (max-width:800px){ .detail-gallery{ grid-template-columns:repeat(2,1fr); } }

/* ---------------- CONTACT ---------------- */
.contact-grid{ display:grid; grid-template-columns:1.15fr 0.85fr; gap:70px; align-items:stretch; }
.contact-photo-card{ min-height:420px; overflow:hidden; border-radius:var(--radius); height:100%; }
.contact-photo-card img{ width:100%; height:100%; object-fit:cover; }
.contact-map{ display:flex; flex-direction:column; gap:14px; }
.contact-map--full{ margin-top:60px; display:grid; grid-template-columns:1.4fr 1fr; gap:32px; align-items:stretch; }
.contact-map__frame{ overflow:hidden; border-radius:var(--radius); border:1px solid var(--line); min-height:260px; }
.contact-map__frame iframe{ width:100%; height:100%; border:0; display:block; }
.contact-map__list{ display:flex; flex-direction:column; gap:10px; justify-content:center; }
.contact-map__loc{ display:flex; gap:12px; align-items:flex-start; padding:14px 16px; background:var(--paper-dim); border-radius:var(--radius-sm); }
.contact-map__loc .dot{ width:9px; height:9px; border-radius:50%; background:var(--amber); margin-top:5px; flex-shrink:0; }
.contact-map__loc strong{ display:block; font-family:var(--display); font-size:15px; margin-bottom:2px; }
.contact-map__loc span{ font-size:13.5px; color:var(--concrete); }
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-bottom:20px; }
.form-field{ display:flex; flex-direction:column; gap:8px; }
.form-field.full{ grid-column:1/-1; }
.form-field label{ font-family:var(--mono); font-size:11.5px; text-transform:uppercase; letter-spacing:0.06em; color:var(--concrete); }
.form-field input, .form-field select, .form-field textarea{
  font-family:var(--body); font-size:15px; padding:14px 16px; border:1px solid var(--line); background:var(--paper); color:var(--ink);
  border-radius:var(--radius-sm);
  transition:border-color .3s;
}
.form-field input:focus, .form-field select:focus, .form-field textarea:focus{ outline:none; border-color:var(--steel); }
.form-field textarea{ resize:vertical; min-height:120px; }
.contact-info{ background:var(--ink); color:var(--paper); padding:44px; border-radius:var(--radius); }
.contact-info .row{ padding:20px 0; border-bottom:1px solid var(--line-dark); }
.contact-info .row:last-child{ border-bottom:none; }
.contact-info .lbl{ font-family:var(--mono); font-size:11px; text-transform:uppercase; letter-spacing:0.08em; color:var(--amber); margin-bottom:8px; display:block; }
.contact-info .val{ font-size:15.5px; }
@media (max-width:800px){
  .contact-grid{ grid-template-columns:1fr; gap:40px; }
  .form-row{ grid-template-columns:1fr; }
  .contact-map--full{ grid-template-columns:1fr; margin-top:40px; }
}

/* ---------------- SCROLL PROGRESS ---------------- */
.scroll-progress{ position:fixed; top:0; left:0; height:2px; background:var(--amber); z-index:200; width:0%; }