/* ══════════════════════════════════════════════════════════
   Amar Prem & Sons — design system
   Anthracite-biased neutrals + a single gold accent taken
   from the company mark. Light body, dark section bands.
   ══════════════════════════════════════════════════════════ */

:root{
  /* ground */
  --carbon:#0B0D0E;
  --anthracite:#1B2124;
  --slate:#39434A;
  --ash:#78838B;
  --screen:#EFF1F2;
  --paper:#FFFFFF;
  --paper-2:#F7F8F9;

  /* ink */
  --ink:#14181B;
  --ink-soft:#5A636B;
  --ink-faint:#697279;
  --ink-invert:#F2F4F5;
  --ink-invert-soft:#A7B0B6;

  /* accent */
  --gold:#C79A33;
  --gold-bright:#D9A93F;
  --gold-deep:#7A5C13;
  --gold-wash:#FBF4E2;

  /* structure */
  --rule:#D8DDE0;
  --rule-soft:#E6EAEC;
  --rule-dark:#2C3438;

  --shadow:0 1px 2px rgba(20,24,27,.05),0 10px 30px -14px rgba(20,24,27,.22);

  --wrap:1200px;
  --gut:28px;
}

*{box-sizing:border-box;}
/* safety net: a stray transform/animation on any element (this or a
   future addition) should never make the whole page scroll sideways */
html,body{overflow-x:hidden;}
html{scroll-behavior:smooth;}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto;}
  *{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;}}

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:"Newsreader",Georgia,"Times New Roman",serif;
  font-size:17.5px;
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

h1,h2,h3,h4,h5{
  font-family:"Archivo","Helvetica Neue",Arial,sans-serif;
  font-weight:700;letter-spacing:-.02em;line-height:1.12;
  margin:0;text-wrap:balance;
}
p{margin:0 0 16px;}
p:last-child{margin-bottom:0;}
strong{font-weight:500;color:var(--ink);}
img{max-width:100%;display:block;}

a{color:var(--gold-deep);text-underline-offset:2px;text-decoration-thickness:1px;}
a:hover{color:var(--ink);}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:2px;}

.mono{font-family:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gut);}
.narrow{max-width:70ch;}

/* eyebrow label ─────────────────────────────── */
.eyebrow{
  font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--gold-deep);margin:0 0 14px;
  display:flex;align-items:center;gap:11px;
}
.eyebrow::after{content:"";flex:1;height:1px;background:currentColor;opacity:.3;}
.on-dark .eyebrow,.band .eyebrow,.hero-slide .eyebrow,.pagehead .eyebrow{color:var(--gold-bright);}

/* ══ header / nav ══════════════════════════════ */
.site-head{
  background:rgba(255,255,255,.92);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  color:var(--ink);
  position:sticky;top:0;z-index:50;border-bottom:1px solid var(--rule);
  box-shadow:0 1px 0 rgba(20,24,27,.03),0 6px 20px -14px rgba(20,24,27,.15);
}
.site-head .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;
  min-height:72px;}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit;flex-shrink:0;}
.brand img{width:38px;height:38px;object-fit:contain;border-radius:3px;}
.brand .bt{font-family:"Archivo",sans-serif;font-weight:700;font-size:17px;
  letter-spacing:-.02em;line-height:1.1;color:var(--ink);}
.brand .bs{font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--gold-deep);margin-top:3px;display:block;}
.brand .btag{font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-faint);margin-top:2px;display:block;}

.nav{display:flex;gap:2px;align-items:center;}
.nav a{
  font-family:"Archivo",sans-serif;font-size:14px;font-weight:500;letter-spacing:-.005em;
  color:var(--ink-soft);text-decoration:none;padding:9px 13px;border-radius:3px;
  transition:color .15s,background .15s;white-space:nowrap;
}
.nav a:hover{color:var(--ink);background:var(--screen);}
.nav a[aria-current="page"]{color:var(--gold-deep);}
.nav-cta{
  font-family:"Archivo",sans-serif;font-size:13.5px;font-weight:600;
  background:var(--carbon);color:var(--ink-invert)!important;padding:10px 16px;border-radius:3px;
  text-decoration:none;white-space:nowrap;transition:background .15s;
}
.nav-cta:hover{background:var(--anthracite);}

