/* FROSTBITE TACKLE — PAGE 3: GUIDES */

.fbt-body--guides {
  background:
    radial-gradient(
      circle at 0 0,
      rgba(152, 255, 233, 0.14),
      transparent 55%
    ),
    radial-gradient(
      circle at 100% 100%,
      rgba(126, 211, 255, 0.2),
      transparent 55%
    ),
    #05101c;
}

/* SECTION 1 — GUIDES HERO MAP */

.fg-hero-inner {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1.5fr);
  gap: 28px;
  align-items: center;
}

.fg-hero-header {
  max-width: 520px;
}

.fg-hero-title {
  font-family: "FrostBiteDisplay", system-ui, sans-serif;
  margin: 0 0 10px;
  font-size: clamp(30px, 3.4vw, 36px);
  line-height: 1.05;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.fg-hero-text {
  margin: 0 0 10px;
  font-size: 14px;
  line-height: 1.7;
  color: var(--fbt-text-soft);
}

.fg-hero-list {
  margin: 4px 0 0;
  padding-left: 18px;
  font-size: 13px;
  color: var(--fbt-text-soft);
}

/* collage */

.fg-hero-collage {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  grid-template-rows: auto auto;
  gap: 10px;
  align-items: center;
  padding: 12px;
  border-radius: 26px;
  background:
    radial-gradient(
      circle at 0 0,
      rgba(126, 211, 255, 0.24),
      transparent 55%
    ),
    radial-gradient(
      circle at 100% 100%,
      rgba(152, 255, 233, 0.2),
      transparent 55%
    ),
    rgba(3, 18, 32, 0.98);
  border: 1px solid rgba(164, 210, 255, 0.6);
  box-shadow: 0 22px 42px rgba(1, 7, 14, 0.98);
}

.fg-hero-figure {
  margin: 0;
  border-radius: 20px;
  padding: 8px;
  background: rgba(5, 26, 44, 0.98);
  border: 1px solid rgba(164, 210, 255, 0.55);
  box-shadow: 0 16px 32px rgba(1, 8, 16, 0.96);
}

.fg-hero-figure--primary {
  grid-row: 1 / 3;
}

.fg-hero-figure--side {
  align-self: flex-start;
}

.fg-hero-figure--bottom {
  align-self: flex-end;
}

.fg-hero-img {
  display: block;
  width: 100%;
  max-width: 350px;
  border-radius: 16px;
}

/* SECTION 2 — ESSENTIALS STRIP */

.fg-essentials-inner {
  display: flex;
  flex-direction: column;
  gap: 22px;
}

.fg-essentials-header {
  max-width: 540px;
}

.fg-essentials-title {
  margin: 0 0 6px;
  font-size: 22px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.fg-essentials-text {
  margin: 0;
  font-size: 14px;
  color: var(--fbt-text-soft);
}

.fg-essentials-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1.3fr);
  gap: 24px;
  align-items: center;
}

.fg-essentials-list {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
}

.fg-essential {
  border-radius: 18px;
  padding: 10px 12px;
  background: rgba(5, 26, 44, 0.97);
  border: 1px dashed rgba(164, 210, 255, 0.6);
}

.fg-essential-title {
  margin: 0 0 4px;
  font-size: 15px;
}

.fg-essential-text {
  margin: 0;
  font-size: 13px;
  color: var(--fbt-text-soft);
}

.fg-essentials-gallery {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  align-items: flex-start;
}

.fg-essentials-figure {
  margin: 0;
  border-radius: 20px;
  padding: 8px;
  background: radial-gradient(
      circle at 0 0,
      rgba(126, 211, 255, 0.22),
      transparent 55%
    ),
    rgba(5, 26, 44, 0.98);
  border: 1px solid rgba(164, 210, 255, 0.6);
  box-shadow: 0 18px 34px rgba(1, 7, 14, 0.98);
}

.fg-essentials-figure--small {
  max-width: 260px;
  justify-self: flex-end;
}

.fg-essentials-img {
  display: block;
  width: 100%;
  max-width: 350px;
  border-radius: 16px;
}

/* SECTION 3 — SCENARIO CARDS PANEL */

.fg-scenarios-inner {
  display: flex;
  flex-direction: column;
  gap: 22px;
}

.fg-scenarios-header {
  max-width: 560px;
}

