
/* =========================================================
   TechEngg | Design System
   Concept: "Survey lines meet steel". TechEngg began in 1999 as an
   aeromagnetic/geophysical survey company before becoming an EPC and
   heavy-equipment supplier. The contour/survey-line motif and a
   molten-bronze accent against deep ink run through the whole site.
   ========================================================= */

:root{
  /* ---- color ---- */
  --ink:        #171716;   /* primary dark background */
  --ink-soft:   #222221;   /* raised dark panel */
  --ink-line:   rgba(255,255,255,.14);
  --ink-line-soft: rgba(255,255,255,.08);

  --paper:      #efefee;   /* primary light background (cool, not cream) */
  --paper-dim:  #e4e4e3;   /* recessed light panel / card */
  --paper-line: #d6d5d3;

  --text-ink:   #1c1b1a;   /* body text on paper */
  --text-steel: #605e5c;   /* secondary text on paper */
  --text-pale:  #b3b1af;   /* muted text on ink */
  --text-onink: #ececec;   /* primary text on ink */

  --amber:      #85837f;   /* primary accent */
  --amber-deep: #605e5c;   /* accent hover / darker accent text */
  --amber-tint: #dfdfde;   /* pale amber wash for light-mode tags */

  /* ---- type ---- */
  --f-display: 'IBM Plex Sans', sans-serif;
  --f-body: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* ---- shape / motion ---- */
  --radius-s: 4px;
  --radius-m: 8px;
  --ease: cubic-bezier(.4,0,.2,1);
}

/* ---------------------------------------------------------
   Reset & base
   --------------------------------------------------------- */