.navtoggle{display:none;background:none;border:1px solid var(--rule);color:var(--ink);
  border-radius:3px;padding:8px 11px;font-family:"IBM Plex Mono",monospace;font-size:12px;cursor:pointer;}

/* ══ nav hover preview ═══════════════════════
   Hovering (or keyboard-focusing) a division link shows a photo and
   one-liner instead of an instant plain click — desktop only; touch
   devices just tap through, they have no hover to trigger this. */
.nav-preview{
  position:absolute;top:100%;z-index:49;width:230px;
  background:var(--paper);border:1px solid var(--rule);border-radius:4px;
  box-shadow:0 16px 40px -14px rgba(20,24,27,.28);overflow:hidden;
  opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .18s ease,transform .18s ease,visibility 0s linear .18s;
  pointer-events:none;
}
.nav-preview.is-open{
  opacity:1;visibility:visible;transform:translateY(8px);pointer-events:auto;
  transition:opacity .18s ease,transform .18s ease;
}
.nav-preview img{width:100%;height:120px;object-fit:cover;}
.nav-preview-text{
  display:block;padding:14px 16px 16px;font-family:"Archivo",sans-serif;
  font-size:14px;font-weight:500;color:var(--ink);letter-spacing:-.01em;line-height:1.4;
}
@media(hover:none),(max-width:1000px){.nav-preview{display:none;}}

/* the brand must be allowed to shrink, or it forces the header wider
   than the viewport on small phones */
.brand{min-width:0;}
.brand span{min-width:0;}
.brand .bt{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block;}

@media(max-width:560px){
  :root{--gut:18px;}
  .site-head .wrap{gap:10px;min-height:62px;padding-top:8px;padding-bottom:8px;}
  .brand img{width:30px;height:30px;}
  .brand .bt{font-size:14px;}
  .brand .bs{font-size:8px;letter-spacing:.1em;margin-top:2px;}
  .brand .btag{font-size:7.5px;letter-spacing:.06em;margin-top:1px;}
}

@media(max-width:1000px){
  .nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--paper);
    flex-direction:column;align-items:stretch;padding:10px var(--gut) 20px;gap:2px;
    border-bottom:1px solid var(--rule);box-shadow:0 6px 20px -14px rgba(20,24,27,.2);}
  .nav.open{display:flex;}
  .nav a{padding:12px 4px;font-size:15px;border-bottom:1px solid var(--rule-soft);border-radius:0;}
  .nav-cta{text-align:center;margin-top:10px;border-bottom:0!important;}
  .navtoggle{display:block;}
  .site-head .wrap{position:relative;}
}

/* ══ hero carousel ═════════════════════════════
   One slide per division, cycling like a filmstrip rather than a
   single static banner. Works with zero JS: the first slide carries
   is-active in the markup, so it renders complete and static; the
   carousel script only adds the rotation on top. */
/* fills the viewport below the sticky header so the next section never
   peeks in above the fold — --header-h is measured live by nav.js, since
   the header's actual height changes whenever its content does */
.hero{position:relative;background:var(--carbon);color:var(--ink-invert);
  overflow:hidden;isolation:isolate;min-height:clamp(560px,calc(100vh - var(--header-h, 73px)),780px);}
.hero-slides{position:relative;width:100%;height:100%;min-height:clamp(560px,calc(100vh - var(--header-h, 73px)),780px);}
.hero-slide{
  position:absolute;inset:0;opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity 1s ease,visibility 0s linear 1s;
}
.hero-slide.is-active{opacity:1;visibility:visible;pointer-events:auto;transition:opacity 1s ease;}
.hero-slide canvas{position:absolute;inset:0;width:100%;height:100%;z-index:-2;}
/* oversized + offset so the parallax drift in reveal.js never exposes an edge */
.hero-slide .poster{position:absolute;left:0;right:0;top:-15%;height:130%;width:100%;z-index:-2;
  object-fit:cover;opacity:1;}
