/*
  Why Shine corporate page — token overlay from the HTML kit.

  Loaded only on page-why-shine.php. Does not replace src/css/tokens.css.
  Brand-intro + benefits tokens come from corporate-service-page-tokens.css.
*/

:root {
  /* Why Shine hero — Figma 304:1467 */
  --hero-title-max-why-shine: 47.4375rem; /* 759px */
  --hero-content-top-why-shine: 17.6875rem; /* 283px */

  /* shine-timeline — Figma 479:4 */
  --shine-timeline-pad-y: 3.5rem; /* 56px — room for the H3 above the year row */
  --shine-timeline-pad-y-mobile: 3.5rem; /* 56px */
  --shine-timeline-photo: 7.9375rem; /* 127px */
  --shine-timeline-copy-w: 12.5rem; /* 200px */
  --shine-timeline-item-gap: 1.5625rem; /* 25px */
  --shine-timeline-line: #e5e5e5;
  /* Figma Line 15–19 are 124px gap strokes, not a 1px full-bleed rule. */
  --shine-timeline-line-thickness: 5px;

  /* community-vision — Figma 304:2525 */
  --community-vision-pad-y: 3.5rem; /* 56px */
  --community-vision-pad-y-desktop: 3.5rem;
  --community-vision-title-max: 49rem; /* 784px */
  --community-vision-media-h: 34.0625rem; /* 545px */
  --community-vision-stack-gap: 2rem; /* 32px */

  /* spotless-home — Figma 314:35 */
  --spotless-home-pad-y: 7.5rem; /* 120px */
  --spotless-home-pad-y-mobile: 3.5rem; /* 56px */
  --spotless-home-card-gap: 2.5rem; /* 40px */
  --spotless-home-card-pad: 2.25rem; /* 36px */
  --spotless-home-photo: 12.5rem; /* 200px */
  --spotless-home-cta-icon: 2.5625rem; /* 41px */
  --shadow-spotless-home-card: 0 4px 20px 0 rgba(0, 0, 0, 0.05);

  /* shine-guarantee — Figma 304:2618 */
  --shine-guarantee-pad-y: 3.5rem; /* 56px */
  --shine-guarantee-lead-max: 60.8125rem; /* 973px */
  --shine-guarantee-foot-max: 61.1875rem; /* 979px */
  /* Figma 304:2625 — 540 × 301.797, aspect 467/261. PNG is a tight crop. */
  --shine-guarantee-badge-w: 33.75rem; /* 540px */
  --shine-guarantee-badge-h: 301.797px;
  --shine-guarantee-badge-ratio: 467 / 261;
  --shine-guarantee-list-w: 19.8125rem; /* 317px */
  --shine-guarantee-check: 2rem; /* 32px */

  /* cta-franchise — Figma 314:197 */
  --cta-franchise-pad-y: 7.5rem; /* 120px */
  --cta-franchise-pad-y-mobile: 3.5rem; /* 56px */
  --cta-franchise-portrait: 13.125rem; /* 210px */
  --cta-franchise-title: 4.375rem; /* 70px */
  --cta-franchise-title-lh: 4.75rem; /* 76px */
  --cta-franchise-body-max: 73.25rem; /* 1172px */
  --cta-franchise-btn-w: 28.125rem; /* 450px */
}