/* ============================================================
   Above the Bell — For Schools page styles
   Shares css/styles.css; only page-specific blocks live here.
   ============================================================ */

/* ============================== HERO ============================== */
/* Anchors clear the fixed header plus the live subnav height
   (--subnav-h is measured in js/for-schools.js so wrapped rows stay accurate) */
html { scroll-padding-top: calc(var(--nav-h) + var(--subnav-h, 48px)); }

.fshero {
  /* the in-flow subnav (with its nav-h top margin) already clears the
     fixed header, so the hero only needs its own breathing room */
  padding: 64px 0 72px;
  background: linear-gradient(180deg, #F4F9FF 0%, var(--atb-white) 88%);
}

/* ============================== SUBNAV ============================== */
/* Sticky section rail under the main header: same type family and
   mission-blue underline language as the primary nav, scaled down.
   Items wrap onto extra rows on narrow viewports so every link stays
   visible and clickable (no horizontal scroll). */
.subnav {
  position: sticky;
  top: var(--nav-h);
  z-index: 90;               /* under the fixed header (z 100) */
  margin-top: var(--nav-h);  /* clears the fixed header while in flow */
  background: rgba(255, 255, 255, 0.94);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid rgba(2, 33, 81, 0.08);
}
.subnav__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  /* desktop: space items across the How It Works → Mission Control span;
     mobile overrides to centered wrap with a fixed gap */
  justify-content: space-between;
  column-gap: 0;
  row-gap: 2px;
  padding-block: 4px 8px;
  /* measured so Overview lines up under How It Works and Get Started
     lines up with the Mission Control button */
  padding-left: var(--subnav-indent, 24px);
  padding-right: var(--subnav-outdent, 24px);
}
.subnav a {
  position: relative;
  flex: none;
  /* 6px below the text matches .nav__menu a so the active line sits
     the same distance under the label as the primary nav */
  padding: 10px 0 6px;
  font-family: var(--font-head);
  font-weight: 600;
  font-size: 0.85rem;
  letter-spacing: 0.01em;
  color: var(--atb-orbit-gray);
  white-space: nowrap;
  transition: color 0.2s var(--ease);
}
.subnav a::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 2px;
  background: var(--atb-mission-blue);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.25s var(--ease);
}
.subnav a:hover { color: var(--atb-deep-space); }
.subnav a:hover::after { transform: scaleX(1); }
.subnav a.is-active { color: var(--atb-mission-blue); }
.subnav a.is-active::after { transform: scaleX(1); }
.fshero__inner {
  display: grid;
  grid-template-columns: 1.08fr 0.92fr;
  gap: clamp(32px, 5vw, 72px);
  align-items: start;
}
.fshero__title {
  font-size: clamp(2rem, 3.8vw, 2.9rem);
  font-weight: 800;
  letter-spacing: -0.015em;
  line-height: 1.14;
  margin: 0 0 20px;
}
.fshero__title em {
  font-style: normal;
  display: inline;
  /* Animated atmosphere → sky → deep space gradient, same effect as the
     "Edge of Space" accent on the How It Works hero */
  padding-bottom: 0.18em;
  margin-bottom: -0.18em;
  background-image: linear-gradient(
    100deg,
    var(--atb-accent-blue) 0%,
    var(--atb-mission-blue) 26%,
    var(--atb-sky-blue) 48%,
    #6ecfff 60%,
    #2a6aad 78%,
    var(--atb-deep-space) 100%
  );
  background-size: 220% 100%;
  background-position: 0% 50%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: var(--atb-deep-space);
  animation: fshero-accent-rise 9s var(--ease) infinite alternate;
}
@keyframes fshero-accent-rise {
  from { background-position: 0% 50%; }
  to   { background-position: 100% 50%; }
}
@media (prefers-reduced-motion: reduce) {
  .fshero__title em { animation: none; background-position: 12% 50%; }
}
.fshero__lede {
  color: var(--atb-orbit-gray);
  font-size: var(--text-lede);
  max-width: 46ch;
  margin: 0 0 30px;
}
.fshero__lede-key {
  color: var(--atb-deep-space);
  font-weight: 600;
}
.fshero__actions {
  /* Stacked: gap matches the lede's 30px bottom margin so the rhythm is even.
     Column shrinks to the wider child, then both stretch to that width. */
  display: flex;
  flex-direction: column;
  align-items: stretch;
  width: max-content;
  max-width: 100%;
  gap: 30px;
}
.fshero__actions .btn {
  width: 100%;
  justify-content: center;
  box-sizing: border-box;
}
.fshero__pdf {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  box-sizing: border-box;
  font-family: var(--font-head);
  font-weight: 600;
  font-size: var(--text-body);
  color: var(--atb-deep-space);
  transition: color 0.2s var(--ease);
}
.fshero__pdf:hover { color: var(--atb-mission-blue); }
.fshero__pdf svg { width: 18px; height: 18px; flex: none; }

/* Trust cards */
.trust {
  display: grid;
  gap: 16px;
  /* offset by the eyebrow's height + margin so the first card's top edge
     lines up with the top of the headline */
  margin-top: 34px;
}
.trust__card {
  display: flex;
  align-items: center;
  gap: 18px;
  background: var(--atb-white);
  border: 1px solid rgba(2, 33, 81, 0.06);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  padding: 20px 22px;
}
.trust__icon {
  flex: none;
  width: 64px;
  height: 64px;
  display: grid;
  place-items: center;
  color: var(--atb-deep-space);
}
.trust__icon svg { width: 34px; height: 34px; }
.trust__icon img {
  max-width: 58px;
  max-height: 58px;
  width: auto;
  height: auto;
  object-fit: contain;
  display: block;
}
.trust__card h3 {
  font-size: var(--text-card-h);
  font-weight: 700;
  margin: 2px 0 4px;
}
.trust__card p {
  margin: 0;
  color: var(--atb-orbit-gray);
  font-size: var(--text-detail);
  line-height: 1.45;
}