.hero-slide::after{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(105deg,rgba(11,13,14,.62) 0%,rgba(11,13,14,.42) 46%,rgba(11,13,14,.16) 100%);
}
.hero-slide .wrap{padding-top:94px;padding-bottom:140px;position:relative;z-index:1;}
.hero h1{font-size:clamp(36px,6vw,66px);letter-spacing:-.035em;max-width:17ch;}
.hero h1 em{font-style:normal;color:var(--gold-bright);}
.hero .sub{font-size:clamp(17px,2vw,20.5px);color:var(--ink-invert-soft);max-width:56ch;margin-top:22px;line-height:1.55;}
.hero-slide .btn{margin-top:34px;}

/* controls — sit above the slides, unaffected by the crossfade */
.hero-controls{position:absolute;left:0;right:0;bottom:0;z-index:2;padding-bottom:26px;}
.hero-controls[hidden]{display:none;}
.hero-controls .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;}
.hero-progress{display:flex;gap:8px;flex:1;max-width:280px;}
.hero-dot{
  flex:1;height:3px;padding:0;border:0;border-radius:2px;cursor:pointer;
  background:rgba(255,255,255,.25);position:relative;overflow:hidden;
}
.hero-dot .fill{position:absolute;inset:0;background:var(--gold-bright);
  transform:scaleX(0);transform-origin:left;}
.hero-dot.is-done .fill{transform:scaleX(1);}
.hero-arrows{display:flex;gap:8px;flex-shrink:0;}
.hero-arrow{
  width:38px;height:38px;border-radius:50%;flex-shrink:0;
  border:1px solid rgba(255,255,255,.3);background:rgba(255,255,255,.06);
  color:var(--ink-invert);display:flex;align-items:center;justify-content:center;
  cursor:pointer;transition:background .15s,border-color .15s;
}
.hero-arrow:hover{background:rgba(255,255,255,.16);border-color:var(--gold);}
@media(max-width:560px){
  .hero-controls{padding-bottom:18px;}
  .hero-progress{max-width:160px;}
}

/* ══ director's message ═══════════════════════
   Photo on a solid colour block, quote on plain paper — two calm
   surfaces next to each other, not a photo with text laid over it. */
.message{display:grid;grid-template-columns:5fr 7fr;min-height:480px;}
.message-photo{position:relative;background:var(--anthracite);overflow:hidden;}
.message-photo img{width:100%;height:100%;object-fit:cover;object-position:center 18%;
  filter:grayscale(.15);}
.message-body{background:var(--paper);display:flex;align-items:center;}
.message-inner{padding:64px var(--gut);max-width:600px;}
.message blockquote{
  margin:22px 0 0;font-family:"Newsreader",serif;font-weight:400;
  font-size:clamp(21px,2.6vw,28px);line-height:1.45;color:var(--ink);
  text-wrap:balance;
}
.message blockquote .qmark{
  font-family:"Archivo",sans-serif;color:var(--gold);font-size:1.4em;
  line-height:0;vertical-align:-.28em;margin-right:2px;
}
/* positioning root for the typewriter cursor — the cursor is placed via
   getBoundingClientRect() math relative to this element, so it must be
   the offset parent, and must not itself reflow while typing runs */
.message blockquote .type-target{position:relative;display:inline;}
.type-cursor{position:absolute;width:2px;background:var(--gold);
  animation:type-blink 0.9s step-end infinite;pointer-events:none;}
@keyframes type-blink{0%,100%{opacity:1;}50%{opacity:0;}}
.message-attr{margin-top:28px;padding-top:20px;border-top:1px solid var(--rule);}
.message-attr .name{font-family:"Archivo",sans-serif;font-weight:700;font-size:17px;letter-spacing:-.015em;}
.message-attr .role{font-family:"IBM Plex Mono",monospace;font-size:11.5px;color:var(--ink-faint);
  letter-spacing:.03em;margin-top:4px;}
.message .btn{margin-top:28px;}
@media(max-width:820px){
  .message{grid-template-columns:1fr;min-height:0;}
  .message-photo{height:340px;}
  .message-inner{padding:44px var(--gut);max-width:none;}
}