.fg-scenarios-title {
  margin: 0 0 6px;
  font-size: 22px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.fg-scenarios-text {
  margin: 0;
  font-size: 14px;
  color: var(--fbt-text-soft);
}

.fg-scenarios-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1.2fr);
  gap: 24px;
  align-items: center;
}

.fg-scenarios-cards {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
}

.fg-scenario-card {
  border-radius: 18px;
  padding: 10px 12px;
  background: rgba(5, 26, 44, 0.97);
  border: 1px solid rgba(164, 210, 255, 0.55);
}

.fg-scenario-title {
  margin: 0 0 4px;
  font-size: 15px;
}

.fg-scenario-text {
  margin: 0;
  font-size: 13px;
  color: var(--fbt-text-soft);
}

.fg-scenarios-gallery {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  align-items: flex-start;
}

.fg-scenarios-figure {
  margin: 0;
  border-radius: 20px;
  padding: 8px;
  background: radial-gradient(
      circle at 100% 0,
      rgba(152, 255, 233, 0.22),
      transparent 55%
    ),
    rgba(5, 26, 44, 0.98);
  border: 1px solid rgba(164, 210, 255, 0.6);
  box-shadow: 0 18px 34px rgba(1, 7, 14, 0.98);
}

.fg-scenarios-figure--small {
  max-width: 260px;
  justify-self: flex-end;
}

.fg-scenarios-img {
  display: block;
  width: 100%;
  max-width: 350px;
  border-radius: 16px;
}

/* RESPONSIVE — GUIDES 1–3 */

@media (max-width: 1024px) {
  .fg-hero-inner {
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.4fr);
  }

  .fg-essentials-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .fg-scenarios-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .fg-essentials-figure--small,
  .fg-scenarios-figure--small {
    justify-self: flex-start;
  }
}

@media (max-width: 768px) {
  .fg-hero-inner {
    grid-template-columns: minmax(0, 1fr);
  }

  .fg-hero-header {
    max-width: none;
  }

  .fg-hero-collage {
    margin-top: 8px;
  }
}

@media (max-width: 640px) {
  .fg-hero-collage {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto auto;
  }

  .fg-hero-figure--primary {
    grid-row: auto;
  }
}
/* SECTION 4 — ICE SAFETY RING */

.fg-safety-inner {
  display: flex;
  flex-direction: column;
  gap: 22px;
}

.fg-safety-header {
  max-width: 600px;
}

.fg-safety-title {
  margin: 0 0 6px;
  font-size: 22px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.fg-safety-text {
  margin: 0 0 8px;
  font-size: 14px;
  color: var(--fbt-text-soft);
}

.fg-safety-text:last-of-type {
  margin-bottom: 0;
}

.fg-safety-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1.2fr);
  gap: 24px;
  align-items: flex-start;
}

.fg-safety-bands {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
}

.fg-safety-band {
  border-radius: 18px;
  padding: 10px 12px;
  background: rgba(5, 26, 44, 0.97);
  border: 1px solid rgba(164, 210, 255, 0.6);
  box-shadow: 0 16px 30px rgba(1, 8, 16, 0.96);
}

.fg-safety-band-title {
  margin: 0 0 4px;
  font-size: 15px;
}

.fg-safety-band-text {
  margin: 0 0 4px;
  font-size: 13px;
  color: var(--fbt-text-soft);
}

.fg-safety-band-text:last-of-type {
  margin-bottom: 0;
}

.fg-safety-gallery {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  align-items: flex-start;
}

.fg-safety-figure {
  margin: 0;
  border-radius: 20px;
  padding: 8px;
  background: radial-gradient(
      circle at 0 0,
      rgba(126, 211, 255, 0.22),
      transparent 55%
    ),
    rgba(5, 26, 44, 0.98);
  border: 1px solid rgba(164, 210, 255, 0.6);
  box-shadow: 0 18px 34px rgba(1, 7, 14, 0.98);
}

.fg-safety-figure--small {
  max-width: 260px;
  justify-self: flex-end;
}

.fg-safety-img {
  display: block;
  width: 100%;
  max-width: 350px;
  border-radius: 16px;
}

/* SECTION 5 — ROUTE & WAYPOINT LANE */

.fg-route-inner {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1.5fr);
  gap: 24px;
  align-items: center;
}

.fg-route-media {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
}