/* ============================== SECTION SHELL ============================== */
.fs-section { padding: 84px 0; }
.fs-section__head {
  max-width: 720px;
  margin: 0 auto 52px;
  text-align: center;
}
.fs-section__title {
  font-size: var(--text-h2);
  font-weight: 800;
}
.fs-section__lede {
  color: var(--atb-orbit-gray);
  font-size: var(--text-lede);
  margin: 14px 0 0;
}

/* ============================== SECTION DIVIDER ============================== */
.fs-divider {
  border-top: 1px solid rgba(2, 33, 81, 0.08);
  background: var(--atb-white);
}

/* ============================== WHAT'S INCLUDED (within Program Overview) ============================== */
/* Distinct-but-soft: hairline separator + its own head, same white canvas */
.included {
  margin-top: 56px;
  padding-top: 48px;
  border-top: 1px solid rgba(2, 33, 81, 0.08);
}
.included__head {
  max-width: 640px;
  margin: 0 auto 36px;
  text-align: center;
}
.included__label {
  color: var(--atb-deep-space);
  margin: 0 0 12px;
}
.included__title {
  font-size: var(--text-h3);
  font-weight: 800;
  line-height: 1.25;
  margin: 0;
}
.included__lede {
  color: var(--atb-orbit-gray);
  font-size: var(--text-body);
  line-height: 1.55;
  margin: 12px 0 0;
}
.included__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 28px 24px;
}
/* Open layout — no card chrome so this doesn't compete with the fact cards above */
.included__card {
  text-align: center;
  background: none;
  border: none;
  border-radius: 0;
  padding: 0 8px;
  box-shadow: none;
}
.included__icon {
  width: 52px;
  height: 52px;
  margin: 0 auto 12px;
  display: grid;
  place-items: center;
  color: var(--atb-deep-space);
}
.included__icon svg { width: 28px; height: 28px; }
.included__icon img {
  max-width: 48px;
  max-height: 48px;
  width: auto;
  height: auto;
  object-fit: contain;
  display: block;
}
.included__card h3 {
  font-size: var(--text-card-h);
  font-weight: 700;
  line-height: 1.3;
  margin: 0 0 8px;
}
.included__card p {
  margin: 0;
  color: var(--atb-orbit-gray);
  font-size: var(--text-detail);
  line-height: 1.45;
}

/* ============================== LEARNING OUTCOMES ============================== */
/* Subtle telemetry dot grid over the base tint; a soft white glow from the
   top keeps the pattern from competing with the section head. */
.outcomes {
  background:
    radial-gradient(1200px 480px at 50% -80px, rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0) 70%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26'%3E%3Ccircle cx='1.4' cy='1.4' r='1.4' fill='%23022151' fill-opacity='0.055'/%3E%3C/svg%3E"),
    #E8EEF4;
  color: var(--atb-deep-space);
}
.outcomes .eyebrow { color: var(--atb-deep-space); }
.outcomes__inner {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: clamp(32px, 5vw, 64px);
  align-items: center;
}
.outcomes__title {
  color: var(--atb-deep-space);
  font-size: var(--text-h2);
  font-weight: 800;
  margin: 0 0 12px;
}
/* Size body copy to the checklist's natural width so lede + standards
   share the same left/right edges as the bullet columns. */
.outcomes__body {
  display: inline-grid;
  max-width: 100%;
}
.outcomes__lede,
.outcomes__standards {
  width: 0;
  min-width: 100%;
  color: var(--atb-orbit-gray);
  font-size: var(--text-body);
  line-height: 1.55;
}
.outcomes__lede {
  margin: 0 0 30px;
}
.outcomes__key {
  color: var(--atb-deep-space);
  font-weight: 600;
}
.outcomes__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, max-content);
  gap: 14px clamp(20px, 3vw, 40px);
  font-size: var(--text-body);
}
.outcomes__list li {
  position: relative;
  padding-left: 28px;
  color: var(--atb-deep-space);
  font-weight: 500;
  white-space: nowrap;
}
.outcomes__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 2px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--atb-deep-space);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 12.5l3.5 3.5L18 7.5' stroke='%23ffffff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-size: 14px;
  background-repeat: no-repeat;
  background-position: center;
}
.outcomes__standards {
  margin: 26px 0 0;
}
.outcomes__media img {
  width: 100%;
  height: auto;
  border-radius: var(--radius-lg);
  display: block;
  box-shadow:
    0 4px 12px rgba(2, 33, 81, 0.08),
    0 24px 48px rgba(2, 33, 81, 0.16);
}

/* ============================== FLEXIBLE CURRICULUM ============================== */
.curriculum {
  padding-top: 72px;
  padding-bottom: 84px;
  background: var(--atb-white);
}
.curriculum .eyebrow { color: var(--atb-deep-space); }
.curriculum__inner {
  display: block;
}
.phases-wrap {
  position: relative;
  /* Even breathing room above the badges and below the phase copy so the
     glow has clearance without crowding the section head or facts rail */
  padding-block: 16px;
}
/* Flight-path track: subtle dashed S-curve drawn behind the badge row
   (badge box is 96px tall, so the SVG covers exactly that band). Offset by
   the wrap's padding-top so it stays centered on the badges. */
.phases-track {
  position: absolute;
  top: 16px;
  left: 0;
  width: 100%;
  height: 96px;
  overflow: visible;
  pointer-events: none;
}
/* Progress sweep: a solid stroke draws itself along the S-curve over the
   dashed base line (8s), rests fully drawn, fades, and loops. Badge glows
   below are timed so each badge lights up as the sweep reaches it
   (centers at 0s, 2s, 4s, 6s, 8s of the 12s cycle). */
