:root{
  --white:#ffffff;
  --gray-01:#afafaf;
  --gray-02:#d8d7d6;
  --gray-03:#f5f4f2;
  --gray-04:#ecebe8;
  --ink:#111111;
  --ink-soft:#3a3a3a;
  --ink-mute:#6e6e6e;
  --rule:#e6e4e0;

  --orange:#e03912;
  --teal:#0d3c44;
  --purple:#561345;

  --font-display:'Montserrat', system-ui, -apple-system, sans-serif;
  --font-body:'Montserrat', system-ui, -apple-system, sans-serif;
  --font-editorial:'Cormorant Garamond', Georgia, serif;

  --side: clamp(20px, 4.5vw, 72px);
  --sec-pad: clamp(50px, 7vw, 100px);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--white); color:var(--ink);
  font-family:var(--font-body); font-weight:400;
  font-size:15px; line-height:1.55;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{display:block; max-width:100%; height:auto;}
a{color:inherit; text-decoration:none;}
button{font:inherit; cursor:pointer; border:none; background:none;}

/* ---- Cursor ---- */
@media (pointer:fine){
  body{cursor:none;}
  .cursor{
    position:fixed; top:0; left:0; width:8px; height:8px;
    background:var(--ink); border-radius:50%;
    pointer-events:none; z-index:9999;
    transform:translate(-50%,-50%);
    transition:width .35s cubic-bezier(.2,.7,.2,1), height .35s cubic-bezier(.2,.7,.2,1);
    mix-blend-mode:difference;
  }
  .cursor.hover{width:56px; height:56px; background:var(--white);}
  a, button, .card, .division-card{cursor:none;}
}

/* ---- Nav ---- */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:200;
  display:flex; align-items:center; justify-content:space-between;
  padding:18px var(--side);
  background:linear-gradient(to bottom, rgba(0,0,0,.42), rgba(0,0,0,0));
  color:var(--white);
  transition:background .35s ease, color .35s ease, padding .35s ease;
}
.nav.scrolled{
  background:rgba(255,255,255,.96); color:var(--ink);
  border-bottom:1px solid var(--rule);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  padding:12px var(--side);
}
.brand-logo{display:flex; align-items:center; gap:16px;}
.brand-logo img{
  height:52px; width:auto;
  max-width:calc(52px * 377 / 139);
  object-fit:contain;
  object-position:left center;
  transition:filter .35s, height .35s, max-width .35s;
}
.nav.scrolled .brand-logo img{height:42px; max-width:calc(42px * 377 / 139);}
.brand-tag{
  display:none;
  font-family:var(--font-display); font-weight:500;
  font-size:9px; letter-spacing:.24em; text-transform:uppercase;
  opacity:.75; padding-left:16px; border-left:1px solid currentColor;
}
.nav-links{
  display:flex; gap:30px; align-items:center;
  font-family:var(--font-display); font-size:11px;
  font-weight:500; letter-spacing:.20em; text-transform:uppercase;
}
.nav-links a{opacity:.85; position:relative; padding:6px 0; transition:opacity .3s;}
.nav-links a:hover{opacity:1;}
.nav-links a.has-dot::before{
  content:""; display:inline-block; width:5px; height:5px; border-radius:50%;
  margin-right:8px; vertical-align:middle;
}
.nav-links a.orange::before{background:var(--orange);}
.nav-links a.teal::before{background:var(--teal);}
.nav-links a.purple::before{background:var(--purple);}
.lang-toggle{
  font-family:var(--font-display); font-size:10px; letter-spacing:.16em;
  font-weight:600; padding:6px 10px; border:1px solid currentColor; opacity:.85;
}
@media (max-width:1050px){.nav-links{display:none;}}
@media (max-width:640px){
  .brand-logo img{height:38px; max-width:calc(38px * 377 / 139);}
  .nav.scrolled .brand-logo img{height:32px; max-width:calc(32px * 377 / 139);}
}

/* ---- Common utilities ---- */
.eyebrow{
  font-family:var(--font-display); font-size:11px; font-weight:600;
  letter-spacing:.28em; text-transform:uppercase; color:var(--ink-mute);
  display:inline-flex; align-items:center; gap:8px;
}
.eyebrow::before{
  content:""; width:24px; height:1px; background:currentColor;
  display:inline-block; margin-right:6px;
}
.see-all{
  font-family:var(--font-display); font-size:11px; font-weight:600;
  letter-spacing:.20em; text-transform:uppercase;
  padding:14px 24px; border:1px solid var(--ink);
  transition:background .3s, color .3s;
}
.see-all:hover{background:var(--ink); color:var(--white);}

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