.btn{
  font-family:"Archivo",sans-serif;font-size:14.5px;font-weight:600;letter-spacing:-.005em;
  padding:13px 22px;border-radius:3px;text-decoration:none;display:inline-flex;
  align-items:center;gap:8px;border:1px solid transparent;transition:background .15s,border-color .15s,color .15s;
}
.btn-gold{background:var(--gold);color:var(--carbon);}
.btn-gold:hover{background:var(--gold-bright);color:var(--carbon);}
.btn-ghost{border-color:rgba(255,255,255,.28);color:var(--ink-invert);}
.btn-ghost:hover{border-color:var(--gold-bright);color:var(--gold-bright);background:rgba(255,255,255,.04);}
.btn-dark{background:var(--carbon);color:var(--ink-invert);}
.btn-dark:hover{background:var(--anthracite);color:var(--gold-bright);}

/* page header (interior pages) ────────────────── */
.pagehead{background:var(--carbon);color:var(--ink-invert);position:relative;overflow:hidden;}
/* oversized + offset so the parallax drift in reveal.js never exposes an edge */
.pagehead-photo{
  position:absolute;left:0;right:0;top:-15%;height:130%;width:100%;
  background-size:cover;background-position:center;
}
.pagehead::after{
  content:"";position:absolute;inset:0;z-index:0;
  background:linear-gradient(100deg,rgba(11,13,14,.72) 0%,rgba(11,13,14,.48) 44%,rgba(11,13,14,.18) 100%);
}

.pagehead .wrap{position:relative;z-index:1;padding-top:64px;padding-bottom:64px;}
.pagehead h1{font-size:clamp(30px,4.6vw,50px);letter-spacing:-.032em;max-width:20ch;}
.pagehead .sub{color:var(--ink-invert-soft);font-size:clamp(16.5px,1.8vw,19px);max-width:62ch;margin-top:18px;}
.pagehead .entity{
  font-family:"IBM Plex Mono",monospace;font-size:11.5px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--gold-bright);margin-top:16px;
}

/* ══ sections ══════════════════════════════════ */
.sec{padding:74px 0;}
.sec-tight{padding:52px 0;}
.band{background:var(--screen);}
.band-dark{background:var(--carbon);color:var(--ink-invert);}
.band-dark h2,.band-dark h3{color:var(--ink-invert);}
.band-dark p{color:var(--ink-invert-soft);}

.sec-head{margin-bottom:34px;}
.sec-head h2{font-size:clamp(24px,3.3vw,36px);}
.sec-head .lede{color:var(--ink-soft);font-size:18px;margin-top:14px;max-width:64ch;}
.band-dark .sec-head .lede{color:var(--ink-invert-soft);}

/* ══ division cards ════════════════════════════ */
.divisions{display:grid;grid-template-columns:repeat(auto-fit,minmax(268px,1fr));gap:18px;}
.division{
  background:var(--paper);border:1px solid var(--rule);border-radius:4px;
  padding:26px 26px 24px;box-shadow:var(--shadow);display:flex;flex-direction:column;
  border-top:3px solid var(--gold);text-decoration:none;color:inherit;
  transition:transform .18s ease,box-shadow .18s ease;
}
.division:hover{transform:translateY(-3px);box-shadow:0 2px 4px rgba(20,24,27,.06),0 18px 40px -18px rgba(20,24,27,.3);color:inherit;}
.division .sec-label{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--gold-deep);}
.division h3{font-size:22px;margin:11px 0 4px;letter-spacing:-.022em;}
.division .ent{font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--ink-faint);
  letter-spacing:.03em;margin-bottom:13px;}
.division p{font-size:15.5px;color:var(--ink-soft);flex:1;}
.division .more{font-family:"Archivo",sans-serif;font-weight:600;font-size:13.5px;
  color:var(--gold-deep);margin-top:16px;display:inline-flex;align-items:center;gap:7px;}
.division:hover .more{gap:11px;}
.division .more span{transition:transform .18s;}

