/* --- Fonts --------------------------------------------------- */
@font-face {
  font-family: "Jost"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("../fonts/jost-400.1d41ff98.woff2") format("woff2");
}
@font-face {
  font-family: "Jost"; font-style: normal; font-weight: 700; font-display: swap;
  src: url("../fonts/jost-700.eb3fb4c3.woff2") format("woff2");
}
@font-face {
  font-family: "Barlow Condensed"; font-style: italic; font-weight: 700; font-display: swap;
  src: url("../fonts/barlow-condensed-700i.e15f66d2.woff2") format("woff2");
}
@font-face {
  font-family: "Barlow Condensed"; font-style: italic; font-weight: 800; font-display: swap;
  src: url("../fonts/barlow-condensed-800i.03d2a3e8.woff2") format("woff2");
}
@font-face {
  font-family: "JetBrains Mono"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("../fonts/jetbrains-mono-400.4eab87b2.woff2") format("woff2");
}

/* ============================================================
   MAC Scaffolding — design system
   ============================================================ */

/* --- Tokens -------------------------------------------------- */
:root {
  --mac-blue:      #53a4db;  /* brand. 7.14:1 with ink-900 on top */
  --mac-blue-600:  #3d8fc9;  /* hover fill */
  --mac-blue-700:  #2f74a6;  /* eyebrow + text link on white 5.04:1 */

  --ink-050: #f4f6f8;
  --ink-100: #e5e9ee;   /* hairlines */
  --ink-200: #ccd3db;   /* borders, stat separators */
  --ink-300: #a8b2bd;   /* body copy on ink-900        9.05:1 */

  --ink-350: #7e8894;   /* micro type on ink-900       5.41:1 */
  --ink-400: #6b7581;   /* micro type on white         4.68:1 */
  --ink-500: #4d5761;   /* secondary body on white     7.36:1 */
  --ink-600: #39424b;
  --ink-700: #262d34;
  --ink-800: #161b21;
  --ink-900: #0b0d10;   /* brand */

  --bg-muted: var(--ink-050);
  --border:   var(--ink-200);

  --s-1: 4px;  --s-2: 8px;  --s-3: 12px; --s-4: 16px; --s-5: 24px;
  --s-6: 32px; --s-7: 48px; --s-8: 64px; --s-9: 96px; --s-10: 128px;

  --dur-fast: 140ms;
  --dur-base: 220ms;
  --ease-out: cubic-bezier(.2, .7, .3, 1);

  --dur-reveal: 660ms;
  --ease-reveal: cubic-bezier(.16, .68, .32, 1);
  --shadow-2: 0 10px 30px -12px rgba(11, 13, 16, .34);

  --shear: -18deg;
  --unshear: 18deg;

  --wrap: 1200px;
  --gut: clamp(20px, 5vw, 56px);

  --font-display: "Barlow Condensed", "Arial Narrow", system-ui, sans-serif;
  --font-body:    "Jost", "Century Gothic", "Avenir Next", system-ui,
                  -apple-system, "Segoe UI", sans-serif;
  --font-mono:    "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

/* --- Base --------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
* { border-radius: 0; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
  margin: 0;
  background: #fff;
  color: var(--ink-900);
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.6;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; display: block; height: auto; }

picture { display: contents; }
a { color: inherit; }

::selection { background: var(--mac-blue); color: var(--ink-900); }

:focus-visible {
  outline: 3px solid var(--mac-blue);
  outline-offset: 3px;
}
.band--dark :focus-visible,
.site-foot :focus-visible { outline-color: var(--mac-blue); }

.skip {
  position: absolute; left: -9999px; top: 0; z-index: 200;
  background: var(--ink-900); color: #fff; padding: 14px 22px;
  font-family: var(--font-display); font-weight: 700;
  text-transform: uppercase; letter-spacing: .05em; text-decoration: none;
}
.skip:focus { left: 0; }

.vh {
  position: absolute; width: 1px; height: 1px; margin: -1px;
  padding: 0; border: 0; overflow: hidden; white-space: nowrap;
  clip: rect(0 0 0 0); clip-path: inset(50%);
}

.wrap { width: 100%; max-width: var(--wrap); margin-inline: auto; padding-inline: var(--gut); }

/* Section rhythm lives on .band only, so nothing else fights it. */
.band { padding-block: clamp(64px, 9vw, 118px); }
.band--tight { padding-block: clamp(44px, 6vw, 76px); }
.band--dark  { background: var(--ink-900); color: #fff; }
.band--muted { background: var(--ink-050); }

/* --- Type --------------------------------------------------- */
.display {
  font-family: var(--font-display);
  font-weight: 800;
  font-style: italic;
  text-transform: uppercase;
  line-height: .92;
  letter-spacing: .002em;
  margin: 0;
}

.eyebrow {
  font-family: var(--font-body);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .14em;
  font-size: 13px;
  color: var(--mac-blue-700);
  margin: 0 0 10px;
}
.band--dark .eyebrow { color: var(--mac-blue); }

.micro {
  font-family: var(--font-body);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .12em;
  font-size: 12px;
  color: var(--ink-400);
}

.mono {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--ink-400);
}

.lede  { font-size: clamp(18px, 1.5vw, 21px); line-height: 1.55; color: var(--ink-600); margin: 0 0 var(--s-5); }
.body  { color: var(--ink-500); margin: 0 0 var(--s-4); }
.body:last-child { margin-bottom: 0; }
.band--dark .lede { color: var(--ink-200); }
.band--dark .body { color: var(--ink-300); }

/* --- Speed-dash mark (from the logo) ------------------------ */
.dashes { display: flex; flex-direction: column; gap: 5px; width: 62px; }
.dashes i { display: block; height: 7px; background: var(--mac-blue); transform: skewX(var(--shear)); }
.dashes i:nth-child(2) { width: 74%; }

/* --- 1f  Section heading ------------------------------------ */
.head-1f .display { font-size: clamp(40px, 6.2vw, 60px); }
.slash-rule { display: flex; gap: 6px; margin-top: var(--s-4); }
.slash-rule span { display: block; height: 8px; transform: skewX(var(--shear)); }
.slash-rule span:first-child { width: 64px; background: var(--ink-900); }
.slash-rule span:last-child  { width: 20px; background: var(--mac-blue); }
.band--dark .slash-rule span:first-child { background: #fff; }

/* --- 1i  Buttons -------------------------------------------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center;
  height: 48px; padding: 0 26px;
  font-family: var(--font-display); font-weight: 700; font-size: 17px;
  text-transform: uppercase; letter-spacing: .05em; text-decoration: none;
  border: 0; cursor: pointer; white-space: nowrap;
  transition: background var(--dur-base) var(--ease-out),
              color var(--dur-base) var(--ease-out),
              transform var(--dur-fast) var(--ease-out);
}

.btn--primary { background: var(--mac-blue); color: var(--ink-900); }
.btn--primary:hover { background: var(--mac-blue-600); }
.btn--primary:active { background: var(--mac-blue-600); transform: scale(.98); }

/* 1i.2 ghost */
.btn--ghost { background: transparent; border: 2px solid var(--ink-900); color: var(--ink-900); }
.btn--ghost:hover { background: var(--bg-muted); }
.btn--ghost:active { transform: scale(.98); }
.btn--ghost-light { background: transparent; border: 2px solid #fff; color: #fff; }
.btn--ghost-light:hover { background: rgba(255,255,255,.1); }

/* 1i.4 text link */
.tlink {
  display: inline-block;
  font-family: var(--font-body); font-weight: 700; font-size: 15px;
  text-transform: uppercase; letter-spacing: .08em;
  color: var(--mac-blue-700); text-decoration: none;
  border-bottom: 2px solid var(--mac-blue); padding-bottom: 3px;
  transition: color var(--dur-fast) var(--ease-out);
}
.tlink:hover { color: var(--ink-900); }

.tlink { position: relative; }
.tlink::before { content: ""; position: absolute; inset: -12px -8px; }
.band--dark .tlink { color: #fff; }
.band--dark .tlink:hover { color: var(--mac-blue); }

.tlink svg { vertical-align: -3px; margin-right: 9px; }

/* --- Header ------------------------------------------------- */

.site-head {
  position: relative; z-index: 90;
  background: #fff;
}

.head-in { display: flex; align-items: center; gap: var(--s-5); height: 104px; }

.brand { display: flex; align-items: center; min-height: 44px; text-decoration: none; margin-right: auto; }

.brand img { height: clamp(44px, calc(41.6px + 1.7vw), 62px); width: auto; }

.nav { display: flex; align-self: stretch; align-items: center; gap: clamp(14px, 1.7vw, 26px); }
.nav a {
  font-family: var(--font-body); font-weight: 700; font-size: 13.5px;
  text-transform: uppercase; letter-spacing: .09em;
  color: var(--ink-600); text-decoration: none; padding: 6px 0;
  position: relative; transition: color var(--dur-fast) var(--ease-out);
}
.nav a::after {
  content: ""; position: absolute; left: 0; right: 100%; bottom: 0; height: 3px;
  background: var(--mac-blue); transform: skewX(var(--shear));
  transition: right var(--dur-base) var(--ease-out);
}
.nav a:hover { color: var(--ink-900); }
.nav a:hover::after { right: 0; }
.nav a[aria-current="page"] { color: var(--ink-900); }
.nav a[aria-current="page"]::after { right: 0; }

.nav a[data-nav-section] { color: var(--ink-900); }
.nav a[data-nav-section]::after { right: 0; }

/* --- About group --------------------------------------------- */

.nav-group {
  position: relative; align-self: stretch;
  display: flex; align-items: center; gap: 2px;
}

.nav-caret {
  width: 44px; height: 44px; padding: 0; border: 0; background: none;
  display: grid; place-items: center; cursor: pointer;
  color: var(--ink-600); transition: color var(--dur-fast) var(--ease-out);
}
.nav-caret:hover, .nav-group:hover .nav-caret { color: var(--ink-900); }
.nav-caret i {
  display: block; width: 10px; height: 6px; background: currentColor;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
  transform: skewX(var(--shear));
  transition: transform var(--dur-base) var(--ease-out);
}

.nav-caret[aria-expanded="true"] i { transform: skewX(var(--shear)) scaleY(-1); }

.nav-panel {
  position: absolute; top: 100%; left: 0; min-width: 170px;
  display: flex; flex-direction: column; align-items: stretch;
  background: #fff; border: 1px solid var(--ink-100);
  box-shadow: var(--shadow-2);
  padding: var(--s-2) var(--s-4);
  visibility: hidden; opacity: 0; transform: translateY(-8px);
  transition: opacity var(--dur-base) var(--ease-out),
              transform var(--dur-base) var(--ease-out),
              visibility 0s linear var(--dur-base);
}
.nav-group:hover .nav-panel,
.nav-group:focus-within .nav-panel,
.nav-panel.is-open {
  visibility: visible; opacity: 1; transform: translateY(0);
  transition: opacity var(--dur-base) var(--ease-out),
              transform var(--dur-base) var(--ease-out),
              visibility 0s;
}

.nav-group.is-shut .nav-panel {
  visibility: hidden; opacity: 0; transform: translateY(-8px);
  transition: opacity var(--dur-base) var(--ease-out),
              transform var(--dur-base) var(--ease-out),
              visibility 0s linear var(--dur-base);
}

.nav-panel a { display: flex; align-items: center; min-height: 44px; padding: 0; }

a.nav-social {
  display: grid; place-items: center;
  width: 44px; height: 44px; padding: 0;
}
a.nav-social svg { display: block; }

.nav-toggle {
  display: none; width: 46px; height: 46px; background: var(--ink-900);
  border: 0; cursor: pointer; padding: 0; place-items: center;

  align-content: center;
}
.nav-toggle i {
  display: block; width: 20px; height: 3px; background: #fff;
  transform: skewX(var(--shear)); margin: 3px auto;
  transition: transform var(--dur-base) var(--ease-out),
              opacity var(--dur-base) var(--ease-out);
}

.nav-toggle[aria-expanded="true"] i:nth-child(1) { transform: translateY(9px) rotate(45deg) skewX(var(--shear)); }
.nav-toggle[aria-expanded="true"] i:nth-child(2) { opacity: 0; transform: skewX(var(--shear)) scaleX(.2); }
.nav-toggle[aria-expanded="true"] i:nth-child(3) { transform: translateY(-9px) rotate(-45deg) skewX(var(--shear)); }

/* --- Hero --------------------------------------------------- */
.hero { position: relative; min-height: min(88svh, 760px); display: flex; align-items: flex-end; overflow: hidden; }

.hero { --par: 0px; }
@media (prefers-reduced-motion: no-preference) {
  .hero { --par: clamp(58px, 8vw, 112px); }
}
.hero__media {
  position: absolute; left: 0; right: 0; bottom: 0;
  top: calc(var(--par) * -1);
  will-change: transform;
}
.hero__media img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 42%; }
.hero__scrim {
  position: absolute; inset: 0;
  background:
    linear-gradient(180deg, rgba(11,13,16,.30) 0%, rgba(11,13,16,0) 26%, rgba(11,13,16,.72) 100%),
    linear-gradient(96deg, rgba(11,13,16,.55) 0%, rgba(11,13,16,0) 58%);
}
.hero__in { position: relative; width: 100%; padding-block: clamp(40px, 7vw, 78px) clamp(34px, 5vw, 60px); }
.hero .dashes { margin-bottom: clamp(16px, 2vw, 22px); }
.hero__h1 {
  font-size: clamp(44px, 8.6vw, 104px);
  color: #fff;
  max-width: 15ch;
  margin: 0 0 clamp(20px, 3vw, 30px);
  text-shadow: 0 2px 24px rgba(11,13,16,.4);
}
.hero__h1 .ln { display: block; position: relative; overflow: hidden; padding-block: .04em; }
.hero__h1 .ln--sub {
  font-family: var(--font-body); font-style: normal; font-weight: 700;
  font-size: clamp(13px, 1.35vw, 17px); letter-spacing: .18em;
  line-height: 1.5; margin-top: clamp(10px, 1.4vw, 16px);
  color: rgba(255,255,255,.9); text-shadow: none;
}
.hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-4); }
.hero__foot {
  position: absolute; right: var(--gut); bottom: clamp(34px, 5vw, 60px);
  text-align: right; color: rgba(255,255,255,.78);
  font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase;
}

.hero__h1 .ln > span { display: inline-block; }
.js .hero__h1 .ln > span { opacity: 0; }
.js .hero__h1 .ln::after {
  content: ""; position: absolute; inset: -12% -40%;
  background: var(--mac-blue); transform: skewX(var(--shear)) translateX(-150%);
}
.js .hero .dashes i { transform: skewX(var(--shear)) scaleX(0); transform-origin: left; }
.js .hero__actions, .js .hero__foot { opacity: 0; }

.is-ready .hero__h1 .ln::after { animation: wipe 760ms var(--ease-out) forwards; }
.is-ready .hero__h1 .ln > span { animation: lineIn 760ms var(--ease-out) forwards; }
.is-ready .hero__h1 .ln:nth-child(2)::after,
.is-ready .hero__h1 .ln:nth-child(2) > span { animation-delay: 115ms; }
.is-ready .hero__h1 .ln:nth-child(3)::after,
.is-ready .hero__h1 .ln:nth-child(3) > span { animation-delay: 230ms; }
.is-ready .hero__h1 .ln:nth-child(4)::after,
.is-ready .hero__h1 .ln:nth-child(4) > span { animation-delay: 345ms; }
.is-ready .hero .dashes i { animation: dashIn 420ms var(--ease-out) forwards; }
.is-ready .hero .dashes i:nth-child(2) { animation-delay: 90ms; }
.is-ready .hero__actions { animation: riseIn 420ms var(--ease-out) 620ms forwards; }
.is-ready .hero__foot   { animation: riseIn 420ms var(--ease-out) 760ms forwards; }

@keyframes wipe {
  0%   { transform: skewX(-18deg) translateX(-150%); }
  46%  { transform: skewX(-18deg) translateX(0%); }
  100% { transform: skewX(-18deg) translateX(150%); }
}
@keyframes lineIn { 0%, 43% { opacity: 0; } 56%, 100% { opacity: 1; } }
@keyframes dashIn { to { transform: skewX(-18deg) scaleX(1); } }
@keyframes riseIn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }

/* --- 1b  Image with EST-bar caption ------------------------- */
.fig-1b { position: relative; padding-bottom: 22px; }
.fig-1b > img, .fig-1b > picture > img { width: 100%; }

.fig-1b--crop > img, .fig-1b--crop > picture > img { height: var(--fig-h, clamp(320px, 34vw, 470px)); object-fit: cover; }
.fig-1b__cap { position: absolute; left: -10px; bottom: 6px; display: flex; flex-direction: column; gap: 5px; max-width: calc(100% + 10px); }
.fig-1b__bar {
  height: 38px; background: var(--ink-900); transform: skewX(var(--shear));
  display: flex; align-items: center; padding: 0 26px 0 22px;
}
.fig-1b__bar span {
  transform: skewX(var(--unshear));
  font-family: var(--font-body); font-weight: 700; font-size: 14px;
  letter-spacing: .12em; text-transform: uppercase; color: #e7e9ec; white-space: nowrap;
}
.fig-1b__rule { height: 5px; width: 76%; background: var(--mac-blue); transform: skewX(var(--shear)); }

.band--dark .fig-1b__bar { background: #fff; }
.band--dark .fig-1b__bar span { color: var(--ink-900); }
.fig-1b--flush .fig-1b__cap { left: 0; }

/* --- 1l  Stat row ------------------------------------------- */
.stats { display: flex; align-items: stretch; }
.stat { flex: 1; padding-inline: clamp(14px, 3vw, 34px); }
.stat:first-child { padding-left: 0; }
.stat:last-child { padding-right: 0; }
.stat__n {
  font-family: var(--font-display); font-weight: 800; font-style: italic;
  font-size: clamp(46px, 7vw, 62px); line-height: 1; color: var(--ink-900);
}
.stat__n em { font-style: italic; color: var(--mac-blue); }
.stat__l { margin-top: 8px; }
.stat-sep { width: 3px; background: var(--ink-200); transform: skewX(var(--shear)); flex: none; }

/* --- 1j / 1k  Sector cards ---------------------------------- */
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s-5); }

