/* ============================================================
   Legion Comps — Strike Force skin ("Strike Force Deployed")
   Homepage-only reskin, switched on by SiteConfig.seasonal_skin.
   Everything is scoped under body.lc-skin-strikeforce, so the file is
   inert anywhere the class isn't set.

   Direction: the year-round, daylight sibling of Planetfall. Under a clear
   frontier sky with a ringed planet hanging over the bunker line, a gunship
   cruises past, drop capsules punch down onto the plain and burst open, an
   armoured squad marches along the defence line and an outrider tears past
   on an assault bike. Cool gunmetal with hazard-yellow and visor-blue
   accents, hard pixel shadows and notched corners; nothing seasonal.

   The squad, bike and capsule sprites are shared with Planetfall
   (images/skins/planetfall/); the sky, ground and gunship are this skin's
   own (images/skins/strikeforce/).

   Presentation only: no copy, prices or compliance text change. Decor
   is aria-hidden, absolutely positioned and click-through, and all motion
   stops under prefers-reduced-motion (the landed capsules and the squad
   stay, as a still battlefield).
   ============================================================ */

.lc-skin-strikeforce {
  /* Skin palette */
  --sf-void:     #0b1017;
  --sf-steel:    #121922;
  --sf-steel-2:  #18212c;
  --sf-steel-3:  #212b37;
  --sf-edge:     #2e3946;
  --sf-edge-2:   #435062;
  --sf-bone:     #eef2f6;
  --sf-bone-2:   #cdd6df;
  --sf-dust:     #a6b2bf;   /* 8.4:1 on --sf-steel */
  --sf-dust-2:   #8a97a5;   /* 6.0:1 on --sf-steel */
  --sf-hazard:   #ffcb2e;   /* 12:1 on --sf-void */
  --sf-hazard-2: #e0a600;
  --sf-visor:    #6fd0ff;
  --sf-shadow:   #2b2000;

  /* Pixel-notched corners for buttons, tags and chips */
  --sf-notch: polygon(0 4px, 4px 4px, 4px 0, calc(100% - 4px) 0, calc(100% - 4px) 4px, 100% 4px,
                      100% calc(100% - 4px), calc(100% - 4px) calc(100% - 4px), calc(100% - 4px) 100%,
                      4px 100%, 4px calc(100% - 4px), 0 calc(100% - 4px));

  /* Flip the light canvas to a gunmetal command deck. Semantic aliases are
     re-pointed rather than the ink scale, because ink stays correct as text
     on the light hazard badges. */
  --paper-0:   var(--sf-steel);
  --paper-50:  var(--sf-steel-2);
  --paper-100: var(--sf-void);
  --paper-200: var(--sf-steel-3);
  --paper-300: var(--sf-edge);
  --paper-400: var(--sf-edge-2);

  --surface-page:    var(--sf-void);
  --surface-card:    var(--sf-steel);
  --surface-raised:  var(--sf-steel-2);
  --surface-sunken:  var(--sf-steel-3);
  --border-soft:     var(--sf-edge);
  --border-strong:   var(--sf-edge-2);

  --text-display:   var(--sf-bone);
  --text-heading:   var(--sf-bone);
  --text-body:      var(--sf-bone-2);
  --text-secondary: var(--sf-dust);
  --text-muted:     var(--sf-dust-2);

  --accent-gold-ink:   var(--sf-hazard);
  --accent-action-ink: var(--sf-hazard);

  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.5);
  --shadow-md: 0 6px 18px rgba(0, 0, 0, 0.55);
  --shadow-lg: 0 16px 36px rgba(0, 0, 0, 0.6), 0 0 0 1px rgba(255, 203, 46, 0.14);
  /* Component depth tokens resolve at :root, so re-point them here or the
     shadow overrides above never reach the cards and buttons. */
  --shadow-card:       var(--shadow-sm);
  --shadow-card-hover: var(--shadow-lg);
  --shadow-btn:        var(--shadow-sm);
  --shadow-btn-hover:  var(--shadow-md);

  background: var(--sf-void);
  color: var(--text-body);
}

/* ---- Promo bar: hazard tape ------------------------------------- */
.lc-skin-strikeforce .lc-promo {
  background:
    repeating-linear-gradient(135deg, rgba(0, 0, 0, 0.14) 0 12px, transparent 12px 24px),
    linear-gradient(90deg, var(--sf-hazard-2), var(--sf-hazard) 50%, var(--sf-hazard-2));
  color: var(--ink-900);
}

