/* =====================================================================
   PARACAN GROUP — investor site v2 ("the short one")
   Same brand system as v1, distilled.
   1 tokens · 2 base · 3 type · 4 components · 5 sections
   6 motion states (.js only) · 7 responsive · 8 reduced motion
   ===================================================================== */

/* 1 · TOKENS ---------------------------------------------------------- */
:root {
  --bg: #070B14;
  --bg-2: #0B1220;
  --surface: #0F1828;
  --surface-2: #132036;
  --line: rgba(255, 255, 255, .08);
  --line-2: rgba(255, 255, 255, .14);
  --text: #E8EEF2;
  --muted: #8A99A8;
  --muted-2: #BFCAD4;
  --teal: #2FB5B9;
  --teal-2: #5FA8A8;
  --seafoam: #A8D5C8;
  --deep: #0E7C86;
  --green: #7CC6A4;
  --btc: #E9973A;

  --paper: #F4F6F5;
  --paper-2: #E9EEEC;
  --ink: #0B1220;
  --ink-muted: #46576A;
  --ink-line: rgba(11, 18, 32, .12);

  --f-display: 'Poppins', 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --f-body: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --f-mono: 'JetBrains Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;

  --maxw: 1360px;
  --gutter: clamp(16px, 4.2vw, 64px);
  --sec: clamp(64px, 7vw, 112px);
  --nav-h: 72px;
  --r: 12px;
  --r-lg: 18px;
  --r-media: 18px;                                         /* every framed photo, clip and portrait */
  --grade: saturate(1.06) contrast(1.05) brightness(.98);  /* Paracan's own media only — never third-party photos */

  --ease: cubic-bezier(.22, .61, .36, 1);
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --ease-io: cubic-bezier(.65, 0, .35, 1);
}
@media (min-width: 1920px) { :root { --maxw: 1560px; } }