.fg-route-figure {
  margin: 0;
  border-radius: 20px;
  padding: 8px;
  background: radial-gradient(
      circle at 100% 0,
      rgba(152, 255, 233, 0.22),
      transparent 55%
    ),
    rgba(5, 26, 44, 0.98);
  border: 1px solid rgba(164, 210, 255, 0.6);
  box-shadow: 0 18px 34px rgba(1, 7, 14, 0.98);
}

.fg-route-figure--small {
  max-width: 260px;
  justify-self: flex-start;
}

.fg-route-img {
  display: block;
  width: 100%;
  max-width: 350px;
  border-radius: 16px;
}

.fg-route-copy {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.fg-route-header {
  max-width: 520px;
}

.fg-route-title {
  margin: 0 0 6px;
  font-size: 22px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.fg-route-text {
  margin: 0;
  font-size: 14px;
  color: var(--fbt-text-soft);
}

.fg-route-steps {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
}

.fg-route-step {
  border-radius: 18px;
  padding: 9px 11px;
  background: rgba(5, 26, 44, 0.97);
  border: 1px dashed rgba(164, 210, 255, 0.6);
}

.fg-route-step-title {
  margin: 0 0 3px;
  font-size: 14px;
}

.fg-route-step-text {
  margin: 0;
  font-size: 13px;
  color: var(--fbt-text-soft);
}

/* SECTION 6 — WARMTH RHYTHM GRID */

.fg-warmth-inner {
  display: flex;
  flex-direction: column;
  gap: 22px;
}

.fg-warmth-header {
  max-width: 560px;
}

.fg-warmth-title {
  margin: 0 0 6px;
  font-size: 22px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.fg-warmth-text {
  margin: 0;
  font-size: 14px;
  color: var(--fbt-text-soft);
}

.fg-warmth-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(0, 1.2fr);
  gap: 24px;
  align-items: center;
}

.fg-warmth-grid {
  border-radius: 24px;
  padding: 12px 12px 10px;
  background: linear-gradient(
    135deg,
    rgba(126, 211, 255, 0.22),
    rgba(5, 26, 44, 0.98)
  );
  border: 1px solid rgba(164, 210, 255, 0.6);
  box-shadow: 0 20px 40px rgba(1, 7, 14, 0.98);
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 10px;
}

.fg-warmth-block {
  border-radius: 16px;
  padding: 8px 10px;
  background: rgba(3, 18, 32, 0.98);
}

.fg-warmth-block-title {
  margin: 0 0 4px;
  font-size: 14px;
}

.fg-warmth-block-text {
  margin: 0;
  font-size: 13px;
  color: var(--fbt-text-soft);
}

.fg-warmth-gallery {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  align-items: flex-start;
}

.fg-warmth-figure {
  margin: 0;
  border-radius: 20px;
  padding: 8px;
  background: radial-gradient(
      circle at 0 0,
      rgba(126, 211, 255, 0.22),
      transparent 55%
    ),
    rgba(5, 26, 44, 0.98);
  border: 1px solid rgba(164, 210, 255, 0.6);
  box-shadow: 0 18px 34px rgba(1, 7, 14, 0.98);
}

.fg-warmth-figure--small {
  max-width: 260px;
  justify-self: flex-end;
}

.fg-warmth-img {
  display: block;
  width: 100%;
  max-width: 350px;
  border-radius: 16px;
}

/* RESPONSIVE — GUIDES 4–6 */

@media (max-width: 1024px) {
  .fg-safety-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .fg-route-inner {
    grid-template-columns: minmax(0, 1fr);
  }

  .fg-warmth-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .fg-safety-figure--small,
  .fg-route-figure--small,
  .fg-warmth-figure--small {
    justify-self: flex-start;
  }
}

@media (max-width: 640px) {
  .fg-warmth-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}
/* SECTION 7 — MIDDAY RESET LANE */

.fg-reset-inner {
  display: flex;
  flex-direction: column;
  gap: 22px;
}

.fg-reset-header {
  max-width: 560px;
}

.fg-reset-title {
  margin: 0 0 6px;
  font-size: 22px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.fg-reset-text {
  margin: 0;
  font-size: 14px;
  color: var(--fbt-text-soft);
}

.fg-reset-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1.2fr);
  gap: 24px;
  align-items: center;
}

.fg-reset-steps {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
}

.fg-reset-step {
  border-radius: 18px;
  padding: 9px 11px;
  background: rgba(5, 26, 44, 0.97);
  border: 1px dashed rgba(164, 210, 255, 0.6);
}

.fg-reset-step-title {
  margin: 0 0 3px;
  font-size: 14px;
}

.fg-reset-step-text {
  margin: 0;
  font-size: 13px;
  color: var(--fbt-text-soft);
}

.fg-reset-gallery {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  align-items: flex-start;
}

.fg-reset-figure {
  margin: 0;
  border-radius: 20px;
  padding: 8px;
  background: radial-gradient(
      circle at 0 0,
      rgba(126, 211, 255, 0.22),
      transparent 55%
    ),
    rgba(5, 26, 44, 0.98);
  border: 1px solid rgba(164, 210, 255, 0.6);
  box-shadow: 0 18px 34px rgba(1, 7, 14, 0.98);
}

.fg-reset-figure--small {
  max-width: 260px;
  justify-self: flex-end;
}

.fg-reset-img {
  display: block;
  width: 100%;
  max-width: 350px;
  border-radius: 16px;
}

/* SECTION 8 — HOLE MANAGEMENT STRIP */

.fg-holes-inner {
  display: flex;
  flex-direction: column;
  gap: 22px;
}

.fg-holes-header {
  max-width: 580px;
}

.fg-holes-title {
  margin: 0 0 6px;
  font-size: 22px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.fg-holes-text {
  margin: 0;
  font-size: 14px;
  color: var(--fbt-text-soft);
}

.fg-holes-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1.2fr);
  gap: 24px;
  align-items: center;
}