.phases-track__progress {
  stroke-dasharray: 100;
  stroke-dashoffset: 100;
  animation: phases-progress 12s linear infinite;
}
@keyframes phases-progress {
  0%      { stroke-dashoffset: 100; opacity: 1; }
  66.67%  { stroke-dashoffset: 0;   opacity: 1; }
  90%     { stroke-dashoffset: 0;   opacity: 1; }
  97%     { stroke-dashoffset: 0;   opacity: 0; }
  100%    { stroke-dashoffset: 100; opacity: 0; }
}
.phases {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 24px;
  position: relative;
}
.phase {
  text-align: center;
  position: relative;
}
/* Fixed-height badge box + fixed-height title row keeps all five columns
   vertically aligned even when icons and titles have different sizes */
.phase__badge {
  height: 96px;
  margin: 0 auto 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.phase__badge img { max-height: 96px; width: auto; max-width: 116px; display: block; }
/* Halo pulse behind each badge, timed to the track's progress sweep */
.phase { --phase-glow: rgba(55, 175, 245, 0.5); }
/* Delays are timed to when the sweep reaches each badge's LEFT edge
   (~0.5s before its center), not the center, so the light-up feels
   immediate. Badge 1 stays at 0s since the sweep starts at its center. */
.phase:nth-child(1) { --phase-glow-delay: 0s; }
.phase:nth-child(2) { --phase-glow-delay: 1.5s; }
.phase:nth-child(3) { --phase-glow-delay: 3.5s; }
.phase:nth-child(4) { --phase-glow-delay: 5.5s; --phase-glow: rgba(251, 149, 11, 0.55); }
.phase:nth-child(5) { --phase-glow-delay: 7.5s; }
.phase__badge::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 132px;
  height: 132px;
  transform: translate(-50%, -50%) scale(0.7);
  border-radius: 50%;
  /* Ring-shaped so the glow flares around the badge art instead of
     hiding underneath it */
  background: radial-gradient(circle, rgba(255, 255, 255, 0) 36%, var(--phase-glow) 56%, rgba(255, 255, 255, 0) 76%);
  opacity: 0;
  pointer-events: none;
  z-index: -1;
  animation: phase-glow 12s linear infinite;
  animation-delay: var(--phase-glow-delay, 0s);
}
@keyframes phase-glow {
  0%   { opacity: 0;    transform: translate(-50%, -50%) scale(0.7); }
  3%   { opacity: 0.95; transform: translate(-50%, -50%) scale(1); }
  15%  { opacity: 0;    transform: translate(-50%, -50%) scale(1.08); }
  100% { opacity: 0;    transform: translate(-50%, -50%) scale(0.7); }
}
.phase__badge img {
  animation: phase-pop 12s ease-in-out infinite;
  animation-delay: var(--phase-glow-delay, 0s);
}
@keyframes phase-pop {
  0%   { transform: scale(1); }
  3%   { transform: scale(1.05); }
  12%  { transform: scale(1); }
  100% { transform: scale(1); }
}
@media (prefers-reduced-motion: reduce) {
  .phases-track__progress { display: none; }
  .phase__badge::before { animation: none; }
  .phase__badge img { animation: none; }
}
.phase h3 {
  font-size: var(--text-card-h);
  font-weight: 700;
  margin: 0 0 8px;
  line-height: 1.25;
  min-height: 2.5em;
  display: flex;
  align-items: center;
  justify-content: center;
}
.phase p {
  margin: 0;
  color: var(--atb-orbit-gray);
  font-size: var(--text-detail);
  line-height: 1.45;
  padding-inline: 4px;
}
.curriculum__cta {
  text-align: center;
  margin-top: 40px;
}
.curriculum__facts {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: 48px;
}
.fact {
  background: var(--atb-cloud-white);
  border-radius: var(--radius);
  padding: 20px 22px;
}
/* Trust-card treatment for the curriculum facts rail */
.fact--card {
  text-align: center;
  background: var(--atb-white);
  border: 1px solid rgba(2, 33, 81, 0.06);
  box-shadow: var(--shadow-sm);
  padding: 28px 24px 26px;
}
.fact__icon {
  width: 56px;
  height: 56px;
  margin: 0 auto 14px;
  display: grid;
  place-items: center;
}
.fact__icon img {
  max-width: 52px;
  max-height: 56px;
  width: auto;
  height: auto;
  object-fit: contain;
  display: block;
}
.fact--card h3 {
  display: block;
  justify-content: center;
  margin: 0 0 8px;
}
.fact h3 {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 0.95rem;
  font-weight: 700;
  margin: 0 0 8px;
}
.fact h3 svg {
  width: 20px;
  height: 20px;
  flex: none;
  color: var(--atb-mission-blue);
}
.fact p {
  margin: 0;
  color: var(--atb-orbit-gray);
  font-size: var(--text-detail);
  line-height: 1.5;
}