*,*::before,*::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior: auto; }
  *,*::before,*::after{ animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
}
body{
  margin:0;
  font-family: var(--f-body);
  background: var(--paper);
  color: var(--text-ink);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
img{ max-width:100%; display:block; }
a{ color: inherit; text-decoration: none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4,p,figure{ margin:0; }
button{ font-family: inherit; }

:focus-visible{
  outline: 2px solid var(--amber);
  outline-offset: 3px;
}

.container{
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 32px;
}
@media (max-width: 640px){ .container{ padding: 0 20px; } }

.visually-hidden{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

.skip-link{
  position:absolute; left:16px; top:-60px;
  background: var(--amber); color:#101010; padding:10px 16px;
  border-radius: var(--radius-s); font-weight:600; z-index:200;
  transition: top .2s var(--ease);
}
.skip-link:focus{ top:16px; }

/* ---------------------------------------------------------
   Typography
   --------------------------------------------------------- */
.display-1{
  font-family: var(--f-display);
  font-weight: 600;
  font-size: clamp(2.4rem, 3.4vw + 1rem, 4.6rem);
  line-height: 1.04;
  letter-spacing: -0.01em;
  max-width: 16ch;
}
.display-2{
  font-family: var(--f-display);
  font-weight: 600;
  font-size: clamp(1.9rem, 2vw + 1.1rem, 3rem);
  line-height: 1.1;
  letter-spacing: -0.01em;
  max-width: 20ch;
}
.display-3{
  font-family: var(--f-display);
  font-weight: 600;
  font-size: clamp(1.5rem, 1vw + 1.1rem, 2rem);
  line-height: 1.2;
}
.lede{
  font-size: clamp(1.05rem, .4vw + 1rem, 1.25rem);
  color: var(--text-steel);
  max-width: 54ch;
  line-height: 1.65;
}
.on-ink .lede{ color: var(--text-pale); }
.body-l{ font-size: 1.0625rem; line-height: 1.7; max-width: 66ch; color: var(--text-steel); }
.body-l.on-ink{ color: var(--text-pale); }
.label{
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--amber-deep);
}
.on-ink .label{ color: var(--amber); }
.quote-mark{ font-family: var(--f-display); font-style: italic; }

/* ---------------------------------------------------------
   Buttons & links
   --------------------------------------------------------- */
.btn{
  display:inline-flex; align-items:center; gap:10px;
  font-family: var(--f-body); font-weight:600; font-size: .95rem;
  padding: 13px 24px; border-radius: var(--radius-s);
  border: 1px solid transparent; cursor:pointer;
  transition: background .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease), transform .2s var(--ease);
}
.btn svg{ width:16px; height:16px; flex:none; transition: transform .2s var(--ease); }
.btn:hover svg{ transform: translateX(3px); }

.btn--amber{ background: var(--amber); color: #101010; }
.btn--amber:hover{ background: var(--amber-deep); color:#ffffff; }

.btn--line-onink{ border-color: var(--ink-line); color: var(--text-onink); }
.btn--line-onink:hover{ border-color: var(--amber); color: var(--amber); }

.btn--line-onpaper{ border-color: var(--paper-line); color: var(--text-ink); }
.btn--line-onpaper:hover{ border-color: var(--amber-deep); color: var(--amber-deep); }

.text-link{
  display:inline-flex; align-items:center; gap:8px;
  font-weight:600; border-bottom: 1px solid currentColor; padding-bottom:2px;
  color: var(--amber-deep);
}
.on-ink .text-link{ color: var(--amber); }
.text-link svg{ width:14px; height:14px; transition: transform .2s var(--ease); }
.text-link:hover svg{ transform: translateX(3px); }

/* ---------------------------------------------------------
   Header / nav
   --------------------------------------------------------- */
.site-header{
  position: sticky; top:0; z-index:100;
  background: rgba(238,238,238,.9);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid transparent;
  transition: background .25s var(--ease), border-color .25s var(--ease);
}
.site-header.is-scrolled{
  border-bottom-color: var(--paper-line);
}
.nav-row{
  display:flex; align-items:center; justify-content:space-between;
  height: 84px;
}
.brand{ display:flex; align-items:center; gap:10px; }
.brand-mark{ width:34px; height:34px; flex:none; }
.brand-word{ font-family: var(--f-display); font-weight:600; font-size:1.28rem; color:var(--text-ink); line-height:1; }
.brand-sub{ font-size:.6rem; letter-spacing:.16em; color: var(--text-steel); display:block; margin-top:3px; }

.nav-primary{ display:flex; align-items:center; gap:34px; }
.nav-primary > li{ position:relative; }
.nav-link{
  font-size: .9rem; font-weight:500; color: var(--text-ink);
  display:flex; align-items:center; gap:5px; padding: 8px 0;
}
.nav-link svg{ width:11px; height:11px; opacity:.6; }
.nav-primary > li:hover .nav-link, .nav-link[aria-current="page"]{ color: var(--amber-deep); }

.nav-drop{
  position:absolute; top: 100%; left: -20px;
  background: #ffffff; border:1px solid var(--paper-line); border-radius: var(--radius-m);
  padding:10px; min-width:260px;
  box-shadow: 0 18px 34px rgba(22,22,22,.12);
  opacity:0; visibility:hidden; transform: translateY(6px);
  transition: opacity .18s var(--ease), transform .18s var(--ease), visibility .18s;
}
.nav-primary > li:hover .nav-drop, .nav-primary > li:focus-within .nav-drop{
  opacity:1; visibility:visible; transform: translateY(0);
}
.nav-drop a{
  display:block; padding:10px 12px; border-radius: var(--radius-s);
  font-size:.875rem; color: var(--text-ink);
}
.nav-drop a:hover{ background: var(--paper-dim); color: var(--amber-deep); }

.nav-cta{ display:flex; align-items:center; gap:22px; }
.nav-toggle{
  display:none; background:none; border:none; cursor:pointer; padding:6px;
  flex-direction:column; gap:5px;
}
.nav-toggle span{ width:22px; height:2px; background: var(--text-ink); display:block; }

@media (max-width: 980px){
  .nav-primary{
    position:fixed; inset: 84px 0 0 0; background: var(--paper);
    flex-direction:column; align-items:stretch; gap:0; padding: 12px 24px 40px;
    overflow-y:auto;
    transform: translateX(100%); transition: transform .3s var(--ease);
  }
  body.nav-open .nav-primary{ transform: translateX(0); }
  .nav-primary > li{ border-bottom:1px solid var(--paper-line); }
  .nav-link{ padding: 16px 0; font-size:1.05rem; justify-content:space-between; }
  .nav-drop{
    position:static; box-shadow:none; border:none; opacity:1; visibility:visible;
    transform:none; display:none; padding: 0 0 10px 12px; min-width:0;
  }
  li.is-open .nav-drop{ display:block; }
  .nav-cta .btn span{ display:none; }
  .nav-toggle{ display:flex; }
  body.nav-open .nav-cta{ display:none; }
}
@media (min-width: 981px){ .nav-toggle{ display:none; } }

/* ---------------------------------------------------------
   Sections & layout helpers
   --------------------------------------------------------- */
section{ position:relative; }
.section-pad{ padding: 96px 0; }
@media (max-width: 720px){ .section-pad{ padding: 64px 0; } }
.on-ink{ background: var(--ink); color: var(--text-onink); }
.on-paper{ background: var(--paper); color: var(--text-ink); }
.on-panel{ background: var(--paper-dim); }

.rule{ height:1px; background: var(--paper-line); border:none; }
.on-ink .rule, hr.rule.on-ink{ background: var(--ink-line); }

.crossmark{
  position:absolute; width:18px; height:18px; opacity:.5; pointer-events:none;
}
.crossmark::before,.crossmark::after{ content:""; position:absolute; background: currentColor; }
.crossmark::before{ width:100%; height:1px; top:50%; left:0; }
.crossmark::after{ height:100%; width:1px; left:50%; top:0; }
.corner-marks{ position:absolute; inset:24px; pointer-events:none; color: var(--ink-line); }
.on-paper .corner-marks{ color: var(--paper-line); }
.corner-marks .crossmark:nth-child(1){ top:-9px; left:-9px; }
.corner-marks .crossmark:nth-child(2){ top:-9px; right:-9px; }
.corner-marks .crossmark:nth-child(3){ bottom:-9px; left:-9px; }
.corner-marks .crossmark:nth-child(4){ bottom:-9px; right:-9px; }

/* contour-line background texture (hero, dark panels) */
.contour-bg{
  position:absolute; inset:0; overflow:hidden; pointer-events:none;
}
.contour-bg svg{ width:100%; height:100%; opacity:.35; }

/* ---------------------------------------------------------
   Hero
   --------------------------------------------------------- */
.hero{
  background: var(--ink); color: var(--text-onink);
  padding: 84px 0 0;
  overflow:hidden;
  position:relative;
}
.hero-inner{ position:relative; z-index:2; padding: 56px 0 72px; }
.hero .label{ margin-bottom:22px; }
.hero h1{ color:#ffffff; }
.hero .lede{ margin-top:22px; }
.hero-actions{ display:flex; flex-wrap:wrap; gap:16px; margin-top:38px; }

.stat-row{
  position:relative; z-index:2;
  display:grid; grid-template-columns: repeat(4,1fr);
  border-top:1px solid var(--ink-line);
}
.stat{ padding: 26px 28px 30px; border-left:1px solid var(--ink-line); }
.stat:first-child{ border-left:none; padding-left:0; }
.stat .num{ font-family: var(--f-display); font-size: clamp(1.6rem,1.6vw + 1rem,2.4rem); font-weight:600; color: var(--amber); white-space:nowrap; }
/* a figure carrying its own unit needs a step down or it runs into the cell edge. The
   line box is pinned to the full-size one so the labels below stay on a common line. */
.stat .num--long{ font-size: clamp(1.2rem,1.2vw + .74rem,2rem);
  line-height: calc(clamp(1.6rem,1.6vw + 1rem,2.4rem) * 1.6); }
.stat .lbl{ margin-top:6px; font-size:.85rem; color: var(--text-pale); }
@media (max-width: 860px){
  .stat-row{ grid-template-columns: repeat(2,1fr); }
  .stat:nth-child(2){ border-left:1px solid var(--ink-line); }
  .stat:nth-child(odd){ border-left:none; padding-left:0; }
  .stat{ padding: 22px 18px; }
}

/* page header (non-home pages) */
.page-hero{
  background: var(--ink); color:#ffffff; padding: 64px 0 56px; position:relative; overflow:hidden;
}
.page-hero .eyebrow-row{ display:flex; align-items:center; gap:10px; margin-bottom:18px; }
.breadcrumb{ font-size:.8rem; color: var(--text-pale); display:flex; gap:8px; align-items:center; margin-bottom:20px; }
.breadcrumb a:hover{ color: var(--amber); }

/* ---------------------------------------------------------
   Bento: what we do
   --------------------------------------------------------- */
.bento{
  display:grid; grid-template-columns: repeat(4, 1fr); gap:1px;
  background: var(--paper-line); border:1px solid var(--paper-line);
  margin-top:48px;
}
.bento-card{
  background: var(--paper); padding:34px 30px; grid-column: span 2;
  display:flex; flex-direction:column; gap:16px; min-height:230px;
  transition: background .2s var(--ease);
}
.bento-card:hover{ background:#ffffff; }
.bento-card .icon{ width:40px; height:40px; color: var(--amber-deep); }
.bento-card h3{ font-family: var(--f-display); font-size:1.3rem; font-weight:600; }
.bento-card p{ color: var(--text-steel); font-size:.95rem; line-height:1.6; flex:1; }
@media (max-width: 860px){ .bento-card{ grid-column: span 4; } }

/* ---------------------------------------------------------
   Industries strip
   --------------------------------------------------------- */
.industry-grid{
  display:grid; grid-template-columns: repeat(4,1fr); gap:14px; margin-top:44px;
}
.industry-tile{
  border:1px solid var(--paper-line); padding:24px 20px; border-radius: var(--radius-m);
  display:flex; flex-direction:column; gap:14px; background:#ffffff;
  transition: border-color .2s var(--ease), transform .2s var(--ease);
}
.industry-tile:hover{ border-color: var(--amber); transform: translateY(-3px); }
.industry-tile .icon{ width:30px; height:30px; color: var(--amber-deep); }
.industry-tile h4{ font-size:1rem; font-weight:600; }
.industry-tile span.tag{ font-size:.78rem; color: var(--text-steel); }
@media (max-width: 860px){ .industry-grid{ grid-template-columns: repeat(2,1fr); } }

/* ---------------------------------------------------------
   Network diagram (global partnerships)
   --------------------------------------------------------- */
.network-wrap{ display:grid; grid-template-columns: .8fr 1.2fr; gap:56px; align-items:center; }
.network-svg{ width:100%; height:auto; }
.network-svg .line{ stroke: var(--ink-line); stroke-width:1; }
.network-svg .node-dot{ fill: var(--amber); }
.network-svg .node-ring{ fill:none; stroke: var(--amber); stroke-width:1; opacity:.4; }
.network-svg .hq-dot{ fill:#ffffff; }
.network-svg text{ fill: var(--text-pale); font-family: var(--f-body); font-size:13px; }
.network-svg .hq-label{ fill:#ffffff; font-weight:600; }
@media (max-width: 860px){ .network-wrap{ grid-template-columns:1fr; } }

/* ---------------------------------------------------------
   Timeline
   --------------------------------------------------------- */
.timeline{ margin-top:52px; overflow-x:auto; padding-bottom:20px; }
.timeline-track{ display:flex; gap:0; min-width: max-content; position:relative; }
.timeline-track::before{
  content:""; position:absolute; left:0; right:0; top:11px; height:1px; background: var(--paper-line);
}
.tl-item{ width:260px; flex:none; padding: 0 26px 0 0; position:relative; }
.tl-item .dot{ width:9px; height:9px; border-radius:50%; background: var(--amber-deep); position:relative; z-index:2; margin-bottom:22px; }
.tl-item .yr{ font-family: var(--f-display); font-weight:600; font-size:1.3rem; margin-bottom:10px; display:block; }
.tl-item p{ font-size:.875rem; color: var(--text-steel); line-height:1.55; }

/* ---------------------------------------------------------
   Director quote
   --------------------------------------------------------- */
.quote-panel{ display:grid; grid-template-columns: .32fr .68fr; gap:56px; align-items:center; }
.quote-portrait{ aspect-ratio: 4/5; overflow:hidden; border-radius: var(--radius-m); }
.quote-portrait img{ width:100%; height:100%; object-fit:cover; }
.quote-panel blockquote{
  font-family: var(--f-display); font-style:italic; font-weight:400;
  font-size: clamp(1.15rem, 1vw + 1rem, 1.6rem); line-height:1.5; color:#ffffff;
}
.quote-cite{ margin-top:26px; font-style:normal; font-family: var(--f-body); }
.quote-cite .name{ font-weight:600; color:#ffffff; display:block; }
.quote-cite .role{ color: var(--text-pale); font-size:.875rem; }
@media (max-width: 780px){ .quote-panel{ grid-template-columns:1fr; } .quote-portrait{ max-width:220px; } }

/* ---------------------------------------------------------
   Logo marquee
   --------------------------------------------------------- */
.marquee{ overflow:hidden; -webkit-mask-image: linear-gradient(90deg,transparent,#000000 8%,#000000 92%,transparent); mask-image: linear-gradient(90deg,transparent,#000000 8%,#000000 92%,transparent); }
.marquee-track{ display:flex; gap:64px; width:max-content; animation: marquee 36s linear infinite; align-items:center; }
.marquee:hover .marquee-track{ animation-play-state: paused; }
.marquee-track img{ height:28px; width:auto; filter: grayscale(1) contrast(0.8); opacity:.6; }
@keyframes marquee{ from{ transform:translateX(0);} to{ transform:translateX(-50%);} }

/* ---------------------------------------------------------
   CTA band
   --------------------------------------------------------- */
.cta-band{
  background: var(--amber-tint);
  padding: 64px 0;
  display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap;
}
.cta-band h2{ font-family: var(--f-display); font-size:clamp(1.5rem,1.4vw + 1rem,2.1rem); font-weight:600; max-width: 26ch; }

/* ---------------------------------------------------------
   Footer
   --------------------------------------------------------- */
.site-footer{ background: var(--ink); color: var(--text-pale); padding: 76px 0 28px; }
.footer-grid{ display:grid; grid-template-columns: 1.4fr 1fr 1fr 1fr 1.1fr; gap: 32px; }
.footer-grid h5{ color:#ffffff; font-size:.8rem; letter-spacing:.06em; text-transform:uppercase; margin-bottom:18px; font-weight:600; }
.footer-grid li{ margin-bottom:10px; font-size:.9rem; }
.footer-grid a:hover{ color: var(--amber); }
.footer-brand p{ margin-top:16px; font-size:.9rem; max-width:32ch; line-height:1.6; }
.footer-social{ display:flex; gap:12px; margin-top:22px; }
.footer-social a{ width:34px; height:34px; border:1px solid var(--ink-line); border-radius:50%; display:flex; align-items:center; justify-content:center; }
.footer-social a:hover{ border-color: var(--amber); color: var(--amber); }
.footer-bottom{ margin-top:60px; padding-top:24px; border-top:1px solid var(--ink-line); display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; font-size:.8rem; }
@media (max-width: 900px){ .footer-grid{ grid-template-columns: 1fr 1fr; } }

/* ---------------------------------------------------------
   Forms
   --------------------------------------------------------- */
.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.field{ display:flex; flex-direction:column; gap:8px; }
.field.full{ grid-column: 1 / -1; }
.field label{ font-size:.82rem; font-weight:600; color: var(--text-ink); }
.on-ink .field label{ color:#ffffff; }
.field input, .field select, .field textarea{
  font-family: var(--f-body); font-size:.95rem; padding:13px 14px;
  border:1px solid var(--paper-line); border-radius: var(--radius-s); background:#ffffff; color: var(--text-ink);
}
.on-ink .field input, .on-ink .field select, .on-ink .field textarea{
  background: var(--ink-soft); border-color: var(--ink-line); color:#ffffff;
}
.field input:focus, .field select:focus, .field textarea:focus{ outline:2px solid var(--amber); outline-offset:1px; }
.field textarea{ resize: vertical; min-height:120px; }
.form-note{ font-size:.8rem; color: var(--text-steel); }
.on-ink .form-note{ color: var(--text-pale); }
@media (max-width: 640px){ .form-grid{ grid-template-columns:1fr; } }

/* ---------------------------------------------------------
   Placeholder avatars (initials, used until real photography
   is licensed and ready, see note in project handoff)
   --------------------------------------------------------- */
.avatar{
  display:flex; align-items:center; justify-content:center;
  font-family: var(--f-display); font-weight:600; color:#ffffff;
  background: linear-gradient(150deg, #2c2b2a 0%, #3e3d3b 55%, var(--amber-deep) 145%);
  width:100%; height:100%;
}
.avatar.square{ aspect-ratio:1/1; border-radius: var(--radius-m); font-size:1.4rem; }
.avatar.portrait{ aspect-ratio:4/5; border-radius: var(--radius-m); font-size:2.6rem; }

/* ---------------------------------------------------------
   Misc content pages (about / services / industries / team)
   --------------------------------------------------------- */
.two-col{ display:grid; grid-template-columns: 1fr 1fr; gap:64px; }
@media (max-width: 860px){ .two-col{ grid-template-columns:1fr; gap:40px; } }
.split-40-60{ display:grid; grid-template-columns: .8fr 1.2fr; gap:56px; }
@media (max-width: 860px){ .split-40-60{ grid-template-columns:1fr; gap:32px; } }

.value-list{ display:flex; flex-direction:column; }
.value-list li{ display:flex; gap:20px; padding:22px 0; border-top:1px solid var(--paper-line); }
.value-list li:last-child{ border-bottom:1px solid var(--paper-line); }
.value-list .n{ font-family: var(--f-display); font-size:1rem; color: var(--amber-deep); flex:none; width:28px; }

.team-grid{ display:grid; grid-template-columns: repeat(4,1fr); gap:28px 24px; margin-top:44px; }
.team-card img{ aspect-ratio: 1/1; object-fit:cover; border-radius: var(--radius-m); background: var(--paper-dim); }
.team-card h4{ margin-top:16px; font-size:1rem; font-weight:600; }
.team-card p{ font-size:.85rem; color: var(--text-steel); margin-top:4px; }
@media (max-width: 900px){ .team-grid{ grid-template-columns: repeat(2,1fr); } }

.service-list{ display:flex; flex-direction:column; margin-top:8px; }
.service-list li{ display:flex; gap:14px; padding:14px 0; border-top: 1px solid var(--paper-line); font-size:.95rem; color: var(--text-ink); }
.service-list li:last-child{ border-bottom: 1px solid var(--paper-line); }
.service-list svg{ width:16px; height:16px; flex:none; margin-top:3px; color: var(--amber-deep); }

.pill{ display:inline-flex; padding:6px 14px; border-radius:20px; background: var(--amber-tint); color: var(--amber-deep); font-size:.78rem; font-weight:600; }

.related-card{ border:1px solid var(--paper-line); border-radius: var(--radius-m); padding:26px; background:#ffffff; transition: border-color .2s var(--ease); }
.related-card:hover{ border-color: var(--amber); }
.related-card h4{ font-family: var(--f-display); font-size:1.1rem; font-weight:600; margin-bottom:10px; }
.related-card p{ font-size:.875rem; color: var(--text-steel); margin-bottom:16px; }
.related-grid{ display:grid; grid-template-columns: repeat(3,1fr); gap:20px; margin-top:44px; }
@media (max-width: 860px){ .related-grid{ grid-template-columns:1fr; } }

.jobs-empty{ border:1px dashed var(--paper-line); border-radius: var(--radius-m); padding:40px; text-align:center; }

.map-frame{ border:1px solid var(--paper-line); border-radius: var(--radius-m); overflow:hidden; }
.contact-block{ display:flex; gap:16px; padding:20px 0; border-top:1px solid var(--paper-line); }
.contact-block:last-child{ border-bottom:1px solid var(--paper-line); }
.contact-block .icon{ width:20px; height:20px; color: var(--amber-deep); flex:none; margin-top:2px; }
.contact-block h5{ font-size:.95rem; font-weight:600; margin-bottom:4px; }
.contact-block p, .contact-block a{ font-size:.9rem; color: var(--text-steel); }

.eng-flow{ display:grid; grid-template-columns: repeat(4,1fr); gap:1px; background:var(--paper-line); border:1px solid var(--paper-line); margin-top:48px; }
.eng-flow-step{ background: var(--paper); padding:28px 22px; }
.eng-flow-step .yr{ font-family: var(--f-display); color: var(--amber-deep); font-size:1.4rem; }
.eng-flow-step h4{ margin-top:10px; font-size:1rem; font-weight:600; }
.eng-flow-step p{ margin-top:8px; font-size:.85rem; color: var(--text-steel); }
@media (max-width: 860px){ .eng-flow{ grid-template-columns: repeat(2,1fr); } }



/* =========================================================
   Build patches: approved design backlog + flat-file build
   ========================================================= */

/* S3: cards read as white against the recessed panel */
.bento-card{ background:#ffffff; }
.bento-card:hover{ background:#ffffff; box-shadow: inset 0 2px 0 var(--amber); }
.bento-card:hover .icon{ color: var(--amber); }

/* S3/S4: trim trailing whitespace where sections stack */
.section-pad.tight-bottom{ padding-bottom:64px; }

/* Footer links never inherit a UA blue */
.footer-grid a{ color: var(--text-pale); transition: color .2s var(--ease); }

/* S5: global presence panel */
.presence-wrap{ display:grid; grid-template-columns:0.8fr 1.2fr; gap:56px; align-items:center; }
.presence-map svg{ width:100%; height:auto; }
.presence-map .grat{ stroke: rgba(255,255,255,.06); stroke-width:1; }
.presence-map .hop{ stroke: rgba(130,130,130,.28); stroke-width:1; }
.presence-map .ring{ fill:none; stroke: var(--amber); stroke-width:1; opacity:.35; }
.presence-map .dot{ fill: var(--amber); }
.presence-map text{ font-family: var(--f-body); font-size:12px; fill: var(--text-pale); text-anchor:middle; letter-spacing:.02em;
  paint-order: stroke fill; stroke: var(--ink); stroke-width:3px; stroke-linejoin:round; }
.office-list{ margin-top:48px; display:grid; grid-template-columns:repeat(4,1fr); gap:0 32px; border-top:1px solid var(--ink-line); }
.office-list li{ display:flex; gap:8px; align-items:baseline; padding:14px 0; border-bottom:1px solid var(--ink-line); font-size:.92rem; }
.office-list .city{ color:#ffffff; font-weight:500; }
.office-list .role{ color: var(--text-steel); }
@media (max-width: 980px){ .presence-wrap{ grid-template-columns:1fr; gap:40px; } .office-list{ grid-template-columns:repeat(2,1fr); } }
@media (max-width: 620px){ .office-list{ grid-template-columns:1fr; } }

/* S5b: client marquee */
.client-strip{ background: var(--paper); padding:48px 0; }
.client-track span{ font-family: var(--f-body); font-weight:600; font-size:1rem; color: var(--text-steel); white-space:nowrap; }
/* The base rule scrolls the track in a fixed 36s regardless of its width, so adding
   names silently speeds the marquee up. Duration scales with the item count to hold a
   constant reading speed: 36s was tuned for 12 names, this is 19. */
.client-track{ animation-duration: 57s; }

/* S6: CTA band */
.cta-inner{ display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap; }
.cta-actions{ display:flex; gap:14px; flex-wrap:wrap; }
.btn--ink{ background: var(--text-ink); color:#ffffff; border:1px solid var(--text-ink); }
.btn--ink:hover{ background: var(--amber); border-color: var(--amber); }
.btn--outline{ background:transparent; color: var(--text-ink); border:1px solid var(--text-ink); }
.btn--outline:hover{ border-color: var(--amber); color: var(--amber); }

/* Mobile nav: the off-canvas panel is position:fixed + translateX(100%), which still
   contributes to document scroll width and caused ~2x horizontal overflow on phones.
   overflow-x:clip contains it WITHOUT creating a scroll container (so position:sticky
   descendants keep working); hidden is the fallback for older engines. */
body{ overflow-x: hidden; }
@supports (overflow-x: clip){ body{ overflow-x: clip; } }
@media (max-width: 980px){
  /* .site-header carried backdrop-filter: blur(10px). A backdrop-filter makes an element
     the containing block for its position:fixed descendants, so the off-canvas
     .nav-primary resolved inset:84px 0 0 0 against the 136px header box rather than the
     viewport: the drawer computed to 52px tall and clipped every link below the first,
     and could never paint over the hero. Dropping the blur at mobile widths restores the
     viewport as the containing block. The header goes fully opaque to stay legible
     without it. */
  .site-header{ backdrop-filter: none; -webkit-backdrop-filter: none; background: var(--paper); }
  /* The panel is position:fixed, so no ancestor overflow can clip it. Sliding it off to
     the RIGHT extends document scroll width; sliding it UP (above the viewport) does not,
     because overflow above/left of the scroll origin is not scrollable. Same animation,
     no phantom horizontal scroll. */
  .nav-primary{ transform: translateY(-100%); visibility:hidden; will-change: transform; }
  body.nav-open .nav-primary{ transform: translateY(0); visibility:visible; }

  /* body.nav-open hid the whole .nav-cta cluster, but the hamburger lives inside it, so
     opening the menu removed the only control that closes it. Hide the phone number and
     the CTA button, keep the toggle, and morph it into an X. */
  body.nav-open .nav-cta{ display:flex; }
  body.nav-open .nav-cta > a{ display:none; }
  .nav-toggle span{ transition: transform .25s var(--ease), opacity .2s var(--ease); }
  body.nav-open .nav-toggle span:nth-child(1){ transform: translateY(7px) rotate(45deg); }
  body.nav-open .nav-toggle span:nth-child(2){ opacity:0; }
  body.nav-open .nav-toggle span:nth-child(3){ transform: translateY(-7px) rotate(-45deg); }

  /* .nav-drop inherits the desktop dropdown card (#ffffff, radius, min-width). Inside the
     mobile drawer it should read as an indented accordion on the paper ground, not a
     floating white panel. */
  .nav-drop{ background: transparent; border-radius: 0; }
  body.nav-open .nav-mail{ display:none; }
  .nav-drop a{ padding: 12px 0; }
}

/* Small screens: .container had a fixed 32px gutter and the header CTA cluster
   (phone number + button + hamburger) overran a 390px viewport by ~13px. */
@media (max-width: 560px){
  .container{ padding: 0 20px; }
  .nav-cta{ gap: 12px; }
  .nav-mail span{ display:none; }
}

.nav-mail{ display:flex; align-items:center; gap:8px; }

/* card headings moved h4 -> h3 to close a skipped rank; these selectors were tag-based,
   so they move with them. Values are unchanged from the originals. */
.industry-tile h3{ font-size:1rem; font-weight:600; }
.related-card h3{ font-family: var(--f-display); font-size:1.1rem; font-weight:600; margin-bottom:10px; }
.eng-flow-step h3{ margin-top:10px; font-size:1rem; font-weight:600; }

/* names a section for assistive tech without occupying any space on screen */
/* ---------------------------------------------------------
   Video plate behind a page hero. Progressive enhancement: without
   scroll-timeline support the poster and video still show, just without drift.
   --------------------------------------------------------- */
.hero, .page-hero{ position:relative; overflow:hidden; }

/* Layer order matters and was wrong until 2026-09-15. The poster used to sit on
   .media-plate itself with the ::before gradient painted OVER it, so the poster was
   never visible: under prefers-reduced-motion, or on any browser that fails to decode
   the clip, the hero fell back to a flat gradient instead of the photograph it was
   carrying all along. My own reduced-motion check missed it because it asserted the
   video was hidden and never asserted the poster was shown. Found by external audit.
   Correct chain, bottom to top: gradient, poster, video, scrim. Each one is the
   fallback for the layer above it. */
.media-plate{
  position:absolute; inset:0; z-index:0; overflow:hidden;
  background: linear-gradient(140deg, #171716 0%, #222221 45%, #272625 100%);
}
/* overflow:hidden on either the hero or the plate makes that box a scroll container, and
   view() resolves against the nearest one, which pins the drift at 50% progress.
   overflow:clip clips without creating one. This @supports block MUST come after both
   rules above: on equal specificity the later declaration wins, so placing it first
   silently leaves overflow:hidden in force and the parallax dead. Measured. */
@supports (overflow: clip){ .hero, .page-hero, .media-plate{ overflow: clip; } }
.media-plate::before{
  content:""; position:absolute; inset:0; z-index:0;
  background-image: var(--plate-poster);
  background-size:cover; background-position:center;
}
.media-plate video{
  position:relative; z-index:1;
  width:100%; height:100%; object-fit:cover; opacity:.52;
}
/* Scrim strengthened 2026-09-15, from .55/.18/.88. Restacking the poster above the
   gradient (see .media-plate) meant the poster now composites UNDER the video at .52
   opacity instead of an opaque gradient, which brightened every hero and broke contrast
   on six elements, worst of them the Oil & Gas H1 at 2.26 against a required 3.0.
   Swept five scrim strengths against the pixel measurement: .74/.52/.92 was the lightest
   that passed everything, at a 1.19x margin. These values are one step darker, 1.41x,
   because the measurement samples a single frame per page and video brightness varies
   frame to frame. Re-run verify-contrast-pixels.py after touching this or the opacity. */
.media-plate::after{
  content:""; position:absolute; inset:0; z-index:2;
  background: linear-gradient(180deg,
    rgba(22,22,22,.78) 0%, rgba(22,22,22,.60) 45%, rgba(22,22,22,.93) 100%);
}
.hero > .container, .hero-inner, .hero .stat-row,
.page-hero > .container{ position:relative; z-index:1; }
/* .on-ink carries a solid --ink background as a legibility helper. Invisible on a flat
   hero, a hard-edged block over video. The scrim does that job now. */
.hero .on-ink, .page-hero .on-ink{ background: transparent; }

@media (prefers-reduced-motion: no-preference){
  @supports (animation-timeline: view()){
    .media-plate video{
      animation: plate-drift linear both;
      animation-timeline: view();
      animation-range: cover;
    }
    @keyframes plate-drift{
      from{ transform: translateY(-3%) scale(1.09); }
      to  { transform: translateY(3%)  scale(1.09); }
    }
  }
}
/* the poster is already the plate background, so reduced motion just drops the video */
@media (prefers-reduced-motion: reduce){ .media-plate video{ display:none; } }

.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; border:0;
}

/* Skip link, added 2026-09-15. The stylesheet had anticipated one for weeks but no
   element was ever emitted, so a keyboard user tabbed through the entire header and its
   two dropdowns on every page before reaching the content. Hidden until focused, then
   painted above the sticky header. */
.skip-link{
  position:absolute; left:16px; top:-100px; z-index:200;
  background: var(--ink); color: var(--text-onink);
  padding:12px 18px; border-radius: var(--radius-s);
  font-size:.9rem; font-weight:600; text-decoration:none;
  transition: top .18s var(--ease);
}
.skip-link:focus{ top:12px; outline:2px solid var(--amber); outline-offset:2px; }

/* Email route that replaced the two dead enquiry forms. Sits in the same grid column the
   form occupied, so neither page layout changes. */
.form-fallback{ border:1px solid var(--paper-line); border-radius: var(--radius-m);
  padding:36px 32px; background:#ffffff; }
@media (max-width: 860px){ .form-fallback{ padding:28px 22px; } }
.footer-grid h2{ color:#ffffff; font-size:.8rem; letter-spacing:.06em; text-transform:uppercase; margin-bottom:18px; font-weight:600; font-family: var(--f-body); }

/* Design system says no drop shadows and border-radius 4-8px only. The nav dropdown
   carried a 34px shadow and .pill a 20px radius, both inherited from the original
   preview. The dropdown already has a 1px paper-line border, which is the system's own
   separation device, so the shadow is simply removed. */
.nav-drop{ box-shadow: none; }
.pill{ border-radius: 6px; }

/* team names moved from h4 to h3, contact block headings from h5 to h3; keep the
   type scale exactly as it was */
.team-card h3{ margin-top:16px; font-size:1rem; font-weight:600; }
.contact-block h3.contact-h{ font-size:.95rem; font-weight:600; margin-bottom:4px; }

/* Leadership team grid blowout. .avatar carried `height:100%` alongside
   `aspect-ratio:1/1`. In a grid item of indefinite height that percentage cannot
   resolve, so the avatar's min-content contribution drove each `1fr` track wider than
   its share: the grid ran to 1644px inside a 1440px viewport (and 562px inside 360px),
   pushing the last column off-screen and dropping each card's name and role on top of
   the row below. Let width plus aspect-ratio derive the height, and give the tracks a
   real zero minimum so they can never be widened by their contents. */
.avatar{ height:auto; }
.team-grid{ grid-template-columns: repeat(4, minmax(0,1fr)); }
.team-card{ min-width:0; }
@media (max-width: 900px){ .team-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
.section-pad.tight-top{ padding-top:48px; }
.heading-sm{ font-size: clamp(1.45rem, 1.1vw + 1rem, 2rem); max-width:26ch; }

/* Selected-projects table (industry + EPC pages) */
.proj-scroll{ overflow-x:auto; margin-top:40px; border:1px solid var(--paper-line); }
.proj-table{ width:100%; border-collapse:collapse; min-width:640px; background:#ffffff; }
.proj-table th{ text-align:left; font-family: var(--f-body); font-size:.72rem; font-weight:600;
  letter-spacing:.08em; text-transform:uppercase; color: var(--amber-deep);
  padding:16px 20px; border-bottom:1px solid var(--paper-line); white-space:nowrap; }
.proj-table td{ padding:16px 20px; font-size:.92rem; color: var(--text-ink);
  border-bottom:1px solid var(--paper-line); vertical-align:top; }
.proj-table tbody tr:last-child td{ border-bottom:none; }
.proj-table tbody tr{ transition: background .2s var(--ease); }
.proj-table tbody tr:hover{ background: var(--paper); }
.proj-table td:nth-child(2){ font-weight:500; }
.proj-table td:nth-child(3){ color: var(--text-steel); }
.proj-note{ margin-top:16px; font-size:.82rem; color: var(--text-steel); max-width:62ch; }

/* Hero stat row: value and label were inline spans, so margin-top never applied */
.stat .num, .stat .lbl{ display:block; }

/* Presence map: HQ pin emphasis */
.presence-map .is-hq .dot{ r:5; }
.presence-map .is-hq .ring{ opacity:.55; }
.presence-map .is-hq text{ fill: var(--amber); font-weight:600; }

/* The original .media-plate placeholder block lived here. It is superseded by the real
   plate rules further up: because it sat later in the stylesheet it was winning on equal
   specificity, forcing opacity back to .35, replacing the poster background with the
   gradient shorthand, and restoring overflow:hidden, which made the plate a scroll
   container again and pinned the parallax at 50% progress. Removed rather than reordered,
   so there is only one source of truth for the plate. */

/* --- WCAG AA contrast, amber as text. Approved 2026-09-09.
   --amber-deep #605e5c scores 4.33 on --paper, 3.99 on --paper-dim and 3.90 on
   --amber-tint. AA needs 4.5 for text below the large-text threshold (24px regular
   or 18.66px bold), so every small amber string on the site was failing.
   --amber-text #51504e clears it on all three grounds: 5.68, 5.23, 5.11.
   The token is additive. --amber-deep keeps every job that needs only 3:1 and passes
   it: icons, timeline dots, borders, hover backgrounds, the ink gradient, and the
   display numerals set inline at 1.4rem 600, which qualify as large text.
   Text on ink is untouched: --amber #85837f on --ink is far clear of AA. */
:root{ --amber-text: #51504e; }
.label,
.text-link,
.pill,
.value-list .n,
.eng-flow-step .yr,
.proj-table th,
.nav-primary > li:hover .nav-link,
.nav-link[aria-current="page"],
.nav-drop a:hover,
.btn--line-onpaper:hover{ color: var(--amber-text); }
.on-ink .label, .on-ink .text-link{ color: var(--amber); }

/* The hero eyebrow was the worst contrast on the site and the CSS audit could not see
   it, because that method walks up the DOM for a background colour and a video is not
   one. Measured instead from composited pixels, sampling the real background under the
   glyphs: --amber at 12px over the footage scores 1.21 at worst and 1.76 median across
   the nine video pages, which is not readable on a bright frame, never mind AA.
   Darkening the plate does not rescue it: a solid ink chip behind the text reaches only
   2.83, and taking the overlay to .88/.70 reaches 2.21, because the failure is the
   lightest pixels the glyphs sit on, not the average. The colour has to change.
   --amber-tint scores 6.18 worst, 8.97 median, 9 of 9 pages clear, and it keeps the
   eyebrow warm and distinct from the white headline. Existing token, no new colour.
   This applies only inside heroes; the eyebrow on paper sections uses --amber-text. */
.hero .label, .page-hero .label{ color: var(--amber-tint); }

/* Inline links inside running prose had no styling at all, so the cross-reference added
   to Electric Mobility rendered as plain text, indistinguishable from the sentence
   around it. .text-link is the standalone arrow treatment and is inline-flex, so it is
   the wrong tool mid-sentence. The underline is not decoration: WCAG 1.4.1 requires a
   link in body text to be marked by something other than colour alone. */
.body-l a:not(.text-link), .body a:not(.text-link){
  color: var(--amber-text); border-bottom: 1px solid currentColor; padding-bottom: 1px;
  transition: color .18s var(--ease); }
.body-l a:not(.text-link):hover, .body a:not(.text-link):hover{ color: var(--ink); }
.on-ink .body-l a:not(.text-link){ color: var(--amber); }

/* .service-list hard-codes --text-ink and --paper-line, which is right on paper and
   invisible on ink. The Carbon Emission Accounting page is the first to run one inside
   an on-ink section. */
.on-ink .service-list li{ color: var(--text-onink); border-top-color: var(--ink-line); }
.on-ink .service-list li:last-child{ border-bottom-color: var(--ink-line); }
.on-ink .service-list svg{ color: var(--amber); }

/* Industry tiles: 4 across left two empty cells once the count dropped to six, the same
   ragged tail the grid had at seven. Three across divides exactly, and it gives the
   longest label, Metals & Mining Infrastructure, room to sit on one line. minmax(0,1fr)
   rather than 1fr because 1fr is minmax(auto,1fr) and blows out on a long unbroken word. */
.industry-grid{ grid-template-columns: repeat(3, minmax(0,1fr)); }
@media (max-width: 860px){ .industry-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 560px){ .industry-grid{ grid-template-columns: minmax(0,1fr); } }

/* Why-go-through-us bands. Each line is a bold claim plus the substance behind it, so
   the list reads as an argument rather than a set of nouns. The label is the same ink
   colour as the body text on paper and --text-onink here, never amber: amber on ink at
   this size is the case the pixel contrast check failed on the hero eyebrow. */
.why-list li{ align-items:flex-start; line-height:1.55; padding:15px 0; }
.why-list strong{ font-weight:600; }
.on-ink .why-list strong{ color:#ffffff; }
.on-ink .why-list li{ color: var(--text-pale); }

/* Two-column variant of the projects table, used where the technology partner column is
   withheld. Without a third column the scope cell would stretch the full width and the
   rows would read as a loose list rather than a table, so it is capped. The cap goes on
   the SCROLL WRAPPER, not the table: the border lives on the wrapper, so capping the
   table alone left an empty bordered strip to the right of the last column.
   min-width is dropped on purpose. The 3-column tables carry min-width:640px and so
   scroll sideways on a phone; two columns fit 390px outright, measured at 348px, so
   this one reads in place with no horizontal scroll. */
.proj-scroll--2col{ max-width:860px; }
.proj-table--2col{ min-width:0; }
.proj-table--2col th:last-child, .proj-table--2col td:last-child{ width:38%; }

/* Sub-heading row inside the projects table. Same weight and colour as the column
   headers so it reads as structure rather than as a data row, with a heavier rule
   above it to separate the groups. */
.proj-table tr.proj-group th{ text-align:left; font-family: var(--f-body);
  font-size:.72rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase;
  color: var(--amber-text); padding:26px 20px 10px;
  border-top:1px solid var(--paper-line); border-bottom:1px solid var(--paper-line); }
.proj-table tbody tr.proj-group:first-child th{ border-top:none; padding-top:16px; }
.proj-table tbody tr.proj-group:hover{ background:transparent; }

/* Brand mark. 34px was sized for the placeholder hexagon outline; the real mark is a
   roundel with six inner triangles that turn to mush below 40px. The header row is
   84px, so this does not move anything. object-fit guards against a future asset
   that is not exactly square. */
.brand-mark{ width:40px; height:40px; object-fit:contain; }

/* ================================================================= STORY
   Cinematic homepage opening. Pinned stage, scrubbed introduction, looping
   sector chapters. Amber accents on a cooler, darker stage than the standard
   ink panels, so footage reads as film rather than as a background texture. */
.story{
  --stage-ink: #0d0d0c;              /* cooler and darker than --ink, for grade */
  --stage-text: #f3f3f2;
  --stage-mute: #c3c1bf;
  --stage-rule: rgba(255,255,255,.18);
  position: relative;
  background: var(--stage-ink);
  color: var(--stage-text);
}
.stage{
  position: relative;
  overflow: hidden;
  isolation: isolate;
  background: linear-gradient(140deg,#111110 0%,#1d1c1b 48%,#201f1e 100%);
}

/* --- media layers ------------------------------------------------------- */
.scene{
  position: absolute; inset: 0; z-index: -3;
  width: 100%; height: 100%;
  object-fit: cover;
  pointer-events: none;
}
.scene-video{ opacity: 0; transition: opacity .5s var(--ease); }
.scene-video.is-shown{ opacity: .62; }
.scene-poster{ opacity: .5; }
.stage::before{
  content: ""; position: absolute; inset: 0; z-index: -2;
  /* The horizontal grade is dark at both edges, not just the left. The right hand
     column carries the metric and the group relationship, and measuring the text
     against the frames actually behind it showed a scrim that faded out there was
     dropping the metric to 1.5:1. Footage still reads through the middle band,
     which is where the subject of every clip sits. */
  background:
    linear-gradient(90deg, rgba(12,12,12,.93) 0%, rgba(12,12,12,.70) 34%,
                           rgba(12,12,12,.34) 54%, rgba(12,12,12,.78) 76%,
                           rgba(12,12,12,.86) 100%),
    linear-gradient(0deg, rgba(12,12,12,.90) 0%, rgba(12,12,12,.22) 38%, rgba(12,12,12,.22) 72%, rgba(12,12,12,.78) 100%);
}
.stage::after{
  content: ""; position: absolute; inset: 0; z-index: -1;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.06);
  pointer-events: none;
}

/* --- chapters ----------------------------------------------------------- */
.chapter-wrap{ position: relative; z-index: 1; }
.chapter{
  display: grid;
  grid-template-columns: minmax(0,1.35fr) minmax(240px,.62fr);
  column-gap: clamp(28px,5vw,88px);
  align-items: end;
}
.chapter-eyebrow{
  display: inline-flex; align-items: center; gap: 10px;
  font-size: .72rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase;
  /* A lift on --amber, used only on the stage. At 11.5px this is small text and
     needs 4.5:1; measured over the brightest frames --amber itself lands at 4.64,
     which is too little room for footage that keeps moving. */
  color: #a4a2a0;
}
.chapter-eyebrow::before{
  content: ""; width: 6px; height: 6px; border-radius: 50%;
  background: currentColor; flex: none;
}
.chapter-title{
  font-family: var(--f-display); font-weight: 600;
  font-size: clamp(2.1rem, 3.2vw + 1rem, 4.2rem);
  line-height: 1.05; letter-spacing: -.01em;
  margin: 18px 0 18px;
  color: #ffffff;
}
.chapter-lede{
  font-size: clamp(1rem,.35vw + .95rem,1.18rem);
  line-height: 1.6; max-width: 50ch; color: #e8e7e6;
}
.chapter-tags{
  list-style: none; margin: 24px 0 0; padding: 0;
  display: flex; flex-wrap: wrap; gap: 8px 22px;
}
.chapter-tags li{
  font-size: .78rem; color: #e2e1e0;
  padding-top: 9px; border-top: 1px solid var(--stage-rule);
}
.chapter-cta{
  display: inline-flex; align-items: center; gap: 12px;
  margin-top: 28px; padding: 12px 18px;
  background: var(--amber); color: #101010;
  border-radius: var(--radius-s);
  font-size: .85rem; font-weight: 600;
  transition: background .2s var(--ease);
}
.chapter-cta:hover{ background: var(--amber-tint); }
.chapter-cta svg{ width: 15px; height: 15px; }
.chapter-note{ max-width: 300px; }
.chapter-metric{ margin: 0; padding-top: 20px; border-top: 2px solid var(--amber); }
.chapter-relation{ margin: 22px 0 0; padding-top: 16px; border-top: 1px solid var(--stage-rule); }
.chapter-note-label{
  display: block; font-size: .65rem; font-weight: 600;
  letter-spacing: .1em; text-transform: uppercase;
  color: #a4a2a0; margin-bottom: 10px;
}
.chapter-relation .chapter-note-label{ color: var(--stage-mute); }
.chapter-metric strong{
  display: block; font-family: var(--f-display); font-weight: 600;
  font-size: clamp(1.5rem,1.2vw + 1.1rem,2.05rem); line-height: 1.1;
  color: var(--amber); margin-bottom: 10px;
}
.chapter-relation strong{
  display: block; font-size: .95rem; font-weight: 600; color: #ffffff; margin-bottom: 6px;
}
.chapter-note-detail{ display: block; font-size: .78rem; line-height: 1.6; color: #ebeae9; }

/* --- stage furniture ---------------------------------------------------- */
.stage-top, .stage-foot, .chapter-rail, .chapter-rail-m{ display: none; }
.stage-controls button, .stage-controls a{
  background: none; border: 0; padding: 8px 0; min-height: 34px;
  font: inherit; font-size: .72rem; color: #e3e2e1; cursor: pointer;
}
.stage-controls a{ border-bottom: 1px solid var(--stage-rule); padding-bottom: 4px; }
.stage-controls button:hover, .stage-controls a:hover{ color: var(--amber); }
.scene-play{
  border: 1px solid var(--stage-rule) !important;
  border-radius: var(--radius-s); padding: 7px 12px !important; background: #21201f !important;
  color: #ffffff !important;
}

/* --- fallback: no JavaScript, or the script failed ---------------------- */
.story:not(.is-live) .scene{ display: none; }
.story:not(.is-live) .stage{ padding: 64px 0; }
.story:not(.is-live) .chapter-wrap{
  max-width: 1200px; margin: 0 auto; padding: 0 32px;
  display: grid; gap: 56px;
}
.story:not(.is-live) .chapter{ padding-top: 40px; border-top: 1px solid var(--stage-rule); }
.story:not(.is-live) .chapter:first-child{ padding-top: 0; border-top: 0; }

/* ================================================================= LIVE
   Everything below applies only once the script has taken over. */
.story.is-live{ height: calc(100svh + var(--story-travel, 4800px)); }
.story.is-live .stage{
  position: sticky; top: 0;
  height: 100svh; min-height: 620px;
}
.story.is-live .chapter-wrap{
  position: absolute;
  left: max(32px, calc((100vw - 1200px) / 2 + 32px));
  right: clamp(32px, 8vw, 160px);
  top: clamp(112px, 22%, 26%);
  bottom: 152px;
  display: flex; align-items: center;
}
.story.is-live .chapter-deck{ width: 100%; }
.story.is-live .chapter{ width: 100%; }
.story.is-live .chapter[hidden]{ display: none; }

.story.is-live .stage-top{
  position: absolute; z-index: 2;
  left: max(32px, calc((100vw - 1200px) / 2 + 32px)); right: clamp(32px,6vw,80px);
  top: 26px;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
}
.chapter-kicker{ font-size: .7rem; letter-spacing: .1em; text-transform: uppercase; color: #d2d1cf; }
.story.is-live .stage-controls{ display: flex; align-items: center; gap: 22px; }

.story.is-live .stage-foot{
  position: absolute; z-index: 2;
  left: max(32px, calc((100vw - 1200px) / 2 + 32px)); right: clamp(32px,6vw,80px);
  bottom: 118px;
  display: flex; align-items: center; justify-content: space-between; gap: 18px;
  font-size: .7rem; color: #dcdcdb;
}
.stage-hint b{ color: var(--amber); font-weight: 400; }
.scene-state{ color: #b8b7b5; }
.stage-count{ display: flex; align-items: center; gap: 12px; }
.stage-track{ display: block; width: 104px; height: 2px; background: rgba(255,255,255,.26); }
.stage-track span{ display: block; height: 100%; width: 0; background: var(--amber); }

.story.is-live .chapter-rail{
  position: absolute; z-index: 2;
  left: max(32px, calc((100vw - 1200px) / 2 + 32px)); right: clamp(32px,6vw,80px);
  bottom: 30px;
  display: grid; grid-template-columns: repeat(8, minmax(0,1fr)); gap: 12px;
}
.chapter-rail button{
  position: relative;
  border: 0; border-top: 1px solid rgba(255,255,255,.28);
  background: none; text-align: left; padding: 12px 0 0;
  font: inherit; font-size: .68rem; line-height: 1.35; color: #cfcecd;
  min-height: 52px; cursor: pointer;
}
.chapter-rail button .rail-n{ display: block; font-size: .6rem; color: #aba9a6; margin-bottom: 5px; }
.chapter-rail button:hover{ color: var(--amber); }
.chapter-rail button[aria-current="true"]{ color: #ffffff; }
.chapter-rail button[aria-current="true"]::before{
  content: ""; position: absolute; left: 0; top: -1px;
  width: var(--rail-progress, 0%); height: 2px; background: var(--amber);
}

/* staged arrival. Travel stays under 24px: felt, not watched. */
@media (prefers-reduced-motion: no-preference){
  /* Deliberately short. A reader moving quickly passes a chapter in well under a
     second, so a long stagger would mean scrolling past text that has not arrived
     yet. Everything is legible within ~0.45s of the chapter changing. */
  .story.is-live .chapter.is-active .chapter-copy > *,
  .story.is-live .chapter.is-active .chapter-note > *{
    animation: chapter-arrive .32s var(--ease) both;
  }
  .story.is-live .chapter.is-active .chapter-copy > :nth-child(2){ animation-delay: .03s; }
  .story.is-live .chapter.is-active .chapter-copy > :nth-child(3){ animation-delay: .06s; }
  .story.is-live .chapter.is-active .chapter-copy > :nth-child(4){ animation-delay: .09s; }
  .story.is-live .chapter.is-active .chapter-copy > :nth-child(5){ animation-delay: .12s; }
  .story.is-live .chapter.is-active .chapter-note > :nth-child(1){ animation-delay: .07s; }
  .story.is-live .chapter.is-active .chapter-note > :nth-child(2){ animation-delay: .11s; }
}
@keyframes chapter-arrive{
  from{ opacity: 0; transform: translateY(16px); }
  to{ opacity: 1; transform: none; }
}
/* motion off: no arrival animation, no footage, posters only */
.story.is-still .scene-video{ opacity: 0 !important; }
.story.is-still .chapter.is-active *{ animation: none !important; }

/* --- stat band, released as the stage unpins --------------------------- */
.stat-band{ background: var(--ink); padding: 0 0 8px; }
.stat-band .stat-row{ border-top: 0; }

/* --- viewports ---------------------------------------------------------- */
@media (max-width: 1100px){
  .chapter{ grid-template-columns: minmax(0,1.4fr) minmax(200px,.6fr); }
  .story.is-live .chapter-rail{ gap: 8px; }
  .chapter-rail button{ font-size: .62rem; }
}
@media (max-width: 860px){
  .chapter{ grid-template-columns: 1fr; row-gap: 22px; align-items: start; }
  .chapter-note{ max-width: none; display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
  .chapter-relation{ margin: 0; padding-top: 20px; border-top: 2px solid var(--stage-rule); }
  .story.is-live .chapter-wrap{
    left: 20px; right: 20px; top: 104px; bottom: 96px; align-items: center;
  }
  .story.is-live .chapter-cta{ display: none; }
  .story.is-live .stage-top{ left: 20px; right: 20px; top: 18px; }
  .story.is-live .stage-controls a{ display: none; }
  .story.is-live .stage-foot{ left: 20px; right: 20px; bottom: 76px; font-size: .65rem; }
  .scene-state{ display: none; }
  .story.is-live .chapter-rail{ display: none; }
  .story.is-live .chapter-rail-m{
    position: absolute; z-index: 2; left: 20px; right: 20px; bottom: 22px;
    display: grid; grid-template-columns: 44px 1fr 44px; gap: 10px; align-items: center;
  }
  .chapter-rail-m button{
    height: 44px; width: 44px; border: 1px solid var(--stage-rule);
    border-radius: var(--radius-s); background: #21201f; color: #ffffff;
    font: inherit; font-size: 1rem; cursor: pointer;
  }
  .chapter-rail-m button[disabled]{ opacity: .4; cursor: default; }
  .chapter-rail-m select{
    width: 100%; min-width: 0; height: 44px; padding: 6px 10px;
    background: #1e1d1c; color: #ffffff; border: 1px solid var(--stage-rule);
    border-radius: var(--radius-s); font: inherit; font-size: .85rem;
  }
  .story:not(.is-live) .chapter-wrap{ padding: 0 20px; gap: 44px; }
  .stat-band .stat-row{ border-top: 1px solid var(--ink-line); }
}
@media (max-width: 480px){
  .chapter-title{ font-size: clamp(1.75rem,7vw,2.3rem); margin: 14px 0; }
  .chapter-note{ grid-template-columns: 1fr; gap: 16px; }
  .story.is-live .chapter-tags{ display: none; }
}
/* Short landscape. A sticky 85px header on a 390px viewport leaves roughly 250px
   of usable stage, which is not enough for a chapter at any type size. Rather than
   drop the metric or the relationship, the chapter scrolls inside the stage: every
   word stays reachable, the rail stays pinned, and nothing is clipped. */
@media (max-height: 560px) and (orientation: landscape){
  .story.is-live .stage{ min-height: 0; }
  .story.is-live .chapter-wrap{
    top: 92px; bottom: 60px; left: 20px; right: 20px;
    display: block; overflow-y: auto;
    /* deliberately not overscroll-behavior:contain. Containing it would trap the
       gesture: once the chapter text is exhausted the reader could not scroll on
       to the next chapter without lifting off the text. Chaining is the escape. */
    overscroll-behavior: auto; -webkit-overflow-scrolling: touch;
  }
  .story.is-live .stage-foot{ display: none; }
  .story.is-live .chapter-rail{ display: none; }
  .story.is-live .chapter-rail-m{
    bottom: 12px; display: grid;
    grid-template-columns: 40px 1fr 40px; gap: 8px; align-items: center;
  }
  .chapter-rail-m button{ height: 40px; width: 40px; }
  .chapter-rail-m select{ height: 40px; }
  .story.is-live .stage-top{ top: 14px; }
  .chapter{ row-gap: 14px; }
  .chapter-title{ font-size: clamp(1.4rem,3.4vw,1.85rem); margin: 8px 0; }
  .chapter-lede{ font-size: .88rem; line-height: 1.5; }
  .chapter-tags{ margin-top: 14px; }
  .story.is-live .chapter-cta{ display: none; }
  .chapter-metric{ padding-top: 14px; }
  .chapter-relation{ padding-top: 12px; }
}
@media (prefers-reduced-motion: reduce){
  .scene-video{ transition: none; }
  .story.is-live .chapter.is-active *{ animation: none !important; }
}

/* Homepage delivery pass: capabilities, evidence and native project disclosures. */
#capabilities{ scroll-margin-top:100px; padding-bottom:72px; }
#capabilities:focus{ outline:2px solid var(--amber-deep); outline-offset:-4px; }
#capabilities .bento-card{ transition:border-color .2s, transform .2s; }
#capabilities .bento-card:hover{ transform:translateY(-3px); border-color:var(--amber-deep); box-shadow:none; }
#capabilities .bento-card:focus-visible{ outline:3px solid var(--amber-deep); outline-offset:4px; }
.stat-band{ padding:32px 0; }
.stat-band .stat .num{ font-size:clamp(1.3rem,2vw,2rem); white-space:normal; }
.stat-band .stat .num--long{ font-size:clamp(1.2rem,1.7vw,1.8rem); }
.proof-heading{ display:flex; align-items:end; justify-content:space-between; gap:32px; margin-bottom:36px; }
.proof-heading h2{ margin-top:14px; max-width:23ch; }
.proof-heading p{ max-width:42ch; color:var(--text-steel); }
.project-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; align-items:start; }
.project-card{ border:1px solid var(--paper-line); border-radius:6px; overflow:hidden; background:#ffffff; }
.project-card summary{ cursor:pointer; list-style:none; }
.project-card summary::-webkit-details-marker{ display:none; }
.project-card summary:focus-visible{ outline:3px solid var(--amber-deep); outline-offset:-4px; }
.project-card summary:hover .project-toggle{ color:var(--ink); }
.project-visual{ position:relative; aspect-ratio:16/9; overflow:hidden; background:var(--ink); }
.project-visual img{ width:100%; height:100%; object-fit:cover; transition:transform .4s; }
.project-visual span{ position:absolute; bottom:12px; left:12px; background:var(--ink); color:#ffffff; padding:4px 8px; font-size:.72rem; border-radius:4px; }
.project-card summary:hover img{ transform:scale(1.035); }
.project-overview{ padding:24px; }
.project-overview .label{ color:var(--amber-deep); }
.project-overview h3{ font-family:var(--f-display); font-size:1.35rem; line-height:1.3; font-weight:600; margin:14px 0 12px; }
.project-client{ color:var(--text-steel); font-size:.92rem; }
.project-toggle{ display:flex; justify-content:space-between; align-items:center; gap:16px; color:var(--amber-deep); font-size:.85rem; font-weight:600; border-top:1px solid var(--paper-line); margin-top:22px; padding-top:16px; }
.project-toggle b{ font-size:1.4rem; line-height:1; transition:transform .2s; }
.project-card[open] .project-toggle b{ transform:rotate(45deg); }
.project-detail{ padding:0 24px 26px; }
.project-detail p{ color:var(--text-steel); font-size:.95rem; line-height:1.65; margin-bottom:18px; }
@media(max-width:1000px){ .project-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:640px){
  .project-grid{ grid-template-columns:minmax(0,1fr); }
  .proof-heading{ display:block; }
  .proof-heading p{ margin-top:20px; }
  .story.is-live .stage-controls a{ display:inline-block; max-width:15ch; line-height:1.3; }
  .story.is-live .stage-controls{ gap:12px; }
}
@media(prefers-reduced-motion:reduce){
  #capabilities .bento-card:hover, .project-card summary:hover img{ transform:none; }
}

/* Review v2: graphite surfaces, photographic navigation and office globe. */
:root{--paper:#1f1f1e;--paper-dim:#282726;--paper-line:#42403e;--text-ink:#efefef;--text-steel:#c1bfbd;--amber-deep:#9e9c9a;--amber-tint:#363533;}
body{background:#1c1b1a;}
.on-paper{background:#1f1f1e;}.on-panel{background:#282726;}
.label{color:#9e9c9a;}.text-link{color:#9e9c9a;}
.section-pad{border-top:1px solid rgba(255,255,255,.055);}
.bento{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:40px;}
.industry-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:40px;}
.bento-card.visual-card,.industry-tile.visual-card{position:relative;isolation:isolate;grid-column:auto;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;min-height:330px;padding:26px;background:#141413;border:1px solid #474543;border-radius:3px;box-shadow:none;transform:none;transition:border-color .25s;}
.bento-card.visual-card{min-height:340px;}
.visual-card:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(12,12,12,.16),rgba(12,12,12,.18) 20%,rgba(12,12,12,.88) 70%,#10100f);}
.visual-card:after{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:#9e9c9a;transform:scaleX(0);transform-origin:left;transition:transform .35s;}
.visual-card .card-scene{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;opacity:.85;transition:transform .7s,opacity .5s;}
.card-index{font-size:.65rem;letter-spacing:.2em;color:#ffffff;display:block;text-shadow:0 1px 5px #000000;}
.card-copy{position:relative;padding-top:65px;}
.visual-card h3{font-family:var(--f-display);font-size:clamp(1.35rem,1.7vw,1.65rem);line-height:1.2;font-weight:500;color:#ffffff;max-width:25ch;}
.visual-card p{color:#d0cfce!important;margin-top:13px;font-size:.9rem;line-height:1.55;max-width:49ch;}
.visual-card span.tag{color:#d0cfce;font-size:.83rem;display:block;margin-top:13px;}
.card-action{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #ffffff38;margin-top:22px;padding-top:12px;font-size:.76rem;letter-spacing:.04em;color:#b2b1af;}
.card-action>span{font-size:1.3rem;transition:transform .25s;}
.visual-card:hover,.visual-card:focus-visible{border-color:#9e9c9a!important;background:#141413!important;transform:none!important;box-shadow:none!important;}
.visual-card:hover:after,.visual-card:focus-visible:after{transform:scaleX(1);}
.visual-card:hover .card-scene,.visual-card:focus-visible .card-scene{transform:scale(1.06);opacity:1;}
.visual-card:hover .card-action>span,.visual-card:focus-visible .card-action>span{transform:translate(3px,-3px);}
.project-card{background:#2c2b29;border-color:#494745;}.project-overview h3{color:#f3f3f2;}.project-detail{background:#232221;}.project-card summary:hover .project-toggle{color:#ffffff;}
.project-visual{aspect-ratio:16/10;}.project-visual img{width:100%;height:100%;object-fit:cover;}
.project-visual span{background:#161514d9;color:#ebeae9;}
.cta-band{background:#323130;color:#f3f3f3;border-top:1px solid #53514f;}
.client-track span{color:#c7c6c5;}.client-strip{background:#1b1a19;}
.globe-panel{min-width:0;background:radial-gradient(ellipse at 50% 40%,#363534 0,#1a1a19 65%);border:1px solid #444240;border-radius:4px;padding:20px;}
.globe-kicker{display:flex;justify-content:space-between;font-size:.62rem;letter-spacing:.18em;color:#bab9b7;}
#office-globe{display:block;width:100%;height:auto;aspect-ratio:640/560;}
.globe-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid #ffffff20;padding-top:16px;}
#globe-city{font-family:var(--f-display);font-size:1.2rem;color:#ffffff;}
#globe-city span{display:block;font-family:var(--f-body);font-size:.7rem;color:#c1bfbd;}
#globe-motion{border:1px solid #656360;border-radius:3px;color:#ededec;background:transparent;padding:10px;font-size:.72rem;cursor:pointer;min-height:44px;}
.office-list{gap:12px;border:0;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:32px;}
.office-list li{padding:0;display:block;border:0;}
.office-select{width:100%;min-height:83px;padding:15px;text-align:left;position:relative;color:#ffffff;border:1px solid #454341;background:#252423;cursor:pointer;}
.office-select .city,.office-select .role{display:block;}.office-select .role{font-size:.74rem;color:#bab9b7;}
.office-arrow{position:absolute;right:12px;top:14px;color:#9f9d9a;}
.office-select[aria-pressed=true]{border-color:#9f9d9a;background:#32312f;}
.presence-wrap{grid-template-columns:1fr 1.05fr;align-items:center;gap:64px;}
@media(max-width:900px){.industry-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.presence-wrap{grid-template-columns:1fr;gap:32px;}.globe-panel{max-width:620px;width:100%;margin:auto;}.office-list{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:600px){.bento,.industry-grid{grid-template-columns:1fr;gap:16px;}.bento-card.visual-card,.industry-tile.visual-card{min-height:310px;padding:23px;}.visual-card h3{font-size:1.6rem;}.card-copy{padding-top:50px;}.globe-panel{padding:14px;}.globe-toolbar{align-items:center;}.office-select{padding:12px;}.office-list .city{font-size:.9rem;}}
@media(prefers-reduced-motion:reduce){.visual-card .card-scene,.visual-card:after,.card-action>span{transition:none!important;transform:none!important;}}


.nav-drop,.related-card,.form-fallback,.proj-table,.field input,.field textarea,.field select{background:#2c2b29;color:var(--text-ink);}
.site-header{background:rgba(30,30,30,.97);}.btn--ink{background:#373635;color:#ffffff;border-color:#615f5c;}
.btn--amber:hover{color:#171716;}.office-list .role{color:#c1bfbd;}
.on-paper [style*="background:#ffffff"]{background:#2c2b29!important;}


/* Integrated dark theme: text tokens and interaction states. */
:root{--amber-text:#b2b0ae;--heading-text:#f3f3f2;--link-hover:#ececeb;}
h1,h2,h3,h4,h5,h6{color:var(--heading-text);}
body,main,.route{color:var(--text-ink);}
.hero .label,.page-hero .label{color:#c8c7c5;}
.body-l a:not(.text-link):hover,.body a:not(.text-link):hover{color:var(--link-hover);}
.text-link:hover,.text-link:focus-visible{color:var(--link-hover);}
.btn--ink:hover{color:#171716;}
.project-toggle{color:var(--amber-text);}
.project-card summary:hover .project-toggle,.project-card summary:focus-visible .project-toggle{color:var(--link-hover);}
::selection{background:#b2b0ae;color:#171716;}


/* Restrained neutral design. Backgrounds are static; motion belongs to the story and globe. */
:root{--ink:#181818;--ink-soft:#222221;--paper:#222221;--paper-dim:#2b2b29;--paper-line:#484845;--amber:#e2e0d9;--amber-deep:#d0cec7;--amber-tint:#343432;--amber-text:#e2e0d9;--heading-text:#f3f2ee;--text-ink:#e8e7e2;--text-steel:#bdbcb6;--text-pale:#bdbcb6;--link-hover:#ffffff;}
body,.on-paper{background:var(--paper);}.on-panel{background:var(--paper-dim);}
.site-header{background:rgba(27,27,26,.98);}
.globe-panel{background:transparent;border:0;box-shadow:none;padding:0;max-width:none;width:100%;}
.presence-intro{text-align:center;max-width:800px;margin:0 auto 36px;}
.presence-intro h2,.presence-intro p{max-width:100%!important;}
.presence-layout{display:grid;grid-template-columns:minmax(160px,1fr) minmax(0,2.4fr) minmax(160px,1fr);align-items:center;gap:36px;}
.presence-layout .office-list{display:flex;flex-direction:column;justify-content:center;gap:20px;margin:0;}
.office-select{background:transparent;border:0;border-bottom:1px solid #454542;padding:20px 8px;min-height:84px;}
.office-select[aria-pressed=true]{background:#30302e;border-color:#e2e0d9;}
.office-select:hover,.office-select:focus-visible{background:#30302e;}
.office-select .role{color:#bdbcb6;}.office-arrow{color:#e2e0d9;}
.globe-kicker{justify-content:center;color:#bdbcb6;}.globe-kicker>span:last-child{display:none;}
.globe-toolbar{padding-top:18px;}.globe-toolbar #globe-motion{color:#e8e7e2;border-color:#676762;}
.visual-card:after{display:none;}.visual-card:hover .card-scene,.visual-card:focus-visible .card-scene{transform:none;opacity:1;}
.media-plate video{animation:none!important;transform:none!important;}
.media-plate,.stage-media{background-color:#181818;}
.hero,.page-hero{background-color:#181818;}
.chapter-cta:hover{color:#181818;}
@media(max-width:900px){.presence-layout{grid-template-columns:minmax(130px,1fr) minmax(0,2fr) minmax(130px,1fr);gap:12px;}.office-select{padding:15px 6px;}.office-arrow{display:none;}.globe-toolbar{flex-wrap:wrap;}}
@media(max-width:650px){.presence-layout{grid-template-columns:1fr 1fr;gap:24px 16px;}.presence-layout .globe-panel{grid-column:1/-1;grid-row:1;width:100%;max-width:460px;margin:auto;}.presence-layout .office-list{align-self:start;gap:8px;}.presence-intro{text-align:left;}.office-select .city{font-size:.93rem;}}

/* Approved sage and clay system. IBM Plex Sans throughout. */
.sector-story summary .chapter-title,.on-ink .why-list strong{color:var(--text-ink)}.office-select[aria-pressed=true] .role{color:#465b4c}#office-globe{color:#f0f4ec}.on-ink .label{color:var(--amber-deep)}.sequence-wrap.motion-ready .sequence-caption button{display:inline-block}
.hero-study>img:first-child{height:auto}
:root{--paper:#f7f7f2;--paper-dim:#edf1eb;--paper-line:#d4dcd3;--ink:#e4ece3;--ink-soft:#eef2ec;--ink-line:#c2cec2;--ink-line-soft:#d7dfd4;--text-ink:#263f35;--text-steel:#56685d;--text-pale:#56685d;--text-onink:#263f35;--heading-text:#263f35;--amber:#a35f3d;--amber-deep:#8a4e31;--amber-text:#8a4e31;--amber-tint:#f1e2d6;--link-hover:#315d47;--forest:#2c5342;--sage:#dce8de;--clay:#ead8c9;--f-display:'IBM Plex Sans',sans-serif;--radius-s:10px;--radius-m:24px}
html{scroll-behavior:auto;scroll-padding-top:100px}body,.on-paper{background:var(--paper)}body{line-height:1.65}.container{max-width:1320px}h1,h2,h3,.display-1,.display-2,.display-3{font-weight:500;letter-spacing:-.035em}p{text-wrap:pretty}.on-panel{background:#eff3ed}.section-pad{padding:80px 0;border:0}.label,.hero .label,.page-hero .label{color:var(--amber-deep)}.site-header{background:rgba(247,247,242,.97);border-bottom:1px solid var(--paper-line);backdrop-filter:none}.nav-row{height:82px}.brand-word{font-family:var(--f-body);font-weight:500;letter-spacing:-.025em}.nav-drop{background:#fff;color:var(--text-ink);border-radius:16px;box-shadow:none}.nav-drop a:hover{background:var(--paper-dim)}.btn{font-weight:500;border-radius:10px;min-height:44px}.btn--amber,.btn--ink{background:var(--forest);color:#fff;border-color:var(--forest)}.btn--amber:hover,.btn--ink:hover{background:#1f4032;color:#fff}.btn--outline,.btn--line-onink{color:var(--forest);border-color:#9eaa9e}.text-link,.on-ink .text-link{color:var(--amber-deep)}::selection{background:var(--clay);color:var(--text-ink)}:focus-visible{outline:3px solid #9a5635;outline-offset:4px}
.hero,.page-hero{background:linear-gradient(115deg,#dce8de 0%,#f0eee5 62%,#ead8c9 100%);color:var(--text-ink)}.page-hero{margin:18px 20px 0;border-radius:32px;padding:60px 0}.page-hero h1,.hero h1,.on-ink h2,.site-footer .brand span{color:var(--text-ink)!important}.page-hero .lede,.on-ink .lede,.body-l.on-ink{background:none;color:var(--text-steel)}.page-hero .container{width:100%}.page-hero .display-1{font-size:clamp(2.3rem,4.2vw,4.7rem)}.breadcrumb{flex-wrap:wrap}.on-ink{color:var(--text-ink);background:var(--ink)}
.home-opening{margin:18px 20px 0}.intro-widget{position:relative;overflow:hidden;border-radius:36px;background:linear-gradient(110deg,#dce8de,#f0eee5 61%,#ead8c9);padding:62px 4.5%;display:grid;grid-template-columns:1.08fr 1fr;gap:36px;align-items:center}.intro-widget .chapter-title{font-size:clamp(2.5rem,4.5vw,4.8rem);line-height:1.04;color:var(--text-ink);font-family:var(--f-body);font-weight:500;letter-spacing:-.05em;max-width:17ch}.intro-widget .chapter-lede{color:var(--text-steel);font-size:1.08rem;max-width:46ch;margin-top:24px}.chapter-eyebrow{color:var(--amber-deep);font-size:.68rem;letter-spacing:.15em}.chapter-eyebrow:before{display:none}.chapter-tags{display:flex;flex-wrap:wrap;gap:8px;margin:24px 0}.chapter-tags li{font-size:.73rem;border:1px solid #a8bba9;color:var(--text-ink);padding:5px 10px;border-radius:7px}.chapter-cta{display:inline-flex;gap:18px;align-items:center;background:var(--forest);border:1px solid var(--forest);color:#fff;border-radius:10px;padding:12px 18px;font-size:.85rem;letter-spacing:0;text-transform:none}.chapter-cta:hover{background:#1f4032;color:#fff}.chapter-cta svg{width:16px;height:16px}.hero-study{position:relative;min-width:0}.hero-study img{width:100%;aspect-ratio:1.18;object-fit:cover;object-position:center;border-radius:24px}.hero-study .line-study{position:absolute;inset:-10% -4%;width:108%;height:120%;opacity:.55;object-fit:contain;pointer-events:none;transform:translateY(var(--study-shift,0px))}.hero-study figcaption{font-size:.63rem;letter-spacing:.14em;color:var(--text-steel);margin-top:14px;text-transform:uppercase}.intro-foundations{display:grid;grid-template-columns:1fr 1fr;gap:32px;border-top:1px solid #c4cec1;margin:28px 4.5% 0;padding:24px 0}.intro-foundations p{padding:0;border:0;margin:0}.intro-foundations strong{display:block;font:500 1.2rem var(--f-body);color:var(--text-ink);margin:5px 0}.chapter-note-label{color:var(--amber-deep);font-size:.68rem;letter-spacing:.1em}.chapter-note-detail{color:var(--text-steel);font-size:.83rem}.opening-foot{display:flex;justify-content:space-between;margin:0 4.5%;font-size:.72rem;color:var(--text-steel);padding-bottom:12px}
.bento,.industry-grid{background:none;border:0;gap:24px}.bento-card.visual-card,.industry-tile.visual-card{display:flex;padding:0;gap:0;min-height:0;background:#fff;border:1px solid #dce2d7;border-radius:24px;isolation:auto;transition:border-color .2s}.visual-card:before,.visual-card:after{display:none!important}.visual-card .card-scene{position:static;height:auto;aspect-ratio:1.9;object-fit:cover;opacity:1;z-index:auto;transform:none!important;transition:none}.visual-card .card-index{position:absolute;top:16px;left:16px;color:var(--forest);background:#f8faf3;padding:5px 10px;border-radius:6px;text-shadow:none;font-size:.62rem}.card-copy{padding:24px;display:flex;flex-direction:column;flex:1}.visual-card h3{color:var(--text-ink);font-size:1.4rem;letter-spacing:-.025em}.visual-card p{color:var(--text-steel)!important}.visual-card span.tag{color:var(--text-steel)}.card-action{color:var(--amber-deep);border-top:1px solid var(--paper-line);margin-top:auto;padding-top:16px}.card-copy p,.card-copy .tag{margin-bottom:20px}.visual-card:hover,.visual-card:focus-visible{background:#fff!important;border-color:var(--amber)!important}.visual-card:hover .card-action>span{transform:none}.stat-band{background:var(--paper);padding:26px 0}.stat-band .stat-row{background:linear-gradient(105deg,#e6eee4,#f3e7dc);border-radius:24px;padding:12px 26px}.stat .num{color:var(--forest);font-weight:500}.stat .lbl{color:var(--text-steel)}
.project-card,.related-card,.form-fallback,.proj-table,.field input,.field textarea,.field select{background:#fff;color:var(--text-ink);border-color:var(--paper-line)}.project-card{border-radius:24px}.project-overview h3{color:var(--text-ink)}.project-detail{background:#eef3eb}.project-visual img,.project-card summary:hover img{transform:none;transition:none}.project-visual span{background:#f9faf4;color:var(--text-steel)}.project-card summary:hover .project-toggle{color:var(--amber-deep)}.proj-table th{background:#e4ece0;color:var(--forest)}.proj-table tr,.proj-table td{border-color:var(--paper-line)}.proj-table .table-section td{background:#edf1e9;color:var(--forest)}.on-paper [style*="background:#ffffff"]{background:#fff!important}.value-list li{border-color:var(--paper-line)}.value-list .n{background:#e5ede1;border-radius:10px}.cta-band{background:linear-gradient(115deg,#e0eadf,#f2e7dc);color:var(--text-ink);border:0;border-radius:28px;margin:0 20px 48px}.cta-band h2{color:var(--text-ink)}
.sector-library{padding:60px 0 80px}.sector-library .display-2{margin-bottom:28px}.sector-stories{display:grid;grid-template-columns:1fr 1fr;gap:16px}.sector-story{background:#fff;border:1px solid var(--paper-line);border-radius:20px;overflow:hidden}.sector-story summary{list-style:none;cursor:pointer;padding:24px;display:flex;align-items:center;justify-content:space-between;gap:20px}.sector-story summary::-webkit-details-marker{display:none}.sector-story summary h2{font:500 1.25rem/1.3 var(--f-body);letter-spacing:-.025em}.sector-story summary h2 br{display:none}.sector-story summary:after{content:'+';font-size:1.6rem;color:var(--amber-deep)}.sector-story[open] summary:after{content:'−'}.sector-story[open]{grid-column:1/-1}.sector-story .chapter{display:grid;grid-template-columns:1.3fr 1fr;gap:32px;padding:0 24px 24px;min-height:0}.sector-story .chapter-lede{color:var(--text-steel);font-size:1rem}.sector-story .chapter-note{max-width:none}.sector-story .chapter-note p{border-color:var(--paper-line)}.sector-story .chapter-note strong{font:500 1.3rem var(--f-body);color:var(--forest)}.sector-story .chapter-tags li{color:var(--forest)}
#global-presence{background:linear-gradient(120deg,#e3ece2,#f1eee3 67%,#efdfd0);border-radius:40px;margin:0 20px}.office-select,.office-list .city{color:var(--text-ink)}.office-select{border-bottom:1px solid #b4c3b3;border-radius:12px}.office-select .role,.office-list .role,.globe-kicker{color:var(--text-steel)}.office-arrow{color:var(--amber-deep)}.office-select[aria-pressed=true],.office-select:hover,.office-select:focus-visible{background:#d4e2d1;border-color:#758f74}.globe-toolbar{border-color:#a9b9a5}#globe-city,#globe-city span{color:var(--text-ink)}.globe-toolbar #globe-motion{color:var(--forest);border-color:#859a80;border-radius:8px}.globe-panel{background:#26352e;border-radius:50%;padding:22px}.globe-panel .globe-kicker,.globe-panel #globe-city,.globe-panel #globe-city span{color:#f0f4ec}.globe-panel .globe-toolbar #globe-motion{color:#f0f4ec;border-color:#a5b69f}.globe-panel .globe-toolbar{border-color:#8ea389}.client-strip{background:var(--paper)}.client-track{animation:none!important;transform:none!important;display:flex;flex-wrap:wrap;justify-content:center;gap:20px 36px;width:auto;padding:0 28px}.client-track span{color:var(--text-steel);font-size:.88rem}.client-track [aria-hidden=true]{display:none}
.site-footer{margin:0;border:0;border-radius:56px 56px 0 0;background:linear-gradient(110deg,#dce8de,#eeeee4 56%,#ead8c9);color:var(--text-ink);padding:64px 0 20px;overflow:hidden}.footer-intro{display:grid;grid-template-columns:1fr 1.6fr;gap:50px;align-items:center;padding-bottom:34px;min-height:300px}.footer-brand .brand-mark{display:none}.footer-brand .brand span{font-size:2rem!important;letter-spacing:-.04em;font-weight:500!important}.footer-brand p{color:var(--text-steel);max-width:43ch}.footer-art{width:100%;opacity:.58}.footer-contact{margin-top:22px}.footer-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:30px;padding:36px 0;border-top:1px solid #acbda9}.footer-grid h2{color:var(--forest);font-size:.7rem;letter-spacing:.16em;font-weight:500}.footer-grid a,.footer-grid li{color:var(--text-steel);font-size:.88rem}.footer-grid a:hover{color:var(--amber-deep)}.footer-social a{border-color:#a2b39f;color:var(--forest)}.footer-signature{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:10px 0 20px}.footer-signature>span{font-size:clamp(3.8rem,12vw,10rem);font-weight:400;letter-spacing:-.075em;line-height:1;color:transparent;background:linear-gradient(90deg,#9eb49d,#d4baa1);background-clip:text}.footer-signature a{font-size:.75rem;white-space:nowrap}.footer-bottom{border-color:#b3c2aa;color:var(--text-steel);gap:20px;line-height:1.6;font-size:.69rem}.footer-bottom span{max-width:50%}
.sequence-wrap{margin:18px 20px 0}.sequence-sticky{position:relative;display:grid;grid-template-columns:.88fr 1.12fr;align-items:center;gap:30px;padding:40px;border-radius:32px;background:linear-gradient(110deg,#dce8de,#f0eee5 59%,#ead8c9)}.sequence-sticky .page-hero{margin:0;padding:0;background:none;border-radius:0;overflow:visible}.sequence-sticky .page-hero .container{padding:0}.sequence-sticky .display-1{font-size:clamp(2.1rem,3.3vw,4rem)}.sequence-sticky .lede{font-size:1.02rem}.sequence-media{position:relative;min-width:0}.sequence-picture{position:relative;aspect-ratio:16/9;background:#e9ede5;border-radius:24px;overflow:hidden}.sequence-picture img,.sequence-picture canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.sequence-picture canvas{display:none;opacity:1;background:#e9ede5}.sequence-picture.has-frame canvas{display:block}.sequence-picture.has-frame img{visibility:hidden}.sequence-caption{display:flex;align-items:center;justify-content:space-between;gap:14px;font-size:.7rem;color:var(--text-steel);padding:14px 4px}.sequence-caption button{font:inherit;color:var(--forest);border:1px solid #879980;border-radius:8px;background:transparent;min-height:40px;padding:8px 12px;cursor:pointer}.sequence-progress{height:2px;background:#ccd5c5}.sequence-progress span{display:block;height:100%;width:0;background:var(--amber)}.sequence-wrap.is-sequence{height:220svh;min-height:1100px}.is-sequence .sequence-sticky{position:sticky;top:100px;min-height:calc(100svh - 120px);max-height:calc(100svh - 110px)}.sequence-wrap:not(.motion-ready) .sequence-caption button{display:none}
@media(max-width:980px){.nav-primary{background:var(--paper)}.intro-widget{padding:40px;gap:24px}.intro-widget .chapter-title{font-size:3.2rem}.sequence-sticky{gap:24px;padding:28px}.sequence-sticky .display-1{font-size:2.5rem}.footer-grid{gap:24px}.footer-intro{gap:20px}.globe-panel{border-radius:24px}}
@media(max-width:720px){.section-pad{padding:52px 0}.home-opening{margin:12px 12px 0}.intro-widget{grid-template-columns:1fr;padding:28px 24px;border-radius:28px}.intro-widget .chapter-title{font-size:clamp(2.45rem,8vw,3.5rem)}.hero-study img{aspect-ratio:1.8}.intro-foundations{gap:20px;margin:24px 12px 0}.opening-foot{margin:0 12px}.bento,.industry-grid{grid-template-columns:1fr}.stat-band .stat-row{padding:6px 20px}.sector-stories{grid-template-columns:1fr}.sector-story .chapter{grid-template-columns:1fr}.sector-story[open]{grid-column:auto}.footer-intro{grid-template-columns:1fr;gap:16px;min-height:0}.footer-art{max-height:220px}.footer-grid{grid-template-columns:1fr 1fr;gap:28px}.site-footer{padding-top:38px;border-radius:32px 32px 0 0}.footer-bottom{flex-direction:column}.footer-bottom span{max-width:100%}.footer-signature{gap:12px}.footer-signature>span{font-size:15vw}.sequence-wrap{margin:12px}.sequence-sticky{grid-template-columns:1fr;padding:24px;gap:20px;align-content:start;border-radius:28px}.sequence-sticky .display-1{font-size:2.2rem}.sequence-sticky .lede{font-size:.9rem}.sequence-sticky .breadcrumb{margin-bottom:8px}.sequence-picture{border-radius:16px}.is-sequence .sequence-sticky{top:90px;min-height:0;max-height:none}.sequence-wrap.is-sequence{height:190svh;min-height:1000px}.sequence-caption{font-size:.65rem}.page-hero{margin:12px;border-radius:24px;padding:36px 0}.cta-band{margin:0 12px 32px}#global-presence{margin:0 12px;border-radius:28px}.globe-panel{border-radius:24px;padding:14px}.footer-signature a{white-space:normal}.chapter-tags{margin:18px 0}.client-track{gap:14px 22px}}
@media(max-width:390px){.intro-foundations{grid-template-columns:1fr}.footer-grid{column-gap:18px}.footer-grid li,.footer-grid a{font-size:.8rem}.intro-widget{padding:24px 20px}.sequence-sticky{padding:20px}.sequence-sticky .display-1{font-size:1.9rem}}
@media(max-height:650px){.sequence-wrap.is-sequence{height:auto;min-height:0}.is-sequence .sequence-sticky{position:relative;top:auto;min-height:0;max-height:none}}
@media(prefers-reduced-motion:reduce){.hero-study .line-study{transform:none!important}.sequence-wrap.is-sequence{height:auto;min-height:0}.is-sequence .sequence-sticky{position:relative;top:auto;min-height:0;max-height:none}}


.footer-intro{grid-template-columns:1.2fr 1fr;min-height:0;padding-bottom:24px}.footer-invitation{font-size:clamp(2rem,3.3vw,3rem);line-height:1.1;margin-bottom:22px;letter-spacing:-.045em}.footer-brand .brand span{font-size:1.1rem!important}.footer-art{max-height:280px}.footer-brand p{font-size:.86rem}.footer-signature>span{line-height:1.18}.footer-grid{padding:28px 0}.footer-contact{border-color:#879b83}
@media(max-width:720px){.nav-cta .nav-mail{display:none}.nav-cta{gap:12px}.nav-cta>.btn{white-space:nowrap;font-size:.75rem;padding:10px 12px;gap:8px}.nav-cta>.btn svg{display:none}.nav-row{gap:12px}.brand-word{font-size:1.15rem}.footer-intro{grid-template-columns:1fr}.footer-art{max-height:200px}.footer-invitation{font-size:2rem}}
.globe-panel{background:transparent;border-radius:0;padding:0}.globe-panel .globe-kicker,.globe-panel #globe-city,.globe-panel #globe-city span,.globe-panel .globe-toolbar #globe-motion{color:var(--text-ink)}.globe-panel .globe-toolbar #globe-motion{border-color:#859a80}

/* Fullscreen industry scenes with native scrolling content panels. */
.sequence-wrap.immersive{margin:0;position:relative;isolation:isolate;height:auto;min-height:0;background:#e4ece3}
.immersive .sequence-sticky,.immersive.is-sequence .sequence-sticky{display:block;position:sticky;top:82px;height:calc(100svh - 82px);min-height:0;max-height:none;padding:0;border-radius:0;background:#dce8de;overflow:hidden;z-index:0}
.immersive .sequence-media,.immersive .sequence-picture{position:absolute;inset:0;aspect-ratio:auto;border-radius:0}
.immersive .sequence-picture img,.immersive .sequence-picture canvas{width:100%;height:100%;object-fit:cover;object-position:center;opacity:1}
.immersive .sequence-picture:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,37,29,.08),transparent 30%,rgba(20,37,29,.25));pointer-events:none}
.immersive .sequence-caption{position:absolute;right:28px;top:20px;left:auto;z-index:2;padding:8px 10px 8px 16px;border:1px solid #d4dcd3;border-radius:16px;background:#f7f7f2;color:#465b4c;gap:16px;font-size:.72rem}
.immersive .sequence-caption button{background:#e4ece3;border-radius:10px;min-height:36px}
.immersive .sequence-progress{position:absolute;bottom:0;left:0;right:0;height:4px;background:#e4ece3;z-index:2;border-radius:4px}
.immersive .sequence-progress span{border-radius:4px}
.sequence-content{position:relative;z-index:1;margin-top:calc(-100svh + 82px);pointer-events:none}
.sequence-content a,.sequence-content summary,.sequence-content button{pointer-events:auto}
.immersive .sequence-intro{min-height:calc(100svh - 82px);display:flex;align-items:flex-end;padding:100px max(28px,calc((100vw - 1280px)/2)) 56px}
.immersive .sequence-intro .page-hero{margin:0;padding:30px 34px;border:1px solid #d4dcd3;border-radius:28px;background:linear-gradient(120deg,#edf3e9,#f7f4ed 70%,#f0e3d6);max-width:620px;width:54%;color:var(--text-ink);pointer-events:auto}
.immersive .page-hero .container{padding:0;width:auto}
.immersive .page-hero .display-1{font-size:clamp(2.3rem,4vw,4rem);line-height:1.06;margin-top:12px!important}
.immersive .page-hero .lede{font-size:1rem;margin-top:20px!important;color:#465b4c}
.immersive .breadcrumb{margin-bottom:18px;font-size:.72rem}
.sequence-read{display:inline-flex;align-items:center;gap:24px;margin-top:24px;background:var(--forest);color:#fff;padding:10px 16px;border-radius:12px;font-size:.8rem;min-height:44px}
.sequence-read:hover{background:#1f4032;color:#fff}
.sequence-body{background:transparent;padding:12vh 0 16vh;position:relative}
.sequence-body>.container{max-width:1280px;gap:28px;align-items:start}
.sequence-body aside{display:grid;gap:18px}
.sequence-body aside>div{border:0!important;padding:0!important;background:transparent!important}
.sequence-body .body-l{background:#f7f7f2;color:var(--text-ink);border:1px solid #d4dcd3;border-radius:28px;padding:32px;font-size:1.05rem;line-height:1.8;margin:0 0 26px!important;pointer-events:auto}
.capability-widget{border:1px solid #c4d3c3;border-radius:24px;background:#e7eee3;overflow:hidden;pointer-events:auto;margin-bottom:18px}
.capability-widget summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px;cursor:pointer}
.capability-widget summary::-webkit-details-marker{display:none}
.capability-widget summary:after{content:'+';font-size:1.5rem;color:var(--amber-deep)}
.capability-widget[open] summary:after{content:'−'}
.capability-widget summary h2{margin:0!important;font-size:1.1rem!important;line-height:1.4}
.capability-widget .service-list{padding:0 24px 20px;margin-top:0!important}
.capability-widget .service-list li{font-size:.9rem;line-height:1.65;border-color:#c5d3bf}
.sequence-body a:not(.btn){text-decoration:underline;text-underline-offset:3px}
.sequence-body a:hover{color:var(--amber-deep)}
body:has(.immersive) main>.section-pad{margin:28px 20px;border-radius:28px;overflow:hidden}
body:has(.immersive) .related-card{border-radius:24px}
body:has(.immersive) .proj-table{border-radius:20px;overflow:hidden}
@media(max-width:980px){.immersive .sequence-intro .page-hero{width:70%;max-width:600px}.sequence-body>.container{gap:20px}.sequence-body .body-l{padding:24px;font-size:1rem}}
@media(max-width:720px){
 .immersive .sequence-sticky,.immersive.is-sequence .sequence-sticky{top:82px;height:calc(100svh - 82px)}
 .immersive .sequence-caption{top:12px;right:12px;left:12px;padding:6px 8px 6px 12px;justify-content:space-between;font-size:.62rem;gap:8px;border-radius:14px}
 .immersive .sequence-caption button{font-size:.65rem;padding:6px 10px;min-height:34px}
 .immersive .sequence-intro{padding:100px 16px 24px;align-items:flex-end}
 .immersive .sequence-intro .page-hero{width:100%;padding:24px;border-radius:24px}
 .immersive .page-hero .display-1{font-size:clamp(1.9rem,7.5vw,2.8rem)}
 .immersive .page-hero .lede{font-size:.9rem;line-height:1.65}
 .immersive .breadcrumb{font-size:.66rem;margin-bottom:12px}
 .sequence-read{margin-top:18px;font-size:.76rem}
 .sequence-body{padding:16vh 0 10vh}
 .sequence-body>.container{display:flex;flex-direction:column;gap:16px;padding:0 16px}
 .sequence-body aside,.sequence-body>.container>div{width:100%;min-width:0}
 .sequence-body .body-l{border-radius:24px;padding:24px;font-size:.95rem;line-height:1.8;margin-bottom:20px!important}
 .capability-widget{border-radius:24px}
 body:has(.immersive) main>.section-pad{margin:20px 12px;border-radius:24px}
}
@media(max-height:600px) and (min-width:721px){.immersive .sequence-intro{padding-top:90px;padding-bottom:24px}.immersive .sequence-intro .page-hero{max-width:760px;width:75%}.immersive .page-hero .display-1{font-size:2.2rem}.immersive .page-hero .lede{font-size:.9rem}}
@media(prefers-reduced-motion:reduce){.immersive .sequence-sticky,.immersive.is-sequence .sequence-sticky{position:sticky;top:82px;height:calc(100svh - 82px)}.sequence-read{scroll-behavior:auto}}

/* Power prototype: a single scene, staged typography, native scroll input. */
.power-story{--power-cream:#fff4df;--power-muted:#e4d4b9;--power-copper:#eac18b;background:#211a13;color:var(--power-cream);position:relative;isolation:isolate}
.power-screen{position:relative;min-height:calc(100svh - 82px);overflow:hidden}
.power-image{position:absolute;inset:0;pointer-events:none}
.power-image img,.power-image canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:1}
.power-image canvas{display:none}.power-image.has-frame img{visibility:hidden}.power-image.has-frame canvas{display:block}
.power-image:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,15,10,.88),rgba(20,15,10,.68) 48%,rgba(20,15,10,.18)),linear-gradient(0deg,rgba(20,15,10,.65),transparent 45%)}
.power-chapters{position:relative;padding:100px max(28px,calc((100vw - 1280px)/2)) 90px}
.power-chapter{position:relative;padding:50px 0;max-width:800px;background:none;border:0;border-radius:0}
.power-chapter h1,.power-chapter h2,.power-chapter h3,.power-chapter p,.power-chapter li,.power-chapter strong{color:var(--power-cream)!important}
.power-chapter h1{font-size:clamp(4.5rem,9vw,8.5rem);line-height:1;letter-spacing:-.065em;font-weight:400;margin:20px 0 28px}
.power-chapter h2{font-size:clamp(2rem,4vw,3.9rem)!important;line-height:1.12;letter-spacing:-.04em;font-weight:400;max-width:24ch;margin:18px 0 28px!important}
.power-chapter h3{font-size:1.35rem!important;margin-bottom:14px}
.power-chapter .body-l,.power-chapter .lede{font-size:clamp(1.08rem,1.65vw,1.5rem);line-height:1.65;max-width:58ch;background:none;padding:0;margin:0!important}
.power-chapter .label,.power-chapter .power-eyebrow{font-size:.7rem;letter-spacing:.17em;text-transform:uppercase;color:var(--power-copper)!important}
.power-chapter .service-list{margin-top:20px!important}.power-chapter .service-list li{font-size:1.05rem;line-height:1.65;border-color:#77634b;padding:12px 0}.power-chapter .service-list svg{color:var(--power-copper);flex-shrink:0}
.power-chapter .breadcrumb,.power-chapter .breadcrumb a{color:var(--power-muted);font-size:.75rem}
.power-chapter .proj-table{background:rgba(38,29,20,.9);border:1px solid #9b805e;border-radius:18px;overflow:hidden;color:var(--power-cream);min-width:0;width:100%}
.power-chapter .proj-table th{background:#493927;color:var(--power-cream);font-size:.7rem}.power-chapter .proj-table td{color:var(--power-cream);border-color:#77634b;font-size:.95rem}.power-chapter .proj-note{font-size:.8rem;line-height:1.6;color:var(--power-muted)!important}
.power-chapter .related-grid{grid-template-columns:1fr;gap:0}.power-chapter .related-card{background:none;border:0;border-top:1px solid #77634b;border-radius:0;padding:18px 0;box-shadow:none}.power-chapter .related-card h3{font-size:1.3rem}.power-chapter .related-card p,.power-chapter .related-card .text-link{color:var(--power-muted)!important}.power-chapter .related-card:hover{background:rgba(255,244,223,.06);border-radius:14px}
.power-toolbar{position:absolute;top:20px;right:28px;z-index:4;display:flex;gap:10px}.power-toolbar button,.power-controls button{font:500 .72rem var(--f-body);padding:10px 14px;min-height:42px;border:1px solid #ad9270;border-radius:24px;background:#32261b;color:var(--power-cream);cursor:pointer}.power-toolbar button:hover,.power-controls button:hover{background:#59422c}.power-toolbar{display:none}
.power-controls{display:none;position:absolute;bottom:24px;left:max(28px,calc((100vw - 1280px)/2));right:28px;z-index:4;align-items:center;gap:18px;color:var(--power-muted);font-size:.72rem;letter-spacing:.04em}.power-controls output{min-width:55px}.power-track{height:2px;flex:1;max-width:440px;background:#6c5741;border-radius:4px;overflow:hidden}.power-track span{height:100%;display:block;background:var(--power-copper);width:0}
.power-story.power-ready .power-toolbar{display:flex}.power-story.power-active .power-controls{display:flex}
.power-story.power-active .power-screen{position:sticky;top:82px;height:calc(100svh - 82px);min-height:0}
.power-active .power-chapters{position:absolute;inset:0;padding:0}
.power-active .power-chapter{position:absolute;top:0;left:max(28px,calc((100vw - 1280px)/2));width:min(800px,calc(100% - 100px));padding:0;visibility:hidden;opacity:0;will-change:transform,opacity}
.power-active .power-chapter.is-current{visibility:visible}
.power-story:not(.power-active) .power-image{position:fixed;z-index:-1}.power-story:not(.power-active) .power-chapter{padding-top:60px;padding-bottom:60px}
@media(max-width:720px){.power-image:after{background:linear-gradient(90deg,rgba(20,15,10,.85),rgba(20,15,10,.55)),linear-gradient(0deg,rgba(20,15,10,.7),transparent)}.power-chapters{padding:80px 24px}.power-active .power-chapter{left:24px;width:calc(100% - 48px)}.power-chapter h1{font-size:4.7rem}.power-chapter h2{font-size:2rem!important}.power-chapter .body-l,.power-chapter .lede{font-size:1.05rem;line-height:1.7}.power-chapter .service-list li{font-size:.92rem;padding:10px 0}.power-toolbar{top:12px;right:16px}.power-toolbar button,.power-controls button{font-size:.65rem;padding:8px 12px}.power-controls{left:24px;right:20px;bottom:14px;gap:10px}.power-chapter .proj-table td{font-size:.77rem;padding:10px}.power-chapter .proj-table th{padding:10px}.power-chapter .proj-scroll{overflow-x:auto}.power-chapter h3{font-size:1.1rem!important}}

/* Selective panels, illustrated pointers and a shared editorial rhythm. */
.power-editorial .power-screen{overflow:clip}.power-editorial.power-active .power-chapters{clip-path:inset(70px 0 80px 0)}
.power-editorial .power-chapter{max-width:1060px}.power-editorial.power-active .power-chapter{width:min(1060px,calc(100% - 120px))}
.power-editorial .power-chapter h1{font-size:clamp(3.2rem,5.8vw,5.9rem);line-height:1.02;max-width:17ch;margin:22px 0 26px}
.power-editorial .power-chapter h2{font-size:clamp(2rem,3.7vw,3.6rem)!important;max-width:27ch;line-height:1.09;margin:14px 0 26px!important}
.power-chapter .power-highlight{color:#edbd80;font-style:normal;font-weight:400}
.power-hero-layout{display:grid;grid-template-columns:1.5fr .65fr;gap:64px;align-items:end}.power-editorial .lede{font-size:1.12rem;max-width:54ch}
.power-proof{padding:22px 0 18px 24px;border-left:1px solid #c29a69;color:var(--power-muted);max-width:300px}.power-proof b{display:block;font-size:clamp(2.5rem,3.8vw,3.8rem);font-weight:400;letter-spacing:-.05em;color:#edbd80;line-height:1.1}.power-proof span{display:block;font-size:.82rem;line-height:1.65;margin-top:12px}.power-proof small{display:block;font-size:.64rem;text-transform:uppercase;letter-spacing:.13em;margin-bottom:18px;color:var(--power-muted)}
.power-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:24px 0}.power-tiles.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.power-tile{background:rgba(45,32,21,.94);border:1px solid #90714e;border-radius:22px;padding:24px;min-width:0}.power-tile .power-icon{margin-bottom:28px}.power-tile .power-tag{font-size:.61rem;text-transform:uppercase;letter-spacing:.13em;color:#edbd80;display:block;margin-bottom:10px}
.power-editorial .power-tile h3{font-size:1.25rem!important;line-height:1.25;margin-bottom:12px}.power-editorial .power-tile p{font-size:.9rem;line-height:1.6;color:#e4d4b9!important;margin:0}
.power-tile.is-light{background:#ecd6b5;border-color:#ecd6b5}.power-chapter .power-tile.is-light h3,.power-chapter .power-tile.is-light p{color:#35281c!important}.power-tile.is-light .power-icon,.power-tile.is-light .power-tag{color:#684725}
.power-icon{display:block;width:34px;height:34px;color:#edbd80;stroke:currentColor;fill:none;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.power-pointers{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 36px;margin:24px 0;padding:0;list-style:none}
.power-pointers>li{display:flex;gap:18px;border-top:1px solid #8a7151;padding:20px 0!important;font-size:1rem!important;line-height:1.55!important;min-width:0}.power-pointers>li .power-icon{width:28px;height:28px;margin-top:2px}.power-point-copy{display:block}.power-point-copy b{display:block;font-weight:500;color:#fff4df;font-size:1.06rem;margin-bottom:8px}.power-point-copy span{font-size:.91rem;color:#e4d4b9;display:block}
.power-details{margin-top:24px;max-width:850px;border-top:1px solid #80674b;padding-top:14px}.power-details summary{display:inline-flex;align-items:center;gap:14px;cursor:pointer;color:#edbd80;font-size:.8rem;min-height:40px;list-style:none}.power-details summary::-webkit-details-marker{display:none}.power-details summary:after{content:'+';font-size:1.2rem}.power-details[open] summary:after{content:'−'}.power-details .body-l{font-size:1rem;line-height:1.75;margin-top:18px!important}.power-details .service-list li{font-size:.94rem}
.power-details a{color:#edbd80;text-decoration:underline;text-underline-offset:4px}.power-editorial .power-chapter .proj-table td{font-size:.9rem}.power-editorial .power-chapter .proj-table th{color:#edbd80}
.power-reveal{will-change:transform,opacity}.power-story:not(.power-active) .power-reveal{opacity:1!important;transform:none!important}
@media(max-width:980px){.power-hero-layout{gap:28px;grid-template-columns:1.3fr .7fr}.power-tiles{gap:12px}.power-tile{padding:20px}.power-pointers{gap:0 24px}}
@media(max-width:720px){.power-editorial.power-active .power-chapter{width:calc(100% - 48px)}.power-editorial .power-chapter h1{font-size:clamp(2.9rem,10vw,4rem)}.power-editorial .power-chapter h2{font-size:2rem!important}.power-hero-layout{grid-template-columns:1fr;gap:24px}.power-proof{max-width:none;padding:14px 0 0;border-left:0;border-top:1px solid #977348;display:grid;grid-template-columns:1fr 1fr;gap:6px 18px}.power-proof small{grid-column:1/-1;margin:0}.power-proof b{font-size:2.4rem}.power-proof span{font-size:.72rem;margin:0}.power-editorial .lede{font-size:.96rem;line-height:1.65}.power-tiles,.power-tiles.two{grid-template-columns:1fr;gap:12px;margin:20px 0}.power-tile{padding:18px 20px}.power-tile .power-icon{margin-bottom:14px;width:28px;height:28px}.power-editorial .power-tile h3{font-size:1.15rem!important}.power-pointers{grid-template-columns:1fr;margin:20px 0}.power-pointers>li{padding:16px 0!important}.power-details{margin-top:16px}.power-details .body-l{font-size:.94rem}.power-editorial .power-chapter .proj-table td{font-size:.77rem}}
@media(prefers-reduced-motion:reduce){.power-reveal{opacity:1!important;transform:none!important;will-change:auto}}
@media(max-width:720px){.power-proof b{font-size:1.65rem;white-space:nowrap}}

/* Shared editorial language; each scene takes its palette from its imagery. */
.industry-story{--scene:#211a13;--panel:#30281f;--tint:#ecd6b5;--accent:#edbd80;--edge:#9b805e;--shade:20,15,10;--power-cream:#fff4df;--power-muted:#e4d4b9;--power-copper:var(--accent);background:var(--scene)}
.theme-sage{--scene:#14221b;--panel:#24372c;--tint:#dae5ca;--accent:#c9dbaa;--edge:#889879;--shade:13,27,19;--power-cream:#f4f6e9;--power-muted:#d9e1d0}
.theme-steel{--scene:#202622;--panel:#303b35;--tint:#dce2d4;--accent:#d0ddc2;--edge:#919d8d;--shade:19,29,24;--power-cream:#f5f5ed;--power-muted:#dedfd6}
.theme-clay,.theme-mineral{--scene:#2a211b;--panel:#3e2e25;--tint:#ead3bf;--accent:#f0bd95;--edge:#b19278;--shade:31,21,16;--power-cream:#fff5e9;--power-muted:#ecdbcd}
.theme-solar{--scene:#25251a;--panel:#35382a;--tint:#e8e5c7;--accent:#e6d79e;--edge:#a6a075;--shade:26,26,15;--power-cream:#fff9e6;--power-muted:#e4dfc7}
.theme-oil{--scene:#2c2018;--panel:#3c2a1e;--tint:#eed2a7;--accent:#f2c283;--edge:#b68e5e;--shade:28,18,11}
.theme-mobility{--scene:#252720;--panel:#343d2e;--tint:#e0e5c4;--accent:#dae5a4;--edge:#9bA47d;--shade:20,25,16;--power-cream:#fafbe9;--power-muted:#e0e5cd}
.theme-battery{--scene:#25221c;--panel:#38342b;--tint:#e4d8bf;--accent:#e4c998;--edge:#a7997c;--shade:24,23,17}
.theme-forest{--scene:#182417;--panel:#293b23;--tint:#dfe7c1;--accent:#d8e49e;--edge:#9baf80;--shade:16,29,13;--power-cream:#f6f9e6;--power-muted:#dce6c9}
.industry-story .power-image:after{background:linear-gradient(90deg,rgba(var(--shade),.92),rgba(var(--shade),.77) 52%,rgba(var(--shade),.48)),linear-gradient(0deg,rgba(var(--shade),.7),transparent 60%)}
.industry-story .power-highlight,.industry-story .power-icon,.industry-story .power-tag,.industry-story .power-details summary,.industry-story .power-proof b{color:var(--accent)}
.industry-story .power-tile{background:var(--panel);border-color:var(--edge)}.industry-story .power-tile.is-light{background:var(--tint)}
.industry-story .power-tile p,.industry-story .power-point-copy span{color:var(--power-muted)!important}
.industry-story .power-pointers>li,.industry-story .power-details,.industry-story .related-card{border-color:var(--edge)}
.industry-story .power-toolbar button,.industry-story .power-controls button{background:var(--panel);border-color:var(--edge)}
.industry-story .power-toolbar button:hover,.industry-story .power-controls button:hover{background:var(--scene)}
.industry-story .power-controls button:disabled{opacity:.45;cursor:default}
.industry-story .power-chapter .proj-table{background:var(--panel);border-color:var(--edge)}.industry-story .power-chapter .proj-table th{background:var(--scene);color:var(--accent)}.industry-story .power-chapter .proj-table td{border-color:var(--edge)}
.industry-story .power-details a,.industry-story .story-outlink{color:var(--accent);text-decoration:underline;text-underline-offset:5px}
.industry-story .power-details h2{font-size:1.3rem!important;margin-top:24px!important}.industry-story .power-details h3{font-size:1.1rem!important}.industry-story .power-details p+p{margin-top:18px!important}
.industry-story .power-chapter h1{max-width:19ch;font-size:clamp(3rem,5.4vw,5.5rem)}
.industry-story .power-chapter :focus-visible{outline:2px solid var(--accent);outline-offset:5px}
.story-hero{display:grid;grid-template-columns:1.65fr .75fr;gap:60px;align-items:end}
.story-signal{display:flex;flex-direction:column;gap:15px;max-width:280px;padding:22px 0;color:var(--power-muted);font-size:.9rem;line-height:1.6}
.story-signal b{font-size:clamp(1.5rem,2.6vw,2.6rem);font-weight:400;letter-spacing:-.045em;line-height:1.1;color:var(--accent)}
.signal-line{height:2px;width:64px;background:var(--accent);position:relative}.signal-line:after{content:'';position:absolute;right:0;top:-3px;width:8px;height:8px;border:1px solid var(--accent);border-radius:50%;background:var(--scene)}
.hero-blueprint .story-signal{border:1px solid var(--edge);border-radius:50% 50% 24px 24px;padding:48px 24px 28px}
.hero-catalogue .story-signal{border-left:1px solid var(--edge);padding-left:26px}
.hero-horizon .story-signal{border-bottom:1px solid var(--edge);padding-bottom:30px;align-self:center}
.hero-instrument .story-signal{border:1px solid var(--edge);border-radius:22px;padding:24px}
.hero-strata .story-signal b{font-size:3.5rem}.hero-strata .story-signal{border-top:3px double var(--edge)}
.hero-mobility .story-signal{border-top:1px solid var(--edge);transform:translateY(-25px)}
.hero-cell .story-signal{border:1px solid var(--edge);border-radius:32px;padding:28px}
.hero-canopy .story-signal{border-left:1px solid var(--edge);border-radius:100px 0 0 100px;padding:45px 25px 45px 38px}
.story-steps{list-style:none;padding:0;margin:30px 0 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.story-steps li{border-top:1px solid var(--edge);padding:22px 0;display:flex;flex-direction:column;gap:22px;min-width:0}
.step-number{font-size:2.8rem;letter-spacing:-.05em;color:var(--accent);font-weight:400;line-height:1}
.industry-story .story-steps h3,.industry-story .story-point h3{font-size:1.22rem!important;margin:0 0 12px}
.industry-story .story-steps p,.industry-story .story-point p{font-size:.96rem;line-height:1.65;color:var(--power-muted)!important;margin:0}
.step-timeline{grid-template-columns:1fr;max-width:760px;gap:0;border-left:1px solid var(--edge);padding-left:28px}.step-timeline li{border:0;flex-direction:row;padding:16px 0;gap:26px}.step-timeline .step-number{font-size:1.9rem;min-width:42px}
.step-terraces li:nth-child(2){margin-top:35px}.step-terraces li:nth-child(3){margin-top:70px}
.step-strata{gap:12px}.step-strata li{border:1px solid var(--edge);border-radius:22px;padding:26px;background:var(--panel)}.step-strata li:nth-child(2){background:var(--tint)}.step-strata li:nth-child(2) *{color:#2b3024!important}
.scope-columns li{border-top:0;border-left:1px solid var(--edge);padding-left:24px}.scope-columns .step-number{font-size:4rem;font-weight:400}
.story-points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:30px}.story-point{display:flex;gap:18px;min-width:0;padding:22px 0;border-top:1px solid var(--edge)}
.selection-grid .story-point{display:block}.selection-grid .power-icon{margin-bottom:25px}
.pointer-rail{grid-template-columns:1fr;gap:0;max-width:820px}.pointer-rail .story-point{display:grid;grid-template-columns:48px 1fr}.pointer-rail .story-point>div{display:grid;grid-template-columns:.8fr 1.4fr;gap:24px}
.sourcing-lanes{grid-template-columns:1fr 1fr;gap:50px}.sourcing-lanes .story-point{border-top:0;border-bottom:1px solid var(--edge);padding-bottom:30px}
.storage-cells .story-point{border:1px solid var(--edge);border-radius:30px;padding:26px;display:block;background:var(--panel)}.storage-cells .power-icon{margin-bottom:30px}
.platform-stack{grid-template-columns:1fr;gap:12px;max-width:820px}.platform-stack .story-point{border:1px solid var(--edge);border-radius:18px;padding:18px 24px;background:var(--panel);align-items:center}.platform-stack .story-point:nth-child(2){margin-left:40px}.platform-stack .story-point:nth-child(3){margin-left:80px}.platform-stack h3{margin-bottom:6px!important}
.story-feature{display:grid;grid-template-columns:1.1fr .9fr;gap:50px;align-items:center;margin-top:28px}.feature-caption{max-width:340px}.feature-caption .power-icon{width:60px;height:60px;margin-bottom:28px}.industry-story .feature-caption p{font-size:1.1rem;line-height:1.7;color:var(--power-muted)!important}.mobility-feature{grid-template-columns:.9fr 1.1fr}
.ownership-mark{border:1px solid var(--edge);border-radius:50%;aspect-ratio:1;max-width:290px;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:30px;text-align:center}.ownership-mark>span{font-size:5.5rem;letter-spacing:-.08em;color:var(--accent);line-height:1}.ownership-mark p{max-width:20ch;margin-top:20px;font-size:.9rem}
.expertise-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:28px}
.expertise-card{display:block;width:100%;padding:0;border:0;border-radius:24px;background:var(--panel);color:var(--power-cream);font:inherit;text-align:left;cursor:pointer;perspective:1200px;min-width:0;--flip-bg:var(--panel);--flip-text:var(--power-cream);--flip-secondary:var(--power-muted);--flip-accent:var(--accent)}
.expertise-card.is-light{--flip-bg:var(--tint);--flip-text:#282c23;--flip-secondary:#3c4035;--flip-accent:#48533a}
.flip-inner{display:grid;position:relative;border-radius:inherit;transform-style:preserve-3d;transition:transform 320ms cubic-bezier(.2,.65,.25,1)}
.flip-face{display:flex;flex-direction:column;gap:16px;padding:28px;border:1px solid var(--edge);border-radius:24px;background:var(--flip-bg);color:var(--flip-text);min-height:290px;overflow-wrap:anywhere}
.flip-face>strong{font-size:1.5rem;line-height:1.2;font-weight:500;color:var(--flip-text)!important;letter-spacing:-.025em}.flip-face>span{font-size:.96rem;line-height:1.6;color:var(--flip-secondary)}
.flip-face>.power-icon{color:var(--flip-accent);margin-bottom:10px}.flip-face>small{display:flex;justify-content:space-between;gap:16px;margin-top:auto;padding-top:15px;font-size:.74rem;color:var(--flip-accent)}
.flip-bullet{display:flex;gap:12px;align-items:flex-start}.flip-bullet .power-icon{width:20px;height:20px;color:var(--flip-accent);margin-top:3px}.flip-bullet>span{flex:1;font-size:.89rem;line-height:1.5}
.flip-ready .flip-face{grid-area:1/1;backface-visibility:hidden;-webkit-backface-visibility:hidden}.flip-ready .flip-back{transform:rotateY(180deg)}.flip-ready.is-flipped .flip-inner{transform:rotateY(180deg)}
.industry-story .story-list h2,.industry-story .story-ledger h2,.industry-story .story-catalogue h2,.industry-story .story-orbit-list h2,.industry-story .story-partner-map h2,.industry-story .story-client-strip h2,.industry-story .story-framework h2,.industry-story .story-service-menu h3,.industry-story .story-contract h3{font-size:1.1rem!important;line-height:1.4;margin:24px 0 12px!important;color:var(--accent)!important;letter-spacing:0}
.story-ledger .service-list,.story-catalogue .service-list,.story-orbit-list .service-list{display:grid;grid-template-columns:1fr 1fr;gap:0 40px}.industry-story .service-list .power-icon{height:22px;width:22px}
.story-catalogue .service-list{grid-template-columns:1fr}.story-catalogue .service-list li{padding:18px 22px;margin-bottom:8px;border:1px solid var(--edge);border-radius:16px;background:var(--panel)}
.story-orbit-list .service-list li{border:0;border-left:1px solid var(--edge);padding:18px 24px}
.story-partner-map .service-list{display:grid;grid-template-columns:1fr 1fr;gap:14px}.story-partner-map .service-list li{padding:25px;border:1px solid var(--edge);border-radius:22px}
.story-client-strip .service-list{display:flex;flex-wrap:wrap;gap:20px 36px}.story-client-strip .service-list li{border:0;font-size:1.5rem!important}
.story-telemetry .value-list,.story-speedometer .value-list{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:24px;list-style:none;padding:0}.story-telemetry .value-list li,.story-speedometer .value-list li{display:flex;flex-direction:column;gap:20px;padding:24px 0;border-top:1px solid var(--edge);border-bottom:0}
.industry-story .story-telemetry .n,.industry-story .story-speedometer .n{font-size:3.5rem!important;line-height:1;width:auto;color:var(--accent)!important;font-family:var(--f-body)}.story-telemetry .value-list div,.story-speedometer .value-list div{font-size:.88rem;color:var(--power-muted);line-height:1.6}
.story-speedometer .value-list{grid-template-columns:1fr 1fr 1fr}.story-speedometer .value-list li{padding:30px 22px;border:1px solid var(--edge);border-radius:50px 50px 20px 20px;background:var(--panel)}.industry-story .story-speedometer .n{font-size:2.4rem!important;white-space:nowrap}
.story-two-columns{display:grid;grid-template-columns:1fr 1fr;gap:42px}.story-contract,.story-service-menu{border-top:1px solid var(--edge)}.story-framework .service-list{display:flex;flex-wrap:wrap;gap:10px}.story-framework .service-list li{border:1px solid var(--edge);border-radius:14px;padding:12px 14px;font-size:.9rem}.story-framework .service-list .power-icon{display:none}
.sector-tags{display:flex;flex-wrap:wrap;gap:14px;max-width:860px;margin:32px 0}.sector-tags span{border:1px solid var(--edge);border-radius:100px;padding:16px 26px;font-size:1.16rem}.sector-tags span:nth-child(3n+1){background:var(--tint);color:#293424}
.industry-story .story-note{max-width:70ch;font-size:.8rem;line-height:1.7;color:var(--power-muted)!important;margin:22px 0}.story-outlink{display:inline-flex;gap:28px;min-height:44px;align-items:center;margin-top:20px;font-size:.9rem}
.industry-story .feature-caption .feature-heading{font-size:1.5rem!important;letter-spacing:-.025em}.story-metrics .stat-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;background:none;border:0;padding:0;margin:36px 0}.story-metrics .stat{padding:30px 20px;border:1px solid var(--edge);border-radius:28px;background:var(--panel)}.story-metrics .stat .num{font:400 clamp(2.5rem,4.5vw,4.5rem)/1.1 var(--f-body);color:var(--accent)}.story-metrics .stat .lbl{color:var(--power-muted);font-size:.87rem;line-height:1.6;margin-top:24px;max-width:24ch}
.industry-story .story-related .related-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}.industry-story .story-related .related-card{padding-top:24px}.industry-story .story-related h3{line-height:1.3}
.theme-power .power-chapter:nth-child(5) .power-pointers{grid-template-columns:repeat(4,minmax(0,1fr))}.theme-power .power-chapter:nth-child(5) .power-pointers>li{display:block}.theme-power .power-chapter:nth-child(5) .power-icon{margin-bottom:20px}.theme-power .power-chapter:nth-child(8) .power-pointers{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:980px){.story-hero{gap:28px;grid-template-columns:1.45fr .8fr}.story-signal{font-size:.82rem}.story-feature{gap:28px}.story-steps,.story-points{gap:20px}.flip-face{padding:24px}.story-speedometer .value-list{gap:12px}.industry-story .story-speedometer .n{font-size:1.9rem!important}}
@media(max-width:720px){
 .industry-story .power-image:after{background:linear-gradient(90deg,rgba(var(--shade),.88),rgba(var(--shade),.7)),linear-gradient(0deg,rgba(var(--shade),.6),transparent)}
 .industry-story .power-chapter h1{font-size:clamp(2.45rem,10.4vw,3.8rem);line-height:1.06;overflow-wrap:normal}
 .story-hero{grid-template-columns:1fr;gap:24px}.story-signal,.hero-canopy .story-signal,.hero-blueprint .story-signal{border:0;border-top:1px solid var(--edge);border-radius:0;padding:15px 0;max-width:100%;display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:center}.story-signal .signal-line{display:none}.story-signal b,.hero-strata .story-signal b{font-size:1.6rem}.story-signal>span{font-size:.75rem;line-height:1.55}.hero-mobility .story-signal{transform:none}
 .story-steps,.story-points,.expertise-grid,.story-feature,.mobility-feature,.story-two-columns{grid-template-columns:1fr;gap:14px}.story-steps{margin-top:20px}.story-steps li{padding:18px 0;gap:18px;flex-direction:row}.step-number{font-size:2rem;min-width:40px}.step-terraces li:nth-child(n){margin-top:0}.step-timeline{padding-left:18px}.step-strata li{padding:20px}.scope-columns li{border-left:0;border-top:1px solid var(--edge);padding-left:0}.scope-columns .step-number{font-size:2rem}
 .industry-story .story-steps p,.industry-story .story-point p{font-size:.92rem}.industry-story .story-steps h3,.industry-story .story-point h3{font-size:1.1rem!important}
 .pointer-rail .story-point>div{display:block}.pointer-rail .story-point{grid-template-columns:32px 1fr}.sourcing-lanes{gap:8px}.storage-cells .story-point{padding:22px;display:flex}.storage-cells .power-icon{margin:0}.platform-stack .story-point:nth-child(n){margin-left:0;padding:18px}
 .flip-face{padding:22px;min-height:270px;gap:14px}.flip-face>strong{font-size:1.3rem}.flip-face>span{font-size:.9rem}.flip-bullet>span{font-size:.85rem}.feature-caption{max-width:none}.feature-caption .power-icon{width:40px;height:40px;margin-bottom:16px}.industry-story .feature-caption p{font-size:.96rem}.ownership-mark{max-width:200px;padding:24px;margin:0 auto 16px}.ownership-mark>span{font-size:3.8rem}.ownership-mark p{font-size:.8rem;margin-top:12px}
 .story-ledger .service-list,.story-orbit-list .service-list,.story-partner-map .service-list{grid-template-columns:1fr}.story-orbit-list .service-list li{padding:14px 18px}.story-partner-map .service-list li{padding:18px}.story-client-strip .service-list{display:block}.story-client-strip .service-list li{font-size:1.3rem!important;border-top:1px solid var(--edge)}
 .story-telemetry .value-list,.story-speedometer .value-list{grid-template-columns:1fr;gap:12px}.story-telemetry .value-list li{display:grid;grid-template-columns:.8fr 1.2fr;gap:18px;align-items:center;padding:18px 0}.industry-story .story-telemetry .n{font-size:2.5rem!important}.story-speedometer .value-list li{flex-direction:row;align-items:center;gap:18px;padding:20px;border-radius:20px}.industry-story .story-speedometer .n{font-size:1.8rem!important;min-width:120px}
 .sector-tags{gap:10px}.sector-tags span{padding:12px 18px;font-size:1rem}.industry-story .story-related .related-grid{grid-template-columns:1fr;gap:0}.industry-story .story-related .related-card{padding:18px 0}
 .story-metrics .stat-row{grid-template-columns:1fr;gap:12px}.story-metrics .stat{padding:22px;display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:center}.story-metrics .stat .lbl{margin-top:0}.story-metrics .stat .num{font-size:2.5rem}
 .theme-power .power-chapter:nth-child(5) .power-pointers,.theme-power .power-chapter:nth-child(8) .power-pointers{grid-template-columns:1fr}.theme-power .power-chapter:nth-child(5) .power-pointers>li{display:flex}
}
@media(prefers-reduced-motion:reduce){.flip-inner{transition:none}.flip-ready .flip-back{transform:none;visibility:hidden}.flip-ready.is-flipped .flip-inner{transform:none}.flip-ready.is-flipped .flip-front{visibility:hidden}.flip-ready.is-flipped .flip-back{visibility:visible}}
@media print{.power-story,.power-screen{height:auto!important;overflow:visible!important;background:#fff!important;color:#111!important}.power-image,.power-toolbar,.power-controls{display:none!important}.power-chapters{position:static!important;padding:0!important;clip-path:none!important}.power-chapter{position:relative!important;left:0!important;top:auto!important;width:100%!important;opacity:1!important;visibility:visible!important;transform:none!important;padding:24px 0!important}.power-reveal{opacity:1!important;transform:none!important}.power-chapter *{color:#111!important}.power-chapter .power-details{display:block}.power-chapter .power-details::details-content{display:block}.expertise-card{break-inside:avoid}.flip-inner{transform:none!important}.flip-face{grid-area:auto!important;transform:none!important;visibility:visible!important;backface-visibility:visible!important;min-height:0;background:#fff!important;border-color:#aaa!important}}


/* September refinement: clear numerals and composed company widgets. */
.industry-story .story-telemetry .n,.industry-story .story-speedometer .n{background:none!important;border:0;border-radius:0;padding:0;box-shadow:none;font-family:var(--f-body);font-style:normal;font-weight:600;letter-spacing:-.035em;font-variant-numeric:lining-nums tabular-nums;color:var(--power-cream)!important;line-height:1.15}
.industry-story .story-speedometer .n{font-size:clamp(2rem,3.2vw,3rem)!important}.industry-story .story-telemetry .n{font-size:clamp(2.8rem,4.2vw,4rem)!important}
.story-speedometer .value-list div,.story-telemetry .value-list div{font-size:1rem;font-weight:500;color:var(--power-cream);line-height:1.6}
.industry-story .story-speedometer>h2,.industry-story .story-telemetry>h2{font-size:1.15rem!important;font-weight:500;letter-spacing:0;margin:24px 0 18px!important}
.company-overview{display:grid;grid-template-columns:1fr 1.45fr;gap:40px;align-items:start}.company-glance{background:linear-gradient(145deg,#e6eee2,#f3eee4);border:1px solid var(--paper-line);border-radius:28px;padding:28px}.company-glance h2{font-size:1.4rem!important;margin-bottom:24px}.company-facts{list-style:none;padding:0;margin:0;display:grid;gap:12px}.company-facts li{padding:18px 20px;background:#f9faf5;border:1px solid #d5dfd0;border-radius:18px;transition:border-color .2s,transform .2s}.company-facts li:hover{transform:translateY(-3px);border-color:#8da085}.company-facts .n{display:block;color:var(--text-steel);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;margin-bottom:10px}.company-facts li>div{font-size:1rem;line-height:1.6;font-weight:500;color:var(--forest)}
.company-widget-stack{display:grid;gap:16px}.company-widget{background:#fafbf6;border:1px solid var(--paper-line);border-radius:24px;overflow:hidden;transition:background .2s,border-color .2s}.company-widget:hover,.company-widget[open]{border-color:#95aa8b;background:#eef3e9}.company-widget summary{padding:24px;display:flex;align-items:center;gap:18px;cursor:pointer;list-style:none}.company-widget summary::-webkit-details-marker,.history-entry summary::-webkit-details-marker{display:none}.company-widget-index{color:var(--amber-deep);font-size:.8rem;font-variant-numeric:tabular-nums}.company-widget summary h2{font-size:1.3rem;line-height:1.35;letter-spacing:-.025em;margin:0;flex:1}.company-plus{font-size:1.4rem;line-height:1;transition:transform .22s;flex-shrink:0;color:var(--forest)}details[open]>summary>.company-plus{transform:rotate(45deg)}.company-widget-body{padding:0 24px 26px 62px}.company-widget .body-l{font-size:1rem;line-height:1.8;margin:0!important}.company-widget summary:focus-visible,.history-entry summary:focus-visible{outline:2px solid var(--forest);outline-offset:-5px;border-radius:20px}
.company-purpose>div{border-radius:28px!important;padding:32px!important;transition:transform .2s,border-color .2s}.company-purpose>div:hover{transform:translateY(-4px);border-color:#96a98a!important}.company-purpose .body-l{font-size:1.12rem;line-height:1.8}.company-purpose>div:last-child{background:#eef3e9!important}
.history-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:36px;align-items:start}.history-entry{background:#fafbf6;border:1px solid var(--paper-line);border-radius:22px;overflow:hidden;transition:background .2s,border-color .2s}.history-entry:hover,.history-entry[open]{background:#e9f0e4;border-color:#94a68a}.history-entry summary{display:flex;align-items:center;gap:20px;padding:24px;list-style:none;cursor:pointer}.history-entry .yr{font-family:var(--f-body);font-size:1.6rem;font-weight:500;color:var(--amber-deep);letter-spacing:-.04em;min-width:64px}.history-title{font-size:1rem;line-height:1.45;flex:1;color:var(--forest);font-weight:500}.history-entry p{margin:0;padding:0 24px 26px 108px;font-size:.96rem;line-height:1.8;color:var(--text-steel)}
@media(max-width:980px){.company-overview{grid-template-columns:1fr;gap:28px}.company-facts{grid-template-columns:1fr 1fr}.history-entry summary{gap:14px;padding:20px}.history-entry p{padding:0 20px 24px}.industry-story .story-speedometer .n{font-size:2rem!important}}
@media(max-width:600px){.company-glance{padding:22px}.company-facts,.history-grid{grid-template-columns:1fr}.company-widget summary{padding:20px;gap:12px}.company-widget summary h2{font-size:1.13rem}.company-widget-body{padding:0 20px 24px}.company-purpose>div{padding:24px!important}.company-purpose .body-l{font-size:1rem}.story-speedometer .value-list li{gap:12px;padding:20px 16px}.industry-story .story-speedometer .n{font-size:1.9rem!important;min-width:125px}.story-speedometer .value-list div,.story-telemetry .value-list div{font-size:.9rem}}
@media(prefers-reduced-motion:reduce){.company-widget,.company-facts li,.company-purpose>div,.history-entry,.company-plus{transition:none}.company-facts li:hover,.company-purpose>div:hover{transform:none}}


/* Connected chronological milestones. */
.company-history .history-grid{position:relative;display:flex;flex-direction:column;gap:24px;padding:12px 0 32px}
.company-history .history-grid::before{content:"";position:absolute;left:50%;top:52px;bottom:0;width:2px;transform:translateX(-50%);background:linear-gradient(#a9b99d,#879e80 65%,#bd987a);pointer-events:none}
.company-history .history-grid::after{content:"";position:absolute;bottom:0;left:50%;width:8px;height:8px;border-right:2px solid #bd987a;border-bottom:2px solid #bd987a;transform:translateX(-50%) rotate(45deg)}
.company-history .history-entry{position:relative;overflow:visible;width:calc(50% - 32px);margin:0}
.company-history .history-entry:nth-child(even){margin-left:calc(50% + 32px)}
.company-history .history-entry::after{content:"";position:absolute;top:41px;right:-32px;width:31px;height:1px;background:#a9b99d;pointer-events:none}
.company-history .history-entry::before{content:"";position:absolute;top:35px;right:-39px;width:12px;height:12px;border:2px solid #91a486;border-radius:50%;background:var(--paper);box-shadow:0 0 0 5px var(--paper);z-index:1;transition:background .2s,border-color .2s;pointer-events:none;box-sizing:border-box}
.company-history .history-entry:nth-child(even)::after{right:auto;left:-32px}
.company-history .history-entry:nth-child(even)::before{right:auto;left:-39px}
.company-history .history-entry[open]::before,.company-history .history-entry:hover::before,.company-history .history-entry:focus-within::before{background:var(--amber-deep);border-color:var(--amber-deep)}
.company-history .history-entry summary{min-height:82px}
@media(max-width:760px){
.company-history .history-grid{gap:20px;padding-left:30px}
.company-history .history-grid::before,.company-history .history-grid::after{left:6px}
.company-history .history-entry,.company-history .history-entry:nth-child(even){width:100%;margin-left:0}
.company-history .history-entry::after,.company-history .history-entry:nth-child(even)::after{right:auto;left:-24px;width:23px}
.company-history .history-entry::before,.company-history .history-entry:nth-child(even)::before{right:auto;left:-31px}
.company-history .history-entry summary{gap:12px;padding:18px 16px}
.company-history .history-entry .yr{font-size:1.35rem;min-width:52px}
.company-history .history-entry p{padding:0 16px 22px}
}
@media(prefers-reduced-motion:reduce){.company-history .history-entry::before{transition:none}}


/* Milestone symbols share the site's outline vocabulary. */
.company-history .history-entry summary{display:grid;grid-template-columns:38px 64px 1fr 16px;gap:14px}
.history-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:#e8eee2;color:var(--forest);transition:background .2s,color .2s}
.history-icon svg{width:23px;height:23px;display:block}
.history-entry[open] .history-icon,.history-entry:hover .history-icon{background:#f0e3d5;color:var(--amber-deep)}
.company-history .history-entry p{padding-left:24px}
@media(max-width:980px){
.company-history .history-entry summary{grid-template-columns:34px 1fr 16px;column-gap:12px;row-gap:2px}
.history-icon{grid-column:1;grid-row:1 / 3;width:34px;height:34px;border-radius:10px}
.company-history .history-entry .yr{grid-column:2;grid-row:1;font-size:1.2rem;line-height:1.4}
.company-history .history-title{grid-column:2;grid-row:2;font-size:.92rem}
.company-history .company-plus{grid-column:3;grid-row:1 / 3}
.company-history .history-entry p{padding-left:16px}
}
@media(prefers-reduced-motion:reduce){.history-icon{transition:none}}


/* Approved group company profiles. */

.group-companies-section{padding:94px 0 100px;background:var(--paper);scroll-margin-top:78px}
.group-section-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:32px}
.group-section-heading .label{color:var(--amber-deep)}
.group-hint{font-size:.78rem;color:var(--text-muted);display:flex;align-items:center;gap:8px}.group-hint svg{width:14px;height:14px}
.group-layout{display:grid;grid-template-columns:.78fr 1.22fr;gap:48px;align-items:start}
.group-intro{position:relative;min-height:525px;padding:36px 32px;border-radius:28px;background:linear-gradient(150deg,#e3eddf,#f1ede3);overflow:hidden}
.group-intro h2{font-weight:500;font-size:clamp(2.3rem,3.7vw,3.25rem);line-height:1.08;letter-spacing:-.045em;margin:0 0 22px;color:var(--forest);position:relative;z-index:1}
.group-intro h2 span{color:var(--amber-deep)}
.group-intro p{font-size:1rem;line-height:1.75;color:var(--text-steel);max-width:32ch;position:relative;z-index:1}
.group-geography{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px;position:relative;z-index:1}.group-geography span{font-size:.77rem;letter-spacing:.03em;padding:8px 12px;border-radius:50px;border:1px solid #c3cfbd;background:#f6f8f080;color:var(--forest)}
.group-orbit{width:300px;height:300px;position:absolute;bottom:-145px;right:-40px;color:#597951;opacity:.25;pointer-events:none}
.group-deck{display:grid;gap:18px}.group-profile{border:1px solid #d5dccc;border-radius:26px;background:#fafbf6;overflow:hidden;transition:border-color .2s,box-shadow .2s}
.group-profile:hover{border-color:#9aaa8f;box-shadow:0 5px 24px #2d49380a}.group-profile[open]{border-color:#a6b79b;background:linear-gradient(150deg,#f8faf4,#f0f4ea)}
.group-profile summary{padding:26px;display:grid;grid-template-columns:44px 1fr 28px;gap:18px;align-items:center;list-style:none;cursor:pointer}.group-profile summary::-webkit-details-marker{display:none}
.group-symbol{width:44px;height:44px;border-radius:14px;background:#e6ecdf;display:grid;place-items:center;color:#41604b;transition:background .2s,color .2s}.group-symbol svg{width:25px;height:25px}.group-profile[open] .group-symbol{background:#eee0d1;color:var(--amber-deep)}
.group-country{display:block;font-size:.68rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--amber-deep);margin-bottom:7px}
.group-company-name{font-size:1.35rem;line-height:1.25;font-weight:500;letter-spacing:-.025em;color:var(--forest);margin:0;display:block}
.group-plus{width:28px;height:28px;border:1px solid #c6d1bc;border-radius:50%;display:grid;place-items:center;color:var(--forest);font-size:1.2rem;line-height:1;transition:transform .22s}
.group-profile[open] .group-plus{transform:rotate(45deg)}
.group-profile summary:focus-visible{outline:2px solid var(--forest);outline-offset:-5px;border-radius:23px}
.group-profile-body{padding:0 26px 26px}.group-profile-body>p{font-size:.98rem;line-height:1.8;color:var(--text-steel);margin:0;padding-top:21px;border-top:1px solid #d7dfcd}
.group-capabilities{padding:0;list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:23px 0 0}.group-capabilities li{display:flex;align-items:flex-start;gap:8px;font-size:.78rem;line-height:1.5;color:var(--forest)}.group-capabilities svg{width:16px;height:16px;flex-shrink:0;margin-top:2px;color:var(--amber-deep)}
.group-record{margin-top:25px;padding-top:16px;border-top:1px solid #d7dfcd;display:flex;justify-content:space-between;gap:16px;font-size:.69rem;line-height:1.5;letter-spacing:.025em;color:#67715f}.group-record span:first-child{font-weight:500;color:var(--forest)}
@media(min-width:981px){.group-intro{position:sticky;top:106px}}
@media(max-width:980px){.group-layout{grid-template-columns:1fr;gap:24px}.group-intro{min-height:0;padding:30px}.group-intro p{max-width:54ch}.group-orbit{right:20px;bottom:-155px}.group-geography{margin-top:22px}.group-companies-section{padding:60px 0}}
@media(max-width:600px){.group-companies-section{padding:45px 0}.group-section-heading{align-items:flex-start;flex-direction:column;gap:12px;margin-bottom:22px}.group-intro{padding:28px 24px}.group-intro h2{font-size:2.6rem}.group-profile summary{padding:22px 18px;grid-template-columns:34px 1fr 24px;gap:12px}.group-symbol{width:34px;height:34px;border-radius:11px}.group-symbol svg{width:22px;height:22px}.group-company-name{font-size:1.1rem}.group-profile-body{padding:0 20px 23px}.group-capabilities{grid-template-columns:1fr;gap:12px}.group-profile-body>p{font-size:.95rem}.group-record{flex-direction:column;gap:6px}.group-plus{width:24px;height:24px}}
@media(prefers-reduced-motion:reduce){.group-profile,.group-symbol,.group-plus{transition:none}}