/* ---- Hero ---- */
.hero{position:relative; height:100vh; min-height:660px; overflow:hidden; color:var(--white);}
.hero-img{position:absolute; inset:0; background-size:cover; background-position:center; animation:kenburns 24s ease-in-out infinite alternate;}
@keyframes kenburns{from{transform:scale(1.03);} to{transform:scale(1.11) translate(-1%,-1%);}}
.hero::after{
  content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg, rgba(0,0,0,.28) 0%, rgba(0,0,0,.05) 45%, rgba(0,0,0,.65) 100%);
}
.hero-content{
  position:absolute; z-index:2;
  bottom:8vh; left:var(--side); right:var(--side);
  display:flex; align-items:flex-end; justify-content:space-between; gap:40px;
}
.hero-title{
  font-family:var(--font-display); font-weight:200;
  font-size:clamp(48px, 8vw, 140px); line-height:.96; letter-spacing:-.02em;
}
.hero-title strong{font-weight:700;}
.hero-title .em{font-family:var(--font-editorial); font-style:italic; font-weight:400;}
.hero-sub{
  max-width:340px; padding-bottom:14px;
  font-size:13px; line-height:1.7; opacity:.9; letter-spacing:.01em;
}
.scroll-cue{
  position:absolute; z-index:2;
  bottom:22px; left:var(--side);
  display:flex; flex-direction:column; align-items:center; gap:10px;
  font-family:var(--font-display); font-size:10px; letter-spacing:.28em;
  text-transform:uppercase; opacity:.85;
}
.scroll-cue::after{content:""; width:1px; height:36px; background:currentColor; animation:cue 1.6s ease-in-out infinite;}
@keyframes cue{0%,100%{opacity:.2;transform:scaleY(.5);} 50%{opacity:1;transform:scaleY(1);}}
.ticker{
  position:absolute; z-index:3; top:22px; right:var(--side); padding-top:90px;
  display:flex; align-items:center; gap:12px;
  font-family:var(--font-display); font-size:10px; letter-spacing:.16em; opacity:.85;
}
.ticker::before{
  content:""; width:6px; height:6px; border-radius:50%;
  background:#5EE38B; box-shadow:0 0 8px #5EE38B; animation:pulse 2s ease-in-out infinite;
}
@keyframes pulse{50%{opacity:.35;}}
@media (max-width:640px){.hero-content{flex-direction:column; align-items:flex-start;} .ticker{display:none;}}

/* Themed hero variants */
.hero.orange::after{background:linear-gradient(180deg, rgba(0,0,0,.24) 0%, rgba(224,57,18,.15) 40%, rgba(0,0,0,.65) 100%);}
.hero.teal::after  {background:linear-gradient(180deg, rgba(0,0,0,.28) 0%, rgba(13,60,68,.20) 40%, rgba(0,0,0,.75) 100%);}
.hero.purple::after{background:linear-gradient(180deg, rgba(0,0,0,.24) 0%, rgba(86,19,69,.25) 40%, rgba(0,0,0,.75) 100%);}

/* ---- Opening ---- */
.opening{
  padding:var(--sec-pad) var(--side);
  display:grid; grid-template-columns:1fr 3fr; gap:clamp(30px,5vw,100px);
  align-items:flex-start;
}
.opening-body{
  font-family:var(--font-display); font-weight:200;
  font-size:clamp(22px,2.5vw,38px); line-height:1.32; letter-spacing:-.005em;
  max-width:1000px; color:var(--ink);
}
.opening-body strong{font-weight:500;}
.opening-body em{font-family:var(--font-editorial); font-style:italic; font-weight:500;}
@media (max-width:820px){.opening{grid-template-columns:1fr;}}

/* ---- Divisions overview ---- */
.divisions-hero{
  padding:var(--sec-pad) var(--side);
  border-top:1px solid var(--rule);
}
.divisions-hero-head{
  display:flex; justify-content:space-between; align-items:baseline;
  margin-bottom:36px; gap:20px; flex-wrap:wrap;
}
.divisions-hero-head h2{
  font-family:var(--font-display); font-weight:200;
  font-size:clamp(30px,3.6vw,52px); letter-spacing:-.015em; max-width:640px;
}
.divisions-hero-head h2 em{font-family:var(--font-editorial); font-weight:500; font-style:italic;}
.divisions-hero-head p{max-width:340px; color:var(--ink-mute); font-size:13px;}
.divisions-grid{
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:clamp(14px,2vw,26px);
}
.division-card{
  position:relative; overflow:hidden;
  display:block; aspect-ratio:3/4; background:var(--gray-03); color:var(--white);
}
.division-card img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  transition:transform 1.4s cubic-bezier(.2,.7,.2,1), filter .5s;
  filter:brightness(.82);
}
.division-card:hover img{transform:scale(1.06); filter:brightness(.95);}
.division-card::after{
  content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg, rgba(0,0,0,.12) 0%, rgba(0,0,0,.82) 100%);
}
.division-card .info{
  position:absolute; left:28px; right:28px; bottom:28px; z-index:2;
}
.division-card .num-row{
  display:flex; align-items:center; gap:12px;
  font-family:var(--font-display); font-size:10px; font-weight:600;
  letter-spacing:.28em; text-transform:uppercase; opacity:.75;
  padding-bottom:12px;
}
.division-card .num-row .dot{width:10px; height:10px; border-radius:50%;}
.division-card.orange .dot{background:var(--orange);}
.division-card.teal .dot{background:var(--teal); box-shadow:0 0 0 1px rgba(255,255,255,.4);}
.division-card.purple .dot{background:var(--purple);}
.division-card h3{
  font-family:var(--font-display); font-weight:700;
  font-size:clamp(28px,3.2vw,44px); line-height:1;
  letter-spacing:-.02em;
  margin-bottom:10px;
}
.division-card .tagline{
  font-family:var(--font-editorial); font-style:italic; font-weight:400;
  font-size:clamp(15px,1.3vw,18px); line-height:1.35; opacity:.9;
  margin-bottom:12px; max-width:290px;
}
.division-card p{
  font-size:12px; opacity:.75; max-width:300px; line-height:1.55;
}
.division-card .arrow{
  display:inline-block; margin-top:18px;
  font-family:var(--font-display); font-size:11px; font-weight:600;
  letter-spacing:.20em; text-transform:uppercase;
  padding-bottom:4px; border-bottom:1px solid rgba(255,255,255,.55);
}
@media (max-width:820px){.divisions-grid{grid-template-columns:1fr;}}