/* ---------- Curriculum modules (10-module outline) ---------- */
.modules {
  background: var(--atb-white);
}
.modules .eyebrow { color: var(--atb-deep-space); }
.modules__wrap {
  position: relative;
  /* Top margin leaves room for the balloon and burst, which extend ~50px
     above the wrap's top edge at the peak of the flight */
  margin: 76px 0 36px;
  --modules-gutter: 220px;
}
/* Guided-by-Wrigley callout between the lede and the flight path */
.modules__guide {
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  margin: 36px auto 0;
}
.modules__guide-avatar {
  flex: 0 0 auto;
  width: 118px;
  height: 118px;
  border-radius: 50%;
  background: #E2EAF4;
  position: relative;
  z-index: 1;
  /* White ring around the disc, a faint hairline outside it, then the
     soft drop shadow */
  box-shadow:
    0 0 0 7px var(--atb-white),
    0 0 0 8px rgba(2, 33, 81, 0.09),
    0 10px 26px rgba(2, 33, 81, 0.14);
}
.modules__guide-avatar img {
  display: block;
  width: 110px;
  height: auto;
  /* Negative top margin lifts the ear tufts above the circle; the clip
     path keeps the top of the image open while following the circle's
     lower arc so the jacket still crops to the disc */
  margin: -8px auto 0;
  clip-path: path("M0 0 H110 V67 H114 A59 59 0 0 1 -4 67 H0 Z");
}
.modules__guide-card {
  background: var(--atb-white);
  border: 1px solid rgba(2, 33, 81, 0.08);
  border-radius: 18px;
  box-shadow: 0 14px 30px rgba(2, 33, 81, 0.08);
  padding: 16px 24px 16px 32px;
  margin-left: -16px;
  max-width: 330px;
  text-align: left;
}
.modules__guide-eyebrow {
  color: var(--atb-mission-blue);
  font-size: var(--text-eyebrow);
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin: 0 0 4px;
}
.modules__guide-copy {
  color: var(--atb-orbit-gray);
  font-size: var(--text-body);
  line-height: 1.5;
  margin: 0;
}
.modules__guide-copy strong { color: var(--atb-deep-space); }
@media (max-width: 560px) {
  .modules__guide {
    flex-direction: column;
    gap: 14px;
  }
  .modules__guide-card {
    margin-left: 0;
    padding: 16px 20px;
    text-align: center;
  }
}
/* Vertical flight-path track in the center gutter, same visual language as
   the phases track: dashed gradient base line + animated progress stroke.
   Full flight story, 24s cycle: balloon lifts off with modules 1-10 (0-33%),
   hangs at altitude (33-38%), pops (38-41.5%), parachutes down (42-68%),
   lands on the grass (68-74%), then an Above the Bell recovery van drives
   in, picks up the payload, and drives out (74-92%) before the cycle
   restarts. Dark space navy sits at the top of the line, fading to light
   sky at the ground. */
.modules-track {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 40px;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}
/* Ambient sky layer behind the flight: clouds drift slowly back and
   forth; an airliner, a fighter jet, and birds cross the gutter at
   different altitudes, fading in on one side and out on the other.
   Painted before the grid in DOM order so the module cards cover the
   crossers outside the gutter. */
/* Subtle curvature-of-the-earth horizon arc near the top of the flight
   path. Static, painted behind the sky crossers and the dashed track. */