.grid-3 > [id] { scroll-margin-top: 24px; }

.card-1j {
  display: flex; flex-direction: column; background: #fff;
  border: 1px solid var(--border); text-decoration: none;
  transition: border-color var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out);
}
.card-1j:hover { border-color: var(--ink-300); box-shadow: var(--shadow-2); }
.card-1j__media { position: relative; display: block; }
.card-1j__media img { width: 100%; height: 190px; object-fit: cover; clip-path: polygon(0 0, 100% 0, 100% 84%, 0 100%); }
.chip {
  position: absolute; top: 14px; right: 16px;
  font-family: var(--font-mono); font-size: 11px; letter-spacing: .08em;
  color: #fff; background: rgba(11,13,16,.72); padding: 4px 8px;
}
.card-1j__body { padding: 6px 22px 24px; display: flex; flex-direction: column; flex: 1; }
.card-1j__t { display: block; font-family: var(--font-display); font-weight: 800; font-style: italic; text-transform: uppercase; font-size: 30px; line-height: 1; color: var(--ink-900); }
.card-1j__p { display: block; margin: 8px 0 0; font-size: 14px; line-height: 1.5; color: var(--ink-500); }
.card-1j__rule { display: block; margin-top: auto; padding-top: 14px; }
.card-1j__rule i { display: block; height: 5px; width: 44px; background: var(--mac-blue); transform: skewX(var(--shear)); transition: width var(--dur-base) var(--ease-out); }
.card-1j:hover .card-1j__rule i { width: 78px; }