/* ══ stat strip ════════════════════════════════ */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  gap:1px;background:var(--rule);border:1px solid var(--rule);border-radius:4px;overflow:hidden;}
.stat{background:var(--paper);padding:22px 24px;border-top:2px solid var(--gold);}
.stat .n{font-family:"Archivo",sans-serif;font-weight:700;font-size:34px;letter-spacing:-.035em;
  color:var(--ink);line-height:1;font-variant-numeric:tabular-nums;}
.stat .l{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--ink-faint);margin-top:10px;line-height:1.5;}
.band-dark .stat{background:var(--anthracite);border-top-color:var(--gold);}
.band-dark .stat .n{color:var(--gold-bright);}
.band-dark .stat .l{color:var(--ink-invert-soft);}

/* ══ tables ════════════════════════════════════ */
.tw{overflow-x:auto;border:1px solid var(--rule);border-radius:4px;background:var(--paper);}
table{border-collapse:collapse;width:100%;min-width:460px;font-size:15px;}
caption{
  font-family:"Archivo",sans-serif;font-weight:700;font-size:16px;text-align:left;
  padding:16px 18px 0;letter-spacing:-.015em;
}
th{
  font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;
  color:var(--ink-faint);text-align:left;font-weight:500;padding:12px 18px;
  border-bottom:1px solid var(--rule);background:var(--paper-2);white-space:nowrap;
}
td{padding:11px 18px;border-bottom:1px solid var(--rule-soft);color:var(--ink-soft);vertical-align:top;}
tr:last-child td{border-bottom:0;}
td:first-child{color:var(--ink);font-family:"Archivo",sans-serif;font-size:14.5px;}
td.v{font-family:"IBM Plex Mono",monospace;font-size:13.5px;font-variant-numeric:tabular-nums;white-space:nowrap;}

/* ══ product blocks ════════════════════════════ */
.prod{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:20px;}
.pcard{
  background:var(--paper);border:1px solid var(--rule);border-radius:4px;overflow:hidden;
  display:flex;flex-direction:column;box-shadow:var(--shadow);
}
.pcard img{height:172px;width:100%;object-fit:cover;}
.pcard .pb{padding:20px 22px 22px;flex:1;display:flex;flex-direction:column;}
.pcard h3{font-size:19px;letter-spacing:-.02em;margin-bottom:6px;}
.pcard .kv{font-family:"IBM Plex Mono",monospace;font-size:11.5px;color:var(--gold-deep);
  letter-spacing:.04em;margin-bottom:11px;}
.pcard p{font-size:15px;color:var(--ink-soft);}

/* ══ spec list (assay leaders) ═════════════════ */
.specs{list-style:none;margin:0;padding:0;}
.specs li{display:flex;align-items:baseline;gap:9px;padding:8px 0;border-bottom:1px dotted var(--rule);}
.specs li:last-child{border-bottom:0;}
.specs .dots{flex:1;min-width:16px;border-bottom:1px dotted var(--rule);transform:translateY(-4px);}
.specs .v{font-family:"IBM Plex Mono",monospace;font-size:13.5px;color:var(--ink-soft);
  font-variant-numeric:tabular-nums;white-space:nowrap;}

/* ══ chip / pill lists ═════════════════════════ */
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none;}
.chips li{
  font-family:"IBM Plex Mono",monospace;font-size:12px;letter-spacing:.04em;
  border:1px solid var(--rule);background:var(--paper);border-radius:3px;padding:6px 11px;
  color:var(--ink-soft);
}
.band-dark .chips li{border-color:var(--rule-dark);background:var(--anthracite);color:var(--ink-invert-soft);}
.chips.gold li{border-color:var(--gold);color:var(--gold-deep);background:var(--gold-wash);}

/* ══ generic card ══════════════════════════════ */
.card{background:var(--paper);border:1px solid var(--rule);border-radius:4px;
  padding:26px 28px;box-shadow:var(--shadow);}
.band-dark .card{background:var(--anthracite);border-color:var(--rule-dark);box-shadow:none;}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(258px,1fr));gap:18px;}
.card h3{font-size:18px;margin-bottom:9px;letter-spacing:-.018em;}
.card p{font-size:15.5px;color:var(--ink-soft);}
.band-dark .card p{color:var(--ink-invert-soft);}