/* ---- Nav: armoured glass ----------------------------------------- */
.lc-skin-strikeforce .lc-nav {
  background: rgba(11, 16, 23, 0.9);
  border-bottom-color: var(--sf-edge);
}
.lc-skin-strikeforce .lc-navlink:hover,
.lc-skin-strikeforce .lc-basket-btn:hover { background: var(--sf-steel-3); color: var(--sf-bone); }
.lc-skin-strikeforce .lc-btn-secondary { background: var(--sf-steel-2); color: var(--sf-bone); border-color: var(--sf-edge-2); }
.lc-skin-strikeforce .lc-btn-primary { background: #2c5f8a; border-color: #214a6c; } /* white text 6.6:1 */

/* ---- Hero ------------------------------------------------------ */
.lc-skin-strikeforce .lc-hero {
  background: #9cc3df;
  /* A battlefield strip below the content for the squad, bike and capsules */
  padding-bottom: clamp(130px, calc(13vw - 20px), 170px);
}
.lc-skin-strikeforce .lc-hero-grid { opacity: 0.06; }
.lc-skin-strikeforce .lc-hero-ring { border-color: rgba(111, 208, 255, 0.06); }
.lc-skin-strikeforce .lc-hero-glow { display: none; }
.lc-skin-strikeforce .lc-hero h1 > span {
  color: var(--sf-hazard) !important; /* beats the inline gold on "Glory" */
  background: linear-gradient(180deg, #fffbe6 0%, #ffe27a 34%, var(--sf-hazard) 64%, var(--sf-hazard-2) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  /* Hard, unblurred offset: a pixel-art drop shadow */
  filter: drop-shadow(3px 3px 0 var(--sf-shadow));
}
/* A smooth gradient smears pixel glyph edges; pixel gets hard colour bands and a
   shadow on the font's own pixel step. */
:root[data-theme="pixel"] .lc-skin-strikeforce .lc-hero h1 > span {
  background: linear-gradient(180deg, #ffe27a 0 42%, var(--sf-hazard) 42% 74%, var(--sf-hazard-2) 74% 100%);
  -webkit-background-clip: text;
  background-clip: text;
  filter: drop-shadow(4px 4px 0 var(--sf-shadow));
}
.lc-skin-strikeforce .lc-eyebrow-gold { color: var(--sf-hazard) !important; }
.lc-skin-strikeforce .lc-live-dot {
  background: var(--sf-visor);
  box-shadow: 0 0 8px var(--sf-visor);
  border-radius: 0;
}
.lc-skin-strikeforce .lc-btn-gold {
  background: linear-gradient(180deg, #ffe27a, var(--sf-hazard) 55%, var(--sf-hazard-2));
  border-color: #a77c00;
  color: var(--ink-900);
  box-shadow: inset 0 -4px 0 rgba(43, 32, 0, 0.3), inset 0 3px 0 rgba(255, 251, 230, 0.55);
  clip-path: var(--sf-notch);
}
.lc-skin-strikeforce .lc-btn-gold:hover { filter: brightness(1.06); }
.lc-skin-strikeforce .lc-hero .lc-btn-dark {
  background: rgba(18, 25, 34, 0.88);
  border-color: var(--sf-edge-2);
  clip-path: var(--sf-notch);
}

/* Seasonal tag above the eyebrow */
.lc-sf-tag {
  display: none;
}
.lc-skin-strikeforce .lc-sf-tag {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
  padding: 6px 12px 6px 14px;
  background:
    repeating-linear-gradient(135deg, var(--sf-hazard) 0 5px, var(--sf-void) 5px 10px) left / 5px 100% no-repeat,
    rgba(11, 16, 23, 0.85);
  color: var(--sf-hazard);
  font-family: var(--font-display);
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  clip-path: var(--sf-notch);
  box-shadow: inset 0 0 0 1px rgba(255, 203, 46, 0.45);
}

/* Spotlight card on the battlefield */
.lc-skin-strikeforce .lc-spotlight {
  border-color: rgba(111, 208, 255, 0.35);
  box-shadow: 6px 6px 0 rgba(11, 16, 23, 0.4), 0 20px 60px rgba(11, 16, 23, 0.45);
}
.lc-skin-strikeforce .lc-hero .lc-mini {
  background: rgba(18, 25, 34, 0.9);
}

/* ---- Hero decor ------------------------------------------------- */
.lc-sf-decor { display: none; }
.lc-skin-strikeforce .lc-sf-decor {
  --sf-k: 1;          /* sprite scale; stepped down on smaller screens */
  --sf-floor: 46px;   /* where the squad's feet meet the defence line */
  display: block;
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}
.lc-sf-decor i { display: block; position: absolute; }

/* Sky: a 512x288 SpriteCook backdrop scaled up with hard pixel edges */
.lc-sf-sky {
  position: absolute;
  inset: 0;
  background: url("../../images/skins/strikeforce/sky.webp") 50% 100% / cover no-repeat;
  image-rendering: pixelated;
}
/* A gunmetal wash behind the copy column, so light text holds on a bright sky */
.lc-sf-shade {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(11, 16, 23, 0.3) 0%, transparent 14%),
    linear-gradient(90deg, rgba(11, 16, 23, 0.9) 0%, rgba(11, 16, 23, 0.78) 32%, rgba(11, 16, 23, 0.3) 52%, transparent 66%);
}

/* Drifting clouds, drawn as chunky 8px pixels with box-shadows */
.lc-sf-clouds i {
  width: 8px;
  height: 8px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow:
    8px 0 #fff, 16px 0 #fff, 24px 0 #fff, 32px 0 #fff, 40px 0 #fff,
    8px -8px #fff, 16px -8px #fff, 24px -8px #fff, 32px -8px #fff,
    16px -16px #fff, 24px -16px #fff,
    -8px 8px #e3eef7, 0 8px #e3eef7, 8px 8px #e3eef7, 16px 8px #e3eef7, 24px 8px #e3eef7,
    32px 8px #e3eef7, 40px 8px #e3eef7, 48px 8px #e3eef7;
  opacity: 0.85;
  animation: lc-sf-drift 90s linear infinite;
}
.lc-sf-clouds i:nth-child(1) { top: 18%; left: 0; animation-delay: -30s; }
.lc-sf-clouds i:nth-child(2) { top: 9%; left: 0; animation-duration: 120s; animation-delay: -95s; opacity: 0.6; }

/* Sprite strips: eight frames side by side. Each sprite clips a ::before
   eight frames wide and slides it one frame at a time with transform, which
   the compositor runs off the main thread; stepping background-position
   instead repaints every sprite on every frame. */
.lc-sf-ship i,
.lc-sf-pod,
.lc-sf-boom,
.lc-sf-squad i,
.lc-sf-bike i { overflow: hidden; }
.lc-sf-ship i::before,
.lc-sf-pod::before,
.lc-sf-boom::before,
.lc-sf-squad i::before,
.lc-sf-bike i::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 800%;
  height: 100%;
  background: 0 0 / 100% 100% no-repeat;
  animation: lc-sf-frames 1s steps(8, jump-none) infinite;
}

/* Gunship: a low run over the battlefield behind the troops every 30s */
.lc-sf-ship {
  position: absolute;
  --sf-ship-w: 199;  /* gunship.webp frame size */
  --sf-ship-h: 61;
  bottom: calc(118px * var(--sf-k));
  left: 0;
  width: calc(var(--sf-ship-w) * 1px * var(--sf-k));
  height: calc(var(--sf-ship-h) * 1px * var(--sf-k));
  animation: lc-sf-fly 30s linear infinite;
  animation-delay: -4s;
  transform: translateX(-360px);
}
.lc-sf-ship i {
  inset: 0;
  image-rendering: pixelated;
}
.lc-sf-ship i::before {
  background-image: url("../../images/skins/strikeforce/gunship.webp");
  animation-duration: 0.7s;
}

/* Drop capsules. Each .lc-sf-drop is a landing spot on the ground line; on
   its 14s cycle the capsule falls in, the impact explosion plays out over
   it, and the landed, burst-open capsule is left steaming until it fades
   before the next drop. The falling capsule passes in front of the hero
   content; what lands stays behind it. */
.lc-sf-drop {
  position: absolute;
  bottom: 40px;
  width: 0;
  height: 0;
}
.lc-sf-drop i { bottom: 0; }
.lc-sf-pod {
  z-index: 2;
  width: calc(54px * var(--sf-k));
  height: calc(198px * var(--sf-k));
  margin-left: calc(-27px * var(--sf-k));
  transform: translateY(-1400px);
  animation: lc-sf-fall 14s cubic-bezier(0.45, 0, 1, 1) infinite both;
}
.lc-sf-pod::before {
  background-image: url("../../images/skins/planetfall/pod-fall.webp");
  animation-duration: 0.6s;
}
.lc-sf-landed {
  width: calc(98px * var(--sf-k));
  height: calc(150px * var(--sf-k));
  margin-left: calc(-49px * var(--sf-k));
  bottom: -6px !important;
  background: url("../../images/skins/planetfall/pod-landed.webp") 0 0 / 100% 100% no-repeat;
  opacity: 0;
  animation: lc-sf-landed 14s linear infinite both;
}
.lc-sf-boom {
  z-index: 2;
  width: calc(176px * var(--sf-k));
  height: calc(190px * var(--sf-k));
  margin-left: calc(-88px * var(--sf-k));
  bottom: -14px !important;
  /* The sprite's last frames run the smoke cap into its top edge; fade it
     out so the rising cloud doesn't end on a hard straight line. */
  mask-image: linear-gradient(to bottom, transparent, black 18%);
  -webkit-mask-image: linear-gradient(to bottom, transparent, black 18%);
  opacity: 0;
  animation: lc-sf-boom 14s step-end infinite both;
}
/* The frames run on the burst's own clock: same length, same delay */
.lc-sf-boom::before {
  background-image: url("../../images/skins/planetfall/boom.webp");
  animation: lc-sf-boom-frames 14s step-end infinite both;
  animation-duration: inherit;
  animation-delay: inherit;
}
.lc-sf-drop-1 { left: 47%; }
.lc-sf-drop-2 { left: 95%; }
.lc-sf-drop-3 { left: 74%; }
.lc-sf-drop-1 i { animation-delay: 0.6s; }
.lc-sf-drop-2 i { animation-delay: 5.2s; }
.lc-sf-drop-3 i { animation-delay: 9.8s; }

/* The defence line: a 512x32 strip tripled up, tiled across */
.lc-sf-ground {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 96px;
  background: url("../../images/skins/strikeforce/ground.webp") 0 100% / auto 100% repeat-x;
  image-rendering: pixelated;
}

/* The squad: three marching soldiers, one shared drift, offset walk phases */
.lc-sf-squad {
  position: absolute;
  left: 0;
  bottom: var(--sf-floor);
  width: calc(290px * var(--sf-k));
  height: calc(104px * var(--sf-k));
  animation: lc-sf-march 42s linear infinite;
  animation-delay: -6s;
}
.lc-sf-squad i {
  bottom: 0;
  width: calc(77px * var(--sf-k));
  height: calc(104px * var(--sf-k));
}
.lc-sf-squad i::before {
  background-image: url("../../images/skins/planetfall/marine-march.webp");
  animation-delay: inherit; /* each soldier's own walk phase, set below */
}
.lc-sf-squad i:nth-child(1) { left: calc(200px * var(--sf-k)); }
.lc-sf-squad i:nth-child(2) { left: calc(100px * var(--sf-k)); bottom: 6px; animation-delay: -0.37s; filter: brightness(0.88); }
.lc-sf-squad i:nth-child(3) { left: 0; animation-delay: -0.62s; filter: brightness(0.94); }

/* The outrider: a fast pass every 20s, kicking up dust */
.lc-sf-bike {
  position: absolute;
  left: 0;
  bottom: 14px;
  width: calc(107px * var(--sf-k));
  height: calc(86px * var(--sf-k));
  animation: lc-sf-ride 20s linear infinite;
  animation-delay: 3s;
  transform: translateX(-200px);
}
.lc-sf-bike i { inset: 0; }
.lc-sf-bike i::before {
  background-image: url("../../images/skins/planetfall/bike-ride.webp");
  animation-duration: 0.5s;
}
.lc-sf-bike::before {
  content: "";
  position: absolute;
  right: 80%;
  bottom: 2px;
  width: 120px;
  height: 26px;
  background:
    radial-gradient(ellipse 30% 60% at 85% 70%, rgba(190, 180, 160, 0.6), transparent 70%),
    radial-gradient(ellipse 40% 50% at 45% 60%, rgba(170, 165, 150, 0.4), transparent 70%);
  filter: blur(3px);
}

/* The copy and cards must sit above the decor */
.lc-skin-strikeforce .lc-hero-inner { z-index: 1; }

/* ---- Stat bar + ticker ------------------------------------------ */
.lc-skin-strikeforce .lc-statbar {
  background:
    repeating-linear-gradient(135deg, var(--sf-hazard) 0 8px, var(--sf-void) 8px 16px) top / 100% 4px no-repeat,
    linear-gradient(180deg, #151c26, #0f151d);
  border-color: var(--sf-edge);
}
.lc-skin-strikeforce .lc-statbar-item + .lc-statbar-item { border-left-color: var(--sf-edge); }
.lc-skin-strikeforce .lc-statbar-item > i {
  color: var(--sf-hazard) !important;
  filter: drop-shadow(2px 2px 0 var(--sf-shadow));
}
.lc-skin-strikeforce .lc-ticker-wrap { background: #0d131a; border-bottom-color: var(--sf-edge); }
.lc-skin-strikeforce .lc-ticker-fade-l { background: linear-gradient(90deg, #0d131a, transparent); }
.lc-skin-strikeforce .lc-ticker-fade-r { background: linear-gradient(270deg, #0d131a, transparent); }
.lc-skin-strikeforce .lc-ticker-item { border-right-color: var(--sf-steel-3); }
.lc-skin-strikeforce .lc-ticker-victor { background: var(--sf-hazard); }

/* ---- Hand-set panels that name slate directly -------------------- */
.lc-skin-strikeforce main > .lc-band-dark {
  --slate-900: #10161e;
  --slate-800: var(--sf-edge);
  --slate-700: var(--sf-edge);
  --surface-dark:      var(--slate-900);
  --surface-dark-card: var(--slate-800);
  --border-dark:       var(--slate-700);
  --border-dark-soft:  var(--slate-800);
}

/* ---- Filter bar + quest grid ------------------------------------ */
.lc-skin-strikeforce .lc-filterbar { background: rgba(18, 25, 34, 0.95); backdrop-filter: blur(8px); }
.lc-skin-strikeforce .lc-chip { border-radius: 0; clip-path: var(--sf-notch); }
.lc-skin-strikeforce .lc-chip:hover { border-color: var(--sf-hazard); color: var(--sf-bone); }
.lc-skin-strikeforce .lc-chip-active {
  background: var(--sf-hazard);
  border-color: var(--sf-hazard);
  color: var(--ink-900);
}
.lc-skin-strikeforce .lc-compcard {
  background: linear-gradient(180deg, var(--sf-steel-2), var(--sf-steel));
  border-color: var(--sf-edge);
}
.lc-skin-strikeforce .lc-compcard:hover {
  border-color: rgba(111, 208, 255, 0.55);
  box-shadow: 6px 6px 0 rgba(0, 0, 0, 0.45), 0 0 24px rgba(111, 208, 255, 0.15);
}
.lc-skin-strikeforce .lc-progress { background: var(--sf-steel-3); }

/* ---- How it works ------------------------------------------------ */
.lc-skin-strikeforce #how-it-works {
  background:
    radial-gradient(ellipse 60% 55% at 50% 100%, rgba(111, 208, 255, 0.07), transparent 70%),
    var(--sf-steel) !important;
}
.lc-skin-strikeforce .lc-step-icon {
  background: var(--sf-steel-2);
  border-color: rgba(255, 203, 46, 0.4);
  border-radius: 0;
  clip-path: var(--sf-notch);
  color: var(--sf-hazard) !important;
}
.lc-skin-strikeforce .lc-howitworks-warrior {
  filter: brightness(0.85) saturate(0.8) drop-shadow(4px 4px 0 rgba(0, 0, 0, 0.5));
}

/* ---- Fair play pillars ------------------------------------------- */
.lc-skin-strikeforce .lc-pillar {
  background: linear-gradient(180deg, var(--sf-steel-2), var(--sf-steel));
  border-color: var(--sf-edge);
}
.lc-skin-strikeforce .lc-pillar-icon {
  background: rgba(255, 203, 46, 0.08);
  border-color: rgba(255, 203, 46, 0.4);
  border-radius: 0;
  clip-path: var(--sf-notch);
  color: var(--sf-hazard);
}

/* ---- Motion ------------------------------------------------------ */
@keyframes lc-sf-frames {
  from { transform: translateX(0); }
  to   { transform: translateX(-87.5%); }
}
/* Drop cycle (14s): fall 0-9% (~1.3s), impact at 9% */
@keyframes lc-sf-fall {
  0%         { transform: translateY(-1400px); opacity: 1; }
  9%         { transform: translateY(0); opacity: 1; }
  9.01%, 100% { transform: translateY(0); opacity: 0; }
}
/* One frame per 1% (~0.14s), then the smoke thins away */
@keyframes lc-sf-boom {
  0%    { opacity: 0; }
  8.9%  { opacity: 1; }
  17%   { opacity: 0.8; }
  18.5% { opacity: 0.55; }
  20%   { opacity: 0.3; }
  21.5%, 100% { opacity: 0; }
}
@keyframes lc-sf-boom-frames {
  0%, 8.9%    { transform: translateX(0); }
  10%         { transform: translateX(-12.5%); }
  11%         { transform: translateX(-25%); }
  12%         { transform: translateX(-37.5%); }
  13%         { transform: translateX(-50%); }
  14%         { transform: translateX(-62.5%); }
  15.5%       { transform: translateX(-75%); }
  17%, 100%   { transform: translateX(-87.5%); }
}
@keyframes lc-sf-landed {
  0%, 9.6%   { opacity: 0; transform: translateY(6px); }
  10.5%      { opacity: 1; transform: translateY(0); }
  84%        { opacity: 1; }
  92%, 100%  { opacity: 0; }
}
@keyframes lc-sf-march {
  from { transform: translateX(calc(-100% - 20px)); }
  to   { transform: translateX(calc(100vw + 20px)); }
}
@keyframes lc-sf-ride {
  0%        { transform: translateX(-200px); }
  24%       { transform: translateX(calc(100vw + 60px)); }
  24.01%, 100% { transform: translateX(-200px); }
}
@keyframes lc-sf-fly {
  0%        { transform: translateX(-360px); }
  55%       { transform: translateX(calc(100vw + 40px)); }
  55.01%, 100% { transform: translateX(-360px); }
}
@keyframes lc-sf-drift {
  from { transform: translateX(-120px); }
  to   { transform: translateX(calc(100vw + 40px)); }
}

/* ---- Smaller screens --------------------------------------------- */
@media (max-width: 1024px) {
  .lc-skin-strikeforce .lc-sf-decor { --sf-k: 0.85; }
  .lc-sf-shade {
    background:
      linear-gradient(180deg, rgba(11, 16, 23, 0.86) 0%, rgba(11, 16, 23, 0.66) 60%, rgba(11, 16, 23, 0.25) 85%, transparent 100%);
  }
  /* Columns stack, so the falling capsules drift behind the copy */
  .lc-sf-pod,
  .lc-sf-boom { z-index: auto; }
}
@media (max-width: 640px) {
  .lc-skin-strikeforce .lc-hero { padding-bottom: 130px; }
  .lc-skin-strikeforce .lc-sf-decor { --sf-k: 0.72; --sf-floor: 40px; }
  .lc-sf-ground { height: 72px; }
  .lc-sf-drop-1 { left: 16%; }
  .lc-sf-drop-2 { left: 84%; }
  .lc-sf-drop-3 { left: 50%; }
  .lc-sf-clouds i:nth-child(2) { display: none; }
}

/* ---- Reduced motion: a still battlefield ---------------------------- */
@media (prefers-reduced-motion: reduce) {
  .lc-sf-pod,
  .lc-sf-boom,
  .lc-sf-bike,
  .lc-sf-ship { display: none; }
  .lc-sf-clouds i,
  .lc-sf-squad,
  .lc-sf-squad i::before { animation: none; }
  .lc-sf-landed { animation: none; opacity: 1; }
  .lc-sf-squad { transform: translateX(6vw); }
  .lc-sf-clouds i:nth-child(1) { transform: translateX(58vw); }
  .lc-sf-clouds i:nth-child(2) { transform: translateX(80vw); }
}