/* ===================================================================
   Intel Spring Bundle — responsive one-pager
   Breakpoints: Desktop 1440, Tablet 1024, Mobile 402
   All numeric positions derive from Figma frame coordinates and are
   expressed in container-query units (cqw) so each section scales
   fluidly to its viewport width.
   =================================================================== */

@font-face {
  font-family: "IntelOne Display";
  src: url("intelone-display-latin-light.e8ee702d.woff2") format("woff2");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "IntelOne Display";
  src: url("intelone-display-latin-regular.7d30ccfa.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "IntelOne Display";
  src: url("intelone-display-latin-medium.38e8d51a.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "IntelOne Display";
  src: url("intelone-display-latin-bold.1e07e246.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "IntelOne Display Heading";
  src: url("intelone-headline-bolditalic.woff") format("woff");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html {
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* IE/Edge */
}
html::-webkit-scrollbar { display: none; } /* Chrome/Safari */

html, body {
  background: #000;
  color: #fff;
  font-family: "IntelOne Display", "Helvetica Neue", Arial, sans-serif;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body { overflow-x: hidden; }

.page {
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  background: #000;
}

section {
  position: relative;
  width: 100%;
  container-type: inline-size;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-position: center top;
  overflow: hidden;
}

img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
sup { font-size: 0.55em; vertical-align: super; line-height: 0; }

/* ========== shared CTA button ========== */
.cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(90deg, #4a3aff 0%, #a923f1 100%);
  color: #fff;
  font-weight: 400;
  font-style: normal;
  white-space: nowrap;
  text-align: center;
}

/* IntelOne Headline Bold Italic — heavy italic display face used for every
   big section heading in the Figma file. Archivo Black is the closest free
   match available on Google Fonts (similar geometric letterforms, same heavy
   weight). Falls back to a synthesised italic of Inter Black if needed. */
.s1-heading,
.s2-heading,
.s3-heading,
.s3b-heading,
.s4-heading,
.s5-heading,
.s6-heading,
.s7-heading,
.s8-heading,
.s9-heading {
  font-family: "IntelOne Display Heading", "Helvetica Neue", Arial, sans-serif;
  font-style: italic;
  font-weight: 700;
  color: #fff;
  letter-spacing: 0.01em;
}

/* ===================================================================
   DESKTOP  (default: up to 1440)
   All positions in % / cqw derived from a 1440-wide design.
   =================================================================== */

/* ---------- Section 1 — hero ---------- */
.s1 {
  aspect-ratio: 1440 / 1523;
  background-image: url("assets/SpringDesktopHeader1Background.png");
}
.s1-heading {
  position: absolute;
  left: 10.55cqw;       /* 152/1440 */
  top: 4.6cqw;          /* 70/1440 */
  width: 53.1cqw;       /* 765/1440 */
  line-height: 1;
  display: flex;
  flex-direction: column;
}
.s1-heading .l1 { font-size: 9.93cqw; }     /* 143 */
.s1-heading .l2 {
  font-size: 6.88cqw;                        /* 99  */
  padding-left: 10.2cqw;                     /* 147 */
}
.s1-heading .l3 { font-size: 10.9cqw; }     /* 157 */
.s1-sub {
  position: absolute;
  left: 6.46cqw;        /* 93 */
  top: 78.91cqw;        /* 1133/1440 * 100 + 65px */
  width: 87cqw;         /* 1253/1440 */
  font-size: 3.125cqw;  /* 45 */
  line-height: 1.55;
  text-align: center;
}
.s1-sub strong { font-weight: 700; }
.cta-lg {
  height: 3.96cqw;      /* 57 */
  font-size: 1.74cqw;   /* 25 */
  padding: 0 1.6cqw;
}
.s1 .cta-lg {
  position: absolute;
  left: 50%;
  top: 91.94cqw;        /* 1324/1440 */
  width: 22.95cqw;      /* 330 */
  transform: translateX(-50%);
}
.s1-offer {
  position: absolute;
  left: 0; right: 0;
  top: 99.3cqw;         /* 1430 */
  text-align: center;
  font-size: 1.39cqw;   /* 20 */
}

/* ---------- Section 2 — Build the legacy ---------- */
.s2 {
  aspect-ratio: 1440 / 577;
  background-image: url("assets/SpringDesktopSection2Background.png");
}
.s2-heading {
  position: absolute;
  left: 6.25cqw;        /* 90 */
  top: 6.1cqw;          /* (1611-1523)/1440 */
  width: 75cqw;
  font-size: 5.2cqw;    /* 75 */
  line-height: 1;
}
.s2-body {
  position: absolute;
  left: 6.25cqw;
  top: 18.21cqw;        /* (1805-1523)/1440 - 20px */
  width: 32.6cqw;       /* 469 */
  font-size: 1.39cqw;   /* 20 */
  line-height: 1.25;
}
.s2 .cta {
  position: absolute;
  left: 6.25cqw;
  top: 29.71cqw;        /* (1956-1523)/1440 - 20px */
  width: 15.625cqw;     /* 225 */
  height: 3.96cqw;
  font-size: 1.74cqw;   /* 25 */
}

/* ---------- Section 3 — The offer + Win on performance ---------- */
.s3 {
  aspect-ratio: 1440 / 1832;
  background-image: url("assets/SpringDesktopSection3Background.png");
}
/* Wrapper div carries the border + glow, matching Figma's rounded-rectangle
   structure. The section has overflow:hidden so we use overflow:visible on
   the wrapper so the glow isn't clipped. */
.s3-thumb {
  position: absolute;
  left: 8.9cqw;         /* 128 */
  top: 13.68cqw;        /* (2297-2100)/1440 */
  width: 43.05cqw;      /* 620 */
  height: 42.98cqw;     /* 619 */
  overflow: visible;
}
.s3-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.s3-heading {
  position: absolute;
  left: 59.72cqw;       /* 860 */
  top: 19.96cqw;        /* (2373-2100)/1440 */
  width: 34.5cqw;       /* 497 */
  font-size: 5.9cqw;    /* 85 */
  line-height: 1.1;
}
.s3-sub {
  position: absolute;
  left: 59.72cqw;
  top: 27.93cqw;        /* (2502-2100)/1440 */
  width: 34.5cqw;
  font-size: 2.98cqw;   /* 43 */
  line-height: 1.25;
}
.s3-cta {
  position: absolute;
  left: 59.72cqw;
  top: 49.79cqw;        /* (2817-2100)/1440 */
  width: 15.625cqw;
}
.s3b-heading {
  position: absolute;
  left: 6.46cqw;        /* 93 */
  top: 73.32cqw;        /* (3359-2100)/1440 - 160px */
  width: 43.3cqw;       /* 624 */
  font-size: 5.0cqw;    /* 75 */
  line-height: 1;
}
.s3b-body {
  position: absolute;
  left: 6.46cqw;
  /* Anchored from bottom so expanded copy never bleeds into section 4 */
  bottom: 4.17cqw;      /* 60px breathing room above section 4 */
  width: 40.1cqw;       /* 578 */
  font-size: 1.39cqw;   /* 20px */
  line-height: 1.2;
}
.s3b-body p { margin-bottom: 1.2em; }
.s3b-body p:last-child { margin-bottom: 0; }

/* ---------- Section 4 — Immersive and responsive play ---------- */
.s4 {
  aspect-ratio: 1440 / 764;
  background-image: url("assets/SpringDesktopSection4Background.png");
}
.s4-heading {
  position: absolute;
  left: 52.5cqw;        /* 756 */
  top: 8.82cqw;         /* (4059-3932)/1440 */
  width: 43.05cqw;      /* 620 */
  font-size: 5.2cqw;
  line-height: 1;
}
.s4-body {
  position: absolute;
  left: 52.5cqw;
  top: 22.3cqw;         /* (4268-3932)/1440 */
  width: 42.57cqw;      /* 613 */
  font-size: 1.39cqw;
  line-height: 1.25;
}
.s4-body ul { padding-left: 1.3em; margin: 0.75em 0; }
.s4-body li { margin: 0.6em 0; }

/* ---------- Section 5 — Ultra Multitasking ---------- */
.s5 {
  aspect-ratio: 1440 / 725;
  background-image: url("assets/SpringDesktopSection5Background.png");
}
.s5-heading {
  position: absolute;
  left: 6.46cqw;
  top: 6.11cqw;         /* (4784-4696)/1440 */
  width: 48.96cqw;      /* 705 */
  font-size: 5.2cqw;
  line-height: 1;
  padding-left: 0;
}
.s5-body {
  position: absolute;
  left: 6.46cqw;
  top: 18.52cqw;        /* (4977-4696)/1440 */
  width: 39.3cqw;       /* 566 */
  font-size: 1.39cqw;
  line-height: 1.25;
}

/* ---------- Section 6 — Unlock the offer (instructions) ---------- */
.s6 {
  aspect-ratio: 1440 / 1448;
  background-image: url("assets/SpringDesktopSection7Background.png");
}
.s6-heading {
  position: absolute;
  left: 50%;
  top: 8.6cqw;          /* (5545-5421)/1440 */
  transform: translateX(-50%);
  font-size: 5.9cqw;    /* 85 */
  line-height: 1.1;
  text-align: center;
  width: 59.5cqw;       /* 856 */
}
.s6-sub {
  position: absolute;
  left: 6.46cqw;
  top: 18.19cqw;        /* (5683-5421)/1440 */
  width: 87cqw;
  font-size: 2.98cqw;   /* 43 */
  line-height: 1.25;
  text-align: center;
}
.s6-sub strong { font-weight: 700; }
.steps {
  position: absolute;
  left: 12.08cqw;       /* 174 */
  top: 32.78cqw;        /* (5893-5421)/1440 */
  width: 75.5cqw;       /* 1087 */
  list-style: none;
  font-size: 2.22cqw;   /* 32 */
  /* IntelOne Display renders at ~70px per line at 32px (line-height ≈ 2.19).
     Using 2.2 so our fallback Inter/Archivo matches Figma's step block height. */
  line-height: 2.35;
}
.steps li {
  display: flex;
  gap: 1.75cqw;
  /* Figma gap between step frames: 28px = 1.94cqw */
  margin-bottom: 3.33cqw; /* 48px */
}
.steps li:nth-child(2), .steps li:nth-child(3) { line-height: 1.2; }
.steps .num {
  flex: 0 0 1.9cqw;
  font-weight: 400;
}
.steps .txt { flex: 1; }
.steps a { text-decoration: none; }
.s6-foot {
  position: absolute;
  left: 8.61cqw;
  right: 9.1cqw;
  /* Anchor from bottom so it always stays near the section base
     regardless of how the steps wrap with the fallback font.
     Figma: section h=1448, footnote top=1389 → 59px from bottom = 4.1cqw */
  bottom: 5.49cqw; /* +20px */
  text-align: center;
  font-size: 1.67cqw;   /* 24 */
  line-height: 1.25;
}

/* ---------- Section 7 — Select your qualifying product ---------- */
.s7 {
  aspect-ratio: 1440 / 569;
  background-image: url("assets/SpringDesktopSection8Background.png");
  color: #00031a;
}
.s7-heading {
  position: absolute;
  left: 0; right: 0;
  top: 4.17cqw;         /* (6917-6857)/1440 */
  text-align: center;
  color: #00031a;
  font-size: 4.17cqw;   /* 60 */
  line-height: 1;
}
.cards {
  position: absolute;
  left: 9.375cqw;       /* 135 */
  right: 9.375cqw;
  top: 7.71cqw;         /* (6968-6857)/1440 */
  display: flex;
  justify-content: space-between;
  gap: 4cqw;
}
.card {
  width: 21.3cqw;       /* 307 */
  height: 30.28cqw;     /* 436 */
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1.45cqw;
  padding: 1.3cqw 0.9cqw;
  color: #00031a;
}
.card img {
  width: 17.78cqw;      /* 256 */
  height: 12.08cqw;     /* 174 */
  object-fit: contain;
}
.card h3 {
  font-size: 1.67cqw;   /* 24 */
  font-weight: 500;
  text-align: center;
  color: #00031a;
}
.card p {
  font-size: 1.11cqw;   /* 16 */
  text-align: center;
  color: #00031a;
}
.cta-sm {
  width: 15.625cqw;     /* 225 */
  height: 2.85cqw;      /* 41 */
  font-size: 1.67cqw;   /* 24 */
}

/* ---------- Section 8 — Unleash AI ---------- */
.s8 {
  aspect-ratio: 1440 / 1213;
  background-image: url("assets/SpringDesktopSection6Background.png");
}
.s8-heading {
  position: absolute;
  left: 0; right: 0;
  top: 6.67cqw;         /* (7522-7426)/1440 */
  font-size: 5.2cqw;    /* 75 */
  text-align: center;
  line-height: 1;
}
.s8-body {
  position: absolute;
  left: 3.47cqw;        /* 50 */
  right: 3.47cqw;
  top: 14.58cqw;        /* (7636-7426)/1440 */
  font-size: 1.39cqw;
  line-height: 1.25;
  text-align: center;
}

/* ---------- Section 9 — That's the power of Intel Inside ---------- */
.s9 {
  aspect-ratio: 1440 / 1624;
  background-image: url("assets/SpringDesktopSection9Background.png");
}
.s9-heading {
  position: absolute;
  left: 0; right: 0;
  top: 7.29cqw;         /* (8744-8639)/1440 */
  font-size: 8.89cqw;   /* 128 */
  text-align: center;
  line-height: 0.9;      /* Figma: leading-[0.9] */
  letter-spacing: 0.089cqw; /* 1.28px */
}
.s9-batman {
  position: absolute;
  left: 32.57cqw;       /* calc(25%+109px) = 469px */
  top: 24.58cqw;        /* (8993-8639)/1440 */
  width: 26.6cqw;       /* 383 */
  height: 14.72cqw;     /* 212 */
  object-fit: contain;
}
.s9-rating {
  position: absolute;
  left: 62.01cqw;       /* 893 */
  top: 29.8cqw;         /* (9068-8639)/1440 */
  width: 4.44cqw;       /* 64 */
  height: 6.18cqw;      /* 89 */
  object-fit: contain;
}
.s9-legal {
  position: absolute;
  left: 10.03cqw;       /* (1440-1151)/2 = 144.5px */
  right: 10.03cqw;
  top: 41.8cqw;         /* (9241-8639)/1440 */
  text-align: center;
  font-size: 1.39cqw;   /* 20 */
  line-height: 1;        /* Figma: leading-none */
  overflow-wrap: break-word;
  word-break: break-word;
}
.s9-legal p { margin-bottom: 1.4em; }
.s9-legal p:last-child { margin-bottom: 0; }
.s9-legal a { text-decoration: underline; overflow-wrap: break-word; word-break: break-all; }
.s9-gaming {
  position: absolute;
  left: 50%;
  top: 104.63cqw;        /* (10038-8639)/1440 + 25px */
  width: 24.95cqw;      /* 359 */
  height: 4.37cqw;      /* 63 */
  transform: translateX(-50%);
  object-fit: contain;
}

/* ===================================================================
   TABLET  (≤ 1024px)
   Positions derived from the 1024-wide Figma frame.
   =================================================================== */
@media (max-width: 1024px) {

  /* ---------- S1 hero ---------- */
  .s1 {
    aspect-ratio: 1024 / 1366;
    background-image: url("assets/SpringTabletHeader1Background.png");
  }
  .s1-heading {
    left: 10.06cqw;     /* 103 */
    top: 5.08cqw;       /* 52 */
    width: 74.7cqw;     /* 765 */
  }
  .s1-heading .l1 { font-size: 11.72cqw; }            /* 120 */
  .s1-heading .l2 { font-size: 9.67cqw; padding-left: 14.35cqw; } /* 99 */
  .s1-heading .l3 { font-size: 11cqw; }            /* 124 */
  .s1-sub {
    left: 6.05cqw;      /* 62 */
    top: 99.5cqw;       /* 1019/1024 * 100 */
    width: 89.75cqw;    /* 919 */
    font-size: 3.52cqw; /* 36 */
    text-align: center;
  }
  .s1 .cta-lg {
    top: 115.33cqw;     /* 1181 */
    width: 20.6cqw;     /* 211 */
    height: 5.18cqw;    /* 53 */
    font-size: 2.64cqw; /* 27 */
  }
  .s1-offer {
    top: 124.2cqw;      /* 1272 */
    font-size: 1.95cqw; /* 20 */
  }

  /* ---------- S2 Build the legacy ---------- */
  .s2 {
    aspect-ratio: 1024 / 423;
    background-image: url("assets/SpringTabletSection2Background.png");
  }
  .s2-heading {
    left: 6.64cqw;      /* 68 */
    top: 4.88cqw;       /* (1416-1366)/1024 */
    width: 55.57cqw;
    font-size: 6.84cqw; /* 70 */
    line-height: 1;
  }
  .s2-body {
    left: 6.05cqw;
    top: 22.1cqw;       /* pushed down to clear 2-line Archivo heading - 40px */
    width: 39.06cqw;    /* 400 */
    font-size: 1.56cqw; /* 16 */
    line-height: 1.25;
  }
  .s2 .cta {
    left: 6.05cqw;
    top: 33.33cqw;      /* -10px */
    width: 16.7cqw;     /* 171 */
    height: 4.2cqw;     /* 43 */
    font-size: 1.85cqw; /* 19 */
  }

  /* ---------- S3 The offer + Win on performance ---------- */
  .s3 {
    aspect-ratio: 1024 / 1193;
    background-image: url("assets/SpringTabletSection3Background.png");
  }
  .s3-thumb {
    left: 13.67cqw;     /* 140 */
    top: 14.65cqw;      /* (1924-1789)/1024 + 15px */
    width: 33.7cqw;     /* 345 */
    height: 33.7cqw;
  }
  .s3-heading {
    left: 59.47cqw;     /* 609 */
    top: 17.09cqw;      /* (1964-1789)/1024 */
    width: 33.1cqw;     /* 339 */
    font-size: 6.84cqw; /* 70 */
  }
  .s3-sub {
    left: 59.47cqw;
    top: 26.37cqw;      /* (2059-1789)/1024 */
    width: 33.1cqw;
    font-size: 2.83cqw; /* 29 */
  }
  .s3-cta {
    left: 59.47cqw;
    top: 46.68cqw;      /* (2226-1789)/1024 */
    width: 16.7cqw;
    height: 4.2cqw;
    font-size: 1.85cqw;
    padding: 0;
    transform: none;
  }
  .s3b-heading {
    left: 7.32cqw;      /* 75 */
    top: 53.96cqw;      /* -15px */
    width: 38.09cqw;    /* 390 */
    font-size: 4.57cqw; /* 57 */
  }
  .s3b-body {
    left: 7.32cqw;
    top: auto;
    bottom: 5.37cqw;    /* +15px */
    width: 39.47cqw;    /* 353 */
    font-size: 1.5625cqw; /* 16px */
    line-height: 1.2;
  }

  /* ---------- S4 Immersive and responsive play ---------- */
  .s4 {
    aspect-ratio: 1024 / 574;
    background-image: url("assets/SpringTabletSection4Background.png");
  }
  .s4-heading {
    left: 50cqw;        /* 512 */
    top: 9.76cqw;       /* (3062-2982)/1024 + 20px */
    width: 39.35cqw;    /* 403 */
    font-size: 5.27cqw; /* 54 */
  }
  .s4-body {
    left: 50cqw;
    top: 24.29cqw;      /* (3181-2982)/1024 + 60px */
    width: 45.41cqw;    /* 465 */
    font-size: 1.56cqw; /* 16 */
  }

  /* ---------- S5 Ultra Multitasking ---------- */
  .s5 {
    aspect-ratio: 1024 / 497;
    background-image: url("assets/SpringTabletSection5Background.png");
  }
  .s5-heading {
    left: 7.32cqw;      /* aligned with s5-body */
    top: 5.37cqw;       /* (3611-3556)/1024 */
    width: 36.1cqw;     /* 370 */
    font-size: 5.27cqw; /* 54 */
    padding-left: 0;
  }
  .s5-body {
    left: 7.32cqw;
    top: 18.85cqw;      /* (3749-3556)/1024 */
    width: 42.0cqw;     /* 430 */
    font-size: 1.56cqw; /* 16 */
  }

  /* ---------- S6 Unlock the offer ---------- */
  .s6 {
    aspect-ratio: 1024 / 1085;
    background-image: url("assets/SpringTabletSection7Background.png");
  }
  .s6-heading {
    left: 50%;
    top: 9.67cqw;       /* (4102-4053)/1024 + 50px */
    transform: translateX(-50%);
    width: 47.6cqw;     /* 487 */
    font-size: 4.69cqw; /* 48 */
    text-align: center;
  }
  .s6-sub {
    left: 50%;
    right: auto;
    transform: translateX(-50%);
    top: 17.67cqw;      /* (4184-4053)/1024 + 50px */
    width: 83.69cqw;    /* 857 */
    font-size: 3.13cqw; /* 32 */
    text-align: center;
  }
  .steps {
    left: 6.93cqw;      /* 71 */
    top: 33.49cqw;      /* (4346-4053)/1024 + 50px */
    width: 83.98cqw;    /* 860 */
    font-size: 2.34cqw; /* 24 */
  }
  .steps li { margin-bottom: 4.69cqw; gap: 1.5cqw; }
  .steps li:nth-child(2), .steps li:nth-child(3) { line-height: 1.2; }
  .steps .num { flex: 0 0 2.5cqw; }
  .s6-foot {
    left: 7.91cqw;
    right: auto;
    bottom: 9.66cqw;    /* +20px */
    top: auto;
    width: 82.3cqw;     /* 843 */
    font-size: 2.34cqw; /* 24 */
    text-align: center;
  }

  /* ---------- S7 Select qualifying product ---------- */
  .s7 {
    aspect-ratio: 1024 / 569;
    background-image: url("assets/SpringTabletSection8Background.png");
  }
  .s7-heading {
    top: 6.15cqw;       /* (5018-4955)/1024 */
    font-size: 4.3cqw;  /* 44 */
  }
  .cards {
    left: 6.54cqw;      /* 67 */
    right: auto;
    top: 16.11cqw;      /* (5120-4955)/1024 */
    width: 87.4cqw;     /* frame 964 */
    gap: 2cqw;
    display: flex;
    justify-content: space-between;
  }
  .card {
    width: 23.54cqw;    /* 241 */
    height: 33.4cqw;    /* 342 */
    padding: 1cqw 0.6cqw;
    gap: 1cqw;
  }
  .card img {
    width: 25cqw;       /* 256 */
    height: 17cqw;      /* 174 */
  }
  .card h3 {
    font-size: 1.95cqw; /* 20 */
  }
  .card p {
    font-size: 1.37cqw; /* 14 */
  }
  .cta-sm {
    width: 21.97cqw;    /* 225 */
    height: 4.0cqw;     /* 41 */
    font-size: 1.56cqw; /* 16 */
  }

  /* ---------- S8 Unleash AI ---------- */
  .s8 {
    aspect-ratio: 1024 / 876;
    background-image: url("assets/SpringTabletSection6Background.png");
  }
  .s8-heading {
    top: 7.03cqw;       /* (5596-5524)/1024 */
    font-size: 5.27cqw; /* 54 */
  }
  .s8-body {
    left: 11.13cqw;     /* 114 */
    right: 11.13cqw;
    top: 14.26cqw;      /* (5670-5524)/1024 */
    font-size: 2.05cqw;
  }

  /* ---------- S9 Intel Inside ---------- */
  .s9 {
    aspect-ratio: 1024 / 1709;
    background-image: url("assets/SpringTabletSection9Background.png");
  }
  .s9-heading {
    top: 14.94cqw;      /* (6492-6399)/1024 + 60px */
    font-size: 10.74cqw;/* 110 */
  }
  .s9-batman {
    top: 36.43cqw;      /* centered + 90px */
    width: 29.39cqw;    /* 301 */
    height: 16.31cqw;   /* 167 */
  }
  .s9-rating {
    left: 63.77cqw;     /* 653 */
    top: 41.02cqw;      /* centered + 90px */
    width: 4.88cqw;     /* 50 */
    height: 6.93cqw;    /* 71 */
  }
  .s9-legal {
    left: 10.94cqw;     /* 112 */
    right: 10.94cqw;
    top: 58.69cqw;      /* (6850-6399)/1024 + 150px */
    font-size: 1.76cqw; /* 18 */
  }
  .s9-gaming {
    top: 151.96cqw;     /* (7855-6399)/1024 + 100px */
    width: 32.62cqw;    /* 334 */
    height: 5.66cqw;    /* 58 */
  }
}

/* ===================================================================
   MOBILE  (≤ 600px — design at 402 wide)
   =================================================================== */
@media (max-width: 600px) {

  /* ---------- S1 hero ---------- */
  .s1 {
    aspect-ratio: 402 / 874;
    background-image: url("assets/SpringMobileHeader1Background.png");
  }
  .s1-heading {
    left: 9.2cqw;       /* 37 */
    top: 4.98cqw;       /* 20px */
    width: 57.46cqw;    /* 231 */
  }
  .s1-heading .l1 { font-size: 12.93cqw; }            /* 60 */
  .s1-heading .l2 { font-size: 9.95cqw; padding-left: 14.93cqw; line-height: 1.1; } /* 40 */
  .s1-heading .l3 { font-size: 12.92cqw; }            /* 64 */
  .s1-sub {
    left: 3.23cqw;      /* 13 */
    top: 159cqw;        /* 639/402 */
    width: 93.5cqw;     /* 376 */
    font-size: 4.98cqw; /* 16 */
    line-height: 1.35;
    text-align: center;
  }
  .s1 .cta-lg {
    top: 186.82cqw;     /* 751 */
    width: 31.59cqw;    /* 127 */
    height: 7.96cqw;    /* 32 */
    font-size: 3.98cqw; /* 16 */
  }
  .s1-offer {
    top: 201cqw;        /* 808 */
    font-size: 3.73cqw; /* 15 */
  }

  /* ---------- S2 Build the legacy ---------- */
  .s2 {
    aspect-ratio: 402 / 669;
    background-image: url("assets/SpringMobileSection2Background.png");
  }
  .s2-heading {
    left: 0;
    top: 10.95cqw;      /* (918-874)/402 */
    width: 100%;
    font-size: 11.94cqw; /* 48 */
    text-align: center;
  }
  .s2-body {
    left: 9.2cqw;
    top: 41.81cqw;      /* (982-874)/402 + 60px */
    width: 81.59cqw;    /* 328 */
    font-size: 3.48cqw; /* 14 */
    line-height: 1.35;
    text-align: center;
  }
  .s2 .cta {
    left: 50%;
    transform: translateX(-50%);
    top: 72.42cqw;      /* (1076-874)/402 + 65px */
    width: 31.59cqw;    /* 127 */
    height: 7.96cqw;    /* 32 */
    font-size: 3.98cqw; /* 16 */
  }

  /* ---------- S3 The offer + Win on performance ---------- */
  .s3 {
    aspect-ratio: 402 / 1474;
    background-image: url("assets/SpringMobileSection3Background.png");
  }
  .s3-heading {
    left: 50%;
    transform: translateX(-50%);
    top: 7.96cqw;       /* (1575-1543)/402 */
    width: 84.33cqw;
    font-size: 11.94cqw; /* 48 */
    text-align: center;
  }
  .s3-thumb {
    left: 22.39cqw;     /* 90 */
    top: 29.6cqw;       /* (1662-1543)/402 */
    width: 54.98cqw;    /* 221 */
    height: 54.98cqw;
  }
  .s3-sub {
    left: 7.96cqw;      /* 32 */
    top: 86.55cqw;      /* (1903-1543)/402 */
    width: 84.33cqw;
    font-size: 5.97cqw; /* 24 */
    text-align: center;
  }
  .s3-cta {
    left: 50%;
    transform: translateX(-50%);
    top: 124.13cqw;     /* (2042-1543)/402 */
    width: 42.54cqw;    /* 171 */
    height: 10.70cqw;   /* 43 */
    font-size: 4.73cqw; /* 19 */
    padding: 0;
  }
  .s3b-heading {
    left: 11.19cqw;     /* 45 */
    top: 226.29cqw;     /* +15px */
    width: 84.33cqw;
    font-size: 9.45cqw; /* 38 */
  }
  .s3b-body {
    left: 11.19cqw;
    top: auto;
    bottom: 12.44cqw;   /* +15px */
    width: 77.61cqw;    /* 312 */
    font-size: 3.48cqw; /* 14px */
    line-height: 1.2;
  }

  /* ---------- S4 Immersive and responsive play ---------- */
  .s4 {
    aspect-ratio: 402 / 860;
    background-image: url("assets/SpringMobileSection4Background.png");
  }
  .s4-heading {
    left: 11.19cqw;
    top: 104.48cqw;     /* (3383-3017)/402 + 50px */
    width: 79.6cqw;     /* 320 */
    font-size: 9.95cqw; /* 40 — max for 2-line break */
  }
  .s4-body {
    left: 11.94cqw;     /* 48 */
    top: 132.08cqw;     /* -20px */
    width: 79.85cqw;    /* 321 */
    font-size: 3.23cqw; /* 13 */
    line-height: 1.35;
  }

  /* ---------- S5 Ultra Multitasking ---------- */
  .s5 {
    aspect-ratio: 402 / 927;
    background-image: url("assets/SpringMobileSection5Background.png");
  }
  .s5-heading {
    left: 11.94cqw;
    top: 10.45cqw;      /* (3919-3877)/402 */
    width: 92.04cqw;    /* 370 */
    font-size: 11.94cqw; /* 48 */
    padding-left: 0;
  }
  .s5-body {
    left: 11.94cqw;
    top: 40.05cqw;      /* +10px */
    width: 74.38cqw;    /* 299 */
    font-size: 3.48cqw;
    line-height: 1.35;
  }

  /* ---------- S6 Unlock the offer ---------- */
  .s6 {
    aspect-ratio: 402 / 975;
    background-image: url("assets/SpringMobileSection7Background.png");
  }
  .s6-heading {
    left: 50%;
    top: 22.89cqw;      /* +20px */
    transform: translateX(-50%);
    width: 90cqw;
    font-size: 9.95cqw; /* 40 */
    text-align: center;
  }
  .s6-sub {
    left: 50%;
    right: auto;
    transform: translateX(-50%);
    top: 42.54cqw;      /* +20px */
    width: 88cqw;
    font-size: 4.98cqw; /* 20 */
    text-align: center;
  }
  .steps {
    left: 10.95cqw;     /* 44 */
    top: 80.06cqw;      /* 350px */
    width: 83.08cqw;    /* 334 */
    font-size: 3.98cqw; /* 16 */
    line-height: 1.4;
  }
  .steps li { margin-bottom: 10.75cqw; gap: 1.5cqw; }
  .steps .num { flex: 0 0 4cqw; }
  .s6-foot {
    left: 50%;
    right: auto;
    transform: translateX(-50%);
    bottom: 24.65cqw;   /* +40px */
    top: auto;
    width: 72.89cqw;    /* 293 */
    font-size: 3.98cqw; /* 16 */
    text-align: center;
  }

  /* ---------- S7 Select qualifying product ---------- */
  .s7 {
    aspect-ratio: 402 / 1405;
    background-image: url("assets/SpringMobileSection8Background.png");
  }
  .s7-heading {
    left: 14.43cqw;     /* 58 */
    right: auto;
    top: 12.94cqw;      /* (5704-5652)/402 */
    width: 71.14cqw;    /* 286 */
    text-align: center;
    font-size: 9.95cqw; /* 40 */
    line-height: 1.1;
  }
  .cards {
    left: 20.15cqw;     /* 81 */
    right: auto;
    top: 51.99cqw;      /* (5861-5652)/402 */
    width: 59.95cqw;    /* 241 */
    flex-direction: column;
    gap: 14.68cqw;      /* (6262-5861-342)/402 ≈ 14.68 */
  }
  .card {
    width: 59.95cqw;    /* 241 */
    height: 85.07cqw;   /* 342 */
    padding: 2cqw;
    gap: 2cqw;
  }
  .card img {
    width: 63.68cqw;    /* 256 */
    height: 43.28cqw;   /* 174 */
  }
  .card h3 { font-size: 4.98cqw; }
  .card p { font-size: 3.48cqw; }
  .cta-sm {
    width: 55.97cqw;    /* 225 */
    height: 10.2cqw;    /* 41 */
    font-size: 3.98cqw;
  }

  /* ---------- S8 Unleash AI ---------- */
  .s8 {
    aspect-ratio: 402 / 612;
    background-image: url("assets/SpringMobileSection6Background.png");
  }
  .s8-heading {
    left: 50%;
    right: auto;
    transform: translateX(-50%);
    top: 13.44cqw;      /* +20px */
    width: 80cqw;
    font-size: 11.94cqw; /* 48 */
    text-align: center;
  }
  .s8-body {
    left: 50%;
    right: auto;
    transform: translateX(-50%);
    top: 43.53cqw;      /* (7232-7057)/402 */
    width: 89.8cqw;     /* 361 */
    font-size: 3.48cqw;
    line-height: 1.35;
    text-align: center;
  }

  /* ---------- S9 Intel Inside ---------- */
  .s9 {
    aspect-ratio: 402 / 2050;
    background-image: url("assets/SpringMobileSection9Background.png");
  }
  .s9-heading {
    left: 11.44cqw;     /* 46 */
    right: auto;
    top: 10.7cqw;       /* +15px */
    width: 77.11cqw;    /* 310 */
    font-size: 9.95cqw; /* 40 */
    text-align: center;
    transform: none;
  }
  .s9-batman {
    left: 18.91cqw;     /* centered group: (402-250)/2 = 76px */
    transform: none;
    top: 30.05cqw;      /* -5px */
    width: 50.75cqw;    /* 204 */
    height: 28.11cqw;   /* 113 */
  }
  .s9-rating {
    left: 72.14cqw;     /* 76+204+10 = 290px */
    transform: none;
    top: 39.89cqw;      /* -5px */
    width: 8.96cqw;     /* 36 */
    height: 12.44cqw;   /* 50 */
  }
  .s9-legal {
    left: 8.71cqw;      /* 35 */
    right: 8.96cqw;
    top: 63.14cqw;      /* +60px */
    font-size: 3.48cqw; /* 14 */
    line-height: 1.4;
    text-align: center;
  }
  .s9-gaming {
    left: 50%;
    top: 490.51cqw;     /* 50px from bottom */
    width: 46.77cqw;    /* 188 */
    height: 8.21cqw;    /* 33 */
  }
}