/* ============================================================
   ZAIN VENTURES INDIA — TRAVELOGUE
   Editorial · Indian Railways Timetable · Tricolor accents
   ============================================================ */

:root {
  --paper: #f4ecdd;
  --paper-2: #efe5d0;
  --paper-3: #e7dabe;
  --ink: #14181f;
  --ink-2: #2c3140;
  --ink-soft: #5a5a5a;
  --rule: #c8b997;
  --rule-soft: #d8caa9;

  --terracotta: #d9472e;
  --terracotta-2: #b73a25;
  --ochre: #e9a23b;
  --teal: #0e5757;
  --sepia: #7b4b2a;

  --saffron: #ff9933;
  --india-green: #138808;
  --chakra-blue: #000080;

  --max: 1320px;
  --pad: clamp(20px, 4vw, 56px);

  --display: "Fraunces", "Times New Roman", serif;
  --body: "Bricolage Grotesque", system-ui, sans-serif;
  --mono: "JetBrains Mono", ui-monospace, monospace;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  background: var(--paper);
  color: var(--ink);
  font-family: var(--body);
  font-weight: 400;
  font-size: 16px;
  line-height: 1.55;
  overflow-x: hidden;
  background-image:
    radial-gradient(1200px 600px at 90% -200px, rgba(217,71,46,0.08), transparent 60%),
    radial-gradient(900px 700px at -10% 120%, rgba(14,87,87,0.07), transparent 60%);
}
img, svg { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; border: none; background: none; color: inherit; }
input, select, textarea { font: inherit; color: inherit; }
::selection { background: var(--ink); color: var(--paper); }

/* a11y / SEO — visually hidden but indexable + screen-reader accessible */
.visually-hidden {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
.focusable-skip:focus {
  position: fixed; top: 12px; left: 12px;
  width: auto; height: auto; padding: 12px 18px;
  background: var(--ink); color: var(--paper);
  z-index: 9999; clip: auto; white-space: normal;
  font-family: var(--mono); font-size: 12px; letter-spacing: 0.16em;
  text-transform: uppercase; border-radius: 4px;
}

.grain {
  position: fixed; inset: 0; pointer-events: none; z-index: 999;
  opacity: 0.16; mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 0.45 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}

/* ===== Page-load curtain — refined: logo + name + tagline + tricolor mark ===== */
.curtain {
  position: fixed; inset: 0; z-index: 9998;
  background: var(--paper);
  display: flex; align-items: center; justify-content: center;
  pointer-events: none;
  animation: curtainExit 0.7s 1.7s cubic-bezier(.6,0,.2,1) forwards;
}
/* Skip the curtain entirely on repeat visits in the same session */
body.curtain-skip .curtain { display: none; }
.curtain::before {
  content: "";
  position: absolute; inset: 0;
  background-image:
    radial-gradient(900px 500px at 70% -100px, rgba(217,71,46,0.05), transparent 60%),
    radial-gradient(700px 500px at -10% 110%, rgba(14,87,87,0.05), transparent 60%);
}
.curtain-card {
  position: relative;
  display: flex; flex-direction: column; align-items: center; gap: 16px;
  padding: 0 24px;
}
.curtain-logo {
  width: 80px; height: 80px; object-fit: contain;
  opacity: 0; transform: scale(0.88) rotate(-4deg);
  animation: cLogoIn 1s 0.1s cubic-bezier(.2,1.05,.3,1) forwards;
  filter: drop-shadow(0 6px 16px rgba(0,0,0,0.08));
}
.curtain-name {
  font-family: var(--display); font-weight: 600;
  font-variation-settings: "opsz" 144, "SOFT" 70;
  font-size: clamp(22px, 2.8vw, 30px); letter-spacing: -0.01em;
  color: var(--ink);
  opacity: 0; transform: translateY(10px);
  animation: cNameIn 0.7s 0.7s cubic-bezier(.7,0,.2,1) forwards;
}
.curtain-tri {
  display: flex; gap: 0;
  width: 108px; height: 2px;
  margin-top: 4px;
  border-radius: 2px; overflow: hidden;
}
.curtain-tri i {
  flex: 1; height: 100%;
  transform: scaleX(0); transform-origin: left;
}
.curtain-tri i:nth-child(1) { background: var(--saffron);    animation: cTri 0.55s 1.05s cubic-bezier(.7,0,.2,1) forwards; }
.curtain-tri i:nth-child(2) { background: var(--paper-3);    animation: cTri 0.55s 1.20s cubic-bezier(.7,0,.2,1) forwards; }
.curtain-tri i:nth-child(3) { background: var(--india-green);animation: cTri 0.55s 1.35s cubic-bezier(.7,0,.2,1) forwards; }
.curtain-tag {
  font-family: var(--display); font-weight: 500;
  font-variation-settings: "opsz" 96, "SOFT" 80;
  font-size: clamp(14px, 1.6vw, 17px); letter-spacing: 0;
  color: var(--ink-soft);
  margin-top: 6px;
  opacity: 0; transform: translateY(8px);
  animation: cTagIn 0.7s 1.7s cubic-bezier(.7,0,.2,1) forwards;
  text-align: center;
}
.curtain-tag em { font-style: italic; color: var(--terracotta); }
@keyframes cLogoIn { to { opacity: 1; transform: scale(1) rotate(0); } }
@keyframes cNameIn { to { opacity: 1; transform: translateY(0); } }
@keyframes cTri    { to { transform: scaleX(1); } }
@keyframes cTagIn  { to { opacity: 1; transform: translateY(0); } }
@keyframes curtainExit { to { opacity: 0; transform: translateY(-12px); } }
.curtain.gone { display: none; }

/* Below-fold sections: defer rendering work until they scroll near */
.fleet, .faq, .book, .foot {
  content-visibility: auto;
  contain-intrinsic-size: 800px;
}

/* ===== Typography — refined sizes ===== */
.display {
  font-family: var(--display);
  font-weight: 540;
  font-variation-settings: "opsz" 96, "SOFT" 50;
  font-size: clamp(38px, 5.4vw, 64px);
  line-height: 1.0;
  letter-spacing: -0.022em;
  color: var(--ink);
}
.display em, .italic {
  font-style: italic;
  font-variation-settings: "opsz" 96, "SOFT" 80;
  color: var(--terracotta);
}
.serif { font-family: var(--display); font-style: italic; }
h2.display { font-size: clamp(32px, 4.4vw, 48px); }
h3 { font-family: var(--display); font-weight: 600; font-size: 22px; letter-spacing: -0.01em; }
h4 { font-family: var(--mono); font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink-soft); }
.eyebrow {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--ink); display: inline-flex; align-items: center; gap: 10px;
}