.modules-earth {
  position: absolute;
  top: 30px;
  left: 50%;
  transform: translateX(-50%);
  /* Slightly narrower than the gutter so the arc ends short of the cards */
  width: calc(var(--modules-gutter) - 32px);
  height: auto;
  pointer-events: none;
}
.modules-sky {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.modules-sky svg {
  position: absolute;
  left: 50%;
  display: block;
}
/* The gutter maps linearly to altitude: top = ~102k ft, bottom = 0 ft.
   Elements sit at real-world altitudes: clouds ~7-13k ft, jet ~60k ft,
   plane ~33k ft, birds ~3k ft. */
.sky-cloud { width: 52px; opacity: 0.85; }
.sky-cloud--a {
  top: 87%; /* ~13k ft */
  margin-left: -86px;
  animation: sky-cloud-drift 18s ease-in-out infinite alternate;
}
.sky-cloud--b {
  top: 90%; /* ~10k ft */
  margin-left: 34px;
  width: 42px;
  opacity: 0.7;
  animation: sky-cloud-drift 24s ease-in-out infinite alternate-reverse;
}
.sky-cloud--c {
  top: 92.5%; /* ~7.5k ft */
  margin-left: -70px;
  width: 34px;
  opacity: 0.6;
  animation: sky-cloud-drift 21s ease-in-out infinite alternate;
  animation-delay: -8s;
}
@keyframes sky-cloud-drift {
  from { transform: translateX(-12px); }
  to   { transform: translateX(12px); }
}
/* Jet crossing left -> right at cruise altitude (~33k ft). Fastest mover:
   crosses the gutter in about 5 seconds. */
.sky-plane {
  top: 68%; /* ~33k ft */
  width: 40px;
  margin-left: -20px;
  opacity: 0;
  animation: sky-plane-cross 26s linear infinite;
}
@keyframes sky-plane-cross {
  0%, 8% { transform: translateX(-130px); opacity: 0; }
  11%    { opacity: 0.9; }
  24%    { opacity: 0.9; }
  27%    { transform: translateX(130px); opacity: 0; }
  100%   { transform: translateX(130px); opacity: 0; }
}
/* Military jet screaming right -> left near its ~60k ft service ceiling.
   The fastest mover: crosses in about 2.2 seconds, roughly twice the
   airliner's speed. */
.sky-jet {
  top: 42%; /* ~60k ft */
  width: 46px;
  margin-left: -23px;
  opacity: 0;
  animation: sky-jet-cross 22s linear infinite;
}
@keyframes sky-jet-cross {
  0%, 40% { transform: translateX(130px); opacity: 0; }
  41.5%   { opacity: 0.9; }
  48.5%   { opacity: 0.9; }
  50%     { transform: translateX(-130px); opacity: 0; }
  100%    { transform: translateX(-130px); opacity: 0; }
}
/* Small flock flapping right -> left down low (~3k ft). Slowest mover:
   takes about 13 seconds to cross. */
.sky-birds {
  top: 95.5%; /* ~3k ft */
  width: 34px;
  margin-left: -17px;
  opacity: 0;
  animation: sky-birds-cross 21s linear infinite;
}
@keyframes sky-birds-cross {
  0%, 18% { transform: translate(120px, 0);  opacity: 0; }
  24%     { opacity: 0.85; }
  50%     { transform: translate(10px, -6px); }
  74%     { opacity: 0.85; }
  80%     { transform: translate(-120px, 2px); opacity: 0; }
  100%    { transform: translate(-120px, 2px); opacity: 0; }
}
/* Progress path is authored bottom -> top so the trail draws upward */
.modules-track__progress {
  stroke-dasharray: 100;
  stroke-dashoffset: 100;
  animation: modules-progress 24s linear infinite;
}
@keyframes modules-progress {
  0%   { stroke-dashoffset: 100; opacity: 1; }
  33%  { stroke-dashoffset: 0;   opacity: 1; }
  42%  { stroke-dashoffset: 0;   opacity: 1; }
  50%  { stroke-dashoffset: 0;   opacity: 0; }
  100% { stroke-dashoffset: 100; opacity: 0; }
}
/* Wavy grass strip at the launch end of the track, extending a little
   under the bottom cards on each side */
.modules-ground {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: -22px;
  width: 160px;
  height: auto;
  pointer-events: none;
}
/* Balloon rides just ahead of the trail tip, with a gentle side-to-side sway */
.modules-balloon {
  position: absolute;
  left: 50%;
  top: 100%;
  z-index: 2;
  width: 36px;
  margin-left: -18px;
  margin-top: -46px;
  opacity: 0;
  pointer-events: none;
  animation: balloon-rise 24s linear infinite;
}
.modules-balloon img {
  display: block;
  width: 100%;
  height: auto;
  animation: balloon-sway 3s ease-in-out infinite alternate;
}
/* Rise to the top, hang and sway, then a quick scale-up "pop" */
@keyframes balloon-rise {
  0%    { top: 100%; opacity: 0; transform: scale(1); }
  2%    { opacity: 1; }
  33%   { top: 0%;   opacity: 1; transform: scale(1); }
  38%   { top: 0%;   opacity: 1; transform: scale(1); }
  39.5% { top: 0%;   opacity: 0; transform: scale(1.35); }
  100%  { top: 100%; opacity: 0; transform: scale(1); }
}
@keyframes balloon-sway {
  from { transform: translateX(-7px) rotate(-3deg); }
  to   { transform: translateX(7px) rotate(3deg); }
}
/* Compact live altitude chip, same glassy navy family as How It Works
   telemetry. Anchored in the right half of the center gutter so the full
   chip stays clear of the module cards. */
.modules-alt {
  position: absolute;
  /* Pin the chip's right edge just inside the gutter's right edge */
  left: calc(50% + var(--modules-gutter) / 2 - 10px);
  top: 100%;
  z-index: 2;
  box-sizing: border-box;
  /* Fixed width for the longest readout ("102,458 FT") so the chip
     doesn't grow/shrink as the altitude ticks */
  width: 86px;
  max-width: calc(var(--modules-gutter) / 2 - 28px);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1px;
  padding: 5px 8px 6px;
  border-radius: 9px;
  background: rgba(2, 33, 81, 0.78);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  border: 1px solid rgba(255, 255, 255, 0.2);
  box-shadow: 0 8px 20px rgba(2, 33, 81, 0.22);
  color: #fff;
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  transform: translate(-100%, -50%);
  animation: alt-ride 24s linear infinite;
}
.modules-alt__label {
  font-size: 0.5rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  color: var(--atb-label-blue);
  line-height: 1;
}
.modules-alt__value {
  display: inline-flex;
  align-items: baseline;
  gap: 3px;
  line-height: 1;
  width: 100%;
}
.modules-alt__num {
  font-family: var(--font-head);
  font-size: 0.78rem;
  font-weight: 700;
  font-style: normal;
  color: #fff;
  font-variant-numeric: tabular-nums;
  /* Reserve space for 6 digits + commas ("102,458") */
  min-width: 5.6ch;
  flex: 1;
  text-align: left;
}
.modules-alt__value em {
  font-style: normal;
  font-size: 0.52rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: rgba(255, 255, 255, 0.72);
}
@keyframes alt-ride {
  0%    { top: 100%; opacity: 0; }
  2%    { opacity: 1; }
  33%   { top: 0%;   opacity: 1; }
  38%   { top: 0%;   opacity: 1; }
  41%   { top: 0%;   opacity: 1; }
  42%   { top: 4%;   opacity: 1; }
  68%   { top: 100%; opacity: 1; }
  71%   { top: 100%; opacity: 0; }
  100%  { top: 100%; opacity: 0; }
}
/* Starburst flash at the moment the balloon pops */
.modules-burst {
  position: absolute;
  left: 50%;
  top: -28px;
  z-index: 2;
  width: 44px;
  height: 44px;
  margin-left: -22px;
  margin-top: -22px;
  opacity: 0;
  pointer-events: none;
  animation: burst-pop 24s linear infinite;
}
@keyframes burst-pop {
  0%, 37.5% { opacity: 0; transform: scale(0.5); }
  39%       { opacity: 1; transform: scale(1.1); }
  41.5%     { opacity: 0; transform: scale(1.35); }
  100%      { opacity: 0; transform: scale(0.5); }
}
/* Parachute carries the payload safely back down to the grass */
.modules-chute {
  position: absolute;
  left: 50%;
  top: 0%;
  z-index: 2;
  width: 40px;
  margin-left: -20px;
  margin-top: -52px;
  opacity: 0;
  pointer-events: none;
  animation: chute-descend 24s linear infinite;
}
.modules-chute svg {
  display: block;
  width: 100%;
  height: auto;
  animation: chute-sway 2.4s ease-in-out infinite alternate;
}
@keyframes chute-descend {
  0%, 39.5% { top: 0%;   opacity: 0; }
  42%       { top: 4%;   opacity: 1; }
  68%       { top: 100%; opacity: 1; }
  69.5%     { top: 100%; opacity: 0; }
  100%      { top: 0%;   opacity: 0; }
}
@keyframes chute-sway {
  from { transform: translateX(-6px) rotate(-5deg); }
  to   { transform: translateX(6px) rotate(5deg); }
}
/* On touchdown the flying chute crossfades into a deflated canopy lying
   flat on the grass beside the payload, then disappears as the van
   collects it */
.modules-chute-flat {
  position: absolute;
  left: 50%;
  bottom: -20px;
  z-index: 2;
  width: 52px;
  margin-left: -26px;
  opacity: 0;
  pointer-events: none;
  animation: chute-flat 24s linear infinite;
}
@keyframes chute-flat {
  0%, 68% { opacity: 0; }
  69.5%   { opacity: 1; }
  78%     { opacity: 1; }
  81%     { opacity: 0; }
  100%    { opacity: 0; }
}
/* Recovery van drives in along the grass, pauses for pickup, then exits */
.modules-van {
  position: absolute;
  left: 50%;
  bottom: -28px;
  z-index: 3;
  width: 62px;
  margin-left: -31px;
  opacity: 0;
  pointer-events: none;
  animation: van-recover 24s linear infinite;
}
.modules-van svg {
  display: block;
  width: 100%;
  height: auto;
}
/* Travel is capped at +/-78px so the 62px-wide van (31px half-width) stays
   fully inside the 220px gutter (110px half-width) at all times. */
@keyframes van-recover {
  0%, 73% { transform: translateX(-78px); opacity: 0; }
  76%     { transform: translateX(-78px); opacity: 1; }
  80%     { transform: translateX(0);     opacity: 1; }
  84%     { transform: translateX(0);     opacity: 1; }
  90%     { transform: translateX(78px);  opacity: 1; }
  93%     { transform: translateX(78px);  opacity: 0; }
  100%    { transform: translateX(-78px); opacity: 0; }
}
.modules__grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  position: relative;
  z-index: 0;
  /* Fill the left column with modules 1-5, then the right with 6-10 */
  grid-auto-flow: column;
  grid-template-rows: repeat(5, auto);
  grid-template-columns: 1fr 1fr;
  gap: 12px var(--modules-gutter);
}
.module {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  position: relative;
  z-index: 0;
  background: var(--atb-white);
  border: 1px solid rgba(2, 33, 81, 0.07);
  border-radius: var(--radius-sm);
  box-shadow: 0 3px 12px rgba(2, 33, 81, 0.05);
  padding: 14px 18px;
}
.module__num {
  flex: none;
  position: relative;
  margin-top: 2px;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--atb-deep-space);
  color: #fff;
  font-family: var(--font-head);
  font-weight: 700;
  font-size: 0.82rem;
  display: grid;
  place-items: center;
}
/* Ring glow that travels module 1 -> 10 during the first ~7s of the cycle,
   running alongside the balloon's climb up the gutter. */