.card-1k {
  display: flex; flex-direction: column; justify-content: space-between;
  min-height: 230px; background: var(--ink-900); padding: 24px 24px 22px;
  position: relative; overflow: hidden; text-decoration: none;
  transition: background var(--dur-base) var(--ease-out);
}

.card-1k::before {
  content: ""; position: absolute; top: 0; bottom: 0; right: -34px; width: 44px;
  background: var(--mac-blue); transform: skewX(var(--shear)); opacity: .9;
  transition: right var(--dur-base) var(--ease-out);
}
.card-1k:hover { background: var(--ink-800); }
.card-1k:hover::before { right: -20px; }
/* ink-300 not ink-400 here: 9.05:1 on ink-900 instead of 4.45:1 */
.card-1k__meta { display: block; position: relative; font-family: var(--font-mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-300); }
.card-1k__foot { display: block; position: relative; }
.card-1k__t { display: block; font-family: var(--font-display); font-weight: 800; font-style: italic; text-transform: uppercase; font-size: 34px; line-height: .95; color: #fff; }
.card-1k__p { display: block; margin: 8px 0 0; max-width: 26ch; font-size: 13.5px; line-height: 1.5; color: var(--ink-300); }

/* --- 1o  Diagonal break ------------------------------------- */

.break-1o { position: relative; height: clamp(44px, 4.4vw, 96px); background: var(--ink-900); clip-path: polygon(0 100%, 100% 0, 100% 100%, 0 100%); margin-top: -1px; margin-bottom: -1px; }
.break-1o i { position: absolute; right: 8%; top: 46%; width: 100px; height: 8px; background: var(--mac-blue); transform: rotate(-2.52deg) skewX(var(--shear)); }

/* --- Case study --------------------------------------------- */
.split { display: grid; grid-template-columns: 1.05fr 1fr; gap: clamp(28px, 5vw, 68px); align-items: center; }
.split--wide { grid-template-columns: 1fr 1.15fr; }
.split--top { align-items: start; }
/* The scaffold tower sits low in the frame; bias the crop down. */
.fig-1b--case > img, .fig-1b--case > picture > img { object-position: 50% 62%; }

/* --- 1n  Accreditation rail --------------------------------- */
.rail__head { display: flex; justify-content: space-between; align-items: baseline; padding-bottom: 10px; border-bottom: 1px solid var(--ink-100); }
.rail__logos { display: flex; align-items: center; gap: 34px; flex-wrap: wrap; padding-top: 26px; }
.rail__logos img { width: auto; }

/* --- Footer ------------------------------------------------- */
.site-foot { background: var(--ink-900); color: var(--ink-300); padding-block: clamp(48px, 6vw, 72px) 34px; }
.foot-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: var(--s-6); }