/* ===== Tricolor strip ===== */
.tricolor {
  position: fixed; top: 0; left: 0; right: 0; height: 4px;
  display: grid; grid-template-columns: 1fr 1fr 1fr;
  z-index: 100;
}
.tc-saffron { background: var(--saffron); }
.tc-white   { background: #fff; position: relative; }
.tc-green   { background: var(--india-green); }
.chakra {
  position: absolute; left: 50%; top: 50%; width: 18px; height: 18px;
  transform: translate(-50%,-50%);
  animation: spinChakra 18s linear infinite;
}
@keyframes spinChakra { to { transform: translate(-50%,-50%) rotate(360deg); } }

/* ===== Passport strip ===== */
.passport-strip {
  position: relative; margin-top: 4px;
  background: var(--ink); color: var(--paper);
  font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase;
  padding: 9px 0; border-bottom: 1px solid var(--ink); z-index: 50;
}
.passport-inner {
  max-width: var(--max); margin: 0 auto; padding: 0 var(--pad);
  display: flex; align-items: center; gap: 24px; white-space: nowrap; overflow: hidden;
}
.passport-inner > * { display: inline-flex; align-items: center; gap: 8px; }
.ps-stamp { color: var(--saffron); }
.ps-stamp em { font-style: normal; color: #fff; font-family: var(--body); font-weight: 600; }
.ps-coords { color: var(--paper); opacity: 0.8; }
.ps-dot { width: 6px; height: 6px; background: var(--india-green); border-radius: 50%; box-shadow: 0 0 0 2px rgba(19,136,8,0.25); animation: pulseG 1.6s infinite; }
.ps-loc { color: var(--paper); opacity: 0.8; margin-right: auto; }
.ps-time { color: var(--saffron); }
.ps-est { color: var(--paper); opacity: 0.6; }
@keyframes pulseG { 0%,100% { box-shadow: 0 0 0 2px rgba(19,136,8,0.25); } 50% { box-shadow: 0 0 0 6px rgba(19,136,8,0); } }

/* ===== NAV ===== */
.nav {
  position: sticky; top: 0; z-index: 60;
  background: var(--paper); border-bottom: 1px solid var(--rule);
  transition: box-shadow 0.3s ease, padding 0.3s ease, background 0.3s ease;
}
.nav.is-scrolled { box-shadow: 0 6px 24px -16px rgba(0,0,0,0.25); }
.nav-inner {
  max-width: var(--max); margin: 0 auto; padding: 14px var(--pad);
  display: grid; grid-template-columns: auto 1fr auto auto; gap: 28px; align-items: center;
}
.brand { display: flex; align-items: center; gap: 12px; }
.brand-mark { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; transition: transform 0.4s cubic-bezier(.2,1,.3,1); flex-shrink: 0; }
.brand-mark img { width: 100%; height: 100%; object-fit: contain; }
.brand:hover .brand-mark { transform: rotate(-6deg) scale(1.04); }
.brand-text { display: flex; flex-direction: column; line-height: 1.05; }
.brand-name { font-family: var(--display); font-weight: 600; font-size: 17px; letter-spacing: -0.01em; }
.brand-sub { font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-soft); }

.nav-links { display: flex; gap: 26px; justify-content: center; }
.nav-links a {
  position: relative; font-family: var(--body); font-size: 14px; font-weight: 500;
  color: var(--ink); padding: 6px 0;
}
.nav-links a span {
  font-family: var(--mono); font-size: 9.5px; color: var(--terracotta);
  margin-right: 6px; letter-spacing: 0.1em;
}
.nav-links a::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--ink);
  transform: scaleX(0); transform-origin: left; transition: transform 0.4s cubic-bezier(.7,0,.2,1);
}
.nav-links a:hover::after { transform: scaleX(1); }

.nav-call {
  display: inline-flex; align-items: center; gap: 10px;
  font-family: var(--mono); font-size: 12px;
  background: var(--ink); color: var(--paper);
  padding: 10px 16px; border-radius: 999px;
  transition: transform 0.3s, box-shadow 0.3s;
}
.nav-call:hover { transform: translateY(-2px); box-shadow: 0 10px 24px -10px rgba(0,0,0,0.4); }
.nav-call .pulse { width: 8px; height: 8px; background: var(--india-green); border-radius: 50%; box-shadow: 0 0 0 0 rgba(19,136,8,0.6); animation: pulseG2 1.4s infinite; }
@keyframes pulseG2 { 0% { box-shadow: 0 0 0 0 rgba(19,136,8,0.6);} 100% { box-shadow: 0 0 0 12px rgba(19,136,8,0);} }

.nav-toggle { display: none; width: 40px; height: 40px; flex-direction: column; gap: 5px; justify-content: center; align-items: center; border: 1px solid var(--ink); border-radius: 50%; }
.nav-toggle span { display: block; width: 16px; height: 1.5px; background: var(--ink); transition: 0.3s; }
.menu-open .nav-toggle span:nth-child(1) { transform: translateY(3px) rotate(45deg); }
.menu-open .nav-toggle span:nth-child(2) { opacity: 0; }
.menu-open .nav-toggle span:nth-child(3) { transform: translateY(-3px) rotate(-45deg); }

.menu {
  position: fixed; inset: 0; z-index: 55;
  background: var(--ink); color: var(--paper);
  padding: 100px var(--pad) 40px;
  transform: translateY(-100%);
  transition: transform 0.6s cubic-bezier(.7,0,.2,1);
  display: flex; flex-direction: column; justify-content: space-between; gap: 40px;
}
.menu-open .menu { transform: translateY(0); }
.menu nav { display: flex; flex-direction: column; gap: 12px; }
.menu nav a {
  font-family: var(--display); font-weight: 500; font-size: clamp(36px, 9vw, 72px);
  line-height: 1; letter-spacing: -0.02em;
  display: flex; align-items: baseline; gap: 18px;
  border-bottom: 1px solid rgba(244,236,221,0.18); padding: 14px 0;
}
.menu nav a::before {
  content: attr(data-i); font-family: var(--mono); font-size: 12px; color: var(--saffron);
}
.menu-cta { display: flex; flex-direction: column; gap: 12px; }

/* ===== Buttons ===== */
.btn {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 14px 22px; border-radius: 999px;
  font-family: var(--body); font-weight: 500; font-size: 15px;
  transition: transform 0.3s cubic-bezier(.7,0,.2,1), box-shadow 0.3s, color 0.3s;
  border: 1px solid transparent; white-space: nowrap;
}
.btn-primary { background: var(--ink); color: var(--paper); position: relative; overflow: hidden; }
.btn-primary::before {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(90deg, var(--saffron), #fff, var(--india-green));
  transform: translateX(-100%); transition: transform 0.6s cubic-bezier(.7,0,.2,1);
}
.btn-primary:hover::before { transform: translateX(0); }
.btn-primary:hover { color: var(--ink); }
.btn-primary > * { position: relative; z-index: 1; }
.btn-ghost { background: transparent; color: var(--ink); border-color: var(--ink); }
.btn-ghost:hover { background: var(--ink); color: var(--paper); transform: translateY(-2px); }
.btn .arrow { display: inline-block; transition: transform 0.4s cubic-bezier(.7,0,.2,1); }
.btn:hover .arrow { transform: translateX(6px); }
.btn-num { font-family: var(--mono); font-size: 12px; opacity: 0.85; }
.btn.big { padding: 18px 28px; font-size: 16px; }

/* ===== HERO — refined: smaller, tighter, less billboard ===== */
.hero {
  padding: clamp(56px, 6vw, 88px) var(--pad) clamp(40px, 5vw, 64px);
  max-width: var(--max); margin: 0 auto; position: relative;
}
.hero-grid { display: block; }
.hero-left { max-width: 760px; }
.tri-dot { display: inline-flex; gap: 3px; }
.tri-dot i { width: 6px; height: 6px; border-radius: 50%; }
.tri-dot i:nth-child(1) { background: var(--saffron); }
.tri-dot i:nth-child(2) { background: #fff; box-shadow: inset 0 0 0 1px var(--ink); }
.tri-dot i:nth-child(3) { background: var(--india-green); }

.hero-left { padding-bottom: 24px; }
.hero-left .display { margin-top: 18px; }
.hero-left .reveal-line { display: block; overflow: hidden; line-height: 0.95; }
.hero-left .reveal-line .word {
  display: inline-block;
  transform: translateY(110%) skewY(6deg);
  opacity: 0; animation: wordRise 1s cubic-bezier(.2,.8,.1,1) forwards;
}
.hero-left .reveal-line:nth-child(1) .word { animation-delay: 0.05s; }
.hero-left .reveal-line:nth-child(2) .word { animation-delay: 0.18s; }
.hero-left .reveal-line:nth-child(3) .word { animation-delay: 0.34s; }
@keyframes wordRise { to { transform: translateY(0) skewY(0); opacity: 1; } }

.lede {
  margin-top: 22px;
  font-size: clamp(15px, 1.2vw, 17px);
  max-width: 52ch; color: var(--ink-2); line-height: 1.55;
  opacity: 0; transform: translateY(10px); animation: fadeUp 1s 0.6s forwards;
}
.lede em { color: var(--terracotta); font-style: italic; font-family: var(--display); }
@keyframes fadeUp { to { opacity: 1; transform: translateY(0); } }

.hero-cta {
  display: flex; gap: 14px; flex-wrap: wrap; margin-top: 28px;
  opacity: 0; transform: translateY(10px); animation: fadeUp 1s 0.75s forwards;
}

.hero-meta {
  margin-top: 44px; list-style: none;
  display: grid; grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid var(--ink);
  opacity: 0; animation: fadeUp 1s 0.9s forwards;
}
.hero-meta li {
  padding: 18px 14px 0 0;
  border-right: 1px solid var(--rule);
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--ink-soft); line-height: 1.4;
}
.hero-meta li:last-child { border-right: none; }
.hero-meta .num, .hero-meta strong {
  display: block;
  font-family: var(--display); font-weight: 600; font-style: italic;
  font-size: clamp(28px, 3.4vw, 44px);
  color: var(--ink); letter-spacing: -0.02em;
  font-variation-settings: "opsz" 96, "SOFT" 80;
  margin-bottom: 4px;
}
.hero-meta sup { font-family: var(--display); font-size: 0.5em; vertical-align: super; color: var(--terracotta); margin-left: 2px; }

.made-in {
  margin-top: 24px;
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--ink-soft); display: inline-flex; align-items: center; gap: 10px;
  padding: 6px 14px; border: 1px solid var(--rule); border-radius: 999px;
  opacity: 0; animation: fadeUp 1s 1s forwards;
}
.made-in strong { color: var(--india-green); font-weight: 700; }
.mi-chakra {
  width: 14px; height: 14px; border-radius: 50%;
  border: 1.5px solid var(--chakra-blue);
  position: relative; display: inline-block;
  background:
    conic-gradient(from 0deg,
      transparent 0deg, var(--chakra-blue) 0deg 2deg, transparent 2deg 30deg,
      var(--chakra-blue) 30deg 32deg, transparent 32deg 60deg,
      var(--chakra-blue) 60deg 62deg, transparent 62deg 90deg,
      var(--chakra-blue) 90deg 92deg, transparent 92deg 120deg,
      var(--chakra-blue) 120deg 122deg, transparent 122deg 150deg,
      var(--chakra-blue) 150deg 152deg, transparent 152deg 180deg,
      var(--chakra-blue) 180deg 182deg, transparent 182deg 210deg,
      var(--chakra-blue) 210deg 212deg, transparent 212deg 240deg,
      var(--chakra-blue) 240deg 242deg, transparent 242deg 270deg,
      var(--chakra-blue) 270deg 272deg, transparent 272deg 300deg,
      var(--chakra-blue) 300deg 302deg, transparent 302deg 330deg,
      var(--chakra-blue) 330deg 332deg, transparent 332deg 360deg);
  animation: spinChakra 14s linear infinite;
}