/* ══ timeline ══════════════════════════════════
   A gold line traces the group's progress down the spine as you
   scroll (GSAP scrub) and each dot lights up on arrival — the
   "journey" read Adani's timeline pages lean on, scaled down for
   six milestones in one continuous story rather than a multi-era
   history with its own sticky chapter nav. */
.tl-wrap{position:relative;}
.tl{list-style:none;margin:0;padding:0;position:relative;}
.tl::before{content:"";position:absolute;left:74px;top:10px;bottom:10px;width:2px;background:var(--rule);}
.tl-fill{position:absolute;left:74px;top:10px;width:2px;height:0;background:var(--gold);z-index:1;}
.tl li{display:grid;grid-template-columns:74px 1fr;gap:26px;padding:14px 0;position:relative;}
.tl .yr{font-family:"IBM Plex Mono",monospace;font-size:14px;color:var(--ink-faint);
  font-weight:500;font-variant-numeric:tabular-nums;text-align:right;padding-top:2px;
  transition:color .3s ease;}
.tl li.is-active .yr{color:var(--gold-deep);}
.tl .ev{position:relative;padding-left:4px;}
.tl .ev::before{
  content:"";position:absolute;left:-26px;top:11px;width:9px;height:9px;z-index:2;
  border-radius:50%;background:var(--paper);border:2px solid var(--rule);
  transform:translateX(-3.5px);transition:background .3s ease,border-color .3s ease,transform .3s ease;
}
.tl li.is-active .ev::before{background:var(--gold);border-color:var(--gold);transform:translateX(-3.5px) scale(1.2);}
.tl h3{font-size:16.5px;margin-bottom:4px;}
.tl .ev-card{margin-top:8px;background:var(--paper);border:1px solid var(--rule);
  border-radius:4px;padding:14px 16px;box-shadow:var(--shadow);}
.tl p{font-size:15.5px;color:var(--ink-soft);margin:0;}
@media(max-width:560px){
  .tl::before,.tl-fill{left:0;}
  .tl li{grid-template-columns:1fr;gap:4px;padding-left:22px;}
  .tl .yr{text-align:left;}
  .tl .ev::before{left:-22px;}
}

/* ══ people ════════════════════════════════════ */
.people{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:18px;}
.person{background:var(--paper);border:1px solid var(--rule);border-radius:4px;padding:24px 24px 22px;
  box-shadow:var(--shadow);border-top:3px solid var(--gold);}
.person .photo{width:84px;height:84px;border-radius:50%;object-fit:cover;
  object-position:center 25%;margin-bottom:16px;border:1px solid var(--rule);}
.person h3{font-size:18.5px;letter-spacing:-.02em;}
.person .role{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--gold-deep);margin:7px 0 11px;}
.person p{font-size:15px;color:var(--ink-soft);}
.person blockquote{margin:13px 0 0;padding-left:13px;border-left:2px solid var(--gold);
  font-size:15.5px;color:var(--ink-soft);font-style:italic;}

/* ══ client logos ══════════════════════════════ */
.logos{display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr));
  gap:1px;background:var(--rule);border:1px solid var(--rule);border-radius:4px;overflow:hidden;}
.logos div{background:var(--paper);display:flex;align-items:center;justify-content:center;
  padding:26px 22px;min-height:112px;transition:transform .15s ease;}
/* permanent light desaturation, not hover-gated — most buyers are on touch
   devices with no hover state. Also quietly unifies logos that carry their
   own baked-in colour blocks (Wonder Cement, UltraTech, AGL) against the
   transparent ones, until real vector originals replace these archive rips. */
.logos img{max-height:52px;width:auto;object-fit:contain;filter:grayscale(.45);opacity:.94;}
.logos div:hover{transform:translateY(-2px);}
.logos div:hover img{filter:grayscale(0);opacity:1;}