.foot-h { font-family: var(--font-body); font-weight: 700; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-350); margin: 0 0 var(--s-3); }
.site-foot a { color: #fff; text-decoration: none; display: inline-block; padding-block: 11px; margin-block: -4px; }
.site-foot a:hover { color: var(--mac-blue); }
.foot-links { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; font-size: 14.5px; }
.foot-links a { display: block; }
.foot-tag { font-family: var(--font-display); font-weight: 800; font-style: italic; text-transform: uppercase; font-size: clamp(28px, 4vw, 40px); line-height: .95; color: #fff; margin: 0; }
.foot-base { display: flex; align-items: center; justify-content: space-between; gap: var(--s-4); flex-wrap: wrap; margin-top: clamp(40px, 5vw, 60px); padding-top: 22px; border-top: 1px solid var(--ink-800); }
.foot-base .mono { color: var(--ink-350); }

.foot-base__end { display: flex; align-items: center; gap: var(--s-4); flex-wrap: wrap; }

a.foot-social {
  display: grid; place-items: center;
  width: 44px; height: 44px; padding: 0; margin: 0;
}
a.foot-social svg { display: block; }

/* --- Scroll reveal: one per section, fade-up 12px / 300ms ---- */

.js .reveal { opacity: 0; transform: translateY(20px); }
.reveal.is-in {
  opacity: 1; transform: none;
  transition: opacity var(--dur-reveal) var(--ease-reveal),
              transform var(--dur-reveal) var(--ease-reveal);
}

/* --- Scroll detail ------------------------------------------- */

.js .reveal--bare { opacity: 1; transform: none; }

.js .reveal--stagger { transform: none; }

/* 1f slash underline wipes out from the left, ink then blue. */
.js .reveal .slash-rule span { transform: skewX(var(--shear)) scaleX(0); transform-origin: left center; }
.reveal.is-in .slash-rule span { transform: skewX(var(--shear)) scaleX(1); transition: transform 720ms var(--ease-reveal) 240ms; }
.reveal.is-in .slash-rule span:last-child { transition-delay: 420ms; }

.js .reveal .stat-sep { transform: skewX(var(--shear)) scaleY(0); transform-origin: center top; }
.reveal.is-in .stat-sep { transform: skewX(var(--shear)) scaleY(1); transition: transform 820ms var(--ease-reveal) 260ms; }

/* Sector cards arrive one after another, 140ms apart. */
.js .reveal .grid-3 > * { opacity: 0; transform: translateY(24px); }

.reveal.is-in .grid-3 > * {
  opacity: 1; transform: none;
  transition: opacity var(--dur-reveal) var(--ease-reveal),
              transform var(--dur-reveal) var(--ease-reveal),
              border-color var(--dur-base) var(--ease-out),
              box-shadow var(--dur-base) var(--ease-out),
              background var(--dur-base) var(--ease-out);
}
.reveal.is-in .grid-3 > *:nth-child(2) { transition-delay: 140ms; }
.reveal.is-in .grid-3 > *:nth-child(3) { transition-delay: 280ms; }

.js .reveal .crew-grid > * { opacity: 0; transform: translateY(20px); }
.reveal.is-in .crew-grid > * {
  opacity: 1; transform: none;
  transition: opacity var(--dur-reveal) var(--ease-reveal),
              transform var(--dur-reveal) var(--ease-reveal);
}
.reveal.is-in .crew-grid > *:nth-child(2)  { transition-delay:  50ms; }
.reveal.is-in .crew-grid > *:nth-child(3)  { transition-delay: 100ms; }
.reveal.is-in .crew-grid > *:nth-child(4)  { transition-delay: 150ms; }
.reveal.is-in .crew-grid > *:nth-child(5)  { transition-delay: 200ms; }
.reveal.is-in .crew-grid > *:nth-child(6)  { transition-delay: 250ms; }
.reveal.is-in .crew-grid > *:nth-child(7)  { transition-delay: 300ms; }
.reveal.is-in .crew-grid > *:nth-child(8)  { transition-delay: 350ms; }
.reveal.is-in .crew-grid > *:nth-child(9)  { transition-delay: 400ms; }
.reveal.is-in .crew-grid > *:nth-child(10) { transition-delay: 450ms; }

/* The 1o blue dash runs in along the cut it sits on. */
.js .break-1o i { transform: rotate(-2.52deg) skewX(var(--shear)) scaleX(0); transform-origin: right center; }
.break-1o.is-in i { transform: rotate(-2.52deg) skewX(var(--shear)) scaleX(1); transition: transform 900ms var(--ease-reveal) 160ms; }

.js .reveal .rail__logos img { opacity: 0; transform: translateY(14px); }
.reveal.is-in .rail__logos img { opacity: 1; transform: none; transition: opacity 560ms var(--ease-reveal), transform 560ms var(--ease-reveal); }
.reveal.is-in .rail__logos img:nth-child(2) { transition-delay: 70ms; }
.reveal.is-in .rail__logos img:nth-child(3) { transition-delay: 140ms; }
.reveal.is-in .rail__logos img:nth-child(4) { transition-delay: 210ms; }
.reveal.is-in .rail__logos img:nth-child(5) { transition-delay: 280ms; }
.reveal.is-in .rail__logos img:nth-child(6) { transition-delay: 350ms; }
.reveal.is-in .rail__logos img:nth-child(7) { transition-delay: 420ms; }

/* --- Hover detail -------------------------------------------- */

.tlink::after {
  content: "→"; display: inline-block; margin-left: 8px;
  transition: transform var(--dur-base) var(--ease-out);
}
.tlink:hover::after, .tlink:focus-visible::after { transform: translateX(5px); }

.card-1j__media { overflow: hidden; clip-path: polygon(0 0, 100% 0, 100% 84%, 0 100%); }
.card-1j__media img { clip-path: none; transition: transform 620ms var(--ease-out); }
.card-1j:hover .card-1j__media img { transform: scale(1.045); }

/* --- Responsive --------------------------------------------- */
@media (max-width: 1080px) {
  .nav-toggle { display: grid; }

  .nav {
    display: flex; flex-direction: column; align-items: flex-start; gap: 0;
    position: absolute; left: 0; right: 0; top: 100%;
    background: var(--ink-900); padding: var(--s-4) var(--gut) var(--s-6);
    visibility: hidden; opacity: 0; transform: translateY(-10px);
    transition: opacity var(--dur-base) var(--ease-out),
                transform var(--dur-base) var(--ease-out),
                visibility 0s linear var(--dur-base);
  }
  .nav.is-open {
    visibility: visible; opacity: 1; transform: translateY(0);
    transition: opacity var(--dur-base) var(--ease-out),
                transform var(--dur-base) var(--ease-out),
                visibility 0s;
  }

  .nav a,
  .nav a:hover,
  .nav a[aria-current="page"],
  .nav a[data-nav-section] { color: #fff; }

  .nav a {
    font-size: 17px; padding: 13px 0; width: 100%;
    border-bottom: 1px solid var(--ink-800);
    opacity: 0; transform: translateY(-8px);
    transition: color var(--dur-fast) var(--ease-out),
                opacity var(--dur-base) var(--ease-out),
                transform var(--dur-base) var(--ease-out);
  }
  .nav.is-open a { opacity: 1; transform: translateY(0); }

  .nav:not(.is-open) a { visibility: hidden; }

  .nav-group {
    display: flex; flex-direction: column; align-items: stretch; width: 100%;
  }
  .nav-caret { display: none; }

  .nav-panel,
  .nav-panel.is-open,
  .nav-group.is-shut .nav-panel,
  .nav-group:hover .nav-panel,
  .nav-group:focus-within .nav-panel {
    position: static; min-width: 0; padding: 0 0 0 var(--s-5);
    background: none; border: 0; box-shadow: none;
    visibility: inherit; opacity: 1; transform: none; transition: none;
  }

  .nav-panel a { display: block; min-height: 0; }

  .nav a.nav-social {
    display: flex; align-items: center; justify-content: flex-start;
    gap: 11px; height: auto;
  }
  .nav a.nav-social .vh {
    position: static; width: auto; height: auto; margin: 0;
    overflow: visible; white-space: normal; clip: auto; clip-path: none;
  }

  .nav a[data-nav-section]::after { right: 100%; }

  .break-1o i { display: none; }
}
@media (max-width: 900px) {

  .grid-3 { grid-template-columns: 1fr; }
  .card-1j__media img { height: 240px; }
  .card-1k { min-height: 200px; }
  .split, .split--wide { grid-template-columns: 1fr; }
  .foot-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  body { font-size: 16px; }

  .card-1j__media img { height: 200px; }
  .foot-grid { grid-template-columns: 1fr; }
  .stats { flex-wrap: wrap; gap: var(--s-5) 0; }
  .stat { flex: 1 1 100%; padding-inline: 0; }
  .stat-sep { display: none; }
  .stat + .stat { padding-top: var(--s-5); border-top: 1px solid var(--ink-100); }
  .hero { min-height: min(92svh, 680px); }
  .hero__foot { display: none; }
  .hero__actions .btn { width: 100%; }
  .rail__logos { gap: 22px 26px; }
  .rail__logos img { height: 30px !important; }
  .fig-1b__bar { height: 34px; padding: 0 20px 0 16px; }
  .fig-1b__bar span { font-size: 12px; letter-spacing: .1em; }
}

/* --- Motion preferences ------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important; animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
  .js .hero__h1 .ln > span,
  .js .hero__actions,
  .js .hero__foot,
  .js .reveal,
  .js .reveal .grid-3 > *,
  .js .reveal .crew-grid > *,
  .js .reveal .rail__logos img { opacity: 1; transform: none; }
  .js .hero__h1 .ln::after { display: none; }

  .js .hero .dashes i { transform: skewX(var(--shear)); }
  .js .reveal .slash-rule span { transform: skewX(var(--shear)) scaleX(1); }
  .js .reveal .stat-sep { transform: skewX(var(--shear)) scaleY(1); }
  .js .break-1o i { transform: rotate(-2.52deg) skewX(var(--shear)) scaleX(1); }
  .js .card-1j:hover .card-1j__media img { transform: none; }

  .nav, .nav-panel { transition-delay: 0s !important; }
}

/* ============================================================
   INNER PAGES
   ============================================================ */

/* --- Page hero (inner pages) — NEW ELEMENT ------------------- */
.page-hero { position: relative; overflow: hidden; padding-block: 0; }
.page-hero .wrap {
  display: flex; align-items: center; flex-wrap: wrap;
  gap: 0 var(--s-5); min-height: 62px;
}

.page-hero__title { display: flex; align-items: center; gap: 11px; }
.page-hero__title .crumb { margin: 0; }
.page-hero .display {
  font-family: var(--font-body); font-weight: 700; font-style: normal;
  font-size: 14px; letter-spacing: .1em; line-height: 1;
}

/* The fact rides the same row, pushed right. */
.page-hero__util {
  display: flex; align-items: center; flex-wrap: wrap;
  gap: 10px var(--s-5); margin-left: auto;
}
.page-hero__fact {
  margin: 0; font-family: var(--font-mono); font-size: 11px;
  letter-spacing: .1em; text-transform: uppercase; color: var(--ink-350);
}

.crumb {
  display: flex; align-items: center; gap: 11px;
  margin: 0 0 clamp(18px, 2.4vw, 30px);
  font-family: var(--font-mono); font-size: 11px;
  letter-spacing: .1em; text-transform: uppercase; color: var(--ink-350);
}
.crumb a { position: relative; color: var(--ink-300); text-decoration: none; transition: color var(--dur-fast) var(--ease-out); }
.crumb a::before { content: ""; position: absolute; inset: -14px -8px; }
.crumb a:hover { color: #fff; }

.crumb i { display: block; width: 2px; height: 11px; background: var(--ink-400); transform: skewX(var(--shear)); }

/* Micro type on dark bands takes the ink-background value. */
.band--dark .mono, .band--dark .micro { color: var(--ink-350); }

/* --- 1c  Offset ink plate ------------------------------------ */
.fig-1c { position: relative; margin: 0; padding: 0 16px 16px 0; }
.fig-1c::before { content: ""; position: absolute; top: 16px; left: 16px; right: 0; bottom: 0; background: var(--ink-900); }
.fig-1c img { position: relative; width: 100%; height: var(--fig-h, clamp(300px, 32vw, 440px)); object-fit: cover; }
/* Optional 10px mono micro-caption on the exposed plate edge. */
.fig-1c__cap {
  position: absolute; right: 6px; bottom: 0; height: 16px;
  display: flex; align-items: center;
  font-family: var(--font-mono); font-size: 10px; line-height: 1;
  letter-spacing: .1em; text-transform: uppercase; color: #fff;
}

/* --- Type-led proof panel (1k, portrait) --------------------- */
.panel-1k {
  position: relative; overflow: hidden;
  display: flex; flex-direction: column; justify-content: space-between;
  min-height: var(--fig-h, clamp(300px, 32vw, 440px));
  background: var(--ink-900); color: #fff;
  padding: clamp(24px, 2.6vw, 34px);
}

.panel-1k::before {
  content: ""; position: absolute; top: 0; bottom: 0; right: -52px; width: 40px;
  background: var(--mac-blue); transform: skewX(var(--shear)); opacity: .9;
}
.panel-1k__meta { position: relative; font-family: var(--font-mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-300); }
.panel-1k__body { position: relative; }
.panel-1k__n { font-family: var(--font-display); font-weight: 800; font-style: italic; text-transform: uppercase; font-size: clamp(56px, 7.4vw, 92px); line-height: .86; color: #fff; }
.panel-1k__n em { font-style: italic; color: var(--mac-blue); }

.panel-1k__n--marks { font-size: clamp(30px, 3.6vw, 44px); line-height: 1.02; letter-spacing: .01em; }
.panel-1k__p { margin: var(--s-4) 0 0; max-width: 30ch; font-size: 15px; line-height: 1.55; color: var(--ink-300); }

.panel-1k__note { position: relative; font-family: var(--font-mono); font-size: 10px; letter-spacing: .16em; text-transform: uppercase; color: var(--ink-350); margin: var(--s-5) 0 0; }

/* --- 1d  Sheared strip (section break) ----------------------- */
.strip-1d { display: flex; gap: 10px; overflow: hidden; padding-inline: var(--gut); height: clamp(190px, 24vw, 300px); }
.strip-1d > * { transform: skewX(var(--shear)); overflow: hidden; }
.strip-1d__ph { flex: 2; }
.strip-1d__ph img { width: 130%; height: 100%; object-fit: cover; transform: skewX(var(--unshear)) translateX(-10%); }
.strip-1d__bar { flex: none; width: 16px; background: var(--mac-blue); }
.strip-1d__panel { flex: 1; background: var(--ink-900); display: flex; align-items: flex-end; }
.strip-1d__panel span {
  transform: skewX(var(--unshear)); padding: 0 0 18px 30px;
  font-family: var(--font-display); font-weight: 800; font-style: italic;
  text-transform: uppercase; font-size: clamp(24px, 2.8vw, 34px); line-height: .95; color: #fff;
}

/* --- Sector sections ---------------------------------------- */
.sector-sec { padding-block: clamp(56px, 7.4vw, 96px); --fig-h: clamp(300px, 33vw, 460px); }

.sector-sec { border-top: 1px solid var(--border); }

.sec-ix { display: flex; align-items: center; gap: 11px; margin: 0 0 var(--s-4); font-family: var(--font-mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-400); }
.sec-ix i { display: block; width: 2px; height: 11px; background: var(--ink-200); transform: skewX(var(--shear)); }
.sector-sec .head-1f .display { font-size: clamp(36px, 5vw, 52px); }

@media (min-width: 901px) {
  .split--flip > *:nth-child(1) { grid-column: 2; grid-row: 1; }
  .split--flip > *:nth-child(2) { grid-column: 1; grid-row: 1; }
}

/* --- Closing CTA -------------------------------------------- */
.cta { display: grid; grid-template-columns: 1.15fr 1fr; gap: clamp(24px, 4vw, 64px); align-items: center; }
.cta__actions { display: flex; flex-wrap: wrap; gap: var(--s-4); }

/* --- Motion ------------------------------------------------- */

.js .page-hero__util, .js .page-hero__title { opacity: 0; }
.is-ready .page-hero__util, .is-ready .page-hero__title { animation: riseIn 520ms var(--ease-out) 80ms forwards; }
.is-ready .page-hero__util { animation-delay: 180ms; }

/* The 1d blue slash draws down its own shear. */
.js .reveal .strip-1d__bar { transform: skewX(var(--shear)) scaleY(0); transform-origin: center top; }
.reveal.is-in .strip-1d__bar { transform: skewX(var(--shear)) scaleY(1); transition: transform 820ms var(--ease-reveal) 200ms; }

/* --- Responsive --------------------------------------------- */
@media (max-width: 900px) {
  .cta { grid-template-columns: 1fr; }
  .strip-1d { height: clamp(170px, 34vw, 230px); }
}

@media (max-width: 700px) {
  .page-hero .wrap { padding-block: 14px; }
  .page-hero__util { width: 100%; margin-left: 0; margin-top: 6px; }
}
@media (max-width: 640px) {
  .sector-sec { --fig-h: clamp(240px, 62vw, 320px); }
  .panel-1k { padding: 24px 22px; }
  .strip-1d { gap: 8px; height: 190px; }
  .strip-1d__panel span { padding: 0 0 14px 22px; }
  .cta__actions .btn { width: 100%; }
}

/* --- Motion preferences ------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .js .page-hero__util, .js .page-hero__title { opacity: 1; transform: none; }

  .js .reveal .strip-1d__bar { transform: skewX(var(--shear)) scaleY(1); }
}

/* ============================================================
   PRODUCTION PAGES
   ============================================================ */

/* --- 1m  Leadership pull quote ------------------------------- */
.quote-1m {
  margin: var(--s-6) 0 0; padding-left: var(--s-5);
  border-left: 4px solid var(--mac-blue);
}
.quote-1m p {
  font-family: var(--font-display); font-weight: 700; font-style: italic;
  font-size: clamp(21px, 2vw, 26px); line-height: 1.25;
  color: var(--ink-900); margin: 0 0 var(--s-4);
}
.band--dark .quote-1m p { color: #fff; }
.quote-1m footer { padding-top: 2px; }
.quote-1m footer b {
  display: block; font-family: var(--font-body); font-weight: 700;
  font-size: 14px; letter-spacing: .08em; text-transform: uppercase;
  color: var(--ink-900); font-style: normal;
}
.band--dark .quote-1m footer b { color: #fff; }
.quote-1m footer span {
  display: block; margin-top: 3px; font-family: var(--font-mono);
  font-size: 11px; letter-spacing: .1em; text-transform: uppercase;
  color: var(--ink-400);
}
.band--dark .quote-1m footer span { color: var(--ink-350); }

/* --- MD statement band (About) ------------------------------- */
.md-note__q {
  margin: 0; max-width: 24em;
  font-family: var(--font-display); font-weight: 700; font-style: italic;
  font-size: clamp(23px, 2.9vw, 40px); line-height: 1.16; color: #fff;
}
.md-note__q p { margin: 0 0 .55em; }
.md-note__q p:last-child { margin-bottom: 0; }
.md-note .slash-rule { margin-top: clamp(26px, 3vw, 40px); }
.md-note__by {
  margin: var(--s-5) 0 0; font-family: var(--font-body); font-weight: 700;
  font-size: 14px; letter-spacing: .08em; text-transform: uppercase; color: #fff;
}
.md-note__meta { margin: var(--s-2) 0 0; }

.md-note--split .md-note__q { font-size: clamp(24px, 2.6vw, 30px); max-width: none; }

/* --- 1m.2  Attributed endorsement ---------------------------- */
.quote-1m2 { border-left: 0; position: relative; }
.quote-1m2::before {
  content: ""; position: absolute; left: -4px; top: 0;
  width: 4px; height: 60%; background: var(--mac-blue);
}

.panel-1k__facts { position: relative; list-style: none; margin: var(--s-5) 0 0; padding: 0; }
.panel-1k__facts li {
  padding: 13px 0; border-top: 1px solid var(--ink-800);
  font-size: 15px; line-height: 1.5; color: var(--ink-300);
}
.panel-1k__facts li:first-child { border-top: 0; padding-top: 0; }
.panel-1k__facts b { color: #fff; font-weight: 700; }

/* --- Leadership profiles (About) ----------------------------- */
.profile { padding-block: clamp(40px, 5vw, 64px); border-top: 1px solid var(--border); }
.profile .display { font-size: clamp(34px, 4.6vw, 48px); }

/* --- 1k panel, generic use ----------------------------------- */
.panel-1k--profile { --fig-h: clamp(320px, 36vw, 480px); }

.panel-1k--onink { background: var(--ink-800); outline: 1px solid var(--ink-700); outline-offset: -1px; }

.crew-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--s-4); }

.crew-card {
  position: relative; overflow: hidden;
  aspect-ratio: 3 / 4; background: var(--ink-900);
  display: flex; flex-direction: column; justify-content: flex-end;
}

.crew-card__win {
  position: relative; overflow: hidden; flex: 1 1 auto;
  background: var(--mac-blue);
  clip-path: polygon(0 0, 100% 0, 100% 86%, 0 100%);
}
.crew-card__win .crew-card__img,
.crew-card__win .crew-card__ph {
  position: absolute; inset: 0;
  clip-path: polygon(0 0, 100% 0, 100% 84%, 0 98%);
}
.crew-card__img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 18%; }

.crew-card__ph { display: grid; place-items: center; background: var(--ink-800); }
.crew-card__mono {
  font-family: var(--font-display); font-weight: 800; font-style: italic;
  text-transform: uppercase; font-size: clamp(46px, 5.4vw, 74px);
  line-height: 1; color: var(--ink-700); user-select: none;
}

.crew-card__cap { position: relative; z-index: 3; padding: 16px; }
.crew-card__n {
  margin: 0; font-family: var(--font-display); font-weight: 800; font-style: italic;
  text-transform: uppercase; line-height: .94; color: #fff;
  font-size: clamp(19px, 1.55vw, 25px);
}
.crew-card__r {
  margin: 7px 0 0; font-family: var(--font-mono); font-size: 10.5px;
  letter-spacing: .12em; text-transform: uppercase; line-height: 1.35;
  color: var(--ink-300);
}

/* --- Community follow prompt --------------------------------- */
.csr-follow {
  margin-top: clamp(40px, 5vw, 64px);
  padding-top: var(--s-6);
  border-top: 1px solid var(--ink-200);
}
.csr-follow__p { margin: 0 0 var(--s-5); color: var(--ink-600); max-width: 46ch; }

/* --- 1n expanded (Safety page) ------------------------------- */
.acc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-4); margin-top: var(--s-6); }
.acc-item {
  display: flex; align-items: center; gap: var(--s-5);
  border: 1px solid var(--ink-100); padding: 18px 22px; background: #fff;
}
.acc-item img { flex: none; }
.acc-item h3 {
  margin: 0; font-family: var(--font-body); font-weight: 700;
  font-size: 15px; letter-spacing: .02em; color: var(--ink-900);
}
.acc-item p { margin: 3px 0 0; font-size: 13.5px; line-height: 1.5; color: var(--ink-500); }
.acc-item:last-child:nth-child(odd) { grid-column: 1 / -1; }

/* --- Contact ------------------------------------------------- */
.contact-grid { display: grid; grid-template-columns: 1fr 1.1fr; gap: clamp(28px, 5vw, 68px); align-items: start; }
.nap { font-style: normal; line-height: 1.75; color: var(--ink-500); }
.nap b { display: block; color: var(--ink-900); font-weight: 700; }
.nap a { color: var(--ink-900); display: inline-block; padding-block: 11px; margin-block: -3px;
  text-decoration: underline 2px var(--mac-blue); text-underline-offset: 4px; }
.nap a:hover { color: var(--mac-blue-700); }
.map-link { display: block; text-decoration: none; }
.map-note { margin: 10px 0 0; }

.form { display: grid; gap: var(--s-5); }
.form label {
  display: block; margin-bottom: 8px;
  font-family: var(--font-body); font-weight: 700; font-size: 13px;
  letter-spacing: .1em; text-transform: uppercase; color: var(--ink-600);
}
.form input, .form textarea {
  width: 100%; height: 48px; padding: 0 14px;
  border: 2px solid var(--ink-200); background: #fff;
  font-family: var(--font-body); font-size: 16px; color: var(--ink-900);
  transition: border-color var(--dur-fast) var(--ease-out);
}
.form textarea { height: auto; min-height: 150px; padding: 12px 14px; resize: vertical; }
.form input:hover, .form textarea:hover { border-color: var(--ink-300); }
.form input:focus-visible, .form textarea:focus-visible {
  outline: 3px solid var(--mac-blue); outline-offset: 0; border-color: var(--ink-900);
}
.form-foot { display: flex; align-items: center; gap: var(--s-5); flex-wrap: wrap; }
.form-status { margin: 0; font-weight: 700; color: var(--ink-900); }
.form-status--err { color: #a4292f; }

.hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

/* --- Privacy prose ------------------------------------------- */
.prose { max-width: 70ch; }
.prose a { color: var(--ink-900); text-decoration: none; border-bottom: 2px solid var(--mac-blue); }
.prose a:hover { color: var(--mac-blue-700); }
.prose h2 {
  font-family: var(--font-display); font-weight: 800; font-style: italic;
  text-transform: uppercase; font-size: clamp(24px, 2.6vw, 30px);
  color: var(--ink-900); margin: var(--s-7) 0 var(--s-3);
}
.prose h2:first-child { margin-top: 0; }
.prose p, .prose li { color: var(--ink-500); }
.prose ul { margin: 0 0 var(--s-4); padding-left: 22px; }
.prose li { margin-bottom: 6px; }
.prose li::marker { color: var(--mac-blue); }

/* --- Responsive --------------------------------------------- */
@media (max-width: 1080px) {

  .crew-grid { grid-template-columns: repeat(2, 1fr); gap: var(--s-3); }
}
@media (max-width: 900px) {

  .acc-grid {
    display: flex; gap: var(--s-4); overflow-x: auto; overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory; scroll-padding-inline: var(--gut);

    margin-inline: calc(var(--gut) * -1); padding-inline: var(--gut);
    padding-bottom: 12px;
    scrollbar-width: thin; scrollbar-color: var(--mac-blue) var(--ink-100);
  }

  .acc-item {
    flex: 0 0 min(78vw, 320px); scroll-snap-align: start;
    flex-direction: column; align-items: flex-start; gap: var(--s-4);
  }

  .acc-item img { height: 34px !important; width: auto; }

  .acc-grid:focus-visible { outline: 3px solid var(--mac-blue); outline-offset: 4px; }

  .contact-grid { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .crew-card__cap { padding: 13px; }
}

@media (max-width: 420px) {
  .crew-card__n { font-size: 17px; }
  .crew-card__r { font-size: 10px; letter-spacing: .08em; margin-top: 5px; }
  .crew-card__cap { padding: 11px; }
}