.module:nth-child(1)  { --module-glow-delay: 0s; }
.module:nth-child(2)  { --module-glow-delay: 0.6s; }
.module:nth-child(3)  { --module-glow-delay: 1.2s; }
.module:nth-child(4)  { --module-glow-delay: 1.8s; }
.module:nth-child(5)  { --module-glow-delay: 2.4s; }
.module:nth-child(6)  { --module-glow-delay: 3s; }
.module:nth-child(7)  { --module-glow-delay: 3.6s; }
.module:nth-child(8)  { --module-glow-delay: 4.2s; }
.module:nth-child(9)  { --module-glow-delay: 4.8s; }
.module:nth-child(10) { --module-glow-delay: 5.4s; }
.module__num::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 40px;
  height: 40px;
  transform: translate(-50%, -50%) scale(0.75);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 255, 255, 0) 38%, rgba(55, 175, 245, 0.55) 58%, rgba(255, 255, 255, 0) 78%);
  opacity: 0;
  pointer-events: none;
  animation: module-glow 24s linear infinite;
  animation-delay: var(--module-glow-delay, 0s);
}
@keyframes module-glow {
  0%   { opacity: 0;    transform: translate(-50%, -50%) scale(0.75); }
  2%   { opacity: 0.9;  transform: translate(-50%, -50%) scale(1); }
  10%  { opacity: 0;    transform: translate(-50%, -50%) scale(1.05); }
  100% { opacity: 0;    transform: translate(-50%, -50%) scale(0.75); }
}
@media (prefers-reduced-motion: reduce) {
  .modules-track__progress { display: none; }
  .sky-plane, .sky-jet, .sky-birds { display: none; }
  .sky-cloud { animation: none; }
  .modules-balloon { display: none; }
  .modules-alt { display: none; }
  .modules-burst { display: none; }
  .modules-chute { display: none; }
  .modules-chute-flat { display: none; }
  .modules-van { display: none; }
  .module__num::after { animation: none; }
}
.module h4 {
  font-size: var(--text-card-h);
  font-weight: 700;
  margin: 0 0 4px;
}
.module__meta {
  margin: 0 0 5px;
  font-family: var(--font-head);
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--atb-mission-blue);
  line-height: 1.3;
}
.module p:not(.module__meta) {
  margin: 0;
  color: var(--atb-orbit-gray);
  font-size: var(--text-detail);
  line-height: 1.45;
}
.modules__extras {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  /* The grass and van hang well below the wrap's bottom edge; this margin
     makes the gap between the grass and these cards match the 76px gap
     between the lede text and the top of the flight path */
  margin-top: 70px;
}

@media (max-width: 980px) {
  .modules-track { display: none; }
  .modules-earth { display: none; }
  .modules-sky { display: none; }
  .modules-balloon { display: none; }
  .modules-alt { display: none; }
  .modules-burst { display: none; }
  .modules-chute { display: none; }
  .modules-chute-flat { display: none; }
  .modules-van { display: none; }
  .modules-ground { display: none; }
  .modules__grid {
    grid-auto-flow: row;
    grid-template-rows: none;
    grid-template-columns: 1fr;
  }
  .modules__extras { grid-template-columns: 1fr; }
}