.fg-holes-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.fg-hole-chip {
  flex: 1 1 140px;
  border-radius: 18px;
  padding: 9px 11px;
  background: rgba(5, 26, 44, 0.97);
  border: 1px solid rgba(164, 210, 255, 0.6);
}

.fg-hole-chip-title {
  margin: 0 0 3px;
  font-size: 14px;
}

.fg-hole-chip-text {
  margin: 0;
  font-size: 13px;
  color: var(--fbt-text-soft);
}

.fg-holes-gallery {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  align-items: flex-start;
}

.fg-holes-figure {
  margin: 0;
  border-radius: 20px;
  padding: 8px;
  background: radial-gradient(
      circle at 100% 0,
      rgba(152, 255, 233, 0.22),
      transparent 55%
    ),
    rgba(5, 26, 44, 0.98);
  border: 1px solid rgba(164, 210, 255, 0.6);
  box-shadow: 0 18px 34px rgba(1, 7, 14, 0.98);
}

.fg-holes-figure--small {
  max-width: 260px;
  justify-self: flex-end;
}

.fg-holes-img {
  display: block;
  width: 100%;
  max-width: 350px;
  border-radius: 16px;
}

/* SECTION 9 — NIGHT SIGNALS PANEL */

.fg-night-inner {
  display: flex;
  flex-direction: column;
  gap: 22px;
}

.fg-night-header {
  max-width: 580px;
}

.fg-night-title {
  margin: 0 0 6px;
  font-size: 22px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.fg-night-text {
  margin: 0;
  font-size: 14px;
  color: var(--fbt-text-soft);
}

.fg-night-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1.2fr);
  gap: 24px;
  align-items: center;
}

.fg-night-tips {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
}

.fg-night-tip {
  border-radius: 18px;
  padding: 9px 11px;
  background: rgba(5, 26, 44, 0.97);
  border: 1px dashed rgba(164, 210, 255, 0.6);
}

.fg-night-tip-title {
  margin: 0 0 3px;
  font-size: 14px;
}

.fg-night-tip-text {
  margin: 0;
  font-size: 13px;
  color: var(--fbt-text-soft);
}

.fg-night-gallery {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  align-items: flex-start;
}

.fg-night-figure {
  margin: 0;
  border-radius: 20px;
  padding: 8px;
  background: radial-gradient(
      circle at 0 0,
      rgba(126, 211, 255, 0.22),
      transparent 55%
    ),
    rgba(5, 26, 44, 0.98);
  border: 1px solid rgba(164, 210, 255, 0.6);
  box-shadow: 0 18px 34px rgba(1, 7, 14, 0.98);
}

.fg-night-figure--small {
  max-width: 260px;
  justify-self: flex-end;
}

.fg-night-img {
  display: block;
  width: 100%;
  max-width: 350px;
  border-radius: 16px;
}

/* RESPONSIVE — GUIDES 7–9 */

@media (max-width: 1024px) {
  .fg-reset-layout,
  .fg-holes-layout,
  .fg-night-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .fg-reset-figure--small,
  .fg-holes-figure--small,
  .fg-night-figure--small {
    justify-self: flex-start;
  }
}