/* HERO right — map card */
.hero-right { position: relative; opacity: 0; animation: fadeUp 1.2s 0.4s forwards; }
.map-card {
  background: var(--paper-2);
  border: 1px solid var(--ink);
  border-radius: 6px;
  position: relative;
  box-shadow: 0 1px 0 var(--ink);
  transition: transform 0.6s cubic-bezier(.7,0,.2,1);
}
.map-card:hover { transform: rotate(0deg) translateY(-4px); }
.map-card-h {
  display: flex; justify-content: space-between; align-items: center;
  padding: 14px 18px; border-bottom: 1px dashed var(--ink);
  font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.16em; text-transform: uppercase;
}
.mc-tag { color: var(--terracotta); font-weight: 500; }
.map-canvas { position: relative; aspect-ratio: 1; overflow: hidden; background: var(--paper-2); }
.route-svg { width: 100%; height: 100%; display: block; }

/* Sea + coast */
.sea  { opacity: 0.85; }
.coast { stroke-linecap: round; }
.river { stroke-linejoin: round; }

/* Routes — all faint by default, active one drawn in terracotta */
.route-line {
  fill: none;
  stroke: #14181F;
  stroke-width: 0.9;
  stroke-dasharray: 3 4;
  opacity: 0.22;
  pointer-events: none;
  transition: opacity 0.4s, stroke 0.4s, stroke-width 0.4s;
}
.route-line.is-active {
  stroke: var(--terracotta);
  stroke-width: 2.6;
  stroke-dasharray: 1200;
  stroke-dashoffset: 1200;
  opacity: 1;
  animation: drawRoute 2.6s cubic-bezier(.7,0,.2,1) forwards;
  filter: drop-shadow(0 1px 0 rgba(217,71,46,0.3));
}
@keyframes drawRoute { to { stroke-dashoffset: 0; } }

/* Pins */
.pin text {
  paint-order: stroke;
  stroke: var(--paper-2);
  stroke-width: 3.5;
  font-family: var(--display);
  font-size: 13px;
  font-weight: 600;
  fill: var(--ink);
  letter-spacing: -0.01em;
}
.pin circle { fill: #2c3140; transition: fill 0.4s, r 0.4s; }
.pin.pin-minor circle { fill: #6e6757; opacity: 0.7; }
.pin.pin-minor text { font-size: 10px; fill: #6e6757; font-weight: 500; }
.pin.is-active circle { fill: var(--terracotta) !important; }
.pin.is-active text { fill: var(--terracotta); }
.pin.is-active::after { content: ""; }
.pin.pin-origin circle:nth-child(3) { animation: ringPulse 2.8s ease-out infinite; transform-origin: 285px 374px; }
@keyframes ringPulse {
  0%   { r: 14; opacity: 0.5; }
  100% { r: 28; opacity: 0; }
}

/* Bus glow */
.bus-mover { filter: drop-shadow(0 1px 1px rgba(0,0,0,0.4)); }
.map-stamp {
  position: absolute; right: 14px; bottom: 14px;
  width: clamp(96px, 14vw, 130px); aspect-ratio: 1; opacity: 0;
  animation: stampDrop 0.5s 4s cubic-bezier(.2,1.5,.4,1) forwards;
}
@keyframes stampDrop {
  0% { opacity: 0; transform: rotate(-22deg) scale(2); }
  60% { opacity: 0.9; }
  100% { opacity: 0.85; transform: rotate(-12deg) scale(1); }
}
.map-card-f {
  display: flex; justify-content: space-between;
  padding: 12px 18px; border-top: 1px dashed var(--ink);
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--ink-soft);
}

/* HERO ticker */
.ticker {
  margin-top: 64px;
  border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink);
  background: var(--ink); color: var(--paper);
  overflow: hidden; padding: 14px 0;
}
.ticker-track {
  display: inline-flex; gap: 48px;
  animation: tick 60s linear infinite;
  white-space: nowrap;
  font-family: var(--mono); font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase;
}
.ticker-track span:nth-child(odd) { color: var(--saffron); }
@keyframes tick { to { transform: translateX(-50%); } }

/* ===== Section heads — refined: less ornament, tighter padding ===== */
.section-head {
  max-width: var(--max); margin: 0 auto;
  padding: clamp(56px, 7vw, 96px) var(--pad) clamp(28px, 3vw, 40px);
  display: flex; flex-direction: column; gap: 12px;
  align-items: flex-start;
}
.sh-meta {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--ink-soft);
}
.sh-num { color: var(--terracotta); font-weight: 700; margin-right: 10px; }
.sh-tag { color: var(--ink-soft); }
.section-head p { max-width: 56ch; color: var(--ink-2); margin-top: 8px; font-size: 15px; }

/* ===== DEPARTURES BOARD ===== */
.departures {
  background: var(--ink); color: var(--paper);
  padding-bottom: clamp(60px, 8vw, 120px);
  position: relative; overflow: hidden;
}
.departures::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 1px;
  background: rgba(244,236,221,0.18);
}
.departures .display { color: var(--paper); }
.departures .display em { color: var(--saffron); }
.departures .section-head p { color: rgba(244,236,221,0.7); }
.departures .sh-meta { border-left-color: var(--saffron); }
.departures .sh-num { color: var(--saffron); }
.departures .sh-tag { color: rgba(244,236,221,0.6); }

/* Departures 2-col: sticky map | scrollable route list */
.dep-layout {
  max-width: var(--max);
  margin: 0 auto;
  padding: 0 var(--pad);
  display: grid;
  grid-template-columns: minmax(380px, 1fr) 1.4fr;
  gap: clamp(24px, 4vw, 48px);
  align-items: start;
}
.dep-map {
  position: sticky;
  top: 92px;
  align-self: start;
}
.dep-map .map-card {
  transform: none;
  background: var(--paper-2);
  color: var(--ink);
  box-shadow: 0 1px 0 var(--ink);
}
.dep-map .map-card:hover { transform: translateY(-2px); }
.dep-map .mc-tag,
.dep-map .map-card-h,
.dep-map .map-card-f { color: var(--ink-soft); }
.dep-map .mc-tag { color: var(--terracotta); }
@media (max-width: 1000px) {
  .dep-layout { grid-template-columns: 1fr; }
  .dep-map { position: relative; top: 0; max-width: 540px; margin: 0 auto; }
}