/* ============================== FUNDING ============================== */
/* Same telemetry dot motif as Learning Outcomes for a consistent quiet
   texture; glow anchored slightly lower so the cards sit on the calm area. */
.funding {
  background:
    radial-gradient(1200px 480px at 50% -80px, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0) 70%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26'%3E%3Ccircle cx='1.4' cy='1.4' r='1.4' fill='%23022151' fill-opacity='0.05'/%3E%3C/svg%3E"),
    var(--atb-cloud-white);
  /* Safety continues this same canvas, so drop the bottom padding here:
     Safety's normal top padding then matches the gray lead-in above Funding
     (where only funding's top padding reads as empty gray). */
  padding-bottom: 0;
}
.fs-section.funding { padding-bottom: 0; }
.funding .eyebrow { color: var(--atb-deep-space); }
.funding__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.funding__cta {
  text-align: center;
  /* Match Safety's section top padding so the gap above the button
     (cards → CTA) equals the gap below it (CTA → Safety). */
  margin-top: 84px;
}

/* ============================== SAFETY ============================== */
/* Continues Funding's exact background (same base + dot grid) so the two
   sections read as one canvas; split layout instead of another card grid so
   this reads as a trust checkpoint before the CTA. */
.fs-safety {
  /* the top white layer fades the dotted gray canvas to pure white at the
     section's bottom edge so it hands off seamlessly to the light CTA */
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0) calc(100% - 220px), #FFFFFF 100%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26'%3E%3Ccircle cx='1.4' cy='1.4' r='1.4' fill='%23022151' fill-opacity='0.05'/%3E%3C/svg%3E"),
    var(--atb-cloud-white);
  color: var(--atb-deep-space);
}
.fs-safety .eyebrow { color: var(--atb-deep-space); }
.fs-safety__inner {
  max-width: 720px;
  margin-inline: auto;
}
.fs-safety__lead {
  display: flex;
  align-items: center;
  gap: 22px;
  margin-bottom: 18px;
}
.fs-safety__icon {
  flex: none;
  width: 88px;
  height: auto;
  filter: drop-shadow(0 8px 18px rgba(2, 33, 81, 0.12));
}
.fs-safety__intro {
  min-width: 0;
}
.fs-safety__intro .eyebrow {
  margin: 0 0 8px;
}
.fs-safety__title {
  font-size: var(--text-h2);
  font-weight: 800;
  line-height: 1.2;
  margin: 0;
  color: var(--atb-deep-space);
}
.fs-safety__lede {
  color: var(--atb-orbit-gray);
  margin: 0 0 20px;
  font-size: var(--text-lede);
  line-height: 1.55;
}
.fs-safety__reg {
  color: var(--atb-deep-space);
  font-weight: 600;
}
.fs-safety__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 12px;
}
.fs-safety__list li {
  position: relative;
  padding-left: 28px;
  color: var(--atb-deep-space);
  font-size: var(--text-body);
  font-weight: 500;
  line-height: 1.45;
}
.fs-safety__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 3px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--atb-deep-space);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 12.5l3.5 3.5L18 7.5' stroke='%23ffffff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-size: 14px;
  background-repeat: no-repeat;
  background-position: center;
}