@media (max-width: 640px) {
  .fg-holes-chips {
    flex-direction: column;
  }
}
/* SECTION 10 — GEAR FAILURE MINI-PLAYBOOK */

.fg-fail-inner {
  display: flex;
  flex-direction: column;
  gap: 22px;
}

.fg-fail-header {
  max-width: 580px;
}

.fg-fail-title {
  margin: 0 0 6px;
  font-size: 22px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.fg-fail-text {
  margin: 0;
  font-size: 14px;
  color: var(--fbt-text-soft);
}

.fg-fail-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1.4fr);
  gap: 24px;
  align-items: center;
}

.fg-fail-timeline {
  border-radius: 24px;
  padding: 12px 12px 10px;
  background: linear-gradient(
    135deg,
    rgba(126, 211, 255, 0.22),
    rgba(5, 26, 44, 0.98)
  );
  border: 1px solid rgba(164, 210, 255, 0.6);
  box-shadow: 0 20px 40px rgba(1, 7, 14, 0.98);
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
  position: relative;
}

.fg-fail-step {
  border-radius: 16px;
  padding: 8px 10px;
  background: rgba(3, 18, 32, 0.98);
}

.fg-fail-step-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 3px;
}

.fg-fail-step-index {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 999px;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  border: 1px solid rgba(164, 210, 255, 0.8);
}

.fg-fail-step-title {
  margin: 0;
  font-size: 14px;
}

.fg-fail-step-text {
  margin: 0;
  font-size: 13px;
  color: var(--fbt-text-soft);
}

.fg-fail-gallery {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  align-items: flex-start;
}

.fg-fail-figure {
  margin: 0;
  border-radius: 20px;
  padding: 8px;
  background: rgba(5, 26, 44, 0.98);
  border: 1px solid rgba(164, 210, 255, 0.6);
  box-shadow: 0 18px 34px rgba(1, 7, 14, 0.98);
}

.fg-fail-figure--main {
  background: radial-gradient(
      circle at 0 0,
      rgba(126, 211, 255, 0.22),
      transparent 55%
    ),
    rgba(5, 26, 44, 0.98);
}

.fg-fail-figure--wide {
  background: radial-gradient(
      circle at 100% 0,
      rgba(152, 255, 233, 0.22),
      transparent 55%
    ),
    rgba(5, 26, 44, 0.98);
}

.fg-fail-img {
  display: block;
  width: 100%;
  max-width: 350px;
  border-radius: 16px;
}

/* SECTION 11 — FOOD & HYDRATION LANE */

.fg-food-inner {
  display: flex;
  flex-direction: column;
  gap: 22px;
}

.fg-food-header {
  max-width: 560px;
}

.fg-food-title {
  margin: 0 0 6px;
  font-size: 22px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.fg-food-text {
  margin: 0;
  font-size: 14px;
  color: var(--fbt-text-soft);
}

.fg-food-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1.2fr);
  gap: 24px;
  align-items: center;
}

.fg-food-table {
  border-radius: 24px;
  padding: 12px 12px 10px;
  background: radial-gradient(
      circle at 0 0,
      rgba(126, 211, 255, 0.22),
      transparent 55%
    ),
    rgba(5, 26, 44, 0.98);
  border: 1px solid rgba(164, 210, 255, 0.6);
  box-shadow: 0 20px 40px rgba(1, 7, 14, 0.98);
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
}

.fg-food-slot {
  border-radius: 16px;
  padding: 8px 10px;
  background: rgba(3, 18, 32, 0.98);
}

.fg-food-slot-label {
  margin: 0 0 4px;
  font-size: 14px;
}

.fg-food-slot-text {
  margin: 0;
  font-size: 13px;
  color: var(--fbt-text-soft);
}

.fg-food-gallery {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  align-items: flex-start;
}

.fg-food-figure {
  margin: 0;
  border-radius: 20px;
  padding: 8px;
  background: radial-gradient(
      circle at 100% 0,
      rgba(152, 255, 233, 0.22),
      transparent 55%
    ),
    rgba(5, 26, 44, 0.98);
  border: 1px solid rgba(164, 210, 255, 0.6);
  box-shadow: 0 18px 34px rgba(1, 7, 14, 0.98);
}

.fg-food-figure--small {
  max-width: 260px;
  justify-self: flex-end;
}