.board { padding: 0; }
.board-head, .row {
  display: grid;
  grid-template-columns: 88px 1.5fr auto auto 30px;
  gap: 14px; align-items: center;
  padding: 18px 18px;
  border-bottom: 1px solid rgba(244,236,221,0.12);
  font-family: var(--mono); font-size: 11.5px; letter-spacing: 0.1em; text-transform: uppercase;
}
.row .from, .board-head > span:nth-child(5) { display: none; }
.board-head {
  color: rgba(244,236,221,0.5); font-size: 10.5px;
  border-top: 1px solid rgba(244,236,221,0.2);
  border-bottom: 1px solid rgba(244,236,221,0.3);
}
.row {
  color: var(--paper); position: relative;
  cursor: pointer; overflow: hidden;
  transition: background 0.4s, padding 0.4s;
}
.row::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 0;
  background: var(--saffron);
  transition: width 0.4s cubic-bezier(.7,0,.2,1);
}
.row:hover { background: rgba(255,153,51,0.06); padding-left: 36px; }
.row:hover::before { width: 4px; }

/* split-flap chars (rendered by JS) */
.flaps { display: inline-flex; gap: 1px; }
.flap {
  display: inline-block;
  width: 0.62em; height: 1.5em; line-height: 1.5em;
  perspective: 200px;
  position: relative;
}
.flap-inner {
  display: block;
  text-align: center;
  width: 100%; height: 100%;
  background: rgba(244,236,221,0.06);
  border-radius: 2px;
  font-family: var(--mono); color: var(--paper);
  transform-origin: center;
  animation: flapIn 0.5s cubic-bezier(.7,0,.2,1) both;
}
@keyframes flapIn {
  0% { transform: rotateX(-90deg); opacity: 0; }
  100% { transform: rotateX(0); opacity: 1; }
}

.row .status { color: var(--india-green); font-weight: 700; display: inline-flex; gap: 6px; align-items: center; }
.row .status::before { content: "●"; color: var(--india-green); animation: blink 2s infinite; }
@keyframes blink { 50% { opacity: 0.3; } }

.row .dest {
  font-family: var(--display); font-style: italic; font-size: 26px;
  letter-spacing: -0.01em; color: var(--paper); text-transform: none; font-weight: 600;
  font-variation-settings: "opsz" 96, "SOFT" 80;
}
.row .dest small {
  display: block; font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.18em;
  text-transform: uppercase; color: rgba(244,236,221,0.55); margin-top: 2px;
  font-style: normal;
}
.row .dist, .row .dur, .row .from { font-family: var(--mono); }
.row .from { color: var(--ochre); }
.row .arrow-cell { color: var(--saffron); font-size: 20px; text-align: right; }

.board-foot {
  display: flex; align-items: center; gap: 10px;
  padding: 16px 22px;
  border-top: 1px solid rgba(244,236,221,0.2);
  font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase;
  color: rgba(244,236,221,0.6);
}
.bf-blink { color: var(--india-green); animation: blink 1.6s infinite; }
.bf-spacer { flex: 1; }

@media (max-width: 800px) {
  .board-head { display: none; }
  .row { grid-template-columns: 1fr; gap: 6px; padding: 18px 16px; }
  .row .dest { font-size: 32px; }
  .row .arrow-cell { display: none; }
}

/* ===== FLEET STUBS ===== */
.fleet { padding-bottom: clamp(60px, 8vw, 120px); background: var(--paper); position: relative; }
.stubs {
  max-width: var(--max); margin: 0 auto; padding: 0 var(--pad);
  display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
  gap: 22px;
}
.stub {
  display: grid;
  grid-template-columns: 1.4fr 14px 1fr;
  background: var(--paper-2);
  border: 1px solid var(--rule);
  border-radius: 6px;
  position: relative; overflow: hidden;
  transition: transform 0.4s cubic-bezier(.2,.8,.1,1), border-color 0.3s;
}
.stub:hover { transform: translateY(-3px); border-color: var(--ink); }
.stub-l { padding: 26px 26px 22px; position: relative; }
.stub-l h3 {
  font-family: var(--display); font-weight: 600; font-size: clamp(28px, 3vw, 38px);
  font-variation-settings: "opsz" 96, "SOFT" 70;
  line-height: 0.95; letter-spacing: -0.02em; margin: 16px 0 18px;
}
.stub-tag {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--terracotta);
}
.stub-l ul { list-style: none; display: flex; flex-direction: column; gap: 8px; }
.stub-l li { font-size: 14px; color: var(--ink-2); position: relative; padding-left: 18px; }
.stub-l li::before { content: "→"; position: absolute; left: 0; color: var(--terracotta); }
.stub-no {
  position: absolute; bottom: 16px; right: 22px;
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.16em; color: var(--ink-soft);
}
.stub-tear {
  background-image:
    radial-gradient(circle at 50% 8px, var(--paper) 4px, transparent 4.5px),
    radial-gradient(circle at 50% 24px, var(--paper) 4px, transparent 4.5px);
  background-size: 14px 16px;
  border-left: 1px dashed var(--ink); border-right: 1px dashed var(--ink);
}
.stub-r {
  background: var(--ink); color: var(--paper);
  padding: 26px 22px;
  display: grid; grid-template-columns: auto 1fr;
  gap: 8px 14px; align-content: center;
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase;
}
.stub-r span { color: rgba(244,236,221,0.6); align-self: center; }
.stub-r strong {
  font-family: var(--display); font-style: italic; font-weight: 600;
  font-size: 22px; letter-spacing: -0.01em; text-transform: none;
  color: var(--saffron);
  font-variation-settings: "opsz" 96, "SOFT" 80;
}

/* ===== STAMPED CREDENTIALS ===== */
.why { background: var(--paper); padding-bottom: clamp(60px, 8vw, 140px); }
.stamps {
  max-width: var(--max); margin: 0 auto; padding: 0 var(--pad);
  display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 24px;
}
.stamp {
  position: relative; padding: 36px 30px 30px;
  border: 2px dashed var(--terracotta); border-radius: 4px;
  background: var(--paper-2); overflow: hidden;
  transition: transform 0.5s cubic-bezier(.2,.8,.1,1);
}
.stamp:hover { transform: rotate(-1.5deg); }
.stamp::before {
  content: "✓ APPROVED";
  position: absolute; top: 18px; right: -38px;
  transform: rotate(35deg) scale(2);
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.18em; font-weight: 700;
  color: var(--india-green); border: 1.5px solid var(--india-green);
  padding: 4px 40px;
  opacity: 0;
  transition: opacity 0.5s, transform 0.5s cubic-bezier(.2,1.5,.3,1);
}
.stamp.in::before { opacity: 0.95; transform: rotate(35deg) scale(1); }
.stamp-no {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.16em; color: var(--terracotta);
  display: inline-block; margin-bottom: 14px;
  padding: 3px 8px; border: 1px solid var(--terracotta); border-radius: 4px;
}
.stamp h3 {
  font-family: var(--display); font-style: italic; font-weight: 600;
  font-size: clamp(24px, 2.4vw, 30px);
  font-variation-settings: "opsz" 96, "SOFT" 80;
  margin-bottom: 10px; letter-spacing: -0.01em;
}
.stamp p { color: var(--ink-2); font-size: 14.5px; }