/* --- landing strip: same scenic touchdown as How It Works, sized down --- */
.fs-safety__landing {
  position: relative;
  /* clip the extra-wide field horizontally but let the treetops rise
     above the strip and overlap the gray canvas of the section */
  overflow-x: clip;
  overflow-y: visible;
  margin-top: 24px;
  min-height: clamp(170px, 19vw, 280px);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  /* fade the section's gray canvas into a pale sky so the field artwork
     lands on believable air, then bright horizon behind the opaque grass */
  background: linear-gradient(180deg,
    rgba(239, 242, 246, 0) 0%,
    #E2F2FD 46%,
    #EFF8FE 78%,
    #FBFEFF 100%);
}
.fs-safety__landing-trail {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
/* descending payload rig: hover starts a slow drift toward the pin,
   same interaction as the How It Works landing strip */
.fs-safety__landing-rig {
  position: absolute;
  z-index: 2;
  right: clamp(10%, 13vw, 17%);
  top: clamp(4px, 1.4vw, 16px);
  width: clamp(84px, 9vw, 128px);
  pointer-events: none;
}
/* generous invisible hover target over the chute (rig stays pointer-events:none) */
.fs-safety__landing-hot {
  position: absolute;
  inset: -8% -12%;
  pointer-events: auto;
}
/* wrapper carries the slow drift toward the target; the image inside
   carries the pendulum wobble, so the two transforms don't fight */
.fs-safety__landing-drift {
  display: block;
  transition: transform 1.6s var(--ease, ease);
}
.fs-safety__landing-chute {
  display: block;
  width: 100%;
  height: auto;
  filter: drop-shadow(0 22px 30px rgba(2, 33, 81, 0.18));
  transform-origin: 50% 8%;
}
@media (hover: hover) {
  .fs-safety__landing-hot:hover ~ .fs-safety__landing-drift {
    /* shrinks as it goes, as if drifting away from the viewer;
       ends with the payload settling just to the right of the landing pin */
    transform: translate(-20%, 46%) scale(0.8);
    transition: transform 7s cubic-bezier(0.3, 0.1, 0.6, 0.9);
  }
  .fs-safety__landing-hot:hover ~ .fs-safety__landing-drift .fs-safety__landing-chute {
    animation: fs-chute-wobble 2.8s ease-in-out infinite;
  }
}
@keyframes fs-chute-wobble {
  0%, 100% { transform: rotate(0deg); }
  25%      { transform: rotate(-3.4deg); }
  75%      { transform: rotate(3.4deg); }
}
@media (prefers-reduced-motion: reduce) {
  .fs-safety__landing-hot:hover ~ .fs-safety__landing-drift { transform: none; }
  .fs-safety__landing-hot:hover ~ .fs-safety__landing-drift .fs-safety__landing-chute { animation: none; }
}
.fs-safety__landing-marker {
  position: absolute;
  z-index: 2;
  right: clamp(17%, 19vw, 23%);
  bottom: clamp(8px, 1.6vw, 22px);
  pointer-events: none;
}
.fs-safety__landing-pin {
  display: block;
  width: clamp(24px, 2.6vw, 34px);
  height: clamp(24px, 2.6vw, 34px);
  filter: drop-shadow(0 4px 8px rgba(2, 33, 81, 0.3));
}
.fs-safety__landing-label {
  position: absolute;
  bottom: calc(100% - 4px);
  right: calc(100% - 8px);
  padding: 6px 12px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(2, 33, 81, 0.1);
  box-shadow: 0 3px 10px rgba(2, 33, 81, 0.12);
  font-family: var(--font-head);
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  color: var(--atb-deep-space);
  white-space: nowrap;
}
.fs-safety__landing-field {
  position: relative;
  display: block;
  left: -3%;
  width: 106%;
  max-width: none;
  min-width: 900px;
  /* taller than the strip, pulled up with a negative margin: the extra
     headroom lets the full treetops rise over the gray section above
     instead of being cut off at the strip's top edge */
  height: calc(clamp(170px, 19vw, 280px) + clamp(28px, 3.5vw, 48px));
  margin-top: calc(-1 * clamp(28px, 3.5vw, 48px));
  object-fit: cover;
  /* fs-landing-field is the HIW field artwork with its very tall left
     tree cluster cropped out, so no canopy touches the artwork's top edge.
     This crop window keeps every remaining treetop intact (tallest starts
     26%+ down the artwork at all supported widths), shows sky above the
     tree line, and keeps foreground grass in frame at the bottom. */
  object-position: center 26%;
  pointer-events: none;
  user-select: none;
}

/* ============================== CTA extras ============================== */
/* Light CTA variant for this page: sits between the Safety checklist and
   the scenic landing strip that closes the page. Safety fades its dotted
   canvas to pure white at its bottom edge, and this section fades its own
   dots back in from white at the top, so the two meet white-on-white with
   no visible seam. A whisper of blue glow sits behind the content so the
   white doesn't feel flat. Bottom padding is zero so the landing strip's
   grass runs straight into the footer. */
.cta--light {
  background:
    linear-gradient(180deg, #FFFFFF 0px, rgba(255, 255, 255, 0) 220px),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26'%3E%3Ccircle cx='1.4' cy='1.4' r='1.4' fill='%23022151' fill-opacity='0.045'/%3E%3C/svg%3E"),
    radial-gradient(ellipse 62% 88% at 50% 42%, rgba(38, 169, 224, 0.07), rgba(38, 169, 224, 0) 68%),
    #FFFFFF;
  color: var(--atb-deep-space);
  padding: 72px 0 0;
}
.cta--light .cta__title { color: var(--atb-deep-space); }
.cta--light .cta__sub { color: var(--atb-orbit-gray); }
.cta--light .cta__pdf { color: var(--atb-deep-space); }
.cta--light .cta__pdf:hover { color: var(--atb-launch-gold); }

.cta__pdf {
  /* Stacked below the button; 24px matches the sub text's bottom margin */
  display: flex;
  align-items: center;
  justify-content: center;
  width: max-content;
  gap: 8px;
  margin: 24px auto 0;
  font-family: var(--font-head);
  font-weight: 600;
  font-size: var(--text-body);
  color: rgba(255, 255, 255, 0.88);
  transition: color 0.2s var(--ease);
}
.cta__pdf:hover { color: #fff; }
.cta__pdf svg { width: 18px; height: 18px; flex: none; }

/* ============================== RESPONSIVE ============================== */
@media (max-width: 1100px) {
  .included__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 980px) {
  .fshero__inner { grid-template-columns: 1fr; }
  .outcomes__inner { grid-template-columns: 1fr; }
  .outcomes__media { order: -1; }
  .phases { grid-template-columns: repeat(5, 1fr); gap: 10px; }
  .phase__badge { width: 72px; }
  .funding__grid { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  .fshero { padding: 40px 0 56px; }
  /* center the rail on small screens; ignore the desktop How It Works /
     Mission Control alignment and use an even gap between wrapped items */
  .subnav__inner {
    justify-content: center;
    column-gap: 14px;
    row-gap: 0;
    padding-block: 6px 10px;
    padding-left: 24px;
    padding-right: 24px;
  }
  .subnav a { font-size: 0.8rem; padding: 8px 0 6px; }
  .fs-section { padding: 64px 0; }
  .cta--light { padding-top: 56px; }
  .curriculum { padding-top: 56px; }
  .included__grid { grid-template-columns: repeat(2, 1fr); }
  .outcomes__list { grid-template-columns: 1fr; }
  .outcomes__list li { white-space: normal; }
  .phases { grid-template-columns: 1fr 1fr; gap: 24px 14px; }
  .phases-track { display: none; }
  .phase__badge::before { animation: none; }
  .phase__badge img { animation: none; }
  .phase:last-child { grid-column: span 2; }
  .curriculum__facts { grid-template-columns: 1fr; }
  .fs-safety__lead {
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 16px;
  }
  .fs-safety__icon { width: 80px; }
  .fs-safety__lede { text-align: center; }
  .fs-safety__list {
    display: inline-grid;
    text-align: left;
    margin-inline: auto;
  }
  .fs-safety__inner { text-align: center; }
}

@media (max-width: 460px) {
  .included__grid { grid-template-columns: 1fr; }
}