/* ══ network map ═══════════════════════════════ */
.net{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px;}
.netcard{border:1px solid var(--rule-dark);background:var(--anthracite);border-radius:4px;padding:22px 24px;}
.netcard h3{font-size:16px;color:var(--ink-invert);margin-bottom:12px;}
.netcard ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:7px;}
.netcard li{font-size:15px;color:var(--ink-invert-soft);display:flex;align-items:baseline;gap:9px;}
.netcard li::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--gold);flex-shrink:0;}
.netcard li.hq{color:var(--gold-bright);font-weight:500;}

/* ══ contact ═══════════════════════════════════ */
.contact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(268px,1fr));gap:20px;}
.cblock{background:var(--paper);border:1px solid var(--rule);border-radius:4px;padding:26px 28px;
  box-shadow:var(--shadow);}
.cblock h3{font-size:17px;margin-bottom:14px;}
.cblock .row{display:flex;flex-direction:column;gap:3px;padding:11px 0;border-bottom:1px solid var(--rule-soft);}
.cblock .row:last-child{border-bottom:0;padding-bottom:0;}
.cblock .lbl{font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--ink-faint);}
.cblock .val{font-size:16.5px;color:var(--ink);}
.cblock .val a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--gold);}
.cblock .val a:hover{color:var(--gold-deep);}

/* ══ CTA band ══════════════════════════════════ */
.ctaband{background:var(--carbon);color:var(--ink-invert);}
.ctaband .wrap{padding:56px var(--gut);display:flex;justify-content:space-between;
  align-items:center;gap:32px;flex-wrap:wrap;}
.ctaband h2{font-size:clamp(22px,3vw,31px);max-width:22ch;letter-spacing:-.028em;}
.ctaband p{color:var(--ink-invert-soft);margin-top:11px;max-width:48ch;font-size:16.5px;}
.ctaband .btns{display:flex;gap:12px;flex-wrap:wrap;}

/* ══ back to top ═══════════════════════════════ */
.to-top{
  position:fixed;right:24px;bottom:24px;z-index:60;
  width:46px;height:46px;border-radius:50%;
  background:var(--carbon);color:var(--ink-invert);border:1px solid var(--rule-dark);
  display:flex;align-items:center;justify-content:center;cursor:pointer;
  box-shadow:0 6px 20px -6px rgba(20,24,27,.35);
  transition:background .15s,transform .15s,opacity .2s;
}
.to-top:hover{background:var(--anthracite);transform:translateY(-2px);}
.to-top[hidden]{display:none;}
@media(max-width:560px){.to-top{right:16px;bottom:16px;width:42px;height:42px;}}

/* ══ footer ════════════════════════════════════ */
.site-foot{background:var(--anthracite);color:var(--ink-invert-soft);padding:56px 0 0;
  border-top:3px solid var(--gold);}
.foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.3fr;gap:36px;padding-bottom:44px;}
@media(max-width:860px){.foot-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:30px;}}
.site-foot h4{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--gold-bright);font-weight:500;margin-bottom:15px;}
.site-foot ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px;}
.site-foot a{color:var(--ink-invert-soft);text-decoration:none;font-size:15px;}
.site-foot a:hover{color:var(--gold-bright);}
.site-foot .fdesc{font-size:15px;line-height:1.6;max-width:34ch;}
.site-foot .fbrand{font-family:"Archivo",sans-serif;font-weight:700;font-size:18px;
  color:var(--ink-invert);letter-spacing:-.02em;margin-bottom:5px;}
.site-foot .ftag{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--gold-bright);margin-bottom:15px;}
.site-foot address{font-style:normal;font-size:15px;line-height:1.6;}
.foot-base{border-top:1px solid var(--rule-dark);padding:20px 0 28px;
  display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;
  font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.04em;color:var(--ash);}

/* ══ notes / callouts ══════════════════════════ */
.note{background:var(--gold-wash);border:1px solid var(--gold);border-left-width:3px;
  border-radius:3px;padding:18px 22px;}
.note .lbl{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--gold-deep);margin-bottom:7px;}
.note p{font-size:16px;color:var(--ink-soft);}

.grid-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;}
.mt{margin-top:34px;}
.mt-s{margin-top:20px;}