/* ===== OCCASIONS ===== */
.occasions { padding-bottom: clamp(60px, 8vw, 120px); }
.occ-grid {
  max-width: var(--max); margin: 0 auto; padding: 0 var(--pad);
  display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 0; border: 1px solid var(--rule);
}
.occ {
  position: relative;
  padding: 32px 26px 100px;
  border: 1px solid var(--rule);
  margin: -1px 0 0 -1px;
  background: var(--paper);
  overflow: hidden; min-height: 240px;
  display: flex; flex-direction: column; justify-content: flex-end;
  transition: color 0.4s;
}
.occ::before {
  content: ""; position: absolute; inset: 0;
  background: var(--c, var(--terracotta));
  transform: translateY(100%);
  transition: transform 0.6s cubic-bezier(.7,0,.2,1);
  z-index: 0;
}
.occ:hover::before { transform: translateY(0); }
.occ:hover { color: #fff; }
.occ:hover .occ-num { color: rgba(255,255,255,0.7); border-color: rgba(255,255,255,0.5); }
.occ > * { position: relative; z-index: 1; }
.occ-num {
  position: absolute; top: 24px; left: 26px;
  font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.16em;
  color: var(--ink-soft);
  padding: 3px 8px; border: 1px solid var(--rule); border-radius: 4px;
  transition: color 0.4s, border-color 0.4s;
}
.occ h3 {
  font-family: var(--display); font-weight: 600; font-style: italic;
  font-variation-settings: "opsz" 96, "SOFT" 90;
  font-size: clamp(28px, 3vw, 40px); letter-spacing: -0.02em; line-height: 0.95;
  margin-bottom: 10px;
}
.occ p { font-size: 14px; opacity: 0.85; }

/* ===== COVERAGE ===== */
.coverage { padding-bottom: clamp(60px, 8vw, 120px); }
.chips {
  max-width: var(--max); margin: 0 auto; padding: 0 var(--pad);
  display: flex; flex-wrap: wrap; gap: 8px;
}
.chip {
  display: inline-flex; align-items: center; padding: 9px 16px;
  font-family: var(--body); font-size: 14px;
  border: 1px solid var(--ink); border-radius: 999px;
  background: transparent;
  transition: transform 0.4s cubic-bezier(.2,.8,.1,1), background 0.3s, color 0.3s;
}
.chip:hover { background: var(--ink); color: var(--paper); transform: translateY(-3px) rotate(-2deg); }
.chip.lg {
  font-family: var(--display); font-style: italic; font-weight: 600;
  font-variation-settings: "opsz" 96, "SOFT" 80;
  font-size: 22px; padding: 10px 20px;
  background: var(--ink); color: var(--saffron); border-color: var(--ink);
}
.chip.lg:hover { background: var(--terracotta); color: #fff; border-color: var(--terracotta); }

/* ===== FAQ ===== */
.faq { padding-bottom: clamp(60px, 8vw, 120px); }
.faq-list {
  max-width: var(--max); margin: 0 auto; padding: 0 var(--pad);
  border-top: 1px solid var(--ink);
}
.faq-item { border-bottom: 1px solid var(--ink); }
.faq-item summary {
  list-style: none; cursor: pointer;
  padding: 26px 0;
  display: grid; grid-template-columns: 60px 1fr auto;
  gap: 20px; align-items: center;
  font-family: var(--display); font-weight: 540;
  font-size: clamp(20px, 2.2vw, 28px); letter-spacing: -0.01em;
  font-variation-settings: "opsz" 96, "SOFT" 60;
  transition: color 0.3s;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item .q-no { font-family: var(--mono); font-size: 12px; color: var(--terracotta); letter-spacing: 0.16em; }
.faq-item .q-icon {
  width: 24px; height: 24px; border: 1px solid var(--ink); border-radius: 50%;
  position: relative; transition: transform 0.4s, background 0.3s;
}
.faq-item .q-icon::before, .faq-item .q-icon::after {
  content: ""; position: absolute; left: 50%; top: 50%; background: var(--ink);
  transform: translate(-50%,-50%);
}
.faq-item .q-icon::before { width: 10px; height: 1.5px; }
.faq-item .q-icon::after { width: 1.5px; height: 10px; transition: transform 0.4s; }
.faq-item[open] .q-icon { background: var(--terracotta); border-color: var(--terracotta); transform: rotate(180deg); }
.faq-item[open] .q-icon::before, .faq-item[open] .q-icon::after { background: #fff; }
.faq-item[open] .q-icon::after { transform: translate(-50%,-50%) scaleY(0); }
.faq-item:hover summary { color: var(--terracotta); }
.faq-body {
  max-height: 0; overflow: hidden;
  padding-left: 80px; padding-right: 60px;
  transition: max-height 0.5s cubic-bezier(.7,0,.2,1), padding 0.4s;
  color: var(--ink-2); font-size: 16px; line-height: 1.65;
}
.faq-item[open] .faq-body { max-height: 500px; padding-bottom: 30px; }
.faq-body a { color: var(--terracotta); border-bottom: 1px solid var(--terracotta); }

/* ===== BOARDING PASS FORM ===== */
.book {
  background: var(--ink); color: var(--paper);
  padding-bottom: clamp(60px, 8vw, 120px);
  position: relative; overflow: hidden;
}
.book::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 1px;
  background: rgba(244,236,221,0.18);
}
.book .display { color: var(--paper); }
.book .display em { color: var(--saffron); }
.book .section-head p { color: rgba(244,236,221,0.7); }
.book .sh-meta { border-left-color: var(--saffron); }
.book .sh-num { color: var(--saffron); }
.book .sh-tag { color: rgba(244,236,221,0.6); }

.pass {
  max-width: 1100px;
  background: var(--paper); color: var(--ink);
  border-radius: 8px;
  display: grid; grid-template-columns: 1fr 280px;
  position: relative;
  margin: 0 auto;
  width: calc(100% - 2 * var(--pad));
  box-shadow: 0 30px 80px -30px rgba(0,0,0,0.5);
  transform: rotate(-0.6deg);
}
.pass::after {
  content: "";
  position: absolute; left: calc(100% - 280px - 1px); top: 14px; bottom: 14px;
  width: 2px;
  background: repeating-linear-gradient(to bottom, var(--ink) 0 6px, transparent 6px 12px);
}
.pass-l { padding: 38px 36px 36px; }
.pass-head {
  display: flex; justify-content: space-between; align-items: center;
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--ink-soft);
  border-bottom: 1px dashed var(--ink); padding-bottom: 14px; margin-bottom: 24px;
}
.pass-head .pass-class { color: var(--terracotta); }
.pass-head strong { color: var(--ink); font-family: var(--mono); letter-spacing: 0.18em; font-weight: 700; }
.pass-form .row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.pass-form label { display: flex; flex-direction: column; gap: 6px; margin-bottom: 14px; }
.pass-form label.full { grid-column: 1 / -1; }
.pass-form span {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--ink-soft);
}
.pass-form input, .pass-form select, .pass-form textarea {
  border: none; border-bottom: 1px solid var(--ink);
  background: transparent;
  padding: 10px 0 12px;
  font-family: var(--display); font-style: italic; font-weight: 500;
  font-size: 22px; letter-spacing: -0.01em; color: var(--ink); outline: none;
  transition: border-color 0.3s, padding 0.3s;
  font-variation-settings: "opsz" 96, "SOFT" 80;
  border-radius: 0;
}
.pass-form input:focus, .pass-form select:focus, .pass-form textarea:focus {
  border-color: var(--terracotta); padding-left: 6px;
}
.pass-form textarea { resize: vertical; min-height: 60px; font-family: var(--body); font-style: normal; font-size: 16px; line-height: 1.5; }
.pass-form select { appearance: none; }

/* ===== Vehicle picker (radio-card grid — show all options at once) ===== */
.field { display: flex; flex-direction: column; gap: 8px; margin-bottom: 18px; }
.field.full { grid-column: 1 / -1; }
.field-tag {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--ink-soft);
}

.vpicker {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-top: 4px;
}
.vcard {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto auto auto;
  gap: 6px;
  padding: 14px 12px 12px;
  border: 1px solid var(--rule);
  border-radius: 6px;
  background: var(--paper);
  cursor: pointer;
  transition: transform 0.25s cubic-bezier(.2,.8,.1,1), border-color 0.25s, background 0.25s, box-shadow 0.25s, color 0.25s;
  text-align: left;
}
.vcard input { position: absolute; opacity: 0; pointer-events: none; }
.vcard-icon {
  width: 36px; height: 24px;
  color: var(--ink); opacity: 0.85;
  transition: color 0.25s, transform 0.4s cubic-bezier(.2,.8,.1,1);
}
.vcard-name {
  font-family: var(--display); font-style: italic; font-weight: 600;
  font-variation-settings: "opsz" 96, "SOFT" 80;
  font-size: 18px; letter-spacing: -0.01em; line-height: 1.05;
  color: var(--ink);
  transition: color 0.25s;
}
.vcard-cap {
  font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--ink-soft);
  transition: color 0.25s;
}
.vcard-tick {
  position: absolute; top: 10px; right: 10px;
  width: 20px; height: 20px;
  border: 1px solid var(--rule);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--mono); font-size: 11px; line-height: 1;
  color: transparent;
  transition: color 0.25s, background 0.25s, border-color 0.25s, transform 0.3s cubic-bezier(.2,1.5,.3,1);
}

/* Hover */
.vcard:hover { border-color: var(--ink); transform: translateY(-2px); box-shadow: 0 8px 20px -10px rgba(0,0,0,0.2); }
.vcard:hover .vcard-icon { color: var(--terracotta); transform: translateX(2px) rotate(-2deg); }

/* Focus (keyboard) */
.vcard:has(input:focus-visible) { outline: 2px dashed var(--terracotta); outline-offset: 4px; }