.fg-food-img {
  display: block;
  width: 100%;
  max-width: 350px;
  border-radius: 16px;
}

/* SECTION 12 — QUIET KIDS LANE */

.fg-kids-inner {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1.5fr);
  gap: 24px;
  align-items: center;
}

.fg-kids-media {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
}

.fg-kids-figure {
  margin: 0;
  border-radius: 20px;
  padding: 8px;
  background: radial-gradient(
      circle at 0 0,
      rgba(126, 211, 255, 0.22),
      transparent 55%
    ),
    rgba(5, 26, 44, 0.98);
  border: 1px solid rgba(164, 210, 255, 0.6);
  box-shadow: 0 18px 34px rgba(1, 7, 14, 0.98);
}

.fg-kids-figure--small {
  max-width: 260px;
  justify-self: flex-start;
}

.fg-kids-img {
  display: block;
  width: 100%;
  max-width: 350px;
  border-radius: 16px;
}

.fg-kids-copy {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.fg-kids-header {
  max-width: 520px;
}

.fg-kids-title {
  margin: 0 0 6px;
  font-size: 22px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.fg-kids-text {
  margin: 0;
  font-size: 14px;
  color: var(--fbt-text-soft);
}

.fg-kids-rules {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
}

.fg-kids-rule {
  border-radius: 18px;
  padding: 9px 11px;
  background: rgba(5, 26, 44, 0.97);
  border: 1px dashed rgba(164, 210, 255, 0.6);
}

.fg-kids-rule-title {
  margin: 0 0 3px;
  font-size: 14px;
}

.fg-kids-rule-text {
  margin: 0;
  font-size: 13px;
  color: var(--fbt-text-soft);
}

/* RESPONSIVE — GUIDES 10–12 */

@media (max-width: 1024px) {
  .fg-fail-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .fg-food-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .fg-kids-inner {
    grid-template-columns: minmax(0, 1fr);
  }

  .fg-food-figure--small {
    justify-self: flex-start;
  }
}

@media (max-width: 640px) {
  .fg-fail-timeline {
    padding-inline: 10px;
  }

  .fg-food-table {
    padding-inline: 10px;
  }
}
/* SECTION 13 — LOGBOOK LANE */

.fg-logbook-inner {
  display: flex;
  flex-direction: column;
  gap: 22px;
}

.fg-logbook-header {
  max-width: 560px;
}

.fg-logbook-title {
  margin: 0 0 6px;
  font-size: 22px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.fg-logbook-text {
  margin: 0;
  font-size: 14px;
  color: var(--fbt-text-soft);
}

.fg-logbook-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(0, 1.3fr);
  gap: 24px;
  align-items: center;
}

.fg-logbook-copy {
  display: flex;
  flex-direction: column;
}

.fg-logbook-grid {
  border-radius: 24px;
  padding: 12px 12px 10px;
  margin-top: 10px;
  background: radial-gradient(
      circle at 0 0,
      rgba(126, 211, 255, 0.22),
      transparent 55%
    ),
    rgba(5, 26, 44, 0.98);
  border: 1px solid rgba(164, 210, 255, 0.6);
  box-shadow: 0 20px 40px rgba(1, 7, 14, 0.98);
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.fg-logbook-cell {
  border-radius: 16px;
  padding: 8px 10px;
  background: rgba(3, 18, 32, 0.98);
}

.fg-logbook-cell-title {
  margin: 0 0 4px;
  font-size: 14px;
}

.fg-logbook-cell-text {
  margin: 0;
  font-size: 13px;
  color: var(--fbt-text-soft);
}

.fg-logbook-gallery {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  align-items: flex-start;
}

.fg-logbook-figure {
  margin: 0;
  border-radius: 20px;
  padding: 8px;
  background: radial-gradient(
      circle at 0 0,
      rgba(126, 211, 255, 0.22),
      transparent 55%
    ),
    rgba(5, 26, 44, 0.98);
  border: 1px solid rgba(164, 210, 255, 0.6);
  box-shadow: 0 18px 34px rgba(1, 7, 14, 0.98);
}

.fg-logbook-figure--small {
  max-width: 260px;
  justify-self: flex-end;
}

.fg-logbook-img {
  display: block;
  width: 100%;
  max-width: 350px;
  border-radius: 16px;
}

/* SECTION 14 — STORAGE & OFF-ICE CARE */

.fg-storage-inner {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1.5fr);
  gap: 24px;
  align-items: center;
}

.fg-storage-media {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
  gap: 10px;
  align-items: stretch;
}

.fg-storage-figure {
  margin: 0;
  border-radius: 20px;
  padding: 8px;
  background: rgba(5, 26, 44, 0.98);
  border: 1px solid rgba(164, 210, 255, 0.6);
  box-shadow: 0 18px 34px rgba(1, 7, 14, 0.98);
}

.fg-storage-figure--main {
  background: radial-gradient(
      circle at 0 0,
      rgba(126, 211, 255, 0.22),
      transparent 55%
    ),
    rgba(5, 26, 44, 0.98);
}

.fg-storage-mini {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
}

.fg-storage-figure--small {
  max-width: 230px;
  justify-self: flex-end;
}

.fg-storage-img {
  display: block;
  width: 100%;
  max-width: 350px;
  border-radius: 16px;
}

.fg-storage-copy {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.fg-storage-header {
  max-width: 520px;
}

.fg-storage-title {
  margin: 0 0 6px;
  font-size: 22px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.fg-storage-text {
  margin: 0;
  font-size: 14px;
  color: var(--fbt-text-soft);
}

.fg-storage-list {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
}

.fg-storage-item {
  border-radius: 18px;
  padding: 9px 11px;
  background: rgba(5, 26, 44, 0.97);
  border: 1px dashed rgba(164, 210, 255, 0.6);
}

.fg-storage-item-title {
  margin: 0 0 3px;
  font-size: 14px;
}

.fg-storage-item-text {
  margin: 0;
  font-size: 13px;
  color: var(--fbt-text-soft);
}

/* SECTION 15 — SEASON SHIFTS STRIP */

.fg-seasons-inner {
  display: flex;
  flex-direction: column;
  gap: 22px;
}

.fg-seasons-header {
  max-width: 560px;
}

.fg-seasons-title {
  margin: 0 0 6px;
  font-size: 22px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.fg-seasons-text {
  margin: 0;
  font-size: 14px;
  color: var(--fbt-text-soft);
}

.fg-seasons-layout {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.fg-season {
  border-radius: 20px;
  padding: 10px 11px;
  background: rgba(5, 26, 44, 0.97);
  border: 1px solid rgba(164, 210, 255, 0.55);
  box-shadow: 0 16px 30px rgba(1, 8, 16, 0.96);
  display: grid;
  grid-template-rows: auto auto auto;
  gap: 6px;
}

.fg-season--mid {
  background: radial-gradient(
      circle at 0 0,
      rgba(126, 211, 255, 0.22),
      transparent 55%
    ),
    rgba(5, 26, 44, 0.97);
}

.fg-season-figure {
  margin: 0 0 4px;
}

.fg-season-img {
  display: block;
  width: 100%;
  max-width: 350px;
  border-radius: 16px;
}

.fg-season-title {
  margin: 0 0 2px;
  font-size: 14px;
}

.fg-season-text {
  margin: 0;
  font-size: 13px;
  color: var(--fbt-text-soft);
}

/* SECTION 16 — SONAR & VISUAL CUES */

.fg-sonar-inner {
  display: flex;
  flex-direction: column;
  gap: 22px;
}

.fg-sonar-header {
  max-width: 580px;
}

.fg-sonar-title {
  margin: 0 0 6px;
  font-size: 22px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.fg-sonar-text {
  margin: 0;
  font-size: 14px;
  color: var(--fbt-text-soft);
}

.fg-sonar-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(0, 1.2fr);
  gap: 24px;
  align-items: center;
}

.fg-sonar-grid {
  border-radius: 24px;
  padding: 12px 12px 10px;
  background: linear-gradient(
    135deg,
    rgba(126, 211, 255, 0.22),
    rgba(5, 26, 44, 0.98)
  );
  border: 1px solid rgba(164, 210, 255, 0.6);
  box-shadow: 0 20px 40px rgba(1, 7, 14, 0.98);
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
}

.fg-sonar-card {
  border-radius: 16px;
  padding: 8px 10px;
  background: rgba(3, 18, 32, 0.98);
}

.fg-sonar-card-title {
  margin: 0 0 4px;
  font-size: 14px;
}

.fg-sonar-card-text {
  margin: 0;
  font-size: 13px;
  color: var(--fbt-text-soft);
}

.fg-sonar-gallery {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  align-items: flex-start;
}

.fg-sonar-figure {
  margin: 0;
  border-radius: 20px;
  padding: 8px;
  background: radial-gradient(
      circle at 0 0,
      rgba(126, 211, 255, 0.22),
      transparent 55%
    ),
    rgba(5, 26, 44, 0.98);
  border: 1px solid rgba(164, 210, 255, 0.6);
  box-shadow: 0 18px 34px rgba(1, 7, 14, 0.98);
}

.fg-sonar-figure--small {
  max-width: 260px;
  justify-self: flex-end;
}

.fg-sonar-img {
  display: block;
  width: 100%;
  max-width: 350px;
  border-radius: 16px;
}

/* SECTION 17 — CALM MIND LANE */

.fg-mind-inner {
  display: flex;
  flex-direction: column;
  gap: 22px;
}

.fg-mind-header {
  max-width: 560px;
}

.fg-mind-title {
  margin: 0 0 6px;
  font-size: 22px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.fg-mind-text {
  margin: 0;
  font-size: 14px;
  color: var(--fbt-text-soft);
}

.fg-mind-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(0, 1.2fr);
  gap: 24px;
  align-items: center;
}

.fg-mind-rules {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
}

.fg-mind-rule {
  border-radius: 18px;
  padding: 9px 11px;
  background: rgba(5, 26, 44, 0.97);
  border: 1px dashed rgba(164, 210, 255, 0.6);
}

.fg-mind-rule-title {
  margin: 0 0 3px;
  font-size: 14px;
}

.fg-mind-rule-text {
  margin: 0;
  font-size: 13px;
  color: var(--fbt-text-soft);
}

.fg-mind-gallery {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  align-items: flex-start;
}

.fg-mind-figure {
  margin: 0;
  border-radius: 20px;
  padding: 8px;
  background: radial-gradient(
      circle at 100% 0,
      rgba(152, 255, 233, 0.22),
      transparent 55%
    ),
    rgba(5, 26, 44, 0.98);
  border: 1px solid rgba(164, 210, 255, 0.6);
  box-shadow: 0 18px 34px rgba(1, 7, 14, 0.98);
}

.fg-mind-figure--small {
  max-width: 260px;
  justify-self: flex-end;
}

.fg-mind-img {
  display: block;
  width: 100%;
  max-width: 350px;
  border-radius: 16px;
}

/* SECTION 18 — GUIDES CTA BELT */

.fg-cta-inner {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1.3fr);
  gap: 24px;
  align-items: center;
}

.fg-cta-copy {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.fg-cta-title {
  margin: 0 0 6px;
  font-size: 22px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.fg-cta-text {
  margin: 0;
  font-size: 14px;
  color: var(--fbt-text-soft);
}

.fg-cta-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 4px;
}

.fg-cta-gallery {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
}

.fg-cta-figure {
  margin: 0;
  border-radius: 20px;
  padding: 8px;
  background: radial-gradient(
      circle at 0 0,
      rgba(126, 211, 255, 0.22),
      transparent 55%
    ),
    rgba(5, 26, 44, 0.98);
  border: 1px solid rgba(164, 210, 255, 0.6);
  box-shadow: 0 18px 34px rgba(1, 7, 14, 0.98);
}

.fg-cta-figure--small {
  max-width: 260px;
  justify-self: flex-end;
}

.fg-cta-img {
  display: block;
  width: 100%;
  max-width: 350px;
  border-radius: 16px;
}

/* RESPONSIVE — GUIDES 13–18 */

@media (max-width: 1024px) {
  .fg-logbook-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .fg-storage-inner {
    grid-template-columns: minmax(0, 1fr);
  }

  .fg-storage-media {
    grid-template-columns: minmax(0, 1fr);
  }

  .fg-storage-figure--small,
  .fg-logbook-figure--small {
    justify-self: flex-start;
  }

  .fg-seasons-layout {
    grid-template-columns: repeat(3, minmax(0, 220px));
    overflow-x: auto;
    scroll-snap-type: x mandatory;
  }

  .fg-season {
    min-width: 220px;
    scroll-snap-align: start;
  }

  .fg-sonar-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .fg-mind-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .fg-cta-inner {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 640px) {
  .fg-logbook-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .fg-seasons-layout {
    grid-template-columns: minmax(0, 1fr);
    overflow-x: visible;
  }

  .fg-season {
    min-width: 0;
  }

  .fg-cta-actions {
    flex-direction: column;
    align-items: stretch;
  }
}