/* 2 · BASE ------------------------------------------------------------ */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; background: var(--bg); }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font: 400 1rem/1.6 var(--f-body);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  overflow-x: clip;
}
img, video, canvas, svg { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
ul, ol { margin: 0; padding: 0; list-style: none; }
h1, h2, h3, h4, p, figure, dl, dd { margin: 0; }
strong { font-weight: 600; color: var(--text); }
::selection { background: rgba(47, 181, 185, .35); color: #fff; }
:focus-visible { outline: 2px solid var(--teal); outline-offset: 3px; border-radius: 4px; }
[tabindex="-1"]:focus { outline: none; }
.sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.wrap { width: 100%; max-width: var(--maxw); margin-inline: auto; padding-inline: var(--gutter); }
.mono { font-family: var(--f-mono); }
section[id] { scroll-margin-top: 0; }

.skip-link {
  position: fixed; left: 16px; top: 12px; z-index: 200;
  padding: 10px 16px; background: var(--teal); color: var(--bg); font-weight: 600; border-radius: 8px;
  transform: translateY(-160%); transition: transform .25s var(--ease);
}
.skip-link:focus { transform: none; }

/* Light sections */
.light { background: var(--paper); color: var(--ink); }
.light strong { color: var(--ink); }
.light ::selection { background: rgba(14, 124, 134, .25); color: var(--ink); }
.light :focus-visible { outline-color: var(--deep); }

/* 3 · TYPE ------------------------------------------------------------ */
.display {
  font: 600 clamp(2.6rem, 5.8vw, 6rem)/1.04 var(--f-display);
  letter-spacing: -.04em;
  text-wrap: balance;
}
.display--md { font-size: clamp(2.4rem, 4.6vw, 4.6rem); }
.h2 {
  font: 600 clamp(2rem, 3.7vw, 3.6rem)/1.08 var(--f-display);
  letter-spacing: -.032em;
  text-wrap: balance;
  max-width: 18ch;
}
.lead { font-size: clamp(1.02rem, 1.2vw, 1.15rem); line-height: 1.6; color: var(--muted-2); max-width: 52ch; }
.light .lead { color: var(--ink-muted); }
.fine { font-size: .875rem; line-height: 1.55; color: var(--muted); max-width: 92ch; }
.eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  font: 500 .75rem/1.4 var(--f-mono);
  letter-spacing: .16em; text-transform: uppercase;
  color: var(--seafoam);
  margin-bottom: 20px;
}
.eyebrow .dot { width: 7px; height: 7px; background: var(--teal); flex: none; box-shadow: 9px 0 0 rgba(47, 181, 185, .35); margin-right: 9px; }
.eyebrow--green { color: #BFE6D2; }
.eyebrow--green .dot { background: var(--green); box-shadow: 9px 0 0 rgba(124, 198, 164, .35); }
.light .eyebrow { color: var(--deep); }
.light .eyebrow .dot { background: var(--deep); box-shadow: 9px 0 0 rgba(14, 124, 134, .3); }

/* 4 · COMPONENTS ------------------------------------------------------ */
/* Buttons */
.btn {
  --bh: 52px;
  position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 12px;
  min-height: var(--bh); padding: 0 26px;
  font: 600 .9375rem/1 var(--f-body); letter-spacing: .005em;
  border-radius: 999px; white-space: nowrap;
  transition: background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease), box-shadow .3s var(--ease), transform .3s var(--ease-out);
}
.btn span { position: relative; }
.btn--sm { --bh: 42px; padding: 0 20px; font-size: .875rem; }
.btn--block { width: 100%; }
.btn--primary { background: var(--teal); color: #04121A; }
.btn--primary:hover { background: #45C6C9; box-shadow: 0 10px 40px -10px rgba(47, 181, 185, .65); transform: translateY(-1px); }
.btn--ghost { border: 1px solid rgba(255, 255, 255, .3); color: var(--text); background: rgba(7, 11, 20, .25); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.btn--ghost:hover { border-color: var(--seafoam); background: rgba(168, 213, 200, .08); }
.btn__arrow { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: transform .35s var(--ease-out); }
.btn:hover .btn__arrow { transform: translateX(4px); }

/* Photography: one radius, one grade, one hairline for every framed image and clip.
   Overlays only. Paracan's own media also gets var(--grade); third-party photographs are only cropped and overlaid. */
.tile, .tl--img figure, .contact__photo, .person__photo { border-radius: var(--r-media); }
.tile::after, .tl--img figure::after, .contact__photo::after {
  content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none; border-radius: inherit;
  background:
    radial-gradient(ellipse 120% 100% at 50% 42%, rgba(7, 11, 20, 0) 56%, rgba(7, 11, 20, .32) 100%),
    linear-gradient(180deg, rgba(14, 124, 134, .08) 0%, rgba(7, 11, 20, 0) 42%, rgba(7, 11, 20, .16) 100%);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .07);
}
.light .tl--img figure::after { box-shadow: inset 0 0 0 1px rgba(11, 18, 32, .07); }


/* Pixel icon (4×4) */
.picon { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2px; width: 28px; height: 28px; flex: none; }
.picon i { background: rgba(255, 255, 255, .1); border-radius: 1px; }
.picon i.on { background: var(--teal); }
.picon--green i.on { background: var(--green); }

/* Chips */
.chip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 11px; border-radius: 999px; font: 500 .72rem/1.4 var(--f-mono); letter-spacing: .04em; border: 1px solid currentColor; color: var(--deep); }
.chip::before { content: ''; width: 5px; height: 5px; background: currentColor; }
.chip--btc { color: #A15A12; }

.section-head { margin-bottom: clamp(36px, 4.6vw, 64px); }
.section-head--split { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: clamp(24px, 5vw, 96px); align-items: end; }

/* 5 · SECTIONS -------------------------------------------------------- */

/* Nav */
.nav {
  position: fixed; inset: 0 0 auto 0; z-index: 60; height: var(--nav-h);
  transition: transform .5s var(--ease-out), background-color .4s var(--ease), border-color .4s var(--ease);
  border-bottom: 1px solid transparent;
}
.nav.is-scrolled { background: rgba(7, 11, 20, .86); -webkit-backdrop-filter: blur(16px) saturate(150%); backdrop-filter: blur(16px) saturate(150%); border-bottom-color: var(--line); }
.nav.is-hidden { transform: translateY(calc(-100% + 2px)); }
.nav__inner { max-width: var(--maxw); margin-inline: auto; height: 100%; padding-inline: var(--gutter); display: flex; align-items: center; gap: 24px; }
.nav__logo { display: inline-flex; align-items: center; gap: 12px; margin-right: auto; color: #fff; min-height: 44px; }
.nav__mark { width: 24px; height: auto; overflow: visible; }
.nav__mark rect { transform-box: fill-box; transform-origin: center; transition: transform .45s var(--ease-out); transition-delay: calc(var(--d) * 35ms); }
.nav__logo:hover .nav__mark rect { transform: scale(.72); }
.js .nav__mark rect { animation: markIn .7s var(--ease-out) both; animation-delay: calc(var(--d) * 70ms + 80ms); }
@keyframes markIn { from { opacity: 0; transform: scale(.2); } to { opacity: 1; transform: none; } }
.nav__word { font: 600 1.0625rem/1 var(--f-display); letter-spacing: .14em; }
.nav__word span { color: var(--teal-2); }
.nav__links ul { display: flex; gap: clamp(18px, 2vw, 32px); }
.nav__links a { position: relative; display: block; padding: 8px 0; font-size: .875rem; font-weight: 500; color: var(--muted-2); transition: color .25s; }
.nav__links a::after { content: ''; position: absolute; left: 50%; bottom: 0; width: 5px; height: 5px; margin-left: -2.5px; background: var(--teal); transform: scale(0); transition: transform .35s var(--ease-out); }
.nav__links a:hover, .nav__links a.is-active { color: var(--text); }
.nav__links a.is-active::after { transform: scale(1); }
.nav__cta { margin-left: 8px; }
.nav__progress { position: absolute; left: 0; right: 0; bottom: 0; height: 2px; pointer-events: none; }
.nav__progress span { display: block; height: 100%; background: linear-gradient(90deg, var(--deep), var(--teal), var(--seafoam)); transform-origin: left; transform: scaleX(0); }
.nav__burger { display: none; width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--line-2); position: relative; }
.nav__burger span { position: absolute; left: 13px; right: 13px; height: 1.5px; background: var(--text); transition: transform .35s var(--ease-out), top .35s var(--ease-out); }
.nav__burger span:first-child { top: 17px; }
.nav__burger span:last-child { top: 25px; }
.nav__burger[aria-expanded="true"] span:first-child { top: 21px; transform: rotate(45deg); }
.nav__burger[aria-expanded="true"] span:last-child { top: 21px; transform: rotate(-45deg); }
.nav__nojs { display: none; }
html:not(.js) .nav { background: rgba(7, 11, 20, .94); border-bottom-color: var(--line); }
.menu-open .nav { background: #070B14; border-bottom-color: var(--line); }

/* Mobile menu */
.menu { position: fixed; inset: 0; z-index: 55; background: rgba(7, 11, 20, .97); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); overflow-y: auto; overscroll-behavior: contain; }
.menu[hidden] { display: none; }
.menu__inner { min-height: 100%; padding: calc(var(--nav-h) + 24px) var(--gutter) 40px; display: flex; flex-direction: column; gap: 28px; }
.menu ol { display: grid; gap: 2px; }
.menu ol a { display: flex; align-items: baseline; gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--line); font: 500 clamp(1.6rem, 7vw, 2.2rem)/1.1 var(--f-display); letter-spacing: -.02em; }
.menu ol small { font: 400 11px/1 var(--f-mono); color: var(--teal); letter-spacing: .1em; }
.menu__meta { font-size: 12.5px; color: var(--muted); }
.js .menu.is-open ol li { animation: menuIn .6s var(--ease-out) both; }
.js .menu.is-open ol li:nth-child(2) { animation-delay: .04s; } .js .menu.is-open ol li:nth-child(3) { animation-delay: .08s; }
.js .menu.is-open ol li:nth-child(4) { animation-delay: .12s; } .js .menu.is-open ol li:nth-child(5) { animation-delay: .16s; }
@keyframes menuIn { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }

/* Hero */
.hero { position: relative; min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column; justify-content: flex-end; overflow: hidden; isolation: isolate; background: var(--bg); }
.hero__media { position: absolute; inset: 0; z-index: -1; }
html:not(.js) .hero__media { background: url('../assets/video/hero-hall-pro-poster.jpg') 50% 55% / cover no-repeat; }
.hero__video { width: 100%; height: 100%; object-fit: cover; object-position: 50% 55%; transform: scale(1.03); }
.hero__shade {
  position: absolute; inset: 0;
  background:
    linear-gradient(180deg, rgba(7, 11, 20, .72) 0%, rgba(7, 11, 20, .12) 24%, rgba(7, 11, 20, .28) 52%, rgba(7, 11, 20, .9) 84%, var(--bg) 100%),
    linear-gradient(90deg, rgba(7, 11, 20, .84) 0%, rgba(7, 11, 20, .54) 40%, rgba(7, 11, 20, .14) 60%, rgba(7, 11, 20, 0) 74%),
    radial-gradient(ellipse 130% 110% at 62% 40%, rgba(7, 11, 20, 0) 58%, rgba(7, 11, 20, .4) 100%);
}
.hero__pixels { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; mix-blend-mode: screen; }
.hero__content { position: relative; padding-top: calc(var(--nav-h) + 6vh); padding-bottom: clamp(24px, 3.4vh, 40px); }
.hero__eyebrow { margin-bottom: clamp(16px, 2.4vh, 26px); }
.hero__title {
  font: 600 clamp(3rem, 6.5vw, 7.2rem)/.98 var(--f-display);
  letter-spacing: -.045em;
  margin-bottom: clamp(20px, 2.8vh, 32px);
}
.hero__title .w { display: block; width: fit-content; }
.hero__title .w:last-child > span { background: linear-gradient(100deg, #6FD3D6 0%, var(--seafoam) 45%, var(--green) 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hero__lead { max-width: 48ch; font-size: clamp(1.02rem, 1.25vw, 1.2rem); line-height: 1.6; color: rgba(232, 238, 242, .88); margin-bottom: clamp(22px, 3.2vh, 34px); }
.hero__ctas { display: flex; flex-wrap: wrap; gap: 12px; }
@media (min-width: 1920px) { .hero__content { padding-bottom: clamp(32px, 5vh, 72px); } }
.hero__kpis { position: relative; border-top: 1px solid var(--line-2); background: rgba(7, 11, 20, .55); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.hkpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.hkpi { display: flex; flex-direction: column-reverse; justify-content: flex-end; gap: 8px; padding: 20px 22px 24px; border-left: 1px solid var(--line); }
.hkpi:first-child { border-left: 0; padding-left: 0; }
.hkpi dt { font: 500 .6875rem/1.4 var(--f-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--muted-2); }
.hkpi dd { display: flex; align-items: baseline; gap: 4px; font: 500 clamp(2rem, 3.2vw, 3.1rem)/1 var(--f-display); letter-spacing: -.04em; font-variant-numeric: tabular-nums; color: #fff; }
.hkpi dd small { font-size: .46em; letter-spacing: 0; color: var(--seafoam); }
.hkpi--green dd small { color: var(--green); }

/* Platform (light) */
.platform { padding: var(--sec) 0; }
.platform__top { margin-bottom: clamp(36px, 4.4vw, 60px); }
.statement { font: 500 clamp(1.7rem, 3vw, 2.9rem)/1.16 var(--f-display); letter-spacing: -.026em; max-width: 27ch; color: var(--ink); text-wrap: pretty; }
.statement em { font-style: normal; color: var(--deep); }
.lines { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--ink-line); }
.line { display: flex; flex-direction: column; gap: 10px; padding: 26px 26px 28px; transition: background .4s var(--ease); }
.line:first-child { padding-left: 0; }
.line + .line { border-left: 1px solid var(--ink-line); }
.line:hover { background: rgba(14, 124, 134, .04); }
.line__idx { font-size: .75rem; color: var(--deep); letter-spacing: .1em; }
.line h3 { font: 600 1.3rem/1.2 var(--f-display); letter-spacing: -.015em; }
.line p:not(.line__idx):not(.line__earn) { color: var(--ink-muted); font-size: .9375rem; line-height: 1.55; }
.line__earn { margin-top: auto; padding-top: 8px; }
.platform__note { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 14px; margin-top: 8px; padding-top: 22px; border-top: 1px solid var(--ink-line); font: 500 clamp(1.1rem, 1.45vw, 1.35rem)/1.3 var(--f-display); letter-spacing: -.012em; color: var(--ink-muted); }
.platform__note strong { font-size: 1.55em; font-weight: 600; letter-spacing: -.035em; color: var(--deep); }

/* Footprint: dot-matrix world map + AI blueprint */
.footprint {
  position: relative; padding: var(--sec) 0; isolation: isolate;
  background:
    radial-gradient(ellipse 70% 55% at 50% 52%, rgba(19, 32, 54, .85) 0%, rgba(11, 18, 32, .55) 45%, rgba(7, 11, 20, 0) 78%),
    var(--bg);
}
.footprint::after { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: radial-gradient(ellipse at 50% 50%, transparent 55%, rgba(4, 7, 13, .55) 100%); }
.footprint__head { margin-bottom: clamp(20px, 2.6vw, 36px); }
.footprint__head .lead { max-width: 46ch; }
.map { position: relative; width: 100%; aspect-ratio: 2.27 / 1; margin-inline: auto; }
/* The dot field fades into the navy at its edges (no ruler-straight Arctic row, no hard cut through Russia). */
.map__canvas {
  width: 100%; height: 100%;
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 17%, #000 90%, transparent 100%), linear-gradient(90deg, transparent 0%, #000 7%, #000 92%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(180deg, transparent 0%, #000 17%, #000 90%, transparent 100%), linear-gradient(90deg, transparent 0%, #000 7%, #000 92%, transparent 100%);
  mask-composite: intersect;
}
.map__labels { position: absolute; inset: 0; pointer-events: none; }
.map__label {
  position: absolute; left: 0; top: 0;
  font: 500 clamp(10.5px, .6vw, 13px)/1.3 var(--f-mono); letter-spacing: .06em; text-transform: uppercase; color: var(--text);
  white-space: nowrap; padding: 5px 8px; border-radius: 4px; background: rgba(7, 11, 20, .8); border: 1px solid var(--line-2);
  opacity: 0; transition: opacity .7s var(--ease);
}
.map__label.is-on { opacity: 1; }
.map__label b { color: var(--teal); font-weight: 500; }
.map__label--dim { color: var(--muted-2); border-style: dashed; }
.map__label--latam { color: #CFEBDD; border-color: rgba(124, 198, 164, .4); background: rgba(6, 20, 18, .8); }
.map__label--latam b { color: var(--green); }
.map--compact .map__label { font-size: 9px; letter-spacing: .04em; padding: 4px 6px; }
html:not(.js) .map, .map.no-data { display: none; }
.footprint__foot { display: grid; gap: clamp(28px, 3.4vw, 48px); margin-top: clamp(16px, 2vw, 28px); }
.places { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 24px; border-top: 1px solid var(--line-2); }
.places li { display: grid; grid-template-columns: 14px minmax(0, 1fr); column-gap: 12px; align-content: start; padding: 18px 0 0; }
.places__px { width: 8px; height: 8px; margin-top: 7px; background: var(--teal); grid-row: span 2; }
.places__px--et { background: #5FC8BE; }
.places__px--latam { background: rgba(124, 198, 164, .55); box-shadow: 0 0 0 3px rgba(124, 198, 164, .16); }
.places__px--dim { background: transparent; border: 1.5px dashed var(--muted-2); }
.places strong { font-weight: 600; font-size: .9375rem; }
.places span:not(.places__px) { color: var(--muted-2); font-size: .875rem; line-height: 1.5; }
.blueprint {
  position: relative; padding: clamp(24px, 2.6vw, 34px); border-radius: var(--r-lg); overflow: hidden;
  background: radial-gradient(ellipse at 100% 0%, rgba(124, 198, 164, .16), transparent 62%), linear-gradient(160deg, rgba(14, 124, 134, .2), rgba(15, 24, 40, .9) 58%);
  border: 1px solid rgba(124, 198, 164, .28);
}
.blueprint { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr); gap: 20px clamp(32px, 5vw, 80px); align-items: start; }
.blueprint__k { margin-bottom: 14px; }
.blueprint__title { font: 600 clamp(1.6rem, 2.5vw, 2.4rem)/1.1 var(--f-display); letter-spacing: -.03em; max-width: 19ch; text-wrap: balance; }
.blueprint__body { color: var(--muted-2); font-size: 1rem; line-height: 1.6; max-width: 56ch; }
.blueprint__main { padding-top: 4px; }
.blueprint__pillars { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 20px; padding-top: 18px; border-top: 1px solid rgba(124, 198, 164, .2); }
.blueprint__pillars li { display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 10px; align-items: start; font: 600 .9375rem/1.3 var(--f-display); letter-spacing: -.005em; }
.blueprint__pillars .picon { width: 20px; height: 20px; gap: 1.5px; margin-top: 1px; }
.blueprint__pillars small { display: block; margin-top: 4px; font: 500 .6875rem/1.3 var(--f-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--green); }

/* Infrastructure: full-bleed "Built, not contracted." opener, then the compact MW grid */
.infra { padding: 0 0 var(--sec); background: var(--bg); }
.opener { position: relative; height: clamp(560px, 86vh, 900px); display: flex; flex-direction: column; justify-content: flex-end; overflow: hidden; isolation: isolate; background: var(--bg-2); }
.opener__media { position: absolute; inset: 0; z-index: -2; overflow: hidden; }
.opener__media video, .opener__media img { position: absolute; left: 0; top: -8%; width: 100%; height: 116%; max-width: none; object-fit: cover; object-position: 50% 50%; }
.opener__shade {
  position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(180deg, var(--bg) 0%, rgba(7, 11, 20, .35) 14%, rgba(7, 11, 20, 0) 34%, rgba(7, 11, 20, .3) 58%, rgba(7, 11, 20, .9) 90%, var(--bg) 100%),
    linear-gradient(90deg, rgba(7, 11, 20, .78) 0%, rgba(7, 11, 20, .44) 34%, rgba(7, 11, 20, .12) 54%, rgba(7, 11, 20, 0) 68%),
    radial-gradient(ellipse 130% 110% at 60% 45%, rgba(7, 11, 20, 0) 58%, rgba(7, 11, 20, .42) 100%);
}
.opener__media video { filter: var(--grade); }
.opener__content { padding-bottom: clamp(56px, 9vh, 104px); }
.opener__content .display { font-size: clamp(3rem, 7.4vw, 7.6rem); line-height: .98; max-width: 12ch; margin-bottom: 22px; }
.opener__lead { max-width: 50ch; font-size: clamp(1.05rem, 1.35vw, 1.3rem); line-height: 1.55; color: rgba(232, 238, 242, .9); }
.infra__body { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(14px, 1.6vw, 24px); align-items: stretch; margin-top: clamp(8px, 1vw, 16px); }
.sitecards { display: grid; grid-template-columns: minmax(0, 1fr); grid-auto-rows: 1fr; gap: 12px; }
.sitecard { display: flex; flex-direction: column; padding: 22px 22px 22px; border-radius: var(--r-lg); background: var(--surface); border: 1px solid var(--line); transition: border-color .4s var(--ease), transform .5s var(--ease-out); }
.sitecard:hover { border-color: rgba(47, 181, 185, .4); transform: translateY(-3px); }
.sitecard__k { font-size: .6875rem; letter-spacing: .1em; text-transform: uppercase; color: var(--seafoam); }
.sitecard__k { display: flex; align-items: center; gap: 10px; }
.sitecard__px { width: 9px; height: 9px; border-radius: 2px; background: var(--teal); flex: none; }
.sitecard--et .sitecard__px { background: var(--seafoam); }
.sitecard__title { margin: 14px 0 10px; font: 600 clamp(1.25rem, 1.7vw, 1.6rem)/1.2 var(--f-display); letter-spacing: -.02em; color: #fff; text-wrap: balance; }
.sitecard__body { margin-bottom: 18px; font-size: .9375rem; line-height: 1.5; color: var(--muted-2); text-wrap: pretty; }
.sitecard__meta { margin-top: auto; padding-top: 12px; border-top: 1px solid var(--line); font-size: .9375rem; line-height: 1.45; color: var(--muted-2); }

.mwp { position: relative; padding: clamp(24px, 3vw, 40px); border-radius: var(--r-lg); background: radial-gradient(ellipse at 100% 0%, rgba(47, 181, 185, .16), transparent 60%), var(--surface); border: 1px solid var(--line); }
.mwp__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; margin-bottom: clamp(24px, 3vw, 36px); }
.mwp__count { display: flex; align-items: baseline; gap: 12px; }
.mwp__num { font: 600 clamp(4rem, 7vw, 6.6rem)/.86 var(--f-display); letter-spacing: -.05em; font-variant-numeric: tabular-nums; color: #fff; }
.mwp__unit { font: 500 clamp(1.1rem, 1.6vw, 1.5rem)/1 var(--f-display); color: var(--seafoam); }
.mwp__label { font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.mwp__blocks { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(16px, 2vw, 28px); align-items: start; }
.mwp__bhead { display: flex; justify-content: space-between; gap: 8px; font: 500 .6875rem/1.3 var(--f-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--muted-2); padding-bottom: 9px; margin-bottom: 12px; border-bottom: 1px solid var(--line); align-items: flex-end; white-space: nowrap; }
.mwp__bhead .mono { color: #fff; }
.mwp__cells { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 5px; }
.mwp__cells i { aspect-ratio: 1; border-radius: 3px; background: var(--teal); }
.mwp__block--et i { background: var(--seafoam); }
.mwp__block--tp i { background: rgba(47, 181, 185, .28); border: 1.5px solid rgba(47, 181, 185, .7); }
.mwp__foot { margin-top: clamp(22px, 3vw, 32px); padding-top: 18px; border-top: 1px solid var(--line); }
.mwp__avail { display: block; position: relative; padding-left: 26px; font-size: .9375rem; line-height: 1.5; color: var(--muted-2); }
.mwp__avail strong { color: #fff; font-weight: 600; }
.mwp__avail i { position: absolute; left: 0; top: .3em; width: 13px; height: 13px; border-radius: 2px; border: 1.5px solid var(--teal); background: rgba(47, 181, 185, .12); animation: avail 2.6s var(--ease-io) infinite; }
@keyframes avail { 0%, 100% { box-shadow: 0 0 0 0 rgba(47, 181, 185, 0); } 50% { box-shadow: 0 0 12px 1px rgba(47, 181, 185, .5); } }

/* Gallery strip: one landscape clip, two portrait frames close to their native 3:4, so nothing is cropped hard */
.strip { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr); gap: clamp(12px, 1.2vw, 18px); margin-top: clamp(40px, 5vw, 64px); height: clamp(320px, 30vw, 460px); }
.tile { position: relative; overflow: hidden; background: var(--bg-2); isolation: isolate; }
.tile video, .tile img { width: 100%; height: 100%; object-fit: cover; filter: var(--grade); transition: transform 1.4s var(--ease-out); }
.tile--walk video { object-position: 50% 45%; }
.tile--racks img { object-position: 50% 42%; }
.tile--et video { position: absolute; left: -1.5%; top: -1.5%; width: 103%; height: 103%; max-width: none; object-position: 50% 55%; filter: brightness(.88) contrast(1.08) saturate(.92); }   /* hazy drone footage: tamed, not recoloured; oversized a touch to hide the encode's dark edge column */

/* Energy */
.energy { background: var(--bg); padding-bottom: var(--sec); }
.energy__hero { position: relative; min-height: clamp(640px, 90vh, 880px); display: flex; flex-direction: column; justify-content: space-between; overflow: hidden; isolation: isolate; background: var(--bg-2); }
.energy__media { position: absolute; inset: 0; z-index: -2; overflow: hidden; }
.energy__media img { position: absolute; left: 0; top: -8%; width: 100%; height: 116%; max-width: none; object-fit: cover; object-position: 50% 62%; }
.energy__shade {
  position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(180deg, rgba(7, 11, 20, .9) 0%, rgba(7, 11, 20, .62) 26%, rgba(7, 11, 20, .08) 52%, rgba(7, 11, 20, .1) 66%, rgba(7, 11, 20, .78) 86%, var(--bg) 100%),
    linear-gradient(90deg, rgba(7, 11, 20, .7) 0%, rgba(7, 11, 20, .45) 38%, rgba(7, 11, 20, 0) 62%),
    radial-gradient(ellipse 130% 110% at 60% 50%, rgba(7, 11, 20, 0) 58%, rgba(7, 11, 20, .4) 100%);
}
.energy__content { padding-top: calc(var(--sec) + 8px); }
.energy__content .display { max-width: 17ch; margin-bottom: 18px; }
.energy__lead { color: rgba(232, 238, 242, .9); max-width: 44ch; }
.energy__statswrap { padding-bottom: clamp(28px, 4vh, 44px); }
.estats { display: grid; grid-template-columns: repeat(3, minmax(0, .8fr)) minmax(0, 1.25fr); border-top: 1px solid rgba(255, 255, 255, .22); }
.estat { display: flex; flex-direction: column-reverse; justify-content: flex-end; gap: 8px; padding: 20px 22px 0; border-left: 1px solid rgba(255, 255, 255, .12); }
.estat:first-child { padding-left: 0; border-left: 0; }
.estat dt { font: 500 .6875rem/1.4 var(--f-mono); letter-spacing: .12em; text-transform: uppercase; color: rgba(232, 238, 242, .8); }
.estat dd { font: 500 clamp(1.9rem, 3vw, 2.9rem)/1 var(--f-display); letter-spacing: -.035em; color: #fff; font-variant-numeric: tabular-nums; display: flex; align-items: baseline; flex-wrap: wrap; gap: 2px 6px; }
.estat dd small { font: 500 .42em/1.3 var(--f-display); letter-spacing: 0; color: var(--seafoam); }
.estat--green dd small { color: var(--green); }
.estat__q { display: block; margin-top: 3px; color: rgba(232, 238, 242, .62); letter-spacing: .06em; }

.energy__more { padding-top: clamp(40px, 5vw, 64px); }

/* From river to rack: energy-flow diagram */
.flow { position: relative; margin-bottom: clamp(40px, 4.6vw, 64px); padding: clamp(24px, 3.2vw, 44px) clamp(20px, 3.2vw, 48px) clamp(20px, 2.4vw, 32px); border-radius: var(--r-lg); border: 1px solid rgba(124, 198, 164, .2); overflow: hidden; isolation: isolate;
  background:
    radial-gradient(ellipse 60% 80% at 0% 100%, rgba(124, 198, 164, .1), transparent 70%),
    radial-gradient(ellipse 60% 80% at 100% 0%, rgba(47, 181, 185, .1), transparent 70%),
    var(--bg-2);
}
.flow::before { content: ''; position: absolute; inset: 0; z-index: -1; opacity: .5; background-image: radial-gradient(rgba(168, 213, 200, .14) 1px, transparent 1.2px); background-size: 22px 22px; -webkit-mask-image: linear-gradient(180deg, transparent, #000 40%, #000 70%, transparent); mask-image: linear-gradient(180deg, transparent, #000 40%, #000 70%, transparent); }
.flow__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px 24px; flex-wrap: wrap; margin-bottom: clamp(8px, 1.4vw, 20px); }
.flow__head .eyebrow { margin-bottom: 12px; }
.flow__title { font: 600 clamp(1.5rem, 2.3vw, 2.2rem)/1.12 var(--f-display); letter-spacing: -.028em; text-wrap: balance; }
.flow__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.flow__chips li { display: inline-flex; align-items: center; gap: 8px; padding: 7px 12px; border-radius: 999px; border: 1px solid rgba(124, 198, 164, .3); background: rgba(7, 11, 20, .5); font: 500 .72rem/1 var(--f-mono); letter-spacing: .04em; color: #CFEBDD; }
.flow__chips li::before { content: ''; width: 6px; height: 6px; background: var(--green); }
.flow__svg { width: 100%; height: auto; overflow: visible; }
.flow__svg--h { max-height: 300px; }
.flow__svg--v { display: none; max-width: 360px; margin: 8px 0 0; }
.flow__track { fill: none; stroke: rgba(255, 255, 255, .12); stroke-width: 2; stroke-dasharray: 2 7; }
.flow__path { fill: none; stroke: url(#flowGrad); stroke-width: 3; stroke-linecap: round; }
.flow__path--v { stroke: url(#flowGradV); }
.flow__halo { fill: var(--bg-2); }
.flow__box { fill: #0A111D; stroke: rgba(124, 198, 164, .45); stroke-width: 1.5; }
.flow__box--dc { stroke: rgba(47, 181, 185, .75); }
.flow__ico { fill: none; stroke: var(--seafoam); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.flow__ico--water { stroke: var(--green); }
.flow__ico--grid { stroke: none; }
.flow__ico--grid rect { fill: var(--teal); opacity: .85; }
.flow__ico--grid rect:nth-child(4n+1) { opacity: 1; }
.flow__ico--grid rect:nth-child(4n) { opacity: .55; }
.flow__t { fill: var(--text); font: 600 19px var(--f-display); letter-spacing: -.01em; text-anchor: middle; }
.flow__s { fill: var(--muted-2); font: 500 12.5px var(--f-mono); text-anchor: middle; letter-spacing: .03em; }
.flow__t--l { text-anchor: start; }
.flow__particles rect { fill: #DFF5EC; }
.flow__foot { margin-top: clamp(14px, 1.6vw, 22px); padding-top: 16px; border-top: 1px solid rgba(124, 198, 164, .16); font-size: .9375rem; line-height: 1.55; color: var(--muted); max-width: 92ch; }
.energy__fine { margin-top: clamp(28px, 3vw, 40px); padding-top: 18px; border-top: 1px solid var(--line); max-width: none; }

/* Track record (light) */
.track { padding: var(--sec) 0; }
.proofs { display: grid; grid-template-columns: minmax(0, 1.5fr) repeat(3, minmax(0, 1fr)); gap: 14px; }
.proofs--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.proof--repeat .proof__name { color: var(--ink); }
.sixes { margin-top: auto; padding-top: 14px; display: flex; gap: 14px; }
.sixes span { display: grid; grid-template-columns: repeat(6, 22px); gap: 4px; }
.sixes i { aspect-ratio: 1; border-radius: 3px; background: rgba(47, 181, 185, .22); border: 1.5px solid rgba(14, 124, 134, .65); }
.js .sixes i { opacity: .2; transform: scale(.4); transition: opacity .45s var(--ease), transform .55s var(--ease-out); transition-delay: calc(var(--i, 0) * 45ms + 300ms); }
.js .proof--repeat.is-in .sixes i { opacity: 1; transform: none; }
.proof { position: relative; display: flex; flex-direction: column; gap: 10px; padding: 26px 24px 28px; border-radius: var(--r-lg); background: #fff; border: 1px solid var(--ink-line); transition: transform .5s var(--ease-out), box-shadow .5s var(--ease), border-color .4s var(--ease); }
.proof:hover { transform: translateY(-4px); box-shadow: 0 26px 50px -32px rgba(11, 18, 32, .4); border-color: rgba(14, 124, 134, .35); }
.proof__k { font-size: .6875rem; letter-spacing: .12em; text-transform: uppercase; color: var(--deep); }
.proof__big { font: 600 clamp(2.3rem, 3.3vw, 3.1rem)/1 var(--f-display); letter-spacing: -.04em; color: var(--ink); margin: 10px 0 6px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.proof__big small { font-size: .42em; letter-spacing: 0; color: var(--deep); font-weight: 500; }
.proof > p:not(.proof__k):not(.proof__big) { color: var(--ink-muted); font-size: .9375rem; line-height: 1.55; }
.proof--feature { background: radial-gradient(ellipse at 100% 0%, rgba(47, 181, 185, .28), transparent 60%), var(--ink); border-color: transparent; color: var(--text); }
.proof--feature .proof__k { color: var(--seafoam); }
.proof--feature .proof__big { color: #fff; }
.proof--feature .proof__big small { color: var(--seafoam); }
.proof--feature > p:not(.proof__k):not(.proof__big) { color: var(--muted-2); }
.proof__name { font: 600 clamp(1.8rem, 2.6vw, 2.4rem)/1 var(--f-display); letter-spacing: -.035em; color: #fff; margin-top: 4px; }
.proof--feature .proof__big { margin: 2px 0 2px; }
.months { margin-top: auto; padding-top: 14px; display: grid; grid-template-columns: repeat(25, minmax(0, 1fr)); gap: 3px; }
.months i { aspect-ratio: 1 / 1.6; border-radius: 2px; background: var(--teal); }
.months i:first-child, .months i:last-child { background: var(--seafoam); }
/* History: "Eight years of building." — horizontal rail the visitor drives (scroll-snap, drag, buttons, keys) */
.track { padding-bottom: calc(var(--sec) * .7); }
.history { position: relative; padding: 0 0 var(--sec); overflow: hidden; isolation: isolate; }
.history__rule { position: relative; padding-top: calc(var(--sec) * .7); border-top: 1px solid var(--ink-line); }
.history__head { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: clamp(20px, 4vw, 64px); align-items: end; margin-bottom: clamp(32px, 4vw, 52px); }
.history__head .h2 { margin-bottom: 18px; }
.history__head .lead { max-width: 48ch; }
.history__ghost {
  margin: 0 0 -.06em 0; padding-right: .04em; min-width: 4.2ch; text-align: right;
  font: 600 clamp(6rem, 14vw, 14rem)/.8 var(--f-display); letter-spacing: -.06em; font-variant-numeric: tabular-nums;
  color: transparent; -webkit-text-stroke: 1.5px rgba(14, 124, 134, .2);
  pointer-events: none; user-select: none; -webkit-user-select: none;
  transition: opacity .35s var(--ease);
}
.history__ghost.is-swap { opacity: 0; }
.tl-viewport {
  --edge: max(var(--gutter), calc((100% - var(--maxw)) / 2 + var(--gutter)));
  position: relative; overflow-x: auto; overflow-y: hidden; overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory; scroll-padding-inline: var(--edge);
  scrollbar-width: none; -webkit-overflow-scrolling: touch; cursor: grab;
}
.tl-viewport::-webkit-scrollbar { display: none; }
.tl-viewport:focus-visible { outline-offset: -4px; border-radius: var(--r); }
.tl-viewport.is-dragging { cursor: grabbing; scroll-snap-type: none; user-select: none; -webkit-user-select: none; }
.tl-viewport.is-dragging * { pointer-events: none; }
.tl-track { display: flex; gap: clamp(14px, 1.6vw, 22px); width: max-content; padding: 10px var(--edge) 0; }
.tl { position: relative; flex: none; width: clamp(240px, 21vw, 300px); padding: 30px 18px 0 0; border-top: 1px solid rgba(11, 18, 32, .2); scroll-snap-align: start; }
.tl::before { content: ''; position: absolute; top: -5px; left: 0; width: 9px; height: 9px; background: var(--deep); }
.tl__year { display: flex; flex-direction: column; justify-content: flex-end; min-height: calc(1em + 1rem + 6px); font: 600 clamp(2.1rem, 3vw, 2.9rem)/1 var(--f-display); letter-spacing: -.045em; color: var(--deep); margin-bottom: 16px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.tl__year small { display: block; height: 1rem; margin-bottom: 6px; font: 500 .6875rem/1rem var(--f-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--ink-muted); }
.tl h3 { font: 600 1.08rem/1.25 var(--f-display); letter-spacing: -.01em; color: var(--ink); margin-bottom: 6px; }
.tl p:not(.tl__year) { color: var(--ink-muted); font-size: .9375rem; line-height: 1.5; }
.tl--prologue::before { background: var(--paper); border: 1.5px solid var(--teal-2); }
.tl--prologue .tl__year { color: transparent; -webkit-text-stroke: 1.2px var(--deep); }
.tl--now::before { background: var(--teal); box-shadow: 0 0 0 5px rgba(47, 181, 185, .22); }
/* Photo frames hang from the same rail as the milestones; their tops line up with the years */
.tl--img { display: flex; flex-direction: column; width: clamp(220px, 19vw, 280px); padding: 30px 0 4px; align-self: stretch; }
.tl--img.tl--wide { width: clamp(300px, 28vw, 420px); }
.tl--img::before { background: var(--paper); border: 1.5px solid var(--teal-2); }   /* hollow marker ties the photo to the rail, like the 2017 prologue */
.tl--img figure { position: relative; flex: 1 1 auto; min-height: 210px; overflow: hidden; isolation: isolate; background: var(--paper-2); }
.tl--img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: var(--grade); transition: transform 1.4s var(--ease-out); }
.tl--img img[src*="hall-fans-closeup"] { object-position: 50% 38%; }
.tl--img img[src*="exterior-transformers"] { object-position: 50% 58%; }
.history__controls { display: flex; align-items: center; gap: 18px 24px; margin-top: clamp(28px, 3vw, 40px); }
.tl-progress { flex: 1 1 auto; height: 2px; background: rgba(11, 18, 32, .12); border-radius: 2px; overflow: hidden; }
.tl-progress span { display: block; height: 100%; background: linear-gradient(90deg, var(--deep), var(--teal)); transform-origin: left; transform: scaleX(0); }
.tl-hint { flex: none; font-size: .6875rem; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-muted); }
.tl-hint__m { display: none; }
.tl-btns { flex: none; display: flex; gap: 8px; }
.tl-btn { width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; border: 1px solid rgba(11, 18, 32, .22); color: var(--ink); background: #fff; transition: background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease), opacity .25s var(--ease); }
.tl-btn svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.tl-btn:hover:not(:disabled) { background: var(--ink); color: #fff; border-color: var(--ink); }
.tl-btn:disabled { opacity: .35; cursor: default; }
html:not(.js) .tl-btns, html:not(.js) .tl-hint { display: none; }
html:not(.js) .tl-viewport { cursor: auto; scrollbar-width: thin; scrollbar-color: rgba(14, 124, 134, .5) transparent; padding-bottom: 10px; }
html:not(.js) .tl-viewport::-webkit-scrollbar { display: block; height: 6px; }
html:not(.js) .tl-viewport::-webkit-scrollbar-thumb { background: rgba(14, 124, 134, .5); border-radius: 3px; }
.tl--img img { -webkit-user-drag: none; user-select: none; -webkit-user-select: none; }

/* People: eight portrait cards, 4 + 4 (leadership row, then second row); 2-up below 1024 px.
   All eight crops share one framing (800x1000, eyes at 36%, matched head size) and one treatment below.
   The four studio shots are graded down in the files (white -> ~206) so both rows read as one set. */
.people { padding-top: var(--sec); background: var(--bg); }
.crew { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 40px clamp(16px, 1.6vw, 24px); }
.crew > .person:nth-child(4n+1) { --rd: 0ms !important; }
.crew > .person:nth-child(4n+2) { --rd: 90ms !important; }
.crew > .person:nth-child(4n+3) { --rd: 180ms !important; }
.crew > .person:nth-child(4n+4) { --rd: 270ms !important; }
.person__photo { position: relative; aspect-ratio: 4 / 5; overflow: hidden; isolation: isolate; background: #DCE3E6; margin-bottom: 16px; }
.person__photo img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.86) contrast(1.04); transition: transform 1.2s var(--ease-out), filter .8s var(--ease); }
.person__photo::before { content: ''; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(14, 124, 134, .14), rgba(7, 11, 20, .26)); mix-blend-mode: multiply; pointer-events: none; transition: opacity .8s var(--ease); }
.person__photo::after { content: ''; position: absolute; z-index: 1; inset: 0; border-radius: inherit; pointer-events: none; background: radial-gradient(ellipse 120% 100% at 50% 40%, rgba(7, 11, 20, 0) 58%, rgba(7, 11, 20, .16) 100%), linear-gradient(to top, rgba(7, 11, 20, .32), rgba(7, 11, 20, 0) 38%); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08); }
/* studio shots (white shirt on a plain backdrop): a lighter, shorter foot shade so the shirts stay clean instead of turning grey */
.person__photo--studio::after { background: radial-gradient(ellipse 120% 100% at 50% 40%, rgba(7, 11, 20, 0) 58%, rgba(7, 11, 20, .16) 100%), linear-gradient(to top, rgba(7, 11, 20, .18), rgba(7, 11, 20, 0) 30%); }
.person h3 { font: 600 1.15rem/1.25 var(--f-display); letter-spacing: -.01em; margin-bottom: 6px; }
.person__role { font-size: .6875rem; letter-spacing: .1em; text-transform: uppercase; color: var(--seafoam); line-height: 1.45; text-wrap: pretty; }
@media (min-width: 1200px) { .person__role { letter-spacing: .08em; } }
@media (hover: hover) and (pointer: fine) {
  .person:hover .person__photo img { transform: scale(1.04); filter: saturate(1) contrast(1.03); }
  .person:hover .person__photo::before { opacity: .35; }
}

/* Community: "Growing with Paraguay." on the real Cordillera de los Altos photograph */
.community { position: relative; margin-top: var(--sec); padding: clamp(120px, 12vw, 190px) 0 clamp(40px, 4vw, 56px); overflow: hidden; isolation: isolate; background: var(--bg-2); }
.community__media { position: absolute; inset: 0; z-index: -2; overflow: hidden; }
.community__media img { position: absolute; left: 0; top: -8%; width: 100%; height: 116%; max-width: none; object-fit: cover; object-position: 50% 40%; }
.community__shade {
  position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(180deg, var(--bg) 0%, rgba(7, 11, 20, .12) 18%, rgba(7, 11, 20, .06) 40%, rgba(7, 11, 20, .62) 70%, rgba(7, 11, 20, .9) 90%, var(--bg) 100%),
    linear-gradient(90deg, rgba(4, 14, 12, .78) 0%, rgba(4, 14, 12, .55) 36%, rgba(4, 14, 12, 0) 66%),
    linear-gradient(rgba(7, 20, 24, .12), rgba(7, 20, 24, .12)),
    radial-gradient(ellipse 130% 110% at 60% 45%, rgba(7, 11, 20, 0) 58%, rgba(7, 11, 20, .38) 100%);
}
.community__head { margin-bottom: clamp(28px, 3.4vw, 44px); }
.community__lead { color: rgba(232, 238, 242, .9); max-width: 44ch; margin-top: 16px; }
.pillars4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.cpill { display: flex; flex-direction: column; gap: 10px; padding: 24px 22px 24px; border-radius: var(--r-lg); background: rgba(6, 16, 18, .66); border: 1px solid rgba(124, 198, 164, .26); -webkit-backdrop-filter: blur(14px) saturate(130%); backdrop-filter: blur(14px) saturate(130%); transition: border-color .4s var(--ease), transform .5s var(--ease-out); }
.cpill:hover { border-color: rgba(124, 198, 164, .5); transform: translateY(-3px); }
.cpill .picon { width: 24px; height: 24px; margin-bottom: 14px; }
.cpill h3 { font: 500 .75rem/1.4 var(--f-mono); letter-spacing: .12em; text-transform: uppercase; color: #BFE6D2; }
.cpill__fig { display: flex; align-items: baseline; align-content: flex-end; flex-wrap: wrap; min-height: clamp(2rem, 2.8vw, 2.6rem); gap: 4px 8px; font: 600 clamp(2rem, 2.8vw, 2.6rem)/1 var(--f-display); letter-spacing: -.04em; color: #fff; font-variant-numeric: tabular-nums; }
.cpill__fig small { font: 500 .75rem/1.2 var(--f-mono); letter-spacing: .04em; color: var(--green); }
.cpill__fig--word { font-size: clamp(1.7rem, 2.3vw, 2.15rem); }
.cpill__txt { margin-top: 4px; color: rgba(232, 238, 242, .86); font-size: .9375rem; line-height: 1.5; }

/* Investor access */
.contact { padding: var(--sec) 0 clamp(40px, 4vw, 64px); background: var(--bg); }
.community + .contact { padding-top: calc(var(--sec) * .6); }
.contact__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(32px, 5vw, 88px); align-items: center; }
.contact__copy .display { max-width: 15ch; margin-bottom: 20px; }
.contact__list { margin-top: 24px; border-top: 1px solid var(--line-2); }
.contact__list div { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.contact__list dt { font: 500 .6875rem/1.7 var(--f-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.contact__list dd { font: 500 1rem/1.4 var(--f-display); display: flex; flex-direction: column; gap: 2px; }
.contact__list dd span { font: 400 .8125rem/1.4 var(--f-body); color: var(--muted); }
.contact__list a { text-decoration: underline; text-decoration-color: rgba(47, 181, 185, .45); text-underline-offset: 4px; transition: color .25s, text-decoration-color .25s; width: fit-content; display: inline-block; padding-block: 11px; margin-block: -8px; }
.contact__list a:hover { color: var(--seafoam); text-decoration-color: var(--seafoam); }
.contact__ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.contact__legal { margin-top: 18px; max-width: 64ch; }
.contact__photo { position: relative; overflow: hidden; isolation: isolate; aspect-ratio: 5 / 4; background: var(--bg-2); }
/* The source is wider (1.71:1) than the frame, so object-position alone cannot crop vertically:
   the image box is made taller than the frame and anchored to the bottom, trimming the empty sky. */
.contact__photo::after {
  background:
    linear-gradient(180deg, rgba(8, 30, 40, .16) 0%, rgba(8, 30, 40, .12) 28%, rgba(8, 30, 40, 0) 52%),
    radial-gradient(ellipse 120% 100% at 50% 42%, rgba(7, 11, 20, 0) 56%, rgba(7, 11, 20, .32) 100%),
    linear-gradient(180deg, rgba(14, 124, 134, .08) 0%, rgba(7, 11, 20, 0) 42%, rgba(7, 11, 20, .16) 100%);
}
.contact__photo img { position: absolute; left: 0; bottom: 0; width: 100%; height: 128%; max-width: none; object-fit: cover; object-position: 58% 100%; transform-origin: 50% 100%; transition: transform 1.6s var(--ease-out); }

/* Footer */
.footer { background: var(--bg); border-top: 1px solid var(--line); padding: clamp(40px, 4vw, 64px) 0 36px; }
.footer__top { display: flex; justify-content: space-between; align-items: center; gap: 20px 32px; flex-wrap: wrap; padding-bottom: 32px; border-bottom: 1px solid var(--line); }
.footer__brand { display: inline-flex; align-items: center; gap: 14px; min-height: 44px; color: #fff; }
.footer__mark { width: 28px; height: 34px; }
.footer__nav { display: flex; flex-wrap: wrap; gap: 4px 22px; }
.footer__nav a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; min-width: 44px; font-size: .875rem; color: var(--muted-2); transition: color .25s; }
.footer__nav a:hover { color: var(--seafoam); }
.footer__h { font-size: .6875rem; letter-spacing: .14em; text-transform: uppercase; color: var(--teal); margin-bottom: 14px; }
.footer__fine { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 28px clamp(32px, 4vw, 64px); padding: 28px 0 8px; }
.footer__legal { display: grid; align-content: start; gap: 10px; font-size: .875rem; line-height: 1.6; color: var(--muted); }
.footer__legal p { max-width: 124ch; }
.footer__legal .footer__h { margin-bottom: 2px; }
.credits { min-width: 0; }
.credits__list { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; font-size: .875rem; line-height: 1.55; color: var(--muted); }
.credits__list strong { color: var(--muted-2); font-weight: 600; }
.credits__list a { color: var(--muted-2); text-decoration: underline; text-decoration-color: rgba(47, 181, 185, .45); text-underline-offset: 3px; transition: color .25s; display: inline-block; padding-block: 11px; margin-block: -11px; }
.credits__list a:hover { color: var(--seafoam); }
.credits__note { margin-top: 12px; font-size: .875rem; color: var(--muted); }
.footer__copy { margin-top: 24px; font-size: .72rem; letter-spacing: .08em; color: var(--muted); }

/* Grain */
.grain { position: fixed; inset: 0; z-index: 100; pointer-events: none; opacity: .04; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }

video.lazy-video { background: var(--bg-2); transition: opacity .35s var(--ease); }
video.lazy-video.is-dip { opacity: 0; }
/* No-JS: pixel icons are drawn by script, so drop the empty icon column */
html:not(.js) .picon { display: none; }
html:not(.js) .blueprint__pillars li { grid-template-columns: minmax(0, 1fr); }
html:not(.js) video.lazy-video, html:not(.js) .hero__video { display: none; }

/* 6 · MOTION STATES (.js only) --------------------------------------- */
.js [data-reveal] { opacity: 0; transform: translateY(28px); transition: opacity .9s var(--ease), transform 1.1s var(--ease-out); transition-delay: var(--rd, 0ms); }
.js [data-reveal].is-in { opacity: 1; transform: none; }
.js [data-reveal="clip"] { opacity: 1; transform: none; clip-path: inset(12% 0 0 0 round var(--r-media)); transition: clip-path 1.3s var(--ease-out); transition-delay: var(--rd, 0ms); }
.js [data-reveal="clip"].is-in { clip-path: inset(0 0 0 0 round var(--r-media)); }
.js [data-reveal="clip"] img, .js [data-reveal="clip"] video { transform: scale(1.08); transition: transform 1.6s var(--ease-out); }
.js [data-reveal="clip"].is-in img, .js [data-reveal="clip"].is-in video { transform: none; }
@media (hover: hover) and (pointer: fine) {
  .tile:hover video, .tile:hover img, .js [data-reveal="clip"].is-in:hover img, .js [data-reveal="clip"].is-in:hover video { transform: scale(1.035); }
  .tl--img:hover img, .contact__photo:hover img { transform: scale(1.03); }
}
.js [data-split] .w { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .17em; margin-bottom: -.17em; }
.js [data-split] .w > span { display: inline-block; transform: translateY(108%); transition: transform 1.1s var(--ease-out); transition-delay: calc(var(--i, 0) * 60ms + var(--sd, 0ms)); }
.js [data-split].is-in .w > span { transform: none; }
.js [data-hero-in] { opacity: 0; transform: translateY(20px); transition: opacity 1s var(--ease), transform 1.2s var(--ease-out); }
.js .hero.is-in [data-hero-in] { opacity: 1; transform: none; }
.js .hero.is-in .hero__lead { transition-delay: .4s; }
.js .hero.is-in .hero__ctas { transition-delay: .55s; }
.js .hero.is-in .hero__kpis { transition-delay: .7s; }
/* MW grid fills once */
.js .mwp__cells i { opacity: 0; transform: scale(.25); transition: opacity .5s var(--ease), transform .6s var(--ease-out); transition-delay: calc(var(--i, 0) * 11ms + 200ms); }
.js .mwp.is-in .mwp__cells i { opacity: 1; transform: none; }
/* Bitmain month strip */
.js .months i { opacity: .18; transition: opacity .4s var(--ease); transition-delay: calc(var(--i, 0) * 38ms + 300ms); }
.js .proof--feature.is-in .months i { opacity: 1; }
/* Energy flow: line draws in once, nodes light up in order (path dash set by JS) */
.js .flow__path { transition: stroke-dashoffset 2s var(--ease-io) .2s; }
.js .flow__node { opacity: .18; transition: opacity .7s var(--ease); transition-delay: calc(var(--n, 0) * .75s + .2s); }
.js .flow__svg.is-drawn .flow__node { opacity: 1; }
.reveal-all [data-reveal], .reveal-all [data-hero-in], .reveal-all .mwp__cells i, .reveal-all .months i, .reveal-all .sixes i { opacity: 1 !important; transform: none !important; clip-path: none !important; }
.reveal-all [data-split] .w > span { transform: none !important; }
.reveal-all .flow__node { opacity: 1 !important; }

/* 7 · RESPONSIVE ------------------------------------------------------ */
@media (max-width: 1199px) {
  .proofs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .proof--feature { grid-row: span 1; }
  .sixes span { grid-template-columns: repeat(6, minmax(0, 18px)); }
  .estats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .estat { padding-bottom: 18px; }
  .estat:nth-child(3) { padding-left: 0; border-left: 0; }
  .estat:nth-child(n+3) { border-top: 1px solid rgba(255, 255, 255, .12); }
  .community__shade {
    background:
      linear-gradient(180deg, var(--bg) 0%, rgba(7, 11, 20, .12) 18%, rgba(7, 11, 20, .06) 40%, rgba(7, 11, 20, .62) 70%, rgba(7, 11, 20, .9) 90%, var(--bg) 100%),
      linear-gradient(90deg, rgba(4, 14, 12, .82) 0%, rgba(4, 14, 12, .66) 44%, rgba(4, 14, 12, .2) 72%, rgba(4, 14, 12, 0) 86%),
      linear-gradient(rgba(7, 20, 24, .12), rgba(7, 20, 24, .12)),
      radial-gradient(ellipse 130% 110% at 60% 45%, rgba(7, 11, 20, 0) 58%, rgba(7, 11, 20, .38) 100%);
  }
}
@media (min-width: 1024px) and (max-width: 1199px) {
  .mwp__bhead { font-size: .65rem; letter-spacing: .06em; }
  .sitecard { padding: 20px 18px; }
  .sitecard__body { margin-bottom: 14px; font-size: .875rem; }
  .sitecard__meta { font-size: .875rem; }
}
@media (max-width: 1099px) {
  .infra__body { grid-template-columns: minmax(0, 1fr); }
  .sitecards { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: auto; }
  .places { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .places li { padding-bottom: 16px; border-bottom: 1px solid var(--line); }
  .blueprint { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 1023px) {
  .section-head--split, .contact__grid { grid-template-columns: minmax(0, 1fr); align-items: start; }
  .lines { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .line:nth-child(3) { padding-left: 0; border-left: 0; }
  .line:nth-child(n+3) { border-top: 1px solid var(--ink-line); }
  .pillars4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .history__head { grid-template-columns: minmax(0, 1fr); align-items: start; }
  .history__ghost { position: absolute; right: 0; top: -6px; min-width: 0; font-size: clamp(4.5rem, 13vw, 7rem); -webkit-text-stroke-width: 1.2px; }
  .flow__svg--h { display: none; }
  .flow__svg--v { display: block; }
  .contact__photo { aspect-ratio: 16 / 10; }
  /* one column: the photo moves up between the intro and the contact details, instead of trailing after the buttons */
  .contact__grid { row-gap: 0; }
  .contact__copy { display: contents; }
  .contact__photo { order: 1; margin-top: 28px; }
  .contact__list, .contact__ctas, .contact__legal { order: 2; }
  .footer__fine { grid-template-columns: minmax(0, 1fr); }
  .credits { padding-top: 26px; border-top: 1px solid var(--line); }
  .strip { grid-template-columns: repeat(2, minmax(0, 1fr)); height: auto; gap: 12px; }
  .tile--wide { grid-column: 1 / -1; aspect-ratio: 16 / 9.6; }
  .tile--tall { aspect-ratio: 3 / 4; }
  /* People: 2-up keeps every row full (8 = 2 x 4) and keeps the reading order Jhony, Andy / Iván, Marlene / Gualberto, Vanessa / Daniel, Humberto.
     Capped and centred on tablets so four rows of portraits don't fill 2.5 screens; phones (below 600 px) use the full width. */
  .crew { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px 20px; max-width: 560px; margin-inline: auto; }
  .crew > .person:nth-child(odd) { --rd: 0ms !important; }
  .crew > .person:nth-child(even) { --rd: 90ms !important; }
}
@media (max-width: 899px) {
  .energy__hero { justify-content: flex-start; }
  .energy__content { margin-bottom: auto; padding-bottom: 120px; }
  .nav__links, .nav__cta { display: none; }
  .nav__burger { display: block; }
  html:not(.js) .nav__burger { display: none; }
  html:not(.js) .nav__nojs { display: inline-flex; align-items: center; min-height: 44px; padding: 0 18px; border: 1px solid var(--line-2); border-radius: 999px; font-size: 14px; font-weight: 600; }
}
@media (max-width: 767px) {
  .sitecard__body { display: none; }      /* narrow two-up cards stay compact; the map legend carries these facts */
  :root { --nav-h: 64px; --sec: 64px; --r-media: 14px; }
  /* Hero */
  .hero__content { padding-top: calc(var(--nav-h) + 5vh); padding-bottom: 20px; }
  .hero__title { font-size: clamp(2.9rem, 14vw, 4.4rem); }
  .hero__shade { background: linear-gradient(180deg, rgba(7, 11, 20, .78) 0%, rgba(7, 11, 20, .5) 22%, rgba(7, 11, 20, .6) 45%, rgba(7, 11, 20, .9) 72%, var(--bg) 100%); }
  .hero__eyebrow { align-items: flex-start; }
  .hero__eyebrow .dot { margin-top: 5px; }
  .hero__sep { display: none; }
  .hero__eyebrow-2 { display: block; }
  .hero__ctas .btn { flex: 1 1 100%; }
  .hkpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hkpi { padding: 16px 14px 18px; }
  .hkpi:nth-child(odd) { padding-left: 0; border-left: 0; }
  .hkpi:nth-child(n+3) { border-top: 1px solid var(--line); }
  .hkpi dd { font-size: clamp(1.9rem, 9.5vw, 2.5rem); }
  /* Platform */
  .lines { grid-template-columns: minmax(0, 1fr); }
  .line, .line:first-child, .line:nth-child(3) { padding: 20px 0 22px; border-left: 0; }
  .line + .line { border-top: 1px solid var(--ink-line); border-left: 0; }
  .line { display: grid; grid-template-columns: 34px minmax(0, 1fr); column-gap: 8px; row-gap: 8px; }
  .line > * { grid-column: 2; }
  .line__idx { grid-column: 1; grid-row: 1; padding-top: 5px; }
  .line__earn { padding-top: 2px; }
  /* Footprint */
  .map { aspect-ratio: 1.62 / 1; margin-inline: calc(var(--gutter) * -0.5); width: calc(100% + var(--gutter)); }
  .places { grid-template-columns: minmax(0, 1fr); }
  .places li { padding: 13px 0; }
  .blueprint { padding: 22px 18px; }
  .blueprint__pillars { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  /* Infrastructure */
  .opener { height: auto; min-height: 0; justify-content: flex-start; background: var(--bg); }
  .opener__media { order: 2; position: relative; inset: auto; z-index: 0; aspect-ratio: 4 / 3.2; }
  .opener__media video, .opener__media img { object-position: 46% 50%; }
  .opener__media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, var(--bg) 0%, rgba(7, 11, 20, 0) 20%, rgba(7, 11, 20, 0) 74%, var(--bg) 100%); }
  .opener__shade { display: none; }
  .opener__content { order: 1; padding-top: var(--sec); padding-bottom: 8px; }
  .opener__content .display { font-size: clamp(2.7rem, 13vw, 4rem); margin-bottom: 16px; }
  .infra__body { margin-top: 28px; }
  .sitecards { gap: 10px; }
  .sitecard { padding: 16px 16px 18px; }
  .sitecard__k { font-size: 10.5px; letter-spacing: .06em; }
  .mwp { padding: 20px 16px; }
  .mwp__blocks { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 14px; }
  .mwp__block--tp { grid-column: 1 / -1; }
  .mwp__block--tp .mwp__cells { grid-template-columns: repeat(14, minmax(0, 1fr)); }
  .mwp__cells { gap: 4px; }
  .mwp__bhead { min-height: 0; }
  /* Energy */
  .energy__hero { min-height: 0; justify-content: flex-start; background: var(--bg); }
  .energy__content { order: 1; padding-top: var(--sec); padding-bottom: 0; margin-bottom: 0; }
  .energy__media { order: 2; position: relative; inset: auto; z-index: 0; aspect-ratio: 4 / 3.3; margin-top: 28px; }
  .energy__media img { object-position: 50% 62%; }
  .energy__media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, var(--bg) 0%, rgba(7, 11, 20, 0) 18%, rgba(7, 11, 20, 0) 72%, var(--bg) 100%), linear-gradient(rgba(7, 20, 24, .2), rgba(7, 20, 24, .2)); }
  .energy__shade { display: none; }
  .energy__statswrap { order: 3; padding-top: 8px; padding-bottom: 0; }
  .estat { padding: 16px 14px 16px; }
  .estat:nth-child(odd) { padding-left: 0; border-left: 0; }
  .estat dd { font-size: clamp(1.7rem, 8vw, 2.2rem); }
  .estat--btc dd small { font-size: 10.5px; }
  /* Energy flow */
  .flow { padding: 22px 16px 14px; }
  .flow__chips li { font-size: .6875rem; padding: 6px 10px; }
  .flow__t { font-size: 18px; }
  .flow__s { font-size: 12px; }
  .flow__svg--v .flow__t { font-size: 19px; }
  .flow__svg--v .flow__s { font-size: 14px; letter-spacing: .01em; }
  .flow__foot { font-size: .875rem; }
  /* Track */
  .proofs { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .proof { padding: 22px 20px 24px; }
  /* History */
  .history__ghost { top: -34px; font-size: clamp(4.25rem, 19vw, 5rem); }
  .tl { width: min(78vw, 300px); }
  .tl-track { align-items: flex-start; }
  .tl--img, .tl--img.tl--wide { width: min(70vw, 280px); align-self: flex-start; }
  .tl--img figure { flex: none; min-height: 0; height: 200px; }
  .history__controls { margin-top: 20px; }
  .tl-hint__d { display: none; }
  .tl-hint__m { display: inline; }
  /* People: 2-up */
  .crew { gap: 28px 12px; }
  .person__photo { margin-bottom: 12px; }
  .person h3 { font-size: min(1.05rem, 4.3vw); margin-bottom: 4px; }   /* names stay on one line down to ~330 px */
  .person__role { font-size: .625rem; letter-spacing: .07em; }
  /* Community: the photo becomes a figure above the copy, so the landscape actually reads on phones */
  .community { display: flex; flex-direction: column; padding: 0 0 56px; background: var(--bg); }
  .community__media { order: 1; position: relative; inset: auto; z-index: 0; aspect-ratio: 4 / 3; }
  .community__media img { object-position: 50% 50%; }
  .community__media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, var(--bg) 0%, rgba(7, 11, 20, 0) 16%, rgba(7, 11, 20, 0) 70%, var(--bg) 100%), linear-gradient(rgba(7, 20, 24, .18), rgba(7, 20, 24, .18)); }
  .community__shade { display: none; }
  .community__inner { order: 2; padding-top: 22px; }
  .pillars4 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .cpill { padding: 18px 16px 18px; background: var(--surface); -webkit-backdrop-filter: none; backdrop-filter: none; }
  .cpill .picon { width: 20px; height: 20px; margin-bottom: 8px; }
  .cpill h3 { font-size: .6875rem; letter-spacing: .08em; }
  .cpill__fig { font-size: 1.9rem; min-height: 1.9rem; }
  .cpill__fig--word { font-size: 1.6rem; }
  .cpill__txt { font-size: .875rem; }
  /* Contact */
  .contact__list div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .contact__ctas .btn { flex: 1 1 100%; }
  /* Footer */
  .credits__list { gap: 12px; }
}
@media (max-width: 599px) {
  .pillars4 { grid-template-columns: minmax(0, 1fr); }
  .cpill { display: grid; grid-template-columns: 20px minmax(0, 1fr) auto; align-items: center; column-gap: 12px; row-gap: 8px; padding: 16px 18px 18px; }
  .cpill .picon { margin: 0; }
  .cpill h3 { grid-column: 2; }
  .cpill__fig { grid-column: 3; grid-row: 1; justify-self: end; font-size: 1.7rem; min-height: 0; }
  .cpill__fig--word { font-size: 1.45rem; }
  .cpill__txt { grid-column: 1 / -1; margin: 0; padding-top: 2px; }
}
@media (max-width: 380px) {
  .sitecards { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 359px) {
  .hero__content { padding-top: calc(var(--nav-h) + 12px); }
  .hero__eyebrow { font-size: .6875rem; letter-spacing: .1em; margin-bottom: 12px; }
  .hero__title { margin-bottom: 14px; }
  .hero__lead { font-size: .95rem; margin-bottom: 18px; }
  .hero__ctas { gap: 8px; }
  .hero__ctas .btn { --bh: 46px; }
}
@media (min-width: 2200px) {
  :root { --maxw: 1800px; --nav-h: 80px; }
  html { font-size: clamp(18px, 0.42vw + 8px, 20px); }
  body { font-size: 1rem; }
}

/* 8 · REDUCED MOTION -------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .js [data-reveal], .js [data-hero-in], .js .mwp__cells i, .js .months i, .js .sixes i { opacity: 1 !important; transform: none !important; transition: none !important; }
  .js [data-reveal="clip"], .js [data-reveal="clip"] img, .js [data-reveal="clip"] video { clip-path: none !important; transform: none !important; transition: none !important; }
  .js [data-split] .w > span { transform: none !important; transition: none !important; }
  .js .flow__node { opacity: 1 !important; transition: none !important; }
  .js .flow__path { transition: none !important; }
  .history__ghost { transition: none; }
  .js .nav__mark rect, .mwp__avail i { animation: none !important; }
  .hero__video { transform: none; }
  .tile:hover video, .tile:hover img, .tl--img:hover img, .person:hover .person__photo img, .contact__photo:hover img { transform: none !important; }
}