/* Selected */
.vcard:has(input:checked) {
  border-color: var(--terracotta);
  background: linear-gradient(180deg, var(--paper) 0%, #f7e6d8 100%);
  box-shadow: inset 0 0 0 1px var(--terracotta), 0 12px 24px -10px rgba(217,71,46,0.3);
}
.vcard:has(input:checked) .vcard-icon { color: var(--terracotta); }
.vcard:has(input:checked) .vcard-name { color: var(--terracotta); }
.vcard:has(input:checked) .vcard-tick {
  color: #fff;
  background: var(--terracotta);
  border-color: var(--terracotta);
  transform: scale(1.05);
}

@media (max-width: 1000px) {
  .vpicker { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 700px) {
  .vpicker { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .vcard { padding: 12px 10px 10px; }
  .vcard-name { font-size: 16px; }
  .vcard-cap { font-size: 9px; }
}
@media (max-width: 380px) {
  .vpicker { grid-template-columns: 1fr 1fr; }
}

/* Legacy vfx classes — kept inert in case anything still references them */
.vfx { position: relative; }
.vfx-trigger {
  width: 100%;
  display: grid;
  grid-template-columns: 32px 1fr auto auto;
  gap: 12px;
  align-items: center;
  padding: 9px 0 11px;
  background: transparent;
  border: none;
  border-bottom: 1px solid var(--ink);
  font-family: var(--display); font-style: italic; font-weight: 500;
  font-size: 22px; letter-spacing: -0.01em;
  font-variation-settings: "opsz" 96, "SOFT" 80;
  color: var(--ink);
  cursor: pointer; text-align: left;
  transition: border-color 0.3s, padding 0.3s;
}
.vfx-trigger:hover, .vfx[aria-expanded="true"] .vfx-trigger { border-color: var(--terracotta); }
.vfx-icon { width: 32px; height: 22px; color: var(--terracotta); display: flex; align-items: center; }
.vfx-icon svg { width: 100%; height: 100%; }
.vfx-label { color: var(--ink); }
.vfx-trigger[data-empty="1"] .vfx-label { color: var(--ink-soft); font-style: italic; }
.vfx-cap {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--terracotta);
  padding: 3px 8px; border: 1px solid var(--terracotta); border-radius: 3px;
}
.vfx-cap:empty { display: none; }
.vfx-caret {
  font-family: var(--mono); font-size: 14px; color: var(--ink-soft);
  transition: transform 0.3s cubic-bezier(.7,0,.2,1);
}
.vfx[aria-expanded="true"] .vfx-caret { transform: rotate(180deg); color: var(--terracotta); }

.vfx-list {
  position: absolute;
  top: calc(100% + 6px); left: 0; right: 0;
  list-style: none; margin: 0; padding: 6px;
  background: var(--paper);
  border: 1px solid var(--ink);
  border-radius: 6px;
  box-shadow: 0 30px 60px -20px rgba(0,0,0,0.35);
  z-index: 30;
  max-height: 0; overflow: hidden;
  opacity: 0;
  transform: translateY(-8px) scaleY(0.96);
  transform-origin: top center;
  transition: opacity 0.25s, transform 0.3s cubic-bezier(.7,0,.2,1), max-height 0.4s cubic-bezier(.7,0,.2,1), padding 0.3s;
  pointer-events: none;
}
.vfx[aria-expanded="true"] .vfx-list {
  max-height: 480px;
  opacity: 1;
  transform: translateY(0) scaleY(1);
  pointer-events: auto;
}
.vfx-list li {
  display: grid;
  grid-template-columns: 36px 1fr;
  grid-template-rows: auto auto;
  gap: 2px 14px;
  padding: 12px 14px;
  border-radius: 4px;
  cursor: pointer;
  align-items: center;
  position: relative;
  color: var(--ink);
  transition: background 0.2s, color 0.2s, transform 0.2s;
}
.vfx-list li:hover, .vfx-list li.is-focus {
  background: var(--ink); color: var(--paper);
}
.vfx-list li.is-focus .vfx-c { color: var(--saffron); }
.vfx-list li[aria-selected="true"]::before {
  content: "✓";
  position: absolute; right: 14px; top: 50%; transform: translateY(-50%);
  color: var(--terracotta); font-family: var(--mono); font-size: 14px;
}
.vfx-list .vfx-i {
  grid-row: 1 / 3; grid-column: 1;
  width: 36px; height: 24px; color: var(--terracotta);
}
.vfx-list li:hover .vfx-i, .vfx-list li.is-focus .vfx-i { color: var(--saffron); }
.vfx-list .vfx-n {
  grid-row: 1; grid-column: 2;
  font-family: var(--display); font-style: italic; font-weight: 600;
  font-variation-settings: "opsz" 96, "SOFT" 80;
  font-size: 19px; letter-spacing: -0.01em; line-height: 1;
}
.vfx-list .vfx-c {
  grid-row: 2; grid-column: 2;
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--ink-soft);
}

@media (max-width: 800px) {
  .vfx-trigger { font-size: 18px; }
  .vfx-list .vfx-n { font-size: 17px; }
}
.pass-form .big { margin-top: 20px; width: 100%; justify-content: center; }
.pass-r {
  background: var(--paper-3);
  padding: 28px 22px;
  display: flex; flex-direction: column; gap: 14px; align-items: center;
  text-align: center;
  font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--ink-soft);
  border-radius: 0 8px 8px 0;
  position: relative;
}
.pass-r-leg { display: flex; flex-direction: column; gap: 4px; align-items: center; min-height: 92px; justify-content: center; }
.pl-tag { color: var(--terracotta); font-weight: 700; font-size: 10px; }
.pass-r strong {
  display: block;
  font-family: var(--display); font-weight: 700;
  font-size: clamp(38px, 4.2vw, 54px); letter-spacing: -0.02em; line-height: 1;
  color: var(--ink);
  font-variation-settings: "opsz" 144, "SOFT" 60;
  transition: color 0.4s, transform 0.4s cubic-bezier(.2,1.5,.3,1);
}
.pl-name {
  font-family: var(--display); font-style: italic; font-weight: 500;
  font-size: 14px; letter-spacing: -0.01em;
  color: var(--ink-2); text-transform: none;
  font-variation-settings: "opsz" 96, "SOFT" 80;
  transition: color 0.4s;
}
#passToCode, #passToName { color: var(--ink-soft); }
.pass-r.is-active #passToCode { color: var(--india-green); animation: codePop 0.5s cubic-bezier(.2,1.5,.3,1); }
.pass-r.is-active #passToName { color: var(--ink); }
@keyframes codePop {
  0% { transform: translateY(8px); opacity: 0; }
  60% { transform: translateY(-2px) scale(1.05); opacity: 1; }
  100% { transform: translateY(0) scale(1); opacity: 1; }
}
.pass-r-arrow { color: var(--terracotta); width: 18px; height: 36px; display: flex; align-items: center; }
.pass-r-arrow svg { width: 100%; height: 100%; }
.pass-r-arrow svg path { stroke-dasharray: 60; stroke-dashoffset: 60; animation: dropArrow 1.2s 0.3s cubic-bezier(.7,0,.2,1) forwards; }
@keyframes dropArrow { to { stroke-dashoffset: 0; } }
.pass-r.is-active .pass-r-arrow { color: var(--india-green); }

.pass-barcode { display: flex; gap: 2px; align-items: center; height: 50px; }
.pass-barcode span { display: block; width: 2px; height: 100%; background: var(--ink); }
.pass-barcode span:nth-child(3n) { width: 4px; }
.pass-barcode span:nth-child(7n) { height: 70%; }
.pass-barcode span:nth-child(5n) { width: 1px; }
.pass-r-meta { display: flex; gap: 14px; font-size: 10px; flex-wrap: wrap; justify-content: center; }
.pass-r-meta strong { font-family: var(--mono); font-size: 10px; color: var(--ink); display: inline; letter-spacing: 0.18em; font-weight: 700; }
.pass-r-date {
  color: var(--india-green) !important;
  border-top: 1px dashed var(--india-green);
  padding-top: 8px;
  margin-top: 4px;
  width: 100%;
  text-align: center;
  animation: codePop 0.5s cubic-bezier(.2,1.5,.3,1);
}
.pass-r-date strong { color: var(--india-green) !important; font-size: 12px !important; }
.pass-r-date[hidden] { display: none; }
.pass-r-call { display: flex; flex-direction: column; gap: 6px; }
.pass-r-call a { color: var(--terracotta); border-bottom: 1px dashed var(--terracotta); padding-bottom: 2px; font-family: var(--mono); }

@media (max-width: 800px) {
  .pass { grid-template-columns: 1fr; transform: none; }
  .pass::after { display: none; }
  .pass-r { border-radius: 0 0 8px 8px; }
}

/* ===== CONTACT INFO ===== */
.contact-info { padding: clamp(60px, 8vw, 120px) 0; background: var(--paper); }
.ci-grid {
  max-width: var(--max); margin: 0 auto; padding: 0 var(--pad);
  display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 0;
  border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink);
}
.ci-block { padding: 36px 28px; border-right: 1px solid var(--rule); }
.ci-block:last-child { border-right: none; }
.ci-block .sh-num {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.16em;
  color: var(--terracotta); display: block; margin-bottom: 10px;
}
.ci-block h3 {
  font-family: var(--display); font-style: italic; font-weight: 600;
  font-variation-settings: "opsz" 96, "SOFT" 80;
  font-size: clamp(26px, 2.6vw, 34px); letter-spacing: -0.01em;
  margin-bottom: 14px;
}
.ci-block p { color: var(--ink-2); font-size: 15px; line-height: 1.6; }
.ci-block a { color: var(--terracotta); border-bottom: 1px solid var(--rule); transition: border-color 0.3s; }
.ci-block a:hover { border-bottom-color: var(--terracotta); }
.ci-link { display: inline-block; margin-top: 10px; font-family: var(--mono); font-size: 12px; }

/* ===== FOOTER ===== */
.foot { background: var(--ink); color: var(--paper); padding-bottom: 24px; position: relative; }
.foot::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 1px;
  background: rgba(244,236,221,0.18);
}
.foot-marquee { padding: 28px 0; border-bottom: 1px solid rgba(244,236,221,0.18); overflow: hidden; }
.fm-track {
  display: inline-flex; gap: 32px; white-space: nowrap;
  animation: tick 28s linear infinite;
  font-family: var(--display); font-style: italic; font-weight: 600;
  font-variation-settings: "opsz" 144, "SOFT" 90;
  font-size: clamp(28px, 4vw, 56px); letter-spacing: -0.02em;
  color: var(--paper);
}
.fm-track span:nth-child(2n) { color: var(--saffron); font-style: normal; }
.foot-grid {
  max-width: var(--max); margin: 0 auto;
  padding: clamp(40px, 5vw, 60px) var(--pad);
  display: grid; grid-template-columns: 1.6fr 1fr 1fr 1.2fr;
  gap: 40px;
}
.foot-logo { width: 56px; height: 56px; object-fit: contain; margin-bottom: 14px; }
.foot-brand h3 {
  font-family: var(--display); font-weight: 700;
  font-size: clamp(28px, 3.6vw, 44px); line-height: 0.95; letter-spacing: -0.02em;
  font-variation-settings: "opsz" 96, "SOFT" 70;
}
.foot-brand h3 em { color: var(--saffron); font-style: italic; }
.foot-brand p { margin-top: 18px; color: rgba(244,236,221,0.7); max-width: 40ch; font-size: 14.5px; }
.foot-grid h4 { color: var(--saffron); margin-bottom: 16px; }
.foot-grid ul { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.foot-grid ul a, .foot-grid ul li { color: rgba(244,236,221,0.85); font-size: 14px; transition: color 0.3s; }
.foot-grid ul a:hover { color: var(--saffron); }
.foot-bot {
  max-width: var(--max); margin: 0 auto;
  padding: 22px var(--pad) 0;
  border-top: 1px solid rgba(244,236,221,0.18);
  display: flex; justify-content: space-between; gap: 14px;
  font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.16em; text-transform: uppercase;
  color: rgba(244,236,221,0.5);
  flex-wrap: wrap;
}
@media (max-width: 800px) { .foot-grid { grid-template-columns: 1fr 1fr; } .foot-brand { grid-column: 1 / -1; } }

/* ===== FLOAT CTA ===== */
.float-cta {
  position: fixed; left: 50%; bottom: 20px;
  transform: translateX(-50%);
  display: none; gap: 8px; z-index: 70;
  background: var(--ink); color: var(--paper);
  border-radius: 999px; padding: 6px;
  box-shadow: 0 16px 40px -10px rgba(0,0,0,0.5);
}
.float-cta a {
  padding: 12px 22px; border-radius: 999px;
  font-family: var(--body); font-weight: 500; font-size: 14px;
  display: inline-flex; align-items: center; gap: 8px;
}
.float-cta a:first-child { background: var(--terracotta); color: #fff; }
.float-cta .dot { width: 6px; height: 6px; background: #fff; border-radius: 50%; animation: blink 1.6s infinite; }

/* ===== Reveal animations ===== */
[data-reveal] {
  opacity: 0; transform: translateY(20px);
  transition: opacity 0.8s cubic-bezier(.7,0,.2,1), transform 0.8s cubic-bezier(.7,0,.2,1);
}
[data-reveal].in { opacity: 1; transform: translateY(0); }

/* Section headline clip-path mask reveal — clean, no char splitting */
.section-head .display {
  clip-path: inset(0 100% 0 0);
  transition: clip-path 1.1s cubic-bezier(.7,0,.2,1);
  will-change: clip-path;
}
.section-head .display.is-revealed { clip-path: inset(0 0 0 0); }

/* Magnetic button: faster transform reset, smoother glide */
.btn-primary { transition: transform 0.4s cubic-bezier(.2,.8,.1,1), box-shadow 0.3s, color 0.3s; }
.btn-primary.is-magnet { transition: transform 0.05s linear, box-shadow 0.3s, color 0.3s; }

/* ===== Coverage chips: directional ink-fill ===== */
.chip {
  background: linear-gradient(90deg, var(--ink) 50%, transparent 50%);
  background-size: 220% 100%;
  background-position: 100% 0;
  transition:
    background-position 0.55s cubic-bezier(.7,0,.2,1),
    color 0.4s 0.05s,
    transform 0.4s cubic-bezier(.2,.8,.1,1),
    border-color 0.4s;
}
.chip:hover {
  background-position: 0% 0;
  color: var(--paper);
}
.chip.lg {
  background: linear-gradient(90deg, var(--terracotta) 50%, var(--ink) 50%);
  background-size: 220% 100%;
  background-position: 100% 0;
}
.chip.lg:hover { background-position: 0% 0; color: #fff; }

/* ===== Stamp ink-bloom on appear ===== */
.stamp { isolation: isolate; }
.stamp::after {
  content: "";
  position: absolute; inset: -10%;
  background: radial-gradient(circle at 30% 35%, rgba(217,71,46,0.35), transparent 60%);
  opacity: 0; transform: scale(0.4);
  pointer-events: none;
  z-index: -1;
  border-radius: inherit;
}
.stamp.in::after { animation: stampBloom 1.4s 0.05s cubic-bezier(.2,.8,.1,1) forwards; }
@keyframes stampBloom {
  0%   { opacity: 0; transform: scale(0.4); }
  50%  { opacity: 1; transform: scale(1.1); }
  100% { opacity: 0; transform: scale(1.6); }
}

/* ===== Tickers pause on hover ===== */
.ticker:hover .ticker-track,
.foot-marquee:hover .fm-track { animation-play-state: paused; }
.ticker-track span, .fm-track span {
  transition: transform 0.4s cubic-bezier(.2,.8,.1,1), color 0.3s;
  display: inline-block;
}
.ticker-track span:hover { transform: translateY(-2px) scale(1.04); color: var(--saffron) !important; }
.fm-track span:hover { color: var(--saffron) !important; }

/* (pass 3D tilt, stub stagger, brand wobble, num shimmer, bus aura — removed for refinement) */
.stub { opacity: 1; }
.pass { transform: rotate(-0.4deg); }

/* ===== Responsive ===== */
@media (max-width: 1000px) {
  .hero-grid { grid-template-columns: 1fr; min-height: auto; }
  .hero-right { transform: none; max-width: 480px; }
  .map-card { transform: rotate(-1deg); }
}
/* ===== Mobile (≤ 800px) ===== */
@media (max-width: 800px) {
  :root { --pad: 18px; }

  .nav-inner { grid-template-columns: 1fr auto auto; gap: 12px; padding: 12px var(--pad); }
  .nav-links, .nav-call { display: none; }
  .nav-toggle { display: inline-flex; }
  .float-cta { display: inline-flex; }
  .brand-mark { width: 30px; height: 30px; }
  .brand-name { font-size: 15px; }
  .brand-sub { font-size: 9px; }

  /* Top strips */
  .passport-strip { font-size: 9px; padding: 7px 0; }
  .passport-inner { gap: 12px; }
  .ps-est, .ps-stamp, .ps-coords { display: none; }
  .ps-loc { margin-right: auto; }

  /* Hero — drop heavy chrome */
  .hero { padding-top: 28px; }
  .hero-grid { min-height: auto; gap: 24px; }
  .hero-left { padding-bottom: 0; }
  .display { font-size: clamp(44px, 13vw, 72px); line-height: 0.95; }
  .lede { font-size: 16px; margin-top: 20px; }
  .hero-cta { margin-top: 22px; gap: 10px; }
  .hero-cta .btn { padding: 13px 18px; font-size: 14px; }
  .btn-num { display: none; }
  .hero-meta { grid-template-columns: 1fr 1fr; gap: 0; margin-top: 32px; }
  .hero-meta li {
    padding: 14px 12px 0 0;
    border-bottom: 1px solid var(--rule);
    padding-bottom: 14px;
  }
  .hero-meta li:nth-child(2) { border-right: none; }
  .hero-meta li:nth-child(3), .hero-meta li:nth-child(4) { padding-top: 14px; }
  .hero-meta li:nth-child(3) { border-right: 1px solid var(--rule); }
  .hero-meta li:nth-child(3), .hero-meta li:nth-child(4) { border-bottom: none; }
  .hero-meta .num, .hero-meta strong { font-size: clamp(28px, 9vw, 36px); }
  .made-in { font-size: 10px; padding: 5px 12px; }

  /* Section heads */
  .section-head { padding-top: 60px; padding-bottom: 28px; }
  .section-head .display, .section-head p { grid-column: 1; }

  /* Departures: stack with map ABOVE rows so clicking a row updates a visible map */
  /* Mobile: map sticks at top below nav so it stays visible while scrolling routes */
  .dep-layout { grid-template-columns: 1fr; gap: 14px; padding: 0 var(--pad); }
  .dep-map {
    position: sticky;
    top: 60px;
    z-index: 5;
    max-width: 100%;
    margin: 0 -2px;
    background: var(--ink);
    padding: 8px 0;
  }
  .dep-map .map-card { transform: none; box-shadow: 0 1px 0 var(--ink); }
  /* Constrain map height on mobile so rows are visible below */
  .dep-map .map-canvas { aspect-ratio: 1.1 / 1; max-height: 50vh; }
  .dep-map .map-card-h, .dep-map .map-card-f { padding: 10px 14px; font-size: 9.5px; }
  .map-stamp { display: none; }
  /* Add scrollable hint cushion at bottom of map so it visually detaches from rows */
  .dep-map::after {
    content: ""; display: block; height: 6px;
    background: linear-gradient(180deg, transparent, rgba(0,0,0,0.25));
    margin: 0 -8px;
  }

  /* Board rows: 2-row layout per row (dest big, then meta below) */
  .board-head { display: none; }
  .row {
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    gap: 4px 10px;
    padding: 16px 14px;
    align-items: baseline;
  }
  .row .status {
    grid-row: 1; grid-column: 1;
    font-size: 10px; color: var(--india-green); opacity: 0.85;
  }
  .row .dest {
    grid-row: 2; grid-column: 1 / -1;
    font-size: 28px; line-height: 1.05;
  }
  .row .dest small { font-size: 9px; }
  .row .dist {
    grid-row: 1; grid-column: 2;
    font-size: 11px; color: var(--ochre);
  }
  .row .dur, .row .from, .row .arrow-cell { display: none; }
  .row:hover { padding-left: 14px; }

  /* Fleet stubs */
  .stubs { grid-template-columns: 1fr; gap: 16px; padding: 0 var(--pad); }
  .stub { grid-template-columns: 1fr 14px 130px; }
  .stub-l h3 { font-size: clamp(26px, 7vw, 32px); margin: 12px 0 14px; }
  .stub-r { padding: 22px 14px; font-size: 9px; }
  .stub-r strong { font-size: 17px; }

  /* Stamps */
  .stamps { grid-template-columns: 1fr; gap: 18px; padding: 0 var(--pad); }
  .stamp { padding: 28px 24px 24px; }

  /* Occasions */
  .occ-grid { grid-template-columns: 1fr 1fr; }
  .occ { min-height: 160px; padding: 24px 18px 64px; }
  .occ-num { top: 18px; left: 18px; font-size: 9.5px; }
  .occ h3 { font-size: clamp(22px, 6vw, 30px); }
  .occ p { font-size: 12.5px; }

  /* Coverage */
  .chip { padding: 8px 14px; font-size: 13px; }
  .chip.lg { font-size: 18px; padding: 8px 16px; }

  /* FAQ */
  .faq-item summary { grid-template-columns: 36px 1fr 28px; gap: 10px; padding: 20px 0; font-size: 18px; line-height: 1.25; }
  .faq-item .q-no { font-size: 11px; }
  .faq-item .q-icon { width: 22px; height: 22px; }
  .faq-body { padding-left: 46px; padding-right: 0; font-size: 15px; }

  /* Boarding pass */
  .pass { grid-template-columns: 1fr; transform: none; width: calc(100% - 2 * var(--pad)); }
  .pass::after { display: none; }
  .pass-l { padding: 28px 22px 22px; }
  .pass-form .row { grid-template-columns: 1fr; gap: 0; }
  .pass-form input, .pass-form select, .pass-form textarea { font-size: 18px; padding: 9px 0 10px; }
  .pass-form .big { padding: 16px 22px; font-size: 15px; }
  .pass-r {
    flex-direction: row; flex-wrap: wrap; padding: 22px 18px; gap: 12px;
    border-radius: 0 0 8px 8px; justify-content: space-between;
  }
  .pass-r-leg { min-height: auto; flex: 1; }
  .pass-r-arrow { transform: rotate(-90deg); width: 24px; height: 24px; }
  .pass-r strong { font-size: 32px; }
  .pl-name { font-size: 13px; }
  .pass-barcode { width: 100%; height: 36px; }
  .pass-r-meta, .pass-r-call { width: 100%; justify-content: center; }
  .pass-r-call { flex-direction: row; gap: 16px; }

  /* Contact info */
  .ci-block { border-right: none; border-bottom: 1px solid var(--rule); }
  .ci-block:last-child { border-bottom: none; }
  .ci-block { padding: 28px 22px; }
  .ci-block h3 { font-size: clamp(24px, 7vw, 30px); }

  /* Footer */
  .foot-grid { grid-template-columns: 1fr 1fr; gap: 28px; }
  .foot-brand { grid-column: 1 / -1; }
  .foot-brand h3 { font-size: clamp(40px, 13vw, 60px); }
  .foot-bot { font-size: 9.5px; gap: 8px; padding-top: 18px; }
  .foot-bot > * { flex: 1 0 auto; }
  .foot-coords { display: none; }

  /* Larger tap targets — accessibility */
  a, button, summary, .row { min-height: 44px; }
  .nav-toggle { min-width: 44px; min-height: 44px; }

  /* Float CTA — make space for it */
  main { padding-bottom: 80px; }
  .float-cta { bottom: 14px; padding: 5px; }
  .float-cta a { padding: 10px 18px; font-size: 13px; }

  /* Marquees: throttle motion + smaller text */
  .ticker-track { gap: 28px; font-size: 11px; }
  .fm-track { font-size: clamp(24px, 9vw, 40px); gap: 20px; }
}

/* ===== Tablet (801–1024px) ===== */
@media (min-width: 801px) and (max-width: 1024px) {
  .dep-layout { grid-template-columns: 1fr 1.5fr; }
  .stubs { grid-template-columns: repeat(2, 1fr); }
  .occ-grid { grid-template-columns: repeat(3, 1fr); }
  .stamps { grid-template-columns: repeat(2, 1fr); }
}

/* ===== Very small phones (≤ 380px) ===== */
@media (max-width: 380px) {
  :root { --pad: 14px; }
  .display { font-size: clamp(38px, 11vw, 52px); }
  .nav-inner { gap: 8px; }
  .occ-grid { grid-template-columns: 1fr; }
  .stub { grid-template-columns: 1fr 14px 110px; }
  .stub-r { padding: 18px 12px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
  .ticker-track, .fm-track, .chakra { animation: none !important; }
}