/* ---- Subsidiary dedicated sections ---- */
.subsidiary{
  padding:var(--sec-pad) var(--side);
  border-top:1px solid var(--rule);
  display:grid; grid-template-columns:1.15fr 1fr;
  gap:clamp(30px,6vw,90px);
  align-items:center;
}
.subsidiary.reversed{grid-template-columns:1fr 1.15fr;}
.subsidiary.reversed .sub-visual{order:2;}
.sub-visual{aspect-ratio:4/5; overflow:hidden; background:var(--gray-03); position:relative;}
.sub-visual img{width:100%; height:100%; object-fit:cover; transition:transform 12s ease-out;}
.subsidiary:hover .sub-visual img{transform:scale(1.05);}
.sub-visual::after{content:""; position:absolute; left:0; top:0; width:6px; height:100%;}
.subsidiary.ds .sub-visual::after{background:var(--orange);}
.subsidiary.cf .sub-visual::after{background:var(--teal);}
.subsidiary.ak .sub-visual::after{background:var(--purple);}
.sub-content .sub-logo{height:40px; margin-bottom:22px;}
.sub-content .sub-logo img{height:100%; width:auto;}
.sub-content h2{
  font-family:var(--font-display); font-weight:200;
  font-size:clamp(40px,5vw,72px); line-height:.98;
  letter-spacing:-.02em; margin-top:14px;
}
.sub-content h2 em{font-family:var(--font-editorial); font-weight:500; font-style:italic;}
.sub-content .sub-lede{
  font-size:15px; color:var(--ink-soft); font-weight:300;
  line-height:1.65; max-width:520px; margin-top:20px;
}
.sub-services{
  display:grid; grid-template-columns:1fr 1fr;
  gap:14px 32px; margin-top:28px;
  padding-top:24px; border-top:1px solid var(--rule);
}
.sub-service{
  padding-left:16px; border-left:2px solid;
  font-family:var(--font-display); font-size:13px; font-weight:500; line-height:1.4;
}
.subsidiary.ds .sub-service{border-color:var(--orange);}
.subsidiary.cf .sub-service{border-color:var(--teal);}
.subsidiary.ak .sub-service{border-color:var(--purple);}
.sub-service span{
  display:block; font-size:10px; font-weight:600; letter-spacing:.18em;
  text-transform:uppercase; color:var(--ink-mute); margin-top:4px;
}
.sub-cta{
  display:inline-flex; align-items:center; gap:10px; margin-top:28px;
  font-family:var(--font-display); font-size:12px; font-weight:600;
  letter-spacing:.22em; text-transform:uppercase;
  padding:16px 26px; border:1px solid var(--ink);
  transition:background .3s, color .3s;
}
.sub-cta:hover{background:var(--ink); color:var(--white);}
.subsidiary.ds .sub-cta{border-color:var(--orange); color:var(--orange);}
.subsidiary.ds .sub-cta:hover{background:var(--orange); color:var(--white);}
.subsidiary.cf .sub-cta{border-color:var(--teal); color:var(--teal);}
.subsidiary.cf .sub-cta:hover{background:var(--teal); color:var(--white);}
.subsidiary.ak{background:var(--purple); color:#f0e6ec; border-top:none; margin-top:1px;}
.subsidiary.ak .sub-content h2{color:#fff;}
.subsidiary.ak .sub-content .sub-lede{color:rgba(255,255,255,.85);}
.subsidiary.ak .sub-service{color:#fff;}
.subsidiary.ak .sub-service span{color:rgba(255,255,255,.6);}
.subsidiary.ak .sub-services{border-top-color:rgba(255,255,255,.20);}
.subsidiary.ak .eyebrow{color:rgba(255,255,255,.7);}
.subsidiary.ak .sub-cta{border-color:#fff; color:#fff;}
.subsidiary.ak .sub-cta:hover{background:#fff; color:var(--purple);}
.ak-callcentre-mini{margin-top:28px; display:flex; align-items:baseline; gap:16px;}
.ak-callcentre-mini .num{
  font-family:var(--font-display); font-weight:200;
  font-size:clamp(64px,7vw,110px); line-height:.9; color:#fff; letter-spacing:-.03em;
}
.ak-callcentre-mini .lbl{
  font-family:var(--font-display); font-size:10px; letter-spacing:.28em;
  text-transform:uppercase; opacity:.65; max-width:130px; line-height:1.5;
}
@media (max-width:900px){
  .subsidiary, .subsidiary.reversed{grid-template-columns:1fr;}
  .subsidiary.reversed .sub-visual{order:0;}
  .sub-services{grid-template-columns:1fr;}
}

/* ---- Work grid ---- */
.work{padding:var(--sec-pad) var(--side); background:var(--gray-03);}
.work.on-white{background:var(--white);}
.work-head{
  display:flex; align-items:flex-end; justify-content:space-between;
  margin-bottom:44px; gap:20px; flex-wrap:wrap;
}
.work-head h2{
  font-family:var(--font-display); font-weight:200;
  font-size:clamp(40px,5.5vw,84px); line-height:1; letter-spacing:-.02em;
}
.work-head h2 em{font-family:var(--font-editorial); font-weight:500; font-style:italic;}
.work-head p{max-width:280px; color:var(--ink-mute); font-size:13px;}
.work-grid{
  display:grid; grid-template-columns:repeat(12, 1fr);
  grid-auto-rows:minmax(120px, auto);
  gap:clamp(12px,1.8vw,24px);
}
.card{position:relative; overflow:hidden; display:block; background:#000;}
.card img{
  width:100%; height:100%; object-fit:cover;
  transition:transform 1.6s cubic-bezier(.2,.7,.2,1), filter .5s;
  filter:brightness(.92) saturate(.95);
}
.card:hover img{transform:scale(1.06); filter:brightness(1) saturate(1);}
.card::after{
  content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg, transparent 55%, rgba(0,0,0,.78) 100%);
  opacity:.9; transition:opacity .4s;
}
.card:hover::after{opacity:1;}
.card .meta{position:absolute; left:22px; right:22px; bottom:20px; z-index:2; color:var(--white);}
.card .kicker{
  font-family:var(--font-display); font-size:10px; letter-spacing:.24em;
  text-transform:uppercase; opacity:.9;
  display:flex; align-items:center; gap:8px;
}
.card .kicker .dot{width:5px; height:5px; border-radius:50%;}
.card .kicker .dot.orange{background:var(--orange);}
.card .kicker .dot.teal{background:var(--teal);}
.card .kicker .dot.purple{background:var(--purple);}
.card .kicker .dot.holding{background:var(--gray-01);}
.card .name{
  font-family:var(--font-display); font-weight:300;
  font-size:clamp(18px,1.7vw,28px); margin-top:6px; line-height:1.08; letter-spacing:-.005em;
}
.card .name strong{font-weight:600;}
.card .year{
  position:absolute; top:22px; right:22px; z-index:2;
  color:var(--white); font-family:var(--font-display); font-size:11px;
  letter-spacing:.24em; opacity:.7;
}
.c-hero{grid-column:span 7; grid-row:span 5;}
.c-tall{grid-column:span 5; grid-row:span 5;}
.c-wide{grid-column:span 8; grid-row:span 3;}
.c-sm  {grid-column:span 4; grid-row:span 3;}
.c-md  {grid-column:span 6; grid-row:span 4;}
.c-mdt {grid-column:span 6; grid-row:span 4;}
.c-half{grid-column:span 6; grid-row:span 4;}
.c-third{grid-column:span 4; grid-row:span 4;}
@media (max-width:900px){
  .work-grid{grid-template-columns:repeat(6,1fr);}
  .c-hero,.c-tall,.c-wide,.c-md,.c-mdt,.c-half{grid-column:span 6; grid-row:span 4;}
  .c-sm,.c-third{grid-column:span 3; grid-row:span 3;}
}
@media (max-width:520px){.c-hero,.c-tall,.c-wide,.c-md,.c-mdt,.c-sm,.c-half,.c-third{grid-column:span 6; grid-row:span 3;}}

/* ---- Process ---- */
.process{padding:var(--sec-pad) var(--side); background:var(--white);}
.process-head h2{
  font-family:var(--font-display); font-weight:200;
  font-size:clamp(40px,5.5vw,84px); line-height:1; letter-spacing:-.02em; max-width:1000px;
}
.process-head h2 em{font-family:var(--font-editorial); font-weight:500; font-style:italic;}
.process-head p{color:var(--ink-mute); font-size:13px; max-width:520px; margin-top:24px;}
.process-steps{
  display:grid; grid-template-columns:repeat(5, 1fr);
  gap:clamp(20px,3vw,44px);
  margin-top:56px; padding-top:28px;
  border-top:1px solid var(--rule);
}
.step .num{
  font-family:var(--font-display); font-weight:200;
  font-size:clamp(48px,6vw,86px); line-height:1; color:var(--ink); letter-spacing:-.03em;
}
.step h3{
  font-family:var(--font-display); font-weight:600; font-size:14px;
  letter-spacing:.14em; text-transform:uppercase; margin-top:16px;
}
.step p{font-size:13px; color:var(--ink-mute); margin-top:10px; max-width:220px; line-height:1.55;}
.step.final .num{color:var(--purple);}
.step.final h3{color:var(--purple);}
@media (max-width:900px){.process-steps{grid-template-columns:repeat(2,1fr); gap:40px;}}
@media (max-width:520px){.process-steps{grid-template-columns:1fr;}}

/* ---- Founders ---- */
.founders{padding:var(--sec-pad) var(--side); background:var(--white); border-top:1px solid var(--rule);}
.founders-head{text-align:center; margin-bottom:56px;}
.founders-head h2{
  font-family:var(--font-display); font-weight:200;
  font-size:clamp(36px,4.5vw,64px); line-height:1.05; margin-top:12px; letter-spacing:-.01em;
}
.founders-head h2 em{font-family:var(--font-editorial); font-weight:400; font-style:italic;}
.founder-grid{display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,6vw,90px);}
.founder{display:grid; grid-template-columns:160px 1fr; gap:32px; align-items:flex-start;}
.founder .portrait{aspect-ratio:4/5; overflow:hidden; background:#000;}
.founder .portrait img{width:100%; height:100%; object-fit:cover;}
.founder h3{font-family:var(--font-display); font-weight:600; font-size:20px; letter-spacing:.02em;}
.founder .role{
  font-family:var(--font-display); font-size:10px; font-weight:600;
  letter-spacing:.22em; text-transform:uppercase; color:var(--ink-mute); margin-top:6px;
}
.founder blockquote{
  margin-top:20px; padding-left:18px; border-left:1px solid var(--ink);
  font-family:var(--font-editorial); font-style:italic; font-weight:400;
  font-size:17px; line-height:1.5; color:var(--ink-soft);
}
.together{
  text-align:center; margin-top:50px; padding-top:30px; border-top:1px solid var(--rule);
  font-family:var(--font-display); font-weight:300; font-size:15px;
  letter-spacing:.02em; color:var(--ink-soft); font-style:italic;
}
@media (max-width:820px){.founder-grid{grid-template-columns:1fr;} .founder{grid-template-columns:110px 1fr; gap:22px;}}

/* ---- Testimonials ---- */
.testimonials{
  padding:var(--sec-pad) var(--side); background:var(--gray-03);
  display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,6vw,80px);
}
.quote{
  font-family:var(--font-editorial); font-style:italic; font-weight:400;
  font-size:clamp(22px,2.4vw,32px); line-height:1.35; color:var(--ink);
}
.quote::before{
  content:"“"; display:block; font-family:var(--font-editorial);
  font-size:80px; line-height:.6; color:var(--ink-mute); opacity:.35; margin-bottom:6px;
}
.cite{
  display:block; margin-top:24px;
  font-family:var(--font-display); font-style:normal; font-weight:600;
  font-size:11px; letter-spacing:.24em; text-transform:uppercase; color:var(--ink);
}
@media (max-width:820px){.testimonials{grid-template-columns:1fr;}}

/* ---- Journal ---- */
.journal{padding:var(--sec-pad) var(--side); background:var(--white);}
.j-head{
  display:flex; justify-content:space-between; align-items:baseline;
  margin-bottom:40px; gap:20px; flex-wrap:wrap;
}
.j-head h2{
  font-family:var(--font-display); font-weight:200;
  font-size:clamp(36px,4.5vw,64px); letter-spacing:-.01em;
}
.j-head h2 em{font-family:var(--font-editorial); font-weight:500; font-style:italic;}
.j-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(20px,3vw,40px);}
.article{display:block; padding-bottom:22px; border-bottom:1px solid var(--rule);}
.article .thumb{aspect-ratio:4/3; overflow:hidden; margin-bottom:20px; background:var(--gray-02);}
.article .thumb img{width:100%; height:100%; object-fit:cover; transition:transform 1.4s cubic-bezier(.2,.7,.2,1);}
.article:hover .thumb img{transform:scale(1.05);}
.article .cat{
  font-family:var(--font-display); font-size:10px; font-weight:600;
  letter-spacing:.22em; text-transform:uppercase; color:var(--ink-mute);
}
.article h3{
  font-family:var(--font-display); font-weight:400;
  font-size:clamp(20px,1.8vw,26px); line-height:1.25; letter-spacing:-.005em; margin-top:12px;
}
.article .date{
  font-family:var(--font-display); font-size:11px; letter-spacing:.14em;
  color:var(--ink-mute); margin-top:14px;
}
@media (max-width:820px){.j-grid{grid-template-columns:1fr;}}

/* ---- Contact section ---- */
.contact{position:relative; padding:var(--sec-pad) var(--side); background:#0f0f0f; color:var(--white); overflow:hidden;}
.contact::before{
  content:""; position:absolute; inset:0;
  background-size:cover; background-position:center;
  opacity:.20; filter:blur(4px) grayscale(.4);
}
.contact-inner{position:relative; z-index:2; max-width:900px; margin:0 auto; text-align:center;}
.contact .eyebrow{color:rgba(255,255,255,.65);}
.contact h2{
  font-family:var(--font-display); font-weight:200;
  font-size:clamp(52px,7vw,120px); line-height:1; letter-spacing:-.02em; margin-top:14px;
}
.contact h2 em{font-family:var(--font-editorial); font-weight:400; font-style:italic;}
.contact-form{max-width:640px; margin:44px auto 0; display:grid; grid-template-columns:1fr 1fr; gap:20px;}
.contact-form input, .contact-form select, .contact-form textarea{
  background:transparent; border:none; border-bottom:1px solid rgba(255,255,255,.35);
  color:var(--white); font-family:var(--font-display); font-size:14px;
  padding:16px 4px; outline:none; transition:border-color .3s;
}
.contact-form input:focus, .contact-form select:focus, .contact-form textarea:focus{border-color:var(--white);}
.contact-form input::placeholder, .contact-form textarea::placeholder{color:rgba(255,255,255,.55);}
.contact-form .full{grid-column:1/-1;}
.contact-form textarea{grid-column:1/-1; resize:vertical; min-height:80px;}
.contact-form button{
  grid-column:1/-1; justify-self:center; margin-top:20px;
  font-family:var(--font-display); font-size:12px; font-weight:600;
  letter-spacing:.24em; text-transform:uppercase; color:var(--white);
  padding:16px 42px; border:1px solid var(--white); transition:background .3s, color .3s;
}
.contact-form button:hover{background:var(--white); color:#0f0f0f;}
.contact-form select{
  appearance:none; -webkit-appearance:none;
  background-image:linear-gradient(45deg, transparent 50%, rgba(255,255,255,.55) 50%),linear-gradient(135deg, rgba(255,255,255,.55) 50%, transparent 50%);
  background-position:calc(100% - 14px) 22px, calc(100% - 8px) 22px;
  background-size:6px 6px, 6px 6px; background-repeat:no-repeat;
}
.contact-form option{background:#0f0f0f; color:var(--white);}
@media (max-width:640px){.contact-form{grid-template-columns:1fr;}}

/* ---- Footer ---- */
footer{padding:56px var(--side) 28px; background:#0a0a0a; color:rgba(255,255,255,.7); font-size:12px;}
.footer-grid{
  display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:40px;
  padding-bottom:36px; border-bottom:1px solid rgba(255,255,255,.14);
}
.footer-logo img{
  height:56px; width:auto; filter:brightness(0) invert(1); margin-bottom:12px;
}
.footer-tagline{
  margin-top:18px; max-width:340px; font-style:italic;
  font-family:var(--font-editorial); font-size:16px; line-height:1.4; color:rgba(255,255,255,.75);
}
footer h4{
  font-family:var(--font-display); font-size:10px; font-weight:600;
  letter-spacing:.22em; text-transform:uppercase; color:rgba(255,255,255,.5); margin-bottom:14px;
}
footer ul{list-style:none;}
footer li{margin-bottom:8px;}
footer a:hover{color:var(--white);}
footer li .dot{display:inline-block; width:5px; height:5px; border-radius:50%; margin-right:8px; vertical-align:middle;}
footer li .dot.orange{background:var(--orange);}
footer li .dot.teal{background:var(--teal);}
footer li .dot.purple{background:var(--purple);}
.footer-bottom{
  display:flex; justify-content:space-between; align-items:center;
  padding-top:24px; flex-wrap:wrap; gap:14px;
  font-family:var(--font-display); font-size:11px; letter-spacing:.14em; color:rgba(255,255,255,.5);
}
@media (max-width:820px){.footer-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:520px){.footer-grid{grid-template-columns:1fr;}}

/* ============================================================
   SUB-PAGE ONLY STYLES
============================================================ */

/* ---- Page hero (shorter than homepage hero) ---- */
.page-hero{position:relative; height:70vh; min-height:520px; overflow:hidden; color:var(--white);}
.page-hero-img{position:absolute; inset:0; background-size:cover; background-position:center; animation:kenburns 28s ease-in-out infinite alternate;}
.page-hero::after{content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg, rgba(0,0,0,.35) 0%, rgba(0,0,0,.10) 50%, rgba(0,0,0,.70) 100%);}
.page-hero-content{position:absolute; z-index:2; left:var(--side); right:var(--side); bottom:8vh; max-width:1200px;}
.page-hero-content .subsidiary-crumb{
  font-family:var(--font-display); font-size:11px; font-weight:600;
  letter-spacing:.28em; text-transform:uppercase; opacity:.85;
  display:inline-flex; align-items:center; gap:10px;
}
.page-hero-content .subsidiary-crumb .dot{width:7px; height:7px; border-radius:50%;}
.page-hero.orange .subsidiary-crumb .dot{background:var(--orange);}
.page-hero.teal .subsidiary-crumb .dot{background:var(--teal);}
.page-hero.purple .subsidiary-crumb .dot{background:var(--purple);}
.page-hero h1{
  font-family:var(--font-display); font-weight:200;
  font-size:clamp(48px,7vw,116px); line-height:.98; letter-spacing:-.02em;
  margin-top:14px; max-width:1000px;
}
.page-hero h1 strong{font-weight:700;}
.page-hero h1 em{font-family:var(--font-editorial); font-style:italic; font-weight:400;}
.page-hero .kicker{
  font-family:var(--font-display); font-size:14px; font-weight:300;
  margin-top:16px; max-width:520px; opacity:.9;
}
.page-hero.orange::after{background:linear-gradient(180deg, rgba(0,0,0,.30) 0%, rgba(224,57,18,.20) 50%, rgba(0,0,0,.75) 100%);}
.page-hero.teal::after{background:linear-gradient(180deg, rgba(0,0,0,.35) 0%, rgba(13,60,68,.30) 50%, rgba(0,0,0,.80) 100%);}
.page-hero.purple::after{background:linear-gradient(180deg, rgba(0,0,0,.28) 0%, rgba(86,19,69,.32) 50%, rgba(0,0,0,.80) 100%);}

/* ---- Service tiles (subsidiary pages) ---- */
.services{
  padding:var(--sec-pad) var(--side);
  border-top:1px solid var(--rule);
}
.services-head{max-width:900px; margin-bottom:40px;}
.services-head h2{
  font-family:var(--font-display); font-weight:200;
  font-size:clamp(36px,4.5vw,64px); line-height:1.05; letter-spacing:-.02em; margin-top:14px;
}
.services-head h2 em{font-family:var(--font-editorial); font-weight:500; font-style:italic;}
.services-head p{font-size:15px; color:var(--ink-soft); font-weight:300; line-height:1.6; margin-top:16px; max-width:640px;}

.service-list{display:grid; grid-template-columns:1fr; gap:0;}
.service-row{
  display:grid; grid-template-columns:80px 1fr 1.4fr; gap:32px;
  padding:36px 0; border-top:1px solid var(--rule); align-items:flex-start;
}
.service-row:last-child{border-bottom:1px solid var(--rule);}
.service-row .snum{
  font-family:var(--font-display); font-weight:200;
  font-size:44px; line-height:1; color:var(--ink); letter-spacing:-.02em;
}
.service-row.orange .snum{color:var(--orange);}
.service-row.teal .snum{color:var(--teal);}
.service-row.purple .snum{color:var(--purple);}
.service-row h3{
  font-family:var(--font-display); font-weight:600;
  font-size:clamp(22px,2vw,30px); letter-spacing:-.005em;
}
.service-row .stag{
  font-family:var(--font-editorial); font-style:italic; font-weight:400;
  font-size:15px; color:var(--ink-mute); margin-top:6px;
}
.service-row p{
  font-size:14px; color:var(--ink-soft); line-height:1.6;
}
@media (max-width:820px){
  .service-row{grid-template-columns:1fr; gap:12px;}
  .service-row .snum{font-size:32px;}
}

/* ---- Split feature (before/after or side comparison) ---- */
.compare{padding:var(--sec-pad) var(--side); background:var(--gray-03); border-top:1px solid var(--rule);}
.compare-head{display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:32px; gap:20px; flex-wrap:wrap;}
.compare-head h2{
  font-family:var(--font-display); font-weight:200;
  font-size:clamp(36px,4.5vw,64px); line-height:1.05; letter-spacing:-.01em;
}
.compare-head h2 em{font-family:var(--font-editorial); font-weight:500; font-style:italic;}
.compare-image{
  position:relative; aspect-ratio:16/9; overflow:hidden; background:#000;
}
.compare-image img{width:100%; height:100%; object-fit:cover;}
.compare-caption{
  display:flex; justify-content:space-between; margin-top:14px;
  font-family:var(--font-display); font-size:11px; letter-spacing:.22em;
  text-transform:uppercase; color:var(--ink-mute);
}
.compare-caption .render-side::before, .compare-caption .built-side::before{
  content:""; display:inline-block; width:6px; height:6px; border-radius:50%; margin-right:8px; vertical-align:middle;
}
.compare-caption .render-side::before{background:var(--gray-01);}
.compare-caption .built-side::before{background:var(--teal);}

/* ---- Tiers grid (After Keys) ---- */
.tiers{padding:var(--sec-pad) var(--side); background:var(--white); border-top:1px solid var(--rule);}
.tiers-head{max-width:800px; margin-bottom:44px;}
.tiers-head h2{font-family:var(--font-display); font-weight:200; font-size:clamp(36px,4.5vw,64px); letter-spacing:-.01em;}
.tiers-head h2 em{font-family:var(--font-editorial); font-style:italic; font-weight:500;}
.tiers-head p{color:var(--ink-soft); font-weight:300; font-size:15px; line-height:1.6; margin-top:14px;}
.tiers-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.tier{
  padding:36px 30px; background:var(--gray-03);
  border-top:3px solid var(--purple); position:relative;
}
.tier.signature{background:var(--purple); color:#f0e6ec;}
.tier .tier-tag{
  font-family:var(--font-display); font-size:10px; font-weight:600;
  letter-spacing:.28em; text-transform:uppercase; opacity:.75;
}
.tier h3{
  font-family:var(--font-display); font-weight:700;
  font-size:32px; letter-spacing:-.01em; margin-top:8px;
}
.tier.signature h3{color:#fff;}
.tier .tier-lede{
  font-family:var(--font-editorial); font-style:italic; font-size:16px;
  color:var(--ink-mute); margin-top:6px;
}
.tier.signature .tier-lede{color:rgba(255,255,255,.75);}
.tier ul{
  list-style:none; margin-top:26px; padding-top:22px; border-top:1px solid rgba(0,0,0,.10);
}
.tier.signature ul{border-top-color:rgba(255,255,255,.20);}
.tier li{
  padding:8px 0; font-size:13px; line-height:1.5; color:var(--ink-soft);
  display:flex; gap:10px; align-items:flex-start;
}
.tier.signature li{color:rgba(255,255,255,.86);}
.tier li::before{content:"✓"; font-weight:700; color:var(--purple);}
.tier.signature li::before{color:#fff;}
@media (max-width:820px){.tiers-grid{grid-template-columns:1fr;}}

/* ---- Filter bar (work index) ---- */
.filter-bar{
  display:flex; gap:10px; flex-wrap:wrap; margin-bottom:36px;
  padding-bottom:24px; border-bottom:1px solid var(--rule);
}
.filter-chip{
  font-family:var(--font-display); font-size:11px; font-weight:600;
  letter-spacing:.20em; text-transform:uppercase;
  padding:10px 18px; border:1px solid var(--rule);
  transition:background .3s, color .3s, border-color .3s;
  display:inline-flex; align-items:center; gap:8px;
}
.filter-chip:hover, .filter-chip.active{background:var(--ink); color:var(--white); border-color:var(--ink);}
.filter-chip .dot{width:6px; height:6px; border-radius:50%;}
.filter-chip .dot.orange{background:var(--orange);}
.filter-chip .dot.teal{background:var(--teal);}
.filter-chip .dot.purple{background:var(--purple);}

/* ---- Case study page ---- */
.case-lede{padding:var(--sec-pad) var(--side); border-top:1px solid var(--rule);}
.case-lede-grid{
  display:grid; grid-template-columns:1fr 1.2fr; gap:clamp(30px,6vw,90px);
  align-items:flex-start;
}
.case-lede h2{
  font-family:var(--font-editorial); font-style:italic; font-weight:500;
  font-size:clamp(28px,3vw,44px); line-height:1.25; color:var(--ink);
}
.case-body{font-size:15px; line-height:1.75; color:var(--ink-soft); font-weight:300;}
.case-body p{margin-top:16px;}
.case-body p:first-child{margin-top:0;}

.case-meta{
  display:grid; grid-template-columns:repeat(4,1fr); gap:26px;
  padding:32px var(--side); border-top:1px solid var(--rule); border-bottom:1px solid var(--rule);
  background:var(--gray-04);
}
.case-meta div{}
.case-meta strong{
  display:block; font-family:var(--font-display); font-size:10px; font-weight:600;
  letter-spacing:.24em; text-transform:uppercase; color:var(--ink-mute); margin-bottom:6px;
}
.case-meta span{
  display:block; font-family:var(--font-display); font-size:14px; color:var(--ink); font-weight:500;
}
@media (max-width:820px){.case-meta{grid-template-columns:1fr 1fr;} .case-lede-grid{grid-template-columns:1fr;}}

.gallery{padding:var(--sec-pad) var(--side); background:var(--white);}
.gallery-head{margin-bottom:24px;}
.gallery-head h2{font-family:var(--font-display); font-weight:200; font-size:clamp(28px,3vw,42px); letter-spacing:-.01em;}
.gallery-grid{display:grid; grid-template-columns:repeat(6,1fr); gap:clamp(12px,1.5vw,20px); grid-auto-rows:minmax(140px, auto);}
.g-full{grid-column:span 6; aspect-ratio:16/9; overflow:hidden; background:#000;}
.g-half{grid-column:span 3; aspect-ratio:4/5; overflow:hidden; background:#000;}
.g-third{grid-column:span 2; aspect-ratio:3/4; overflow:hidden; background:#000;}
.gallery-grid img{width:100%; height:100%; object-fit:cover; transition:transform 1.4s ease;}
.gallery-grid > *:hover img{transform:scale(1.03);}
@media (max-width:820px){.g-full,.g-half,.g-third{grid-column:span 6;}}

.case-quote{
  padding:var(--sec-pad) var(--side);
  border-top:1px solid var(--rule);
  text-align:center;
}
.case-quote blockquote{
  font-family:var(--font-editorial); font-style:italic; font-weight:400;
  font-size:clamp(28px,3.4vw,46px); line-height:1.3; max-width:1000px; margin:0 auto;
  color:var(--ink);
}
.case-quote .cite{display:block; margin-top:22px;}

.related{padding:var(--sec-pad) var(--side); background:var(--gray-03); border-top:1px solid var(--rule);}
.related-head{margin-bottom:32px;}
.related-head h2{font-family:var(--font-display); font-weight:200; font-size:clamp(28px,3vw,42px); letter-spacing:-.01em;}
.related-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.related .card{aspect-ratio:4/5;}
@media (max-width:820px){.related-grid{grid-template-columns:1fr;}}

/* ---- Timeline (About) ---- */
.timeline{padding:var(--sec-pad) var(--side); border-top:1px solid var(--rule);}
.timeline-head{max-width:640px; margin-bottom:40px;}
.timeline-head h2{font-family:var(--font-display); font-weight:200; font-size:clamp(36px,4.5vw,64px); letter-spacing:-.01em;}
.timeline-head h2 em{font-family:var(--font-editorial); font-style:italic; font-weight:500;}
.tl-list{position:relative; display:grid; gap:0;}
.tl-item{
  display:grid; grid-template-columns:140px 1fr 2fr; gap:28px;
  padding:28px 0; border-top:1px solid var(--rule); align-items:flex-start;
}
.tl-item:last-child{border-bottom:1px solid var(--rule);}
.tl-item .year{
  font-family:var(--font-display); font-weight:200; font-size:36px; color:var(--ink); letter-spacing:-.02em;
}
.tl-item h3{font-family:var(--font-display); font-weight:600; font-size:18px; letter-spacing:.01em;}
.tl-item p{font-size:14px; color:var(--ink-soft); line-height:1.65;}
@media (max-width:820px){.tl-item{grid-template-columns:100px 1fr;} .tl-item p{grid-column:1/-1;}}