/* ========================================================================== 
   HQ Supply Chain — Factory-to-door scroll narrative (homepage only)
   High-fidelity interaction study inspired by United Carriers; all artwork is
   original, code-authored and tied to HQ's confirmed operating language.
   ========================================================================== */

body[data-page="home"] {
  --hq-violet: #6e3ff3;
  --hq-violet-deep: #4f20da;
  --hq-violet-bright: #8d68ff;
  --hq-black: #070707;
  --hq-carbon: #111111;
  --hq-paper: #f5f5f2;
  --hq-rule-dark: rgba(255,255,255,.17);
  --hq-rule-light: rgba(7,7,7,.18);
  background: var(--hq-black);
  cursor: none;
}

body[data-page="home"] a,
body[data-page="home"] button { cursor: none; }
body[data-page="home"] .hq-journey { margin-top: calc(var(--nav-h) * -1); }
body[data-page="home"] .scroll-progress {
  position: fixed;
  inset: 0 auto auto 0;
  z-index: 120;
  width: 100%;
  height: 2px;
  background: var(--hq-violet-bright);
  transform: scaleX(0);
  transform-origin: left center;
  pointer-events: none;
}

/* Loader and cursor ------------------------------------------------------- */
.hq-loader {
  position: fixed;
  inset: 0;
  z-index: 999;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: var(--hq-black);
  color: #fff;
  isolation: isolate;
}
.hq-loader:not(.is-enhanced) { visibility: hidden; pointer-events: none; }
.hq-loader.is-enhanced { visibility: visible; background: transparent; }
.hq-loader.is-done { visibility: hidden; pointer-events: none; }

body[data-page="home"].is-loader-active { overflow: hidden; }
.hq-loader-gate {
  position: absolute;
  z-index: -2;
  inset-block: 0;
  width: calc(50% + 2px);
  background:
    linear-gradient(90deg,rgba(255,255,255,.018),transparent 22%),
    #050505;
  will-change: transform;
  transition: transform .72s cubic-bezier(.76,0,.24,1);
}
.hq-loader-gate--left { left: 0; border-right: 1px solid rgba(141,104,255,.22); }
.hq-loader-gate--right { right: 0; border-left: 1px solid rgba(141,104,255,.22); }
.hq-loader-scene {
  position: absolute;
  inset: 0;
  z-index: -1;
  overflow: hidden;
  opacity: 1;
  transition: opacity .24s ease, transform .44s cubic-bezier(.16,1,.3,1);
}
.hq-loader-scene::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size: 48px 48px;
  -webkit-mask-image: linear-gradient(90deg,rgba(0,0,0,.78),transparent 74%);
  mask-image: linear-gradient(90deg,rgba(0,0,0,.78),transparent 74%);
}
.hq-loader-scene::after {
  content: "";
  position: absolute;
  top: -25%;
  bottom: -25%;
  left: -22%;
  width: 14%;
  background: linear-gradient(90deg,transparent,rgba(141,104,255,.16),rgba(255,255,255,.13),transparent);
  filter: blur(8px);
  transform: skewX(-15deg);
  animation: hqLoaderSweep 1.45s cubic-bezier(.22,.61,.36,1) .12s both;
}
.hq-loader-canvas { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; }
.hq-loader-mascot {
  position: absolute;
  z-index: 0;
  top: 38%;
  left: 21.5%;
  width: min(380px,29vw);
  translate: -50% -50%;
  text-align: center;
  pointer-events: none;
  animation: hqLoaderMascotIn .95s cubic-bezier(.16,1,.3,1) .24s both;
}
.hq-loader-mascot img {
  width: 100%;
  opacity: .92;
  filter: drop-shadow(0 14px 34px rgba(110,63,243,.3));
}
.hq-loader-mascot span {
  display: none;
}
.hq-loader-ui {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: grid;
  grid-template-rows: auto 1fr auto;
  padding: clamp(22px,3vw,48px);
}
.hq-loader-meta,
.hq-loader-foot,
.hq-loader-status-line,
.hq-loader-coordinates {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.hq-loader-meta,
.hq-loader-coordinates {
  color: rgba(255,255,255,.48);
  font-size: 10px;
  line-height: 1;
  letter-spacing: .15em;
  text-transform: uppercase;
}
.hq-loader-meta span:first-child { color: rgba(255,255,255,.86); }
.hq-loader-meta i {
  width: 6px;
  height: 6px;
  margin-right: 8px;
  display: inline-block;
  border-radius: 50%;
  background: var(--hq-violet-bright);
  box-shadow: 0 0 18px rgba(141,104,255,.8);
  animation: hqLoaderPulse .9s ease-in-out infinite alternate;
}
.hq-loader-lockup {
  position: absolute;
  top: 63%;
  left: clamp(48px,7vw,110px);
  width: min(430px,36vw);
  animation: hqLoaderLockup .7s cubic-bezier(.16,1,.3,1) .12s both;
}
.hq-loader-lockup::before {
  content: "";
  display: block;
  width: 92px;
  height: 3px;
  background: var(--hq-violet-bright);
  transform-origin: left;
  animation: hqLoaderRouteLine .9s cubic-bezier(.16,1,.3,1) .34s both;
}
.hq-loader-lockup p {
  max-width: 34ch;
  margin-top: 18px;
  color: rgba(255,255,255,.72);
  font-size: clamp(13px,1.2vw,17px);
  line-height: 1.45;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.hq-loader-foot {
  position: absolute;
  right: clamp(22px,3vw,48px);
  bottom: clamp(22px,3vw,48px);
  left: clamp(22px,3vw,48px);
  gap: 28px;
}
.hq-loader-progress-wrap { flex: 1; max-width: 720px; }
.hq-loader-status-line {
  margin-bottom: 11px;
  color: rgba(255,255,255,.68);
  font-size: 10px;
  line-height: 1;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.hq-loader-status-line output { color: #fff; font: inherit; font-size: 12px; }
.hq-loader-progress { height: 2px; overflow: hidden; background: rgba(255,255,255,.16); }
.hq-loader-progress i {
  display: block;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg,#6e3ff3,#a786ff 74%,#fff);
  transform: scaleX(var(--loader-progress,0));
  transform-origin: left;
  will-change: transform;
}
.hq-loader-coordinates { min-width: min(440px,32vw); }
.hq-loader-coordinates span:last-child {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .18em;
  text-shadow: 0 4px 18px rgba(141,104,255,.42);
}
.hq-loader-coordinates span:last-child::before {
  content: "";
  width: 22px;
  height: 2px;
  background: var(--hq-violet-bright);
}
.hq-loader.is-leaving .hq-loader-scene { opacity: 0; transform: scale(1.015); }
.hq-loader.is-leaving .hq-loader-gate--left { transform: translate3d(-101%,0,0); }
.hq-loader.is-leaving .hq-loader-gate--right { transform: translate3d(101%,0,0); }

@keyframes hqLoaderSweep { from { translate: 0; } to { translate: 1050%; } }
@keyframes hqLoaderPulse { to { opacity: .36; scale: .72; } }
@keyframes hqLoaderLockup { from { opacity: 0; transform: translateY(34px); filter: blur(8px); } }
@keyframes hqLoaderRouteLine { from { transform: scaleX(0); } }
@keyframes hqLoaderMascotIn {
  from { opacity: 0; clip-path: inset(0 100% 0 0); scale: .94; }
  to { opacity: 1; clip-path: inset(0); scale: 1; }
}

.hq-cursor {
  position: fixed;
  z-index: 998;
  top: 0;
  left: 0;
  width: 64px;
  height: 52px;
  pointer-events: none;
  transform: translate3d(-80px,-80px,0);
}
.hq-cursor::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url('/assets/img/hq-mascot-cursor.webp') center / contain no-repeat;
  filter: drop-shadow(0 3px 5px rgba(0,0,0,.48));
  transform: scale(.84);
  transition: transform .24s cubic-bezier(.16,1,.3,1), filter .24s ease;
}
.hq-cursor span {
  position: absolute;
  z-index: 1;
  top: 55%;
  left: 50%;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(110,63,243,.45),0 0 12px rgba(141,104,255,.9);
  transform: translate(-50%,-50%);
  transition: scale .16s ease;
}
.hq-cursor.is-link::before { transform: scale(1.04) rotate(-2deg); filter: drop-shadow(0 5px 9px rgba(0,0,0,.55)) drop-shadow(0 0 8px rgba(110,63,243,.45)); }
.hq-cursor.is-link span { scale: 1.45; }
.hq-cursor.is-pressed::before { transform: scale(.76) translateY(2px); }
.hq-cursor.is-pressed span { scale: .7; }

/* Homepage navigation treatment ----------------------------------------- */
body[data-page="home"] .nav {
  color: #fff;
  background: linear-gradient(180deg,rgba(5,5,5,.88),rgba(5,5,5,.44) 76%,transparent);
  border-bottom-color: rgba(255,255,255,.08);
  backdrop-filter: none;
}
/* Full circular lockup: use the transparent bright treatment on the dark
   hero/nav, then swap to the purple-on-light artwork when the nav crosses a
   light section. */
body[data-page="home"] .nav .brand-logo-img {
  content: url("/assets/img/brand/hq-supply-chain-logo-dark.webp");
}

/* Homepage brand lockup: make the supplied HQ Supply Chain mark legible at a glance. */
body[data-page="home"] .nav .brand-logo-img { width: 56px; height: 56px; }
body[data-page="home"] .nav .logo { gap: 12px; }
body[data-page="home"] .nav .logo-mark { font-size: 23px; }
body[data-page="home"] .nav .logo-sub { font-size: 11.5px; letter-spacing: .1em; }
body[data-page="home"][data-nav-tone="light"] .nav .brand-logo-img {
  content: url("/assets/img/brand/hq-supply-chain-logo-light.webp");
}
body[data-page="home"] .announce { background: rgba(0,0,0,.86); border-bottom: 1px solid rgba(255,255,255,.12); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; }
body[data-page="home"] .nav.scrolled { background: rgba(7,7,7,.96); border-bottom-color: rgba(255,255,255,.14); backdrop-filter: none; }
body[data-page="home"] .logo-mark,
body[data-page="home"] .logo-sub,
body[data-page="home"] .nav-link,
body[data-page="home"] .nav-links > .nav-item > a,
body[data-page="home"] .nav-login { color: #fff; }
body[data-page="home"] .logo-sub,
body[data-page="home"] .nav-link,
body[data-page="home"] .nav-links > .nav-item > a,
body[data-page="home"] .nav-login { opacity: .72; }
body[data-page="home"] .nav-link:hover,
body[data-page="home"] .nav-links > .nav-item > a:hover,
body[data-page="home"] .nav-login:hover { color: #fff; opacity: 1; }
body[data-page="home"] .nav-toggle { background: rgba(255,255,255,.12); }
body[data-page="home"] .nav-toggle span,
body[data-page="home"] .nav-toggle span::before,
body[data-page="home"] .nav-toggle span::after { background: #fff; }
body[data-page="home"] .nav-toggle.open span { background: transparent; }
body[data-page="home"][data-nav-tone="light"] .nav { color: var(--hq-black); background: rgba(245,245,242,.98); border-bottom-color: rgba(7,7,7,.12); backdrop-filter: none; }
body[data-page="home"][data-nav-tone="light"] .logo-mark,
body[data-page="home"][data-nav-tone="light"] .logo-sub,
body[data-page="home"][data-nav-tone="light"] .nav-link,
body[data-page="home"][data-nav-tone="light"] .nav-links > .nav-item > a,
body[data-page="home"][data-nav-tone="light"] .nav-login { color: var(--hq-black); }
body[data-page="home"][data-nav-tone="light"] .nav-toggle { background: rgba(7,7,7,.08); }
body[data-page="home"][data-nav-tone="light"] .nav-toggle span,
body[data-page="home"][data-nav-tone="light"] .nav-toggle span::before,
body[data-page="home"][data-nav-tone="light"] .nav-toggle span::after { background: var(--hq-black); }
body[data-page="home"][data-nav-tone="light"] .nav-toggle.open span { background: transparent; }
body[data-page="home"] .nav-drop { color: var(--ink); cursor: auto; }
body[data-page="home"] .nav-drop a { cursor: none; }

/* Shared homepage objects ------------------------------------------------ */
.hq-journey { position: relative; overflow: clip; background: var(--hq-paper); color: var(--hq-black); }
.hq-journey h1,.hq-journey h2,.hq-journey h3 {
  font-family: "Avenir Next Condensed", "Arial Narrow", Impact, sans-serif;
  font-stretch: condensed;
  font-weight: 700;
  text-wrap: balance;
}
.hq-journey .i { width: 1em; height: 1em; }
.hq-pill {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 0 22px;
  border: 1px solid transparent;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  transition: transform .35s cubic-bezier(.2,.8,.2,1), background-color .35s, color .35s;
}
.hq-pill:hover { transform: translateY(-3px); }
.hq-pill--light { background: #fff; color: var(--hq-black); }
.hq-pill--light:hover { background: var(--hq-violet); color: #fff; }
.hq-pill--line { border-color: rgba(255,255,255,.42); color: #fff; }
.hq-pill--line:hover { background: #fff; color: var(--hq-black); }
.hq-pill--dark { background: var(--hq-black); color: #fff; }
.hq-pill--dark:hover { background: var(--hq-violet); }

/* Hero ------------------------------------------------------------------- */
.hq-hero { position: relative; height: 250vh; background: var(--hq-black); color: #fff; }
.hq-hero-sticky { position: sticky; top: 0; height: 100vh; min-height: 700px; overflow: hidden; isolation: isolate; }
.hq-globe { position: absolute; z-index: -2; inset: 0 0 0 auto; width: 68%; height: 100%; contain: strict; transform: translateZ(0); touch-action: pan-y; cursor: grab; }
.hq-globe.is-dragging { cursor: grabbing; }
.hq-hero-noise {
  position: absolute;
  z-index: -1;
  inset: 0;
  opacity: .33;
  background-image: radial-gradient(circle at 50% 40%,transparent 0 45%,rgba(0,0,0,.56) 78%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96' viewBox='0 0 96 96'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.76' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.13'/%3E%3C/svg%3E");
  pointer-events: none;
}
.hq-hero-atmosphere {
  position: absolute;
  z-index: 3;
  inset: 0;
  opacity: 0;
  pointer-events: none;
  transform: translate3d(0,100%,0);
  will-change: transform,opacity;
  background:
    radial-gradient(ellipse 112% 58% at 50% 49%,rgba(147,62,255,.96) 0,rgba(75,44,232,.72) 34%,rgba(36,55,219,.24) 63%,transparent 79%),
    linear-gradient(180deg,transparent 0 18%,rgba(39,12,93,.12) 28%,rgba(74,26,195,.78) 47%,#3138d8 62%,#66a9f5 76%,#d9effd 89%,var(--hq-paper) 98%);
}
.hq-hero-atmosphere::before {
  content: "";
  position: absolute;
  inset: 26% -8% 0;
  opacity: .48;
  background: radial-gradient(ellipse 90% 30% at 50% 28%,rgba(178,86,255,.8),transparent 72%);
  filter: blur(34px);
}
.hq-hero-atmosphere::after {
  content: "";
  position: absolute;
  inset: 68% 0 0;
  background: linear-gradient(180deg,rgba(245,245,242,0),var(--hq-paper) 72%);
}
.hq-hero-grid { width: min(1440px,100%); height: 100%; margin: 0 auto; padding: clamp(150px,18vh,200px) var(--gutter) 86px; display: grid; grid-template-columns: minmax(0,1fr) minmax(300px,.55fr); position: relative; z-index: 2; }
.hq-hero-copy { align-self: center; max-width: 850px; }
.hq-route-state { display: flex; align-items: center; gap: 9px; margin-bottom: 24px; font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.hq-route-state span { width: 8px; height: 8px; border-radius: 50%; background: var(--hq-violet-bright); box-shadow: 0 0 20px rgba(141,104,255,.8); }
.hq-hero h1 { max-width: 900px; font-size: clamp(70px,8.3vw,134px); font-weight: 600; line-height: .83; letter-spacing: -.07em; text-transform: uppercase; }
.hq-hero-lede { max-width: 490px; margin-top: 30px; color: rgba(255,255,255,.7); font-size: clamp(15px,1.3vw,18px); line-height: 1.35; }
.hq-hero-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 34px; }
.hq-hero-readout { align-self: end; justify-self: end; display: grid; gap: 3px; width: 180px; padding-top: 14px; border-top: 1px solid var(--hq-rule-dark); font-size: var(--type-meta); letter-spacing: .08em; text-transform: uppercase; }
.hq-hero-readout b { color: var(--hq-violet-bright); font-size: 18px; letter-spacing: -.02em; }
.hq-hero-readout small { color: rgba(255,255,255,.5); }
.hq-route-tags { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.hq-route-tag { position: absolute; display: flex; align-items: center; gap: 7px; padding: 5px 8px; border: 1px solid rgba(255,255,255,.48); background: rgba(4,3,10,.82); color: #fff; box-shadow: 0 8px 24px rgba(0,0,0,.34),inset 0 0 0 1px rgba(151,101,255,.08); font-size: var(--type-meta); font-weight: 700; letter-spacing: .075em; line-height: 1; text-shadow: 0 0 12px rgba(255,255,255,.38); white-space: nowrap; }
.hq-route-tag i { width: 6px; height: 6px; flex: 0 0 6px; border-radius: 50%; background: var(--hq-violet-bright); box-shadow: 0 0 10px currentColor; animation: tagPulse 1.8s ease-in-out infinite; }
.hq-route-tag.is-origin { border-color: rgba(232,132,255,.78); background: rgba(18,4,27,.88); }
.hq-route-tag.is-origin i,.hq-route-tag[data-region="origin"] i { background: #ed74ff; color: #ed74ff; }
.hq-route-tag[data-region="north-america"] i { background: #cc54ff; color: #cc54ff; }
.hq-route-tag[data-region="europe"] i { background: #916cff; color: #916cff; }
.hq-route-tag[data-region="oceania"] i { background: #2f78ff; color: #2f78ff; }
.hq-route-tag[data-region="middle-east"] i { background: #ed68cf; color: #ed68cf; }
.hq-route-tag--eu { display: none !important; }
.hq-route-tag--sz { right: 38%; top: 44%; }
.hq-route-tag--us { right: 4%; top: 33%; }
.hq-route-tag--uk { right: 25%; top: 20%; }
.hq-route-tag--eu { right: 14%; top: 26%; }
.hq-route-tags .hq-route-tag { right: auto !important; }
@keyframes tagPulse { 50% { box-shadow: 0 0 0 5px rgba(141,104,255,0); } }
.hq-hero-bottom { position: absolute; z-index: 2; right: var(--gutter); bottom: 24px; left: var(--gutter); display: flex; align-items: center; color: rgba(255,255,255,.55); font-size: var(--type-meta); letter-spacing: .1em; text-transform: uppercase; }
.hq-hero-bottom i { height: 1px; flex: 1; margin: 0 12px; background: linear-gradient(90deg,var(--hq-violet),rgba(255,255,255,.18)); }

/* Intro ------------------------------------------------------------------ */
.hq-intro { --intro-progress: 0; min-height: 190vh; background: #fbfafc; }
.hq-intro-sticky { position: sticky; top: 0; height: 100vh; min-height: 720px; display: flex; flex-direction: column; justify-content: space-between; overflow: hidden; padding: clamp(92px,12vh,130px) var(--gutter) 26px; }
.hq-intro-statement { width: min(1500px,100%); min-height: 0; flex: 1; margin: 0 auto; display: grid; grid-template-columns: minmax(420px,.9fr) minmax(520px,1.1fr); gap: clamp(36px,6vw,94px); align-items: center; }
.hq-intro-copy { position: relative; z-index: 3; padding-bottom: 12px; }
.hq-intro-eyebrow { display: inline-flex; align-items: center; gap: 9px; margin-bottom: 22px; padding: 7px 12px; border: 1px solid rgba(110,63,243,.16); border-radius: 999px; color: rgba(7,7,7,.63); background: rgba(255,255,255,.74); font-size: var(--type-meta); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.hq-intro-eyebrow::before { content: ""; width: 7px; height: 7px; border: 1px solid var(--hq-violet); border-radius: 50%; box-shadow: inset 0 0 0 2px #fff; background: var(--hq-violet); }
.hq-intro h2 { max-width: 780px; margin: 0; font-size: clamp(60px,6.2vw,100px); font-weight: 650; line-height: .82; letter-spacing: -.068em; text-transform: uppercase; }
.hq-intro h2 span { color: var(--hq-black); }.hq-intro h2 b { color: var(--hq-violet); font: inherit; }
.hq-intro-copy h3 { margin-top: 27px; font-size: clamp(18px,1.55vw,24px); font-weight: 650; letter-spacing: -.025em; }
.hq-intro-copy p { max-width: 56ch; margin-top: 13px; color: rgba(7,7,7,.66); font-size: 15px; line-height: 1.52; }
.hq-intro-flow { display: block; margin-top: 20px; color: var(--hq-violet); font-size: var(--type-body-small); letter-spacing: .02em; }
.hq-intro-copy a { display: inline-flex; align-items: center; gap: 8px; margin-top: 27px; padding-bottom: 6px; border-bottom: 1px solid var(--hq-black); font-size: 12px; font-weight: 650; }

.hq-intro-visual {
  position: relative;
  width: 100%;
  max-width: 790px;
  aspect-ratio: 1.288;
  justify-self: end;
  isolation: isolate;
  transform: translate3d(0,calc((.5 - var(--intro-progress)) * 12px),0);
}
.hq-intro-visual::before {
  content: "";
  position: absolute;
  inset: 14% 7% 4%;
  z-index: -1;
  border-radius: 50%;
  background: radial-gradient(ellipse,rgba(110,63,243,.11),rgba(110,63,243,.025) 51%,transparent 74%);
  filter: blur(12px);
}
.hq-intro-diorama { width: 100%; height: 100%; overflow: visible; }
.hq-diorama-asset { pointer-events: none; }
.hq-diorama-map path { fill: url(#introMapDots); }
.hq-diorama-routes { fill: none; stroke-linecap: round; }
.hq-diorama-route { stroke: rgba(110,63,243,.34); stroke-width: 2; stroke-dasharray: 2 7; }
.hq-diorama-route-flow {
  stroke: #7a48ed;
  stroke-width: 2.2;
  stroke-dasharray: 10 90;
  filter: url(#introRouteGlow);
  animation: introDioramaRoute 5.8s linear infinite;
}
.hq-diorama-route-flow--2 { animation-delay: -1.6s; }
.hq-diorama-route-flow--3 { animation-delay: -3.2s; }
.hq-diorama-route-flow--4 { animation-delay: -4.6s; }
.hq-diorama-route-dot { fill: #7040df; stroke: #fff; stroke-width: 2.5; filter: url(#introRouteGlow); }
.hq-diorama-plane { transform-box: fill-box; transform-origin: center; animation: introDioramaPlane 5s ease-in-out infinite; }
.hq-diorama-warehouse { transform-box: fill-box; transform-origin: center bottom; animation: introDioramaHub 4.6s ease-in-out infinite; }
.hq-diorama-ship { transform-box: fill-box; transform-origin: center bottom; animation: introDioramaShip 4.2s ease-in-out infinite; }
.hq-diorama-train { transform-box: fill-box; transform-origin: center bottom; animation: introDioramaTrain 5.2s ease-in-out infinite; }
.hq-diorama-boxes { animation: introDioramaBoxes 2.4s ease-in-out infinite; }
.hq-diorama-pulse { transform-box: fill-box; transform-origin: center; animation: introDioramaPulse 2.2s ease-out infinite; }
.hq-diorama-card { transform-box: fill-box; transform-origin: center; animation: introDioramaCard 4.8s ease-in-out infinite; }
.hq-diorama-card--store { animation-delay: -.9s; }
.hq-diorama-card--ship { animation-delay: -1.8s; }
.hq-diorama-card--fulfill { animation-delay: -2.7s; }

.hq-intro-ledger { width: min(1500px,100%); margin: 18px auto 0; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); border-top: 1px solid var(--hq-rule-light); }
.hq-intro-ledger article { min-width: 0; display: grid; grid-template-columns: 54px 1fr; gap: 0 14px; padding: 22px 22px 0; border-right: 1px solid var(--hq-rule-light); }
.hq-intro-ledger article:first-child { padding-left: 0; }.hq-intro-ledger article:last-child { padding-right: 0; border-right: 0; }
.hq-intro-ledger b { color: var(--hq-violet); font-size: 34px; line-height: 1; letter-spacing: -.06em; }
.hq-intro-ledger span { display: block; color: rgba(7,7,7,.72); font-size: var(--type-label); font-weight: 650; letter-spacing: .08em; text-transform: uppercase; }
.hq-intro-ledger h3 { margin-top: 8px; font-size: 13px; font-weight: 700; line-height: 1.1; letter-spacing: -.015em; }
.hq-intro-ledger p { margin-top: 9px; color: rgba(7,7,7,.57); font-size: var(--type-body-small); line-height: 1.42; }
@keyframes introDioramaRoute { to { stroke-dashoffset: -100; } }
@keyframes introDioramaPlane { 50% { translate: 8px -7px; rotate: 1deg; } }
@keyframes introDioramaHub { 50% { translate: 0 -3px; } }
@keyframes introDioramaShip { 50% { translate: 0 3px; rotate: -.6deg; } }
@keyframes introDioramaTrain { 50% { translate: 7px -1px; } }
@keyframes introDioramaBoxes { 50% { translate: 0 -2px; } }
@keyframes introDioramaPulse { 0% { scale: .45; opacity: .85; } 100% { scale: 1.8; opacity: 0; } }
@keyframes introDioramaCard { 50% { translate: 0 -4px; } }
.hq-intro:not(.is-motion-active) .hq-diorama-route-flow,
.hq-intro:not(.is-motion-active) .hq-diorama-plane,
.hq-intro:not(.is-motion-active) .hq-diorama-warehouse,
.hq-intro:not(.is-motion-active) .hq-diorama-ship,
.hq-intro:not(.is-motion-active) .hq-diorama-train,
.hq-intro:not(.is-motion-active) .hq-diorama-boxes,
.hq-intro:not(.is-motion-active) .hq-diorama-pulse,
.hq-intro:not(.is-motion-active) .hq-diorama-card { animation-play-state: paused; }
.hq-intro:not(.is-motion-active) .hq-diorama-route-dot { opacity: 0; }

/* Handoff machine -------------------------------------------------------- */
.hq-handoffs { height: 430vh; background: #fff; }
.hq-handoffs-sticky { position: sticky; top: 0; height: 100vh; min-height: 700px; overflow: hidden; padding: 72px var(--gutter) 34px; background: #fff; }
.hq-handoff-head { position: absolute; z-index: 4; top: 116px; left: var(--gutter); max-width: 520px; }
.hq-handoff-head h2 { font-size: clamp(28px,3vw,46px); font-weight: 600; line-height: .96; letter-spacing: -.05em; text-transform: uppercase; }
.hq-handoff-head p { margin-top: 12px; color: rgba(7,7,7,.54); font-size: var(--type-body-small); }
.hq-handoff-index { position: absolute; z-index: 5; top: 114px; right: var(--gutter); display: flex; gap: 4px; }
.hq-handoff-index button { --stage-progress: 0; position: relative; display: grid; gap: 3px; min-width: 82px; overflow: hidden; padding: 8px 10px 11px; border-top: 1px solid rgba(7,7,7,.22); color: rgba(7,7,7,.42); text-align: left; font-size: 11px; text-transform: uppercase; transition: color .25s; }
.hq-handoff-index button::after { content: ""; position: absolute; top: -1px; right: 0; left: 0; height: 2px; background: var(--hq-violet); transform: scaleX(var(--stage-progress)); transform-origin: left center; }
.hq-handoff-index button span { font-size: var(--type-meta); letter-spacing: .08em; }
.hq-handoff-index button.is-active { border-color: var(--hq-violet); color: var(--hq-black); }
.hq-machine { position: absolute; z-index: 1; inset: 188px 0 0; overflow: hidden; background: var(--hq-black); }
.hq-machine::before,
.hq-machine::after { content: ""; position: absolute; right: 0; left: 0; z-index: 3; pointer-events: none; }
.hq-machine::before {
  top: 0;
  height: 34%;
  background: linear-gradient(to bottom,#fff 0,rgba(255,255,255,.96) 15%,rgba(255,255,255,.52) 44%,transparent 100%);
}
.hq-machine::after {
  bottom: 0;
  height: 52%;
  background: linear-gradient(to bottom,transparent 0,rgba(7,7,7,.32) 30%,rgba(7,7,7,.9) 73%,var(--hq-black) 100%);
}
.hq-machine-floor,.hq-route { display: none; }
.hq-machine-belt { position: absolute; z-index: 2; right: 8%; bottom: 28%; left: 8%; height: 34px; border: 1px solid #fff; background: #121212; display: flex; justify-content: space-around; align-items: center; }
.hq-machine-belt::after { content: ""; position: absolute; inset: 0; opacity: .28; background: repeating-linear-gradient(90deg,transparent 0 44px,rgba(141,104,255,.8) 45px 47px,transparent 48px 88px); transform: translate3d(calc(var(--handoff-motion) * -88px),0,0); }
.hq-machine-belt i { position: relative; width: 16px; height: 16px; border: 1px solid rgba(255,255,255,.5); border-radius: 50%; transform: rotate(calc(var(--handoff-motion) * 1440deg)); }
.hq-machine-belt i::after { content: ""; position: absolute; top: 50%; left: 50%; width: 50%; height: 1px; background: rgba(255,255,255,.65); transform-origin: left center; }
.hq-machine-scene {
  position: absolute;
  z-index: 1;
  inset: 0;
  visibility: hidden;
  opacity: 0;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  filter: saturate(.92) contrast(1.02);
  transform: scale(1.035);
  transform-origin: center;
  will-change: transform,opacity;
}
.hq-machine-scene.is-active,.hq-machine-scene.is-current,.hq-machine-scene.is-next { visibility: visible; }
.hq-machine-scene svg { display: none !important; }
.hq-machine-scene path,.hq-machine-scene circle,.hq-machine-scene rect { vector-effect: non-scaling-stroke; }
.hq-machine-scene .dj-anim {
  opacity: clamp(0,calc((var(--scene-progress,1) - var(--enter-at,0)) * 7),1);
}
.dj-ground { fill: none; stroke: rgba(7,7,7,.55); stroke-width: 1.5; }
.dj-shadow { fill: rgba(7,7,7,.08); }
.dj-chip rect { fill: #070707; stroke: #070707; }
.dj-chip text { fill: #fff; font-size: 12px; font-weight: 600; letter-spacing: .12em; }
.dj-card-kicker,.dj-mon-kicker { fill: #6e3ff3; font-size: 9px; font-weight: 600; letter-spacing: .08em; }
.dj-card-line,.dj-mon-line { fill: #070707; font-size: 11px; }
.dj-card-row { fill: none; stroke: rgba(7,7,7,.25); stroke-width: 1; }
.dj-pkg-front { fill: #6e3ff3; stroke: #070707; stroke-width: 1.7; }
.dj-pkg-top { fill: #8d68ff; stroke: #070707; stroke-width: 1.7; }
.dj-pkg-side { fill: #4f20da; stroke: #070707; stroke-width: 1.7; }
.dj-pkg-text,.dj-stamp-text { fill: #fff; font-size: 11px; font-weight: 600; letter-spacing: .08em; }
.dj-check-text,.dj-target-text,.dj-station-text,.dj-map-label,.dj-node-text,.dj-beep-text { fill: #070707; font-size: 10px; font-weight: 600; letter-spacing: .04em; }
.dj-ready-text,.dj-fulfilled-text,.dj-delivered { fill: #6e3ff3; font-size: 14px; font-weight: 700; letter-spacing: .06em; }
.dj-scan-line,.dj-beam-line { fill: none; stroke: #8d68ff; stroke-width: 3; }
.dj-land { fill: rgba(110,63,243,.08); stroke: rgba(7,7,7,.28); stroke-width: 1; }
.dj-graticule { opacity: .35; }
.dj-route { fill: none; stroke: #6e3ff3; stroke-width: 3; stroke-dasharray: 8 8; }
.dj-product-wrap { translate: calc(var(--scene-progress,0) * 230px) calc(var(--scene-progress,0) * -34px); }
.hq-machine-scene--check .dj-scan { translate: 0 calc(var(--scene-progress,0) * 82px); }
.hq-machine-scene--check .dj-stamp { scale: clamp(.65,calc(var(--scene-progress,0) * 1.4),1); transform-origin: center; }
.dj-cart-move { translate: calc(var(--scene-progress,0) * 330px) 0; }
.hq-machine-scene--fulfill .dj-belt-pkg { translate: calc(var(--scene-progress,0) * 330px) 0; }
.hq-machine-scene--deliver .dj-map-pkg { offset-path: path("M0 0 C58 -122 228 -132 296 -64"); offset-distance: calc(var(--scene-progress,0) * 100%); }
.dj-route { stroke-dashoffset: calc((1 - var(--scene-progress,0)) * 180); }
.hq-machine-scene .line-muted { fill: none; stroke: rgba(7,7,7,.18); stroke-width: 1.2; }
.hq-machine-scene .line-main { fill: rgba(255,255,255,.85); stroke: var(--hq-black); stroke-width: 1.6; }
.hq-machine-scene .violet-line { fill: none; stroke: var(--hq-violet); stroke-width: 2; }
.hq-machine-scene .violet-fill { fill: var(--hq-violet); }
.warehouse-boxes rect { fill: var(--hq-violet); stroke: var(--hq-black); stroke-width: 1; }
.scan-line { filter: drop-shadow(0 0 9px rgba(110,63,243,.7)); animation: scan 2.3s ease-in-out infinite alternate; }
@keyframes scan { from { transform: translateY(0); } to { transform: translateY(165px); } }
.warehouse-picker { animation: picker 4s ease-in-out infinite alternate; }
@keyframes picker { to { transform: translateX(430px); } }
.tape-line { stroke-dasharray: 7 7; animation: dash 1s linear infinite; }
.delivery-arc { stroke-dasharray: 9 9; animation: dash 1s linear infinite; }
@keyframes dash { to { stroke-dashoffset: -36; } }
.destination-dot { animation: destination 1.5s ease-in-out infinite; transform-origin: 650px 157px; }
@keyframes destination { 50% { transform: scale(1.65); opacity: .45; } }
.hq-parcel { --parcel-x: 15%; --parcel-y: 0px; --parcel-turn: 0deg; position: absolute; z-index: 3; bottom: calc(28% + 34px); left: var(--parcel-x); width: clamp(82px,8vw,128px); aspect-ratio: 1.06; transform: translate3d(-50%,var(--parcel-y),0) rotate(var(--parcel-turn)); transform-origin: 50% 100%; will-change: left,transform; filter: drop-shadow(18px 22px 20px rgba(0,0,0,.18)); }
.hq-parcel-front,.hq-parcel-top,.hq-parcel-side { position: absolute; display: grid; place-items: center; background: var(--hq-violet); color: #fff; border: 1px solid rgba(7,7,7,.6); font-size: 9px; font-weight: 600; letter-spacing: .08em; text-align: center; }
.hq-parcel-front { inset: 20% 16% 0 0; }
.hq-parcel-top { top: 0; right: 16%; left: 0; height: 21%; clip-path: polygon(16% 0,100% 0,84% 100%,0 100%); }
.hq-parcel-side { top: 20%; right: 0; bottom: 0; width: 17%; background: var(--hq-violet-deep); clip-path: polygon(0 0,100% 0,100% 88%,0 100%); }
.hq-handoff-copy { position: absolute; z-index: 4; right: var(--gutter); bottom: 42px; width: min(420px,36vw); min-height: 136px; padding: 18px 0 0 26px; border-top: 1px solid rgba(255,255,255,.35); color: #fff; }
.hq-handoff-copy article { position: absolute; inset: 18px 0 0 26px; display: block; opacity: 0; pointer-events: none; transform: translate3d(0,18px,0); will-change: transform,opacity; }
.hq-handoff-copy article.is-current,.hq-handoff-copy article.is-next { visibility: visible; }
.hq-handoff-copy h3 { font-size: clamp(24px,2.3vw,36px); font-weight: 600; letter-spacing: -.04em; text-transform: uppercase; }
.hq-handoff-copy p { max-width: 44ch; margin-top: 10px; color: rgba(255,255,255,.7); font-size: 13px; line-height: 1.4; }
.hq-handoff-copy a { display: inline-flex; align-items: center; gap: 7px; margin-top: 14px; color: #fff; font-size: var(--type-label); font-weight: 600; }
.hq-handoff-progress { position: absolute; z-index: 4; bottom: 18px; left: var(--gutter); width: calc(100% - var(--gutter) * 2); height: 2px; background: rgba(255,255,255,.18); }
.hq-handoff-progress i { display: block; width: 100%; height: 100%; background: var(--hq-violet-bright); transform: scaleX(0); transform-origin: left center; }

/* Reliability runway ----------------------------------------------------- */
.hq-reliability { height: 365vh; background: var(--hq-black); color: #fff; }
.hq-reliability-sticky { position: sticky; top: 0; height: 100vh; min-height: 700px; overflow: hidden; padding: clamp(110px,14vh,150px) var(--gutter) 52px; }
.hq-reliability-title { position: absolute; top: clamp(110px,14vh,150px); left: var(--gutter); max-width: 520px; }
.hq-reliability-title h2 { font-size: clamp(58px,7.8vw,120px); font-weight: 600; line-height: .83; letter-spacing: -.065em; text-transform: uppercase; }
.hq-reliability-title p { max-width: 380px; margin-top: 22px; color: rgba(255,255,255,.6); }
.hq-runway { position: absolute; top: 0; bottom: 0; left: 50%; width: clamp(150px,18vw,280px); transform: translateX(-50%); border-right: 1px solid rgba(255,255,255,.08); border-left: 1px solid rgba(255,255,255,.08); background: #0c0c0c; }
.hq-runway::before { content: ""; position: absolute; top: 0; bottom: 0; left: 50%; border-left: 3px dashed rgba(255,255,255,.2); }
.hq-runway span { position: absolute; top: 10%; bottom: 10%; left: 50%; width: 1px; background: var(--hq-violet); transform: scaleY(0); transform-origin: top; }
.hq-runway i {
  position: absolute;
  top: 14%;
  left: 50%;
  width: clamp(82px,8.5vw,128px);
  aspect-ratio: 3 / 4;
  background: url('/assets/img/hq-aircraft-top.svg') center / contain no-repeat;
  filter: drop-shadow(0 16px 18px rgba(0,0,0,.5));
  transform: translate3d(-50%,0,0);
  will-change: transform;
}
.hq-runway b { position: absolute; left: 50%; bottom: 3%; color: var(--hq-violet-bright); font-size: 13px; letter-spacing: .1em; transform: translateX(-50%); }
.hq-reliability-cards { position: absolute; top: 18%; right: var(--gutter); bottom: 8%; width: min(360px,29vw); }
.hq-reliability-cards article { position: absolute; inset: 0; display: none; flex-direction: column; justify-content: center; }
.hq-reliability-cards article.is-active { display: flex; animation: reliabilityIn .5s cubic-bezier(.2,.8,.2,1) both; }
@keyframes reliabilityIn { from { opacity: 0; transform: translateY(34px); } to { opacity: 1; transform: none; } }
.hq-reliability-cards span { color: var(--hq-violet-bright); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.hq-reliability-cards h3 { margin-top: 16px; font-size: clamp(34px,4vw,62px); font-weight: 600; line-height: .92; letter-spacing: -.055em; text-transform: uppercase; }
.hq-reliability-cards p { max-width: 38ch; margin-top: 22px; color: rgba(255,255,255,.62); font-size: 14px; line-height: 1.45; }

/* Control tower ---------------------------------------------------------- */
.hq-control { display: grid; grid-template-columns: minmax(320px,.76fr) minmax(0,1.24fr); gap: clamp(50px,8vw,130px); padding: clamp(110px,13vw,190px) var(--gutter); background: var(--hq-paper); align-items: center; }
.hq-control-copy { max-width: 540px; }
.hq-control-copy h2 { font-size: clamp(56px,7vw,104px); font-weight: 600; line-height: .84; letter-spacing: -.065em; text-transform: uppercase; }
.hq-control-copy p { max-width: 44ch; margin-top: 28px; color: rgba(7,7,7,.68); font-size: 16px; line-height: 1.45; }
.hq-control-copy .hq-pill { margin-top: 32px; }
.hq-control-video { display: block; min-width: 0; overflow: hidden; border: 1px solid rgba(7,7,7,.55); background: var(--hq-black); color: #fff; box-shadow: 0 40px 90px rgba(7,7,7,.16); transform: perspective(1400px) rotateY(-4deg) rotateX(2deg); transform-origin: left center; }
.hq-control-video:focus-visible { outline: 3px solid var(--hq-violet); outline-offset: 5px; }
.hq-video-bar { display: flex; height: 46px; align-items: center; justify-content: space-between; gap: 24px; padding: 0 18px; border-bottom: 1px solid rgba(255,255,255,.2); color: rgba(255,255,255,.64); font-size: 9px; letter-spacing: .1em; }
.hq-video-action { display: inline-flex; min-height: 44px; align-items: center; color: #fff; }
.hq-video-frame { position: relative; overflow: hidden; width: 100%; aspect-ratio: 16 / 9; background: #121212; }
.hq-video-frame::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.22)); pointer-events:none; }
.hq-video-frame img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .65s cubic-bezier(.16,1,.3,1),filter .35s ease; }
.hq-video-play { position:absolute; z-index:2; top:50%; left:50%; display:grid; width:76px; height:76px; place-items:center; border:1px solid rgba(255,255,255,.72); border-radius:50%; background:rgba(7,7,7,.86); color:#fff; transform:translate(-50%,-50%); transition:background-color .25s ease,transform .35s cubic-bezier(.16,1,.3,1); }
.hq-video-play .i { width:24px; height:24px; margin-left:4px; }
.hq-control-video:hover .hq-video-frame img,.hq-control-video:focus-visible .hq-video-frame img { transform:scale(1.035); filter:saturate(.9) contrast(1.04); }
.hq-control-video:hover .hq-video-play,.hq-control-video:focus-visible .hq-video-play { background:var(--hq-violet); transform:translate(-50%,-50%) scale(1.06); }

/* Integrations ----------------------------------------------------------- */
.hq-connect { padding: 68px 0; overflow: hidden; background: #fff; border-top: 1px solid var(--hq-rule-light); border-bottom: 1px solid var(--hq-rule-light); }
.hq-connect-head { display: flex; align-items: end; justify-content: space-between; gap: 20px; padding: 0 var(--gutter) 42px; }
.hq-connect-head h2 { font-size: clamp(32px,4vw,60px); font-weight: 600; letter-spacing: -.05em; text-transform: uppercase; }
.hq-connect-head a { display: inline-flex; align-items: center; gap: 7px; padding-bottom: 4px; border-bottom: 1px solid var(--hq-black); font-size: 12px; font-weight: 600; }
.hq-connect-marquee { overflow: hidden; border-top: 1px solid var(--hq-rule-light); border-bottom: 1px solid var(--hq-rule-light); }
.hq-connect-marquee div { display: flex; width: max-content; animation: hqMarquee 28s linear infinite; }
.hq-connect-marquee span { min-width: 240px; padding: 24px 38px; border-right: 1px solid var(--hq-rule-light); color: rgba(7,7,7,.72); font-size: 18px; font-weight: 600; letter-spacing: -.03em; text-align: center; }
@keyframes hqMarquee { to { transform: translateX(-50%); } }

/* Industries ------------------------------------------------------------- */
.hq-industries { height: 350vh; background: var(--hq-black); color: #fff; }
.hq-industries-sticky { position: sticky; top: 0; height: 100vh; min-height: 700px; overflow: hidden; padding: clamp(110px,14vh,150px) var(--gutter) 56px; }
.hq-industries-head { display: grid; grid-template-columns: minmax(0,1fr) 380px auto; gap: 40px; align-items: end; }
.hq-industries-head h2 { font-size: clamp(58px,8vw,126px); font-weight: 600; line-height: .82; letter-spacing: -.07em; text-transform: uppercase; }
.hq-industries-head p { color: rgba(255,255,255,.58); font-size: 14px; line-height: 1.4; }
.hq-industries-head a { display: inline-flex; align-items: center; gap: 6px; padding-bottom: 4px; border-bottom: 1px solid rgba(255,255,255,.6); font-size: 12px; white-space: nowrap; }
.hq-industry-track { position: absolute; top: 47%; left: var(--gutter); display: flex; width: max-content; will-change: transform; }
.hq-industry-track a { position: relative; isolation: isolate; overflow: hidden; width: clamp(300px,29vw,470px); height: clamp(270px,32vh,370px); padding: 24px; border-top: 1px solid rgba(255,255,255,.32); border-right: 1px solid rgba(255,255,255,.32); background: #111; }
.hq-industry-track a::after { content: ""; position: absolute; z-index: 1; inset: 0; background: linear-gradient(180deg,rgba(5,5,5,.18),rgba(5,5,5,.36) 46%,rgba(5,5,5,.9)),linear-gradient(110deg,rgba(16,8,36,.3),transparent 64%); transition: background-color .35s ease; }
.hq-industry-media { position: absolute; z-index: 0; inset: 0; background-position: center; background-size: cover; transform: scale(1.015); transition: transform .75s cubic-bezier(.16,1,.3,1),filter .45s ease; }
.hq-industry-track a:hover .hq-industry-media,.hq-industry-track a:focus-visible .hq-industry-media { transform: scale(1.075); filter: saturate(.78) contrast(1.06); }
.hq-industry-track a:hover::after,.hq-industry-track a:focus-visible::after { background-color: rgba(78,35,177,.28); }
.hq-industry-track small { position: relative; z-index: 2; display: block; color: rgba(255,255,255,.76); font-size: 9px; text-shadow: 0 2px 12px rgba(0,0,0,.52); }
.hq-industry-track strong { position: absolute; z-index: 2; top: 50%; left: 24px; color: #fff; font-size: clamp(38px,4.2vw,68px); font-weight: 600; line-height: .86; letter-spacing: -.06em; text-shadow: 0 3px 22px rgba(0,0,0,.42); text-transform: uppercase; transform: translateY(-50%); }
.hq-industry-track .hq-industry-action { position: absolute; z-index: 2; bottom: 22px; left: 24px; color: #fff; font-size: 10px; letter-spacing: .06em; text-transform: uppercase; }
.hq-industry-progress { position: absolute; right: var(--gutter); bottom: 30px; left: var(--gutter); height: 1px; background: var(--hq-rule-dark); }
.hq-industry-progress i { display: block; width: 100%; height: 2px; background: var(--hq-violet-bright); transform: scaleX(0); transform-origin: left center; }

/* Ambient loops only run while their scene is near the viewport. */
.hq-route-tag i,
.scan-line,
.warehouse-picker,
.tape-line,
.delivery-arc,
.destination-dot,
.map-route,
.hq-connect-marquee div,
.hq-radar-sweep,
.hq-radar-node,
.hq-radar-node span,
.hq-radar-node small,
.hq-radar-core i,
.hq-radar-signal i,
.hq-close-route i { animation-play-state: paused; }
.is-motion-active .hq-route-tag i,
.is-motion-active .scan-line,
.is-motion-active .warehouse-picker,
.is-motion-active .tape-line,
.is-motion-active .delivery-arc,
.is-motion-active .destination-dot,
.is-motion-active .map-route,
.is-motion-active .hq-connect-marquee div,
.is-motion-active .hq-radar-sweep,
.is-motion-active .hq-radar-node,
.is-motion-active .hq-radar-node span,
.is-motion-active .hq-radar-node small,
.is-motion-active .hq-radar-core i,
.is-motion-active .hq-radar-signal i,
.is-motion-active .hq-close-route i { animation-play-state: running; }

/* Scenario --------------------------------------------------------------- */
.hq-scenario { position: relative; min-height: 940px; display: grid; grid-template-columns: 1.05fr .95fr; background: var(--hq-violet); color: #fff; overflow: hidden; }
.hq-scenario-radar { position: relative; min-height: 940px; border-right: 1px solid rgba(255,255,255,.25); overflow: hidden; }
.hq-radar-meta { position: absolute; z-index: 5; top: 118px; right: 42px; left: 42px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-bottom: 13px; border-bottom: 1px solid rgba(255,255,255,.24); text-transform: uppercase; }
.hq-radar-meta strong { font-size: 11px; font-weight: 600; letter-spacing: .06em; }
.hq-radar-meta span { color: rgba(255,255,255,.58); font-size: var(--type-meta); letter-spacing: .1em; }
.hq-radar-stage { position: absolute; top: 51%; left: 50%; width: min(73%,680px); aspect-ratio: 1; border: 1px solid rgba(255,255,255,.4); border-radius: 50%; transform: translate(-50%,-50%); }
.hq-radar-stage::before,.hq-radar-stage::after { content: ""; position: absolute; z-index: 1; top: 50%; left: 50%; border: 1px solid rgba(255,255,255,.24); border-radius: 50%; transform: translate(-50%,-50%); }
.hq-radar-stage::before { width: 64%; height: 64%; }
.hq-radar-stage::after { width: 32%; height: 32%; }
.hq-radar-grid { position: absolute; z-index: 0; inset: 0; border-radius: 50%; opacity: .48; overflow: hidden; }
.hq-radar-grid::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,.075) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.075) 1px,transparent 1px); background-size: 10% 10%; -webkit-mask-image: radial-gradient(circle,#000 0 69%,transparent 70%); mask-image: radial-gradient(circle,#000 0 69%,transparent 70%); }
.hq-radar-axis { position: absolute; z-index: 1; inset: 0; border-radius: 50%; background: linear-gradient(90deg,transparent calc(50% - .5px),rgba(255,255,255,.16) 50%,transparent calc(50% + .5px)),linear-gradient(transparent calc(50% - .5px),rgba(255,255,255,.16) 50%,transparent calc(50% + .5px)); }
.hq-radar-sweep { position: absolute; z-index: 2; inset: 0; border-radius: 50%; background: conic-gradient(from 270deg,rgba(255,255,255,.32),rgba(178,145,255,.16) 17deg,rgba(109,62,231,.04) 36deg,transparent 39deg); transform: rotate(-72deg); animation: hqRadarSweep 12s linear infinite; }
.hq-radar-sweep::after { content: ""; position: absolute; top: 50%; left: 50%; width: 50%; height: 1px; background: linear-gradient(90deg,rgba(255,255,255,.16),#fff); box-shadow: 0 0 10px rgba(255,255,255,.34); transform: rotate(-90deg); transform-origin: 0 50%; }
@keyframes hqRadarSweep { to { transform: rotate(-432deg); } }
.hq-radar-node { --node-color: rgba(255,255,255,.38); position: absolute; z-index: 4; color: var(--node-color); font-size: 9px; letter-spacing: .08em; line-height: 1; text-align: center; text-transform: uppercase; animation: hqRadarNode 12s linear infinite; animation-delay: calc(var(--step) * 2.4s); }
.hq-radar-node::before { content: ""; display: block; width: 9px; height: 9px; margin: 0 auto 9px; border: 1px solid currentColor; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 5px rgba(255,255,255,.035); }
.hq-radar-node span { display: block; white-space: nowrap; transform-origin: center; animation: hqRadarLabel 12s linear infinite; animation-delay: calc(var(--step) * 2.4s); }
.hq-radar-node small { display: block; margin-top: 6px; color: #fff; font-size: 7px; letter-spacing: .12em; opacity: 0; transform: translateY(3px); animation: hqRadarData 12s linear infinite; animation-delay: calc(var(--step) * 2.4s); }
.hq-radar-node--source { top: 26%; left: 8.5%; }
.hq-radar-node--qc { bottom: 18%; left: 16%; }
.hq-radar-node--warehouse { right: 10%; bottom: 18%; }
.hq-radar-node--fulfill { top: 26%; right: 9%; }
.hq-radar-node--delivery { top: -2px; left: 50%; transform: translateX(-50%); }
@keyframes hqRadarNode {
  0%,14%,100% { --node-color: rgba(255,255,255,.38); }
  2.5% { --node-color: #a786ff; }
  5.5%,9% { --node-color: #fff; filter: drop-shadow(0 0 7px rgba(255,255,255,.78)); }
  12% { --node-color: #9e78ff; filter: none; }
}
@keyframes hqRadarLabel {
  0%,2%,13%,100% { transform: scale(1); text-shadow: none; }
  4%,10% { transform: scale(1.85); text-shadow: 0 0 8px #fff,0 0 22px rgba(206,186,255,.96); }
}
@keyframes hqRadarData {
  0%,2%,13%,100% { opacity: 0; transform: translateY(3px); }
  4%,10% { opacity: 1; transform: translateY(0); }
}
.hq-radar-core { position: absolute; z-index: 5; top: 50%; left: 50%; width: clamp(128px,22%,156px); aspect-ratio: 1; display: grid; place-items: center; transform: translate(-50%,-50%); }
.hq-radar-core img { width: 145%; max-width: none; height: auto; opacity: .98; filter: brightness(0) invert(1) drop-shadow(0 9px 16px rgba(48,10,132,.28)); }
.hq-radar-core span { position: absolute; top: calc(100% + 23px); font-size: var(--type-micro); letter-spacing: .18em; text-transform: uppercase; }
.hq-radar-core i { position: absolute; top: calc(100% + 40px); width: 1px; height: 27px; background: linear-gradient(#fff,transparent); animation: hqRadarSignal 1.2s ease-in-out infinite; }
@keyframes hqRadarSignal { 50% { opacity: .28; transform: scaleY(.72); } }
.hq-radar-signal { position: absolute; z-index: 5; right: 42px; bottom: 36px; left: 42px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-top: 13px; border-top: 1px solid rgba(255,255,255,.24); text-transform: uppercase; }
.hq-radar-signal span { display: inline-flex; align-items: center; gap: 8px; color: rgba(255,255,255,.62); font-size: var(--type-micro); letter-spacing: .1em; }
.hq-radar-signal span i { width: 6px; height: 6px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 0 rgba(255,255,255,.4); animation: hqRadarPing 1.8s ease-out infinite; }
.hq-radar-signal strong { font-size: var(--type-meta); font-weight: 500; letter-spacing: .08em; }
@keyframes hqRadarPing { 70%,100% { box-shadow: 0 0 0 8px rgba(255,255,255,0); } }
.hq-scenario-copy { display: flex; flex-direction: column; justify-content: center; padding: clamp(70px,9vw,140px) var(--gutter); }
.hq-scenario-copy > p { font-size: var(--type-label); letter-spacing: .09em; text-transform: uppercase; }
.hq-scenario-copy h2 { margin-top: 22px; font-size: clamp(52px,6.4vw,100px); font-weight: 600; line-height: .84; letter-spacing: -.065em; text-transform: uppercase; }
.hq-scenario-copy blockquote { max-width: 40ch; margin-top: 50px; padding-top: 24px; border-top: 1px solid rgba(255,255,255,.4); font-size: clamp(18px,2vw,28px); line-height: 1.25; }
.hq-scenario-copy > span { margin-top: 18px; color: rgba(255,255,255,.65); font-size: var(--type-body-small); }

/* FAQ -------------------------------------------------------------------- */
.hq-faq { display: grid; grid-template-columns: .72fr 1.28fr; gap: clamp(50px,9vw,150px); padding: clamp(110px,13vw,190px) var(--gutter); background: var(--hq-paper); }
.hq-faq-head { align-self: start; position: sticky; top: 140px; }
.hq-faq-head h2 { font-size: clamp(70px,9vw,140px); font-weight: 600; line-height: .8; letter-spacing: -.07em; }
.hq-faq-head p { max-width: 320px; margin-top: 28px; color: rgba(7,7,7,.62); }
.hq-faq-list { border-top: 1px solid var(--hq-rule-light); }
.hq-faq .faq-item { border-bottom: 1px solid var(--hq-rule-light); }
.hq-faq .faq-q { width: 100%; min-height: 104px; display: flex; align-items: center; justify-content: space-between; gap: 22px; padding: 28px 0; font-size: clamp(20px,2.3vw,34px); font-weight: 500; line-height: 1.05; letter-spacing: -.035em; text-align: left; }
.hq-faq .faq-q .i { transition: transform .35s; }
.hq-faq .faq-item.open .faq-q .i { transform: rotate(45deg); }
.hq-faq .faq-a p { max-width: 62ch; padding: 0 60px 28px 0; color: rgba(7,7,7,.64); font-size: 15px; }

/* Close ------------------------------------------------------------------ */
.hq-close { min-height: 92vh; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 130px var(--gutter); background: var(--hq-black); color: #fff; text-align: center; overflow: hidden; }
.hq-close-route { display: flex; align-items: center; gap: 34px; width: min(700px,80vw); margin-bottom: 46px; }
.hq-close-route::before,.hq-close-route::after { content: ""; height: 1px; flex: 1; background: rgba(255,255,255,.25); }
.hq-close-route i { width: 10px; height: 10px; border: 1px solid var(--hq-violet-bright); border-radius: 50%; animation: closePulse 2s ease-in-out infinite; }
.hq-close-route i:nth-child(2) { animation-delay: .2s; }.hq-close-route i:nth-child(3) { animation-delay: .4s; }.hq-close-route i:nth-child(4) { animation-delay: .6s; }.hq-close-route i:nth-child(5) { animation-delay: .8s; }
@keyframes closePulse { 50% { background: var(--hq-violet-bright); box-shadow: 0 0 0 10px rgba(141,104,255,0); } }
.hq-close > p { color: var(--hq-violet-bright); font-size: var(--type-label); letter-spacing: .1em; text-transform: uppercase; }
.hq-close h2 { margin-top: 24px; font-size: clamp(68px,10vw,154px); font-weight: 600; line-height: .8; letter-spacing: -.075em; text-transform: uppercase; }
.hq-close .hq-pill { margin-top: 44px; }
.hq-close > span { max-width: 540px; margin-top: 18px; color: rgba(255,255,255,.48); font-size: var(--type-body-small); }

/* Footer --------------------------------------------------------------- */
body[data-page="home"] .footer-notch { display: none; }

/* Responsive ------------------------------------------------------------- */
@media (max-width: 1100px) {
  .hq-hero-grid { grid-template-columns: 1fr; }
  .hq-hero-readout { display: none; }
  .hq-globe { width: 85%; opacity: .75; }
  .hq-intro-statement { grid-template-columns: minmax(330px,.88fr) minmax(410px,1.12fr); gap: 28px; }
  .hq-intro-copy { max-width: none; margin: 0; }
  .hq-intro h2 { font-size: clamp(54px,6.8vw,74px); }
  .hq-intro-visual { max-width: 620px; }
  .hq-intro-ledger article { grid-template-columns: 42px 1fr; padding-inline: 14px; }
  .hq-intro-ledger p { font-size: var(--type-body-small); }
  .hq-handoff-head { max-width: 420px; }
  .hq-handoff-index button { min-width: 65px; }
  .hq-reliability-title { max-width: 420px; }
  .hq-control { grid-template-columns: 1fr; }
  .hq-control-copy { max-width: 760px; }
  .hq-control-video { transform: none; }
  .hq-industries-head { grid-template-columns: 1fr 300px; }
  .hq-industries-head a { position: absolute; right: var(--gutter); top: 110px; }
  .hq-scenario { grid-template-columns: 1fr; }
  .hq-scenario-radar { min-height: 680px; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.25); }
  .hq-faq { grid-template-columns: 1fr; }
  .hq-faq-head { position: static; }
}

@media (max-width: 760px) {
  body[data-page="home"],body[data-page="home"] a,body[data-page="home"] button { cursor: auto; }
  .hq-cursor { display: none; }
  .hq-loader-ui { padding: 20px 18px 24px; }
  .hq-loader-scene::before { background-size: 32px 32px; -webkit-mask-image: linear-gradient(rgba(0,0,0,.5),transparent 72%); mask-image: linear-gradient(rgba(0,0,0,.5),transparent 72%); }
  .hq-loader-lockup { top: 62%; left: 18px; width: 62vw; }
  .hq-loader-lockup::before { width: 68px; height: 2px; }
  .hq-loader-lockup p { max-width: 24ch; margin-top: 14px; font-size: 10px; }
  .hq-loader-mascot { top: 33%; left: 31%; width: min(250px,64vw); }
  .hq-loader-mascot img { opacity: .8; }
  .hq-loader-mascot span { display: none; }
  .hq-loader-foot { display: grid; align-items: end; gap: 12px; }
  .hq-loader-coordinates { display: flex; grid-row: 1; min-width: 0; justify-content: flex-end; }
  .hq-loader-coordinates span:first-child { display: none; }
  .hq-loader-coordinates span:last-child { gap: 7px; font-size: 9px; }
  .hq-loader-coordinates span:last-child::before { width: 16px; }
  .hq-loader-meta { font-size: 8px; }
  .hq-loader-progress-wrap { grid-row: 2; max-width: none; }
  body[data-page="home"] .hq-journey { margin-top: calc(var(--nav-h) * -1); }
  body[data-page="home"] .announce { font-size: 9px; }
  body[data-page="home"] .announce-inner { min-width: 0; justify-content: center; font-size: 0; }
  body[data-page="home"] .announce-inner::before { content: "Factory to front door."; color: rgba(255,255,255,.72); font-size: 9px; letter-spacing: .08em; }
  body[data-page="home"] .announce-inner a { flex: none; font-size: 9px; white-space: nowrap; }
  body[data-page="home"] .mobile-drawer { color: var(--ink); background: #fff; }
  body[data-page="home"] .mobile-drawer a { cursor: auto; }

  .hq-hero { height: 250vh; }
  .hq-hero-sticky { min-height: 620px; }
  .hq-globe { inset: 0 auto auto 6%; width: 185%; height: 100%; opacity: 1; }
  .hq-hero-grid { padding-top: calc(var(--nav-h) + 100px); padding-bottom: 66px; align-items: end; }
  .hq-hero-copy { align-self: end; }
  .hq-route-state { margin-bottom: 17px; font-size: 10px; }
  .hq-hero h1 { font-size: clamp(54px,17vw,82px); line-height: .84; }
  .hq-hero-lede { max-width: 32ch; margin-top: 20px; font-size: 14px; }
  .hq-hero-actions { margin-top: 24px; }
  .hq-pill { min-height: 44px; padding: 0 17px; font-size: 10px; }
  .hq-route-tag { gap: 5px; padding: 4px 6px; font-size: var(--type-meta); }
  .hq-route-tag i { width: 5px; height: 5px; flex-basis: 5px; }
  .hq-route-tag--sz { top: 24%; right: 55%; }.hq-route-tag--us { top: 20%; right: 4%; }
  .hq-hero-bottom { overflow: hidden; gap: 10px; white-space: nowrap; }
  .hq-hero-bottom i { min-width: 30px; margin: 0; }

  .hq-intro { min-height: 0; }
  .hq-intro-sticky { position: relative; top: auto; height: auto; min-height: 0; overflow: hidden; padding: 108px 18px 70px; }
  .hq-intro-statement { grid-template-columns: 1fr; gap: 40px; }
  .hq-intro h2 { font-size: clamp(48px,14.2vw,64px); line-height: .84; }
  .hq-intro-copy { max-width: none; margin: 0; padding-bottom: 0; }
  .hq-intro-eyebrow { margin-bottom: 18px; }
  .hq-intro-copy h3 { margin-top: 23px; font-size: 18px; }
  .hq-intro-copy p { font-size: 14px; }
  .hq-intro-flow { font-size: var(--type-body-small); line-height: 1.4; }
  .hq-intro-copy a { margin-top: 23px; }
  .hq-intro-visual { width: calc(100% + 24px); max-width: none; aspect-ratio: 1.02; margin: 4px 0 0 -12px; justify-self: center; }
  .hq-intro-diorama { transform: scale(1.06); transform-origin: center; }
  .hq-intro-ledger { grid-template-columns: 1fr; margin-top: 48px; border-bottom: 1px solid var(--hq-rule-light); }
  .hq-intro-ledger article,.hq-intro-ledger article + article { grid-template-columns: 46px 1fr; padding: 22px 0; border-right: 0; border-bottom: 1px solid var(--hq-rule-light); }
  .hq-intro-ledger article:last-child { border-bottom: 0; }
  .hq-intro-ledger b { font-size: 28px; }
  .hq-intro-ledger h3 { font-size: 13px; }
  .hq-intro-ledger p { display: block; font-size: var(--type-body-small); }

  .hq-handoffs { height: 390vh; }
  .hq-handoffs-sticky { min-height: 650px; padding: 0; }
  .hq-handoff-head { top: calc(var(--nav-h) + 28px); right: 18px; left: 18px; max-width: none; }
  .hq-handoff-head h2 { font-size: 27px; }
  .hq-handoff-index { top: calc(var(--nav-h) + 150px); right: 18px; left: 18px; overflow-x: auto; scrollbar-width: none; }
  .hq-handoff-index::-webkit-scrollbar { display: none; }
  .hq-handoff-index button { min-width: 64px; min-height: 60px; padding-inline: 5px; color: rgba(7,7,7,.68); font-size: var(--type-meta); }
  .hq-machine { inset: calc(var(--nav-h) + 205px) 0 0; }
  .hq-machine::before { height: 26%; }
  .hq-machine::after { height: 60%; }
  .hq-machine-scene { inset: 0; background-position: center; }
  .hq-handoff-copy { right: 18px; bottom: 18px; left: 18px; width: auto; min-height: 160px; padding: 15px 0 0; }
  .hq-handoff-copy article { inset: 15px 0 0; }
  .hq-handoff-copy h3 { font-size: 23px; }
  .hq-handoff-copy p { max-width: 42ch; font-size: var(--type-body-small); }
  .hq-handoff-copy a { margin-top: 8px; font-size: 10px; }
  .hq-handoff-progress { right: 18px; bottom: 8px; left: 18px; width: auto; }

  .hq-reliability { height: 300vh; }
  .hq-reliability-sticky { min-height: 650px; padding-top: 105px; }
  .hq-reliability-title { top: 100px; right: 18px; left: 18px; max-width: none; }
  .hq-reliability-title h2 { max-width: 330px; font-size: 55px; }
  .hq-reliability-title p { max-width: 28ch; font-size: var(--type-body-small); }
  .hq-runway { top: 300px; left: 25%; width: 88px; }
  .hq-runway i { width: 58px; }
  .hq-reliability-cards { top: 295px; right: 18px; bottom: 35px; width: 54%; }
  .hq-reliability-cards h3 { font-size: 28px; }
  .hq-reliability-cards p { font-size: var(--type-body-small); }

  .hq-control { gap: 48px; padding: 96px 18px; }
  .hq-control-copy h2 { font-size: 54px; }
  .hq-control-copy p { font-size: 14px; }
  .hq-video-bar { height: 42px; padding-inline: 12px; font-size: var(--type-micro); }
  .hq-video-play { width:58px; height:58px; }
  .hq-video-play .i { width:19px; height:19px; }
  .hq-connect-head { align-items: start; flex-direction: column; padding-inline: 18px; }
  .hq-connect-marquee span { min-width: 180px; padding: 20px 26px; font-size: 15px; }

  .hq-industries { height: 300vh; }
  .hq-industries-sticky { min-height: 650px; padding: 104px 18px 46px; }
  .hq-industries-head { display: block; }
  .hq-industries-head h2 { font-size: 56px; }
  .hq-industries-head p { max-width: 30ch; margin-top: 18px; font-size: var(--type-body-small); }
  .hq-industries-head a { top: 245px; right: 18px; }
  .hq-industry-track { top: 48%; left: 18px; }
  .hq-industry-track a { width: 77vw; height: 310px; }
  .hq-industry-track strong { font-size: 44px; }
  .hq-industry-progress { right: 18px; left: 18px; }

  .hq-scenario { min-height: 0; }
  .hq-scenario-radar { min-height: 590px; }
  .hq-radar-meta { top: 104px; right: 18px; left: 18px; }
  .hq-radar-meta span { display: none; }
  .hq-radar-stage { top: 49%; width: min(88%,430px); }
  .hq-radar-node { font-size: var(--type-micro); }
  .hq-radar-node small { margin-top: 4px; font-size: var(--type-micro); }
  .hq-radar-node::before { width: 7px; height: 7px; margin-bottom: 6px; }
  .hq-radar-node--source { left: 5%; }
  .hq-radar-node--fulfill { right: 5%; }
  .hq-radar-node--warehouse { right: 5%; }
  .hq-radar-node--qc { left: 12%; }
  .hq-radar-core { width: 104px; }
  .hq-radar-core span { top: calc(100% + 16px); font-size: var(--type-micro); }
  .hq-radar-core i { top: calc(100% + 31px); height: 18px; }
  .hq-radar-signal { right: 18px; bottom: 23px; left: 18px; }
  .hq-radar-signal strong { font-size: var(--type-micro); }
  .hq-scenario-copy { padding: 86px 18px; }
  .hq-scenario-copy h2 { font-size: 54px; }
  .hq-scenario-copy blockquote { margin-top: 35px; font-size: 18px; }

  .hq-faq { gap: 58px; padding: 100px 18px; }
  .hq-faq-head h2 { font-size: 78px; }
  .hq-faq .faq-q { min-height: 86px; font-size: 20px; }
  .hq-faq .faq-a p { padding-right: 0; font-size: 13px; }
  .hq-close { min-height: 760px; padding-inline: 18px; }
  .hq-close h2 { font-size: 59px; }
  .hq-close-route { gap: 16px; width: 92vw; }
}

@media (prefers-reduced-motion: reduce) {
  .hq-loader { display: none; }
  .hq-connect-marquee div,.scan-line,.warehouse-picker,.tape-line,.delivery-arc,.destination-dot,.hq-radar-sweep,.hq-radar-node,.hq-radar-node span,.hq-radar-node small,.hq-radar-core i,.hq-radar-signal i,.hq-close-route i { animation: none !important; }
  .hq-radar-node { color: rgba(255,255,255,.72); filter: none; }
  .hq-radar-node span { transform: none; text-shadow: none; }
  .hq-radar-node small { opacity: 1; transform: none; }
  .hq-radar-sweep { transform: rotate(-72deg); }
  .hq-machine-scene,.hq-reliability-cards article,.hq-parcel,.hq-industry-media { transition-duration: .01ms !important; }
  .hq-machine-scene { --scene-progress: 1 !important; }
  .hq-machine-scene .dj-anim { opacity: 1 !important; translate: none !important; scale: none !important; offset-distance: 100% !important; }
  .hq-diorama-route-flow,.hq-diorama-plane,.hq-diorama-warehouse,.hq-diorama-ship,.hq-diorama-train,.hq-diorama-boxes,.hq-diorama-pulse,.hq-diorama-card { animation: none !important; }
  .hq-diorama-route-dot { display: none; }
  .hq-hero-atmosphere { display: none; }
  .hq-cursor { display: none; }
  body[data-page="home"],body[data-page="home"] a,body[data-page="home"] button { cursor: auto; }
}

/* Homepage footer proposal — deliberately scoped to the home page. */
body[data-page="home"] .home-footer {
  --home-footer-ink: #0a0a0a;
  --home-footer-muted: rgba(10,10,10,.62);
  --home-footer-rule: rgba(10,10,10,.18);
  background: #f1eee8;
  color: var(--home-footer-ink);
}
body[data-page="home"] .home-footer__inner { padding-top: clamp(74px,8vw,118px); }
body[data-page="home"] .home-footer__opening {
  display: grid;
  grid-template-columns: minmax(0,1.35fr) minmax(300px,.65fr);
  gap: clamp(56px,8vw,132px);
  align-items: end;
  padding-bottom: clamp(48px,6vw,80px);
  border-bottom: 1px solid var(--home-footer-rule);
}
body[data-page="home"] .home-footer__statement-block { min-width: 0; }
body[data-page="home"] .home-footer__brand {
  display: inline-flex;
  width: max-content;
  min-height: 76px;
  margin-bottom: clamp(28px,4vw,52px);
  align-items: center;
  justify-content: center;
  gap: 12px;
  border-radius: 50%;
  transition: transform .28s var(--ease), box-shadow .28s var(--ease);
}
body[data-page="home"] .home-footer__brand:hover,
body[data-page="home"] .home-footer__brand:focus-visible {
  transform: translateY(-3px) rotate(-3deg);
  box-shadow: 0 12px 26px rgba(10,10,10,.12);
}
body[data-page="home"] .home-footer__brand-logo {
  display: block;
  width: 76px;
  height: 76px;
  object-fit: contain;
  border-radius: 50%;
  background: #fff;
  content: url("/assets/img/brand/hq-supply-chain-logo-light.webp");
}
body[data-page="home"] .home-footer__brand-copy { display: none; }
body[data-page="home"] .home-footer__brand-copy > span { font-size: 24px; font-weight: 600; letter-spacing: -.04em; }
body[data-page="home"] .home-footer__brand-copy > small { color: var(--home-footer-muted); font-size: 10px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; }
body[data-page="home"] .home-footer__statement {
  max-width: 920px;
  font-size: clamp(48px,6.15vw,94px);
  font-weight: 560;
  line-height: .91;
  letter-spacing: -.062em;
}
body[data-page="home"] .home-footer__statement span { color: rgba(10,10,10,.5); }
body[data-page="home"] .home-footer__action > p {
  max-width: 25ch;
  margin-bottom: 18px;
  color: var(--home-footer-muted);
  font-size: 12px;
  line-height: 1.45;
}
body[data-page="home"] .home-footer__action > a {
  display: flex;
  min-height: 68px;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  border-top: 1px solid var(--home-footer-ink);
  border-bottom: 1px solid var(--home-footer-ink);
  color: var(--home-footer-ink);
  font-size: 17px;
  font-weight: 560;
  letter-spacing: -.02em;
}
body[data-page="home"] .home-footer__action-icon {
  display: grid;
  width: 44px;
  height: 44px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 50%;
  background: var(--home-footer-ink);
  color: #fff;
  transition: transform .25s ease, background-color .25s ease;
}
body[data-page="home"] .home-footer__action-icon .i { width: 17px; height: 17px; }
body[data-page="home"] .home-footer__action > a:hover .home-footer__action-icon { transform: rotate(45deg); background: var(--hq-violet); }
body[data-page="home"] .home-footer__directory {
  display: grid;
  grid-template-columns: minmax(0,1.25fr) minmax(190px,.62fr) minmax(250px,.78fr);
  border-bottom: 1px solid var(--home-footer-rule);
}
body[data-page="home"] .home-footer__group {
  min-width: 0;
  padding: 34px clamp(24px,3vw,46px) 50px 0;
}
body[data-page="home"] .home-footer__group + .home-footer__group {
  padding-left: clamp(24px,3vw,46px);
  border-left: 1px solid var(--home-footer-rule);
}
body[data-page="home"] .home-footer__group h2 {
  color: var(--home-footer-muted);
  font-size: 9px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: .16em;
  text-transform: uppercase;
}
body[data-page="home"] .home-footer__links {
  display: grid;
  margin-top: 24px;
}
body[data-page="home"] .home-footer__links--operations {
  grid-template-columns: repeat(2,minmax(0,1fr));
  column-gap: clamp(22px,3vw,44px);
}
body[data-page="home"] .home-footer__links a,
body[data-page="home"] .home-footer__contact a {
  color: var(--home-footer-ink);
}
body[data-page="home"] .home-footer__links a {
  display: flex;
  min-height: 47px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--home-footer-rule);
  font-size: 14px;
  line-height: 1.25;
}
body[data-page="home"] .home-footer__links .i,
body[data-page="home"] .home-footer__contact .i {
  width: 13px;
  height: 13px;
  flex: 0 0 auto;
  transition: transform .2s ease, color .2s ease;
}
body[data-page="home"] .home-footer__links a:hover,
body[data-page="home"] .home-footer__contact a:hover { color: var(--hq-violet); }
body[data-page="home"] .home-footer__links a:hover .i,
body[data-page="home"] .home-footer__contact a:hover .i { transform: translate(2px,-2px); }
body[data-page="home"] .home-footer__contact { margin-top: 24px; }
body[data-page="home"] .home-footer__contact > div {
  padding: 12px 0 14px;
  border-bottom: 1px solid var(--home-footer-rule);
}
body[data-page="home"] .home-footer__contact > div:first-child { padding-top: 0; }
body[data-page="home"] .home-footer__contact span {
  display: block;
  margin-bottom: 5px;
  color: var(--home-footer-muted);
  font-size: 9px;
  line-height: 1.25;
  letter-spacing: .11em;
  text-transform: uppercase;
}
body[data-page="home"] .home-footer__contact a,
body[data-page="home"] .home-footer__contact p {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  overflow-wrap: anywhere;
  font-size: 14px;
  line-height: 1.35;
}
body[data-page="home"] .home-footer__showcase {
  position: relative;
  padding: 32px 0 38px;
  border-bottom: 1px solid var(--home-footer-rule);
  overflow: hidden;
}
body[data-page="home"] .home-footer__showcase-controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}
body[data-page="home"] .home-footer__switch {
  display: inline-grid;
  grid-template-columns: repeat(2,1fr);
  padding: 3px;
  border: 1px solid var(--home-footer-rule);
  border-radius: 999px;
  background: rgba(10,10,10,.035);
}
body[data-page="home"] .home-footer__switch button {
  min-width: 112px;
  min-height: 42px;
  padding: 0 18px;
  border-radius: 999px;
  color: var(--home-footer-muted);
  font-size: 10px;
  font-weight: 650;
  letter-spacing: .12em;
  text-transform: uppercase;
  transition: color .2s ease, background-color .2s ease;
}
body[data-page="home"] .home-footer__switch button[aria-selected="true"] {
  background: var(--home-footer-ink);
  color: #f1eee8;
}
body[data-page="home"] .home-footer__motion {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  gap: 12px;
  padding: 0 16px;
  border: 1px solid var(--home-footer-rule);
  border-radius: 999px;
  color: var(--home-footer-ink);
  font-size: 10px;
  font-weight: 650;
  letter-spacing: .1em;
  text-transform: uppercase;
}
body[data-page="home"] .home-footer__motion:hover { border-color: rgba(10,10,10,.45); }
body[data-page="home"] .home-footer__motion-icon {
  display: flex;
  width: 12px;
  height: 12px;
  align-items: center;
  justify-content: center;
  gap: 3px;
}
body[data-page="home"] .home-footer__motion-icon i {
  width: 2px;
  height: 10px;
  background: currentColor;
}
body[data-page="home"] .home-footer__motion[aria-pressed="true"] .home-footer__motion-icon {
  position: relative;
  display: block;
}
body[data-page="home"] .home-footer__motion[aria-pressed="true"] .home-footer__motion-icon i { display: none; }
body[data-page="home"] .home-footer__motion[aria-pressed="true"] .home-footer__motion-icon::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 3px;
  width: 0;
  height: 0;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 8px solid currentColor;
  transform: translateY(-50%);
}
body[data-page="home"] .home-footer__marquee {
  width: 100%;
  margin-top: 28px;
  overflow: hidden;
}
body[data-page="home"] .home-footer__marquee[hidden] { display: none; }
body[data-page="home"] .home-footer__marquee-track {
  display: flex;
  width: max-content;
  animation: homeFooterMarquee 62s linear infinite;
  will-change: transform;
}
body[data-page="home"] .home-footer__marquee--services .home-footer__marquee-track { animation-duration: 70s; }
body[data-page="home"] .home-footer__marquee-group {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
}
body[data-page="home"] .home-footer__marquee-group a {
  position: relative;
  display: inline-flex;
  min-height: 50px;
  align-items: center;
  padding-right: clamp(50px,5.2vw,82px);
  color: var(--home-footer-ink);
  font-size: clamp(25px,2.4vw,36px);
  font-weight: 560;
  line-height: 1;
  letter-spacing: -.035em;
  white-space: nowrap;
  transition: color .2s ease;
}
body[data-page="home"] .home-footer__marquee-group a::after {
  content: "";
  position: absolute;
  top: 50%;
  right: clamp(22px,2.4vw,38px);
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--hq-violet);
  transform: translateY(-50%);
}
body[data-page="home"] .home-footer__marquee-group a:hover { color: var(--hq-violet); }
body[data-page="home"] .home-footer__showcase.is-paused .home-footer__marquee-track,
body[data-page="home"] .home-footer__showcase:hover .home-footer__marquee-track,
body[data-page="home"] .home-footer__marquee:focus-within .home-footer__marquee-track { animation-play-state: paused; }
body[data-page="home"] .home-footer__marquee.is-entering { animation: homeFooterPanelIn .32s cubic-bezier(.16,1,.3,1); }
@keyframes homeFooterMarquee { to { transform: translate3d(-50%,0,0); } }
@keyframes homeFooterPanelIn { from { opacity: 0; clip-path: inset(0 0 0 8%); } }

/* Original HQ particle wordmark, recolored for the light footer. */
body[data-page="home"] .hq-footer-signature {
  position: relative;
  margin-top: 0;
  padding-top: 18px;
}
body[data-page="home"] .hq-footer-signature__meta {
  display: flex;
  justify-content: space-between;
  gap: 24px;
  color: var(--home-footer-muted);
  font-size: 9px;
  letter-spacing: .14em;
  text-transform: uppercase;
}
body[data-page="home"] .hq-footer-signature__stage {
  position: relative;
  isolation: isolate;
  height: clamp(150px,18vw,270px);
  margin-top: 16px;
  overflow: hidden;
}
body[data-page="home"] .hq-footer-signature__ghost,
body[data-page="home"] .hq-footer-signature__wordmark {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  gap: .18em;
  white-space: nowrap;
  font-size: clamp(84px,15.1vw,226px);
  font-weight: 650;
  line-height: .8;
  letter-spacing: -.085em;
}
body[data-page="home"] .hq-footer-signature__ghost {
  color: transparent;
  -webkit-text-stroke: 1px rgba(10,10,10,.17);
}
body[data-page="home"] .hq-footer-signature__wordmark {
  color: rgba(10,10,10,.045);
  text-shadow: 0 0 80px rgba(110,63,243,.08);
}
body[data-page="home"] .hq-footer-signature__ghost span,
body[data-page="home"] .hq-footer-signature__wordmark span {
  font-size: .62em;
  letter-spacing: -.07em;
}
body[data-page="home"] .hq-footer-signature__canvas {
  position: absolute;
  z-index: 2;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
body[data-page="home"] .hq-footer-signature + .footer-bottom { margin-top: 12px; }
body[data-page="home"] .home-footer .footer-bottom {
  border-color: var(--home-footer-rule);
  color: var(--home-footer-muted);
}
body[data-page="home"] .home-footer .footer-bottom a { color: var(--home-footer-muted); }
body[data-page="home"] .home-footer .footer-bottom a:hover { color: var(--home-footer-ink); }
body[data-page="home"] .home-footer a:focus-visible {
  outline: 2px solid var(--hq-violet);
  outline-offset: 4px;
}

@media (max-width: 960px) {
  body[data-page="home"] .home-footer__opening { grid-template-columns: 1fr; gap: 42px; }
  body[data-page="home"] .home-footer__action { max-width: 460px; }
  body[data-page="home"] .home-footer__directory { grid-template-columns: 1.25fr .75fr; }
  body[data-page="home"] .home-footer__group--direct {
    grid-column: 1 / -1;
    padding-left: 0;
    border-top: 1px solid var(--home-footer-rule);
    border-left: 0;
  }
  body[data-page="home"] .home-footer__contact { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 28px; }
  body[data-page="home"] .home-footer__contact > div { padding-top: 0; }
}

@media (max-width: 680px) {
  body[data-page="home"] .nav .brand-logo-img { width: 48px; height: 48px; }
  body[data-page="home"] .nav .logo-mark { font-size: 21px; }
  body[data-page="home"] .nav .logo-sub { font-size: 10px; }
  body[data-page="home"] .home-footer__inner { padding-top: 68px; }
  body[data-page="home"] .home-footer__opening { gap: 38px; padding-bottom: 48px; }
  body[data-page="home"] .home-footer__brand { min-height: 64px; gap: 10px; }
  body[data-page="home"] .home-footer__brand-logo { width: 64px; height: 64px; }
  body[data-page="home"] .home-footer__brand-copy > span { font-size: 21px; }
  body[data-page="home"] .home-footer__statement { font-size: clamp(43px,13.5vw,58px); line-height: .93; }
  body[data-page="home"] .home-footer__action { max-width: none; }
  body[data-page="home"] .home-footer__directory { grid-template-columns: 1fr; }
  body[data-page="home"] .home-footer__group,
  body[data-page="home"] .home-footer__group + .home-footer__group {
    padding: 30px 0 40px;
    border-top: 1px solid var(--home-footer-rule);
    border-left: 0;
  }
  body[data-page="home"] .home-footer__directory .home-footer__group:first-child { border-top: 0; }
  body[data-page="home"] .home-footer__links--operations { grid-template-columns: 1fr; }
  body[data-page="home"] .home-footer__contact { grid-template-columns: 1fr; gap: 0; }
  body[data-page="home"] .home-footer__contact > div { padding: 12px 0 14px; }
  body[data-page="home"] .home-footer__contact > div:first-child { padding-top: 0; }
  body[data-page="home"] .home-footer__showcase { padding: 28px 0 34px; }
  body[data-page="home"] .home-footer__showcase-controls { align-items: stretch; gap: 10px; }
  body[data-page="home"] .home-footer__switch { display: grid; flex: 1 1 auto; }
  body[data-page="home"] .home-footer__switch button { min-width: 0; min-height: 44px; }
  body[data-page="home"] .home-footer__motion { width: 48px; flex: 0 0 48px; justify-content: center; padding: 0; }
  body[data-page="home"] .home-footer__motion > span:first-child { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }
  body[data-page="home"] .home-footer__marquee { margin-top: 24px; }
  body[data-page="home"] .home-footer__marquee-group a { min-height: 48px; padding-right: 50px; font-size: 28px; }
  body[data-page="home"] .home-footer__marquee-group a::after { right: 22px; }
  body[data-page="home"] .hq-footer-signature { margin-top: 0; }
  body[data-page="home"] .hq-footer-signature__meta span:last-child { display: none; }
  body[data-page="home"] .hq-footer-signature__stage { height: 170px; }
  body[data-page="home"] .hq-footer-signature__ghost,
  body[data-page="home"] .hq-footer-signature__wordmark {
    align-content: center;
    align-items: flex-start;
    flex-direction: column;
    justify-content: center;
    gap: 0;
    font-size: 90px;
    line-height: .72;
  }
  body[data-page="home"] .hq-footer-signature__ghost span,
  body[data-page="home"] .hq-footer-signature__wordmark span { font-size: .42em; line-height: 1; }
}

@media (prefers-reduced-motion: reduce) {
  body[data-page="home"] .home-footer__motion { display: none; }
  body[data-page="home"] .home-footer__marquee { overflow-x: auto; scrollbar-width: thin; }
  body[data-page="home"] .home-footer__marquee-track { animation: none; transform: none; will-change: auto; }
  body[data-page="home"] .home-footer__marquee-group[aria-hidden="true"] { display: none; }
  body[data-page="home"] .hq-footer-signature__canvas { display: none; }
  body[data-page="home"] .hq-footer-signature__wordmark { color: rgba(10,10,10,.78); }
}