/* ==========================================================================
   DESIGN TOKENS
   All CSS custom properties for the AMPECO design system.
   Source of truth: reference/design-system-tokens-v6.md
   ========================================================================== */

/* --------------------------------------------------------------------------
   PRIMITIVES — Theme-invariant raw values. Never use directly in components.
   -------------------------------------------------------------------------- */

:root {

  /* --- Color Primitives: Primary (Brand Blue) --- */
  --color-primitive-primary-100: #CFDFF3;
  --color-primitive-primary-300: #6EA0DB;
  --color-primitive-primary-500: #0E60C3;
  --color-primitive-primary-600: #0B4D9C;
  --color-primitive-primary-700: #083A75;
  --color-primitive-primary-800: #06264E;

  /* --- Color Primitives: Secondary (Light Vibrant Blue) --- */
  --color-primitive-secondary-100: #DCEDFE;
  --color-primitive-secondary-300: #96C8FC;
  --color-primitive-secondary-500: #50A4FA;
  --color-primitive-secondary-600: #4087CF;
  --color-primitive-secondary-700: #3069A3;
  --color-primitive-secondary-800: #214C78;

  /* --- Color Primitives: Frost (Cool Near-Whites) --- */
  --color-primitive-frost-100: #F5FAFF;
  --color-primitive-frost-300: #E2EFFE;
  --color-primitive-frost-500: #CEE5FD;
  --color-primitive-frost-600: #A6C7EA;
  --color-primitive-frost-700: #7EA9D7;
  --color-primitive-frost-800: #568CC3;

  /* --- Color Primitives: Midnight (Desaturated Blue-Greys) --- */
  --color-primitive-midnight-50: #E9ECEF;
  --color-primitive-midnight-100: #D3D8E0;
  --color-primitive-midnight-200: #A7B1C1;
  --color-primitive-midnight-300: #7B8BA1;
  --color-primitive-midnight-500: #233D63;
  --color-primitive-midnight-600: #1C314F;
  --color-primitive-midnight-700: #15253B;
  --color-primitive-midnight-800: #0E1828;

  /* --- Color Primitives: Raven (Near-Black Neutrals) --- */
  --color-primitive-raven-100: #53606C;
  --color-primitive-raven-200: #454F59;
  --color-primitive-raven-300: #363F47;
  --color-primitive-raven-400: #282E34;
  --color-primitive-raven-500: #1A1E22;

  /* --- Color Primitives: Green (Success / Positive) --- */
  --color-primitive-green-100: #CEE9DD;
  --color-primitive-green-200: #9CD2BB;
  --color-primitive-green-300: #6BBC99;
  --color-primitive-green-400: #39A577;
  --color-primitive-green-500: #088F55;
  --color-primitive-green-600: #067244;
  --color-primitive-green-700: #055633;
  --color-primitive-green-800: #033922;
  --color-primitive-green-900: #021D11;

  /* --- Color Primitives: Red (Error / Destructive) --- */
  --color-primitive-red-100: #F8D6D7;
  --color-primitive-red-200: #F2AEAF;
  --color-primitive-red-300: #EB8587;
  --color-primitive-red-400: #E55D5F;
  --color-primitive-red-500: #DE3437;
  --color-primitive-red-600: #B22A2C;
  --color-primitive-red-700: #851F21;
  --color-primitive-red-800: #591516;
  --color-primitive-red-900: #2C0A0B;

  /* --- Color Primitives: Orange (Warning / Caution) --- */
  --color-primitive-orange-100: #FFEBD0;
  --color-primitive-orange-200: #FFD6A0;
  --color-primitive-orange-300: #FFC271;
  --color-primitive-orange-400: #FFAD41;
  --color-primitive-orange-500: #FF9912;
  --color-primitive-orange-600: #CC7A0E;
  --color-primitive-orange-700: #995C0B;
  --color-primitive-orange-800: #663D07;
  --color-primitive-orange-900: #331F04;

  /* --- White / Black Opacity (Theme-Invariant) --- */
  --color-white-100: #FFFFFF;
  --color-white-90: rgba(255, 255, 255, 0.9);
  --color-white-80: rgba(255, 255, 255, 0.8);
  --color-white-70: rgba(255, 255, 255, 0.7);
  --color-white-60: rgba(255, 255, 255, 0.6);
  --color-white-50: rgba(255, 255, 255, 0.5);
  --color-white-40: rgba(255, 255, 255, 0.4);
  --color-white-30: rgba(255, 255, 255, 0.3);
  --color-white-20: rgba(255, 255, 255, 0.2);
  --color-white-10: rgba(255, 255, 255, 0.1);
  --color-white-5: rgba(255, 255, 255, 0.05);

  --color-black-100: #000000;
  --color-black-90: rgba(0, 0, 0, 0.9);
  --color-black-80: rgba(0, 0, 0, 0.8);
  --color-black-70: rgba(0, 0, 0, 0.7);
  --color-black-60: rgba(0, 0, 0, 0.6);
  --color-black-50: rgba(0, 0, 0, 0.5);
  --color-black-40: rgba(0, 0, 0, 0.4);
  --color-black-30: rgba(0, 0, 0, 0.3);
  --color-black-20: rgba(0, 0, 0, 0.2);
  --color-black-10: rgba(0, 0, 0, 0.1);
  --color-black-5: rgba(0, 0, 0, 0.05);

  /* --- Spacing Scale (4px base unit) --- */
  --spacing-none: 0;
  --spacing-xxs: 0.125rem;  /* 2px */
  --spacing-xs: 0.25rem;    /* 4px */
  --spacing-s: 0.5rem;      /* 8px */
  --spacing-m: 0.75rem;     /* 12px */
  --spacing-l: 1rem;        /* 16px */
  --spacing-xl: 1.25rem;    /* 20px */
  --spacing-xxl: 1.5rem;    /* 24px */
  --spacing-3xl: 1.75rem;   /* 28px */
  --spacing-4xl: 2rem;      /* 32px */
  --spacing-5xl: 2.5rem;    /* 40px */
  --spacing-6xl: 3rem;      /* 48px */
  --spacing-7xl: 3.5rem;    /* 56px */
  --spacing-8xl: 4rem;      /* 64px */
  --spacing-9xl: 4.5rem;    /* 72px */
  --spacing-10xl: 5rem;     /* 80px */
  --spacing-11xl: 6rem;     /* 96px */
  --spacing-max: 8rem;      /* 128px */

  /* --- Border Radius Scale --- */
  --radius-xs: 4px;
  --radius-s: 8px;
  --radius-m: 12px;
  --radius-l: 16px;
  --radius-xxl: 24px;
  --radius-4xl: 32px;

  /* --- Typography --- */
  --font-display: 'Manrope', sans-serif;
  --font-body: 'Lexend', sans-serif;

  /* --- Gradients: Default (two-stop) --- */
  --gradient-clean-light: linear-gradient(223.28deg, #F5FAFF 50%, #CEE5FD 100%);
  --gradient-clean-dark: linear-gradient(223.28deg, #282E34 50%, #191E22 100%);
  --gradient-cloud-blue: linear-gradient(67.41deg, #CEE5FD 0%, #F5F9FD 100%);
  --gradient-blue: linear-gradient(112.41deg, #0E60C3 0%, #519EFC 100%);
  --gradient-dark: linear-gradient(67.41deg, #1A1E22 0%, #233D63 100%);

  /* --- Gradients: Decorative (three-stop) --- */
  --gradient-moonshine: linear-gradient(223.28deg, #193F66 0%, #0E263D 50%, #191E22 100%);
  --gradient-ocean-deep: linear-gradient(223.28deg, #0E60C3 0%, #083A75 50%, #1A1E22 100%);
  --gradient-ocean-dive: linear-gradient(223.28deg, #50A4FA 0%, #0E60C3 50%, #15253B 100%);
  --gradient-ocean: linear-gradient(224.18deg, #CEE5FD 0%, #0E60C3 50%, #15253B 100%);
  --gradient-sea: linear-gradient(223.28deg, #CEE5FD 0%, #50A4FA 50%, #0E60C3 100%);
  --gradient-cloud: linear-gradient(223.28deg, #F5FAFF 0%, #CEE5FD 50%, #50A4FA 100%);
  --gradient-rain-cloud: linear-gradient(223.28deg, #F5FAFF 0%, #CEE5FD 50%, #7EA9D7 100%);
  --gradient-light-rain-cloud: linear-gradient(223.28deg, #F5FAFF 0%, #CEE5FD 50%, #A6C7EA 100%);

  /* --- Elevation / Shadows (base values) --- */
  --shadow-light-1: 0px 10px 25px rgba(50, 50, 93, 0.1);
  --shadow-light-2: 0px 5px 15px rgba(50, 50, 93, 0.1);
  --shadow-light-3: 0px 2px 10px rgba(50, 50, 93, 0.1);
  --shadow-dark-1: 0px 10px 40px rgba(22, 44, 78, 0.2);
  --shadow-dark-2: 0px 5px 20px rgba(22, 44, 78, 0.2);
  --shadow-dark-3: 0px 2px 20px rgba(22, 44, 78, 0.2);
}


/* --------------------------------------------------------------------------
   LIGHT THEME — Semantic tokens referencing primitives
   -------------------------------------------------------------------------- */

:root, .report-prose [data-theme="light"] {

  /* Background */
  --color-bg-default: var(--color-primitive-frost-100);
  --color-bg-default-secondary: var(--color-primitive-frost-300);
  --color-bg-default-tertiary: var(--color-primitive-frost-500);
  --color-bg-default-binary: var(--color-white-100);
  --color-bg-brand: var(--color-primitive-primary-500);
  --color-bg-brand-hover: var(--color-primitive-primary-700);
  --color-bg-brand-secondary: var(--color-primitive-midnight-500);
  --color-bg-brand-secondary-hover: var(--color-primitive-midnight-700);
  --color-bg-brand-tertiary: var(--color-primitive-raven-400);
  --color-bg-brand-tertiary-hover: var(--color-primitive-raven-500);
  --color-bg-brand-alt: var(--color-primitive-secondary-500);
  --color-bg-brand-alt-hover: var(--color-primitive-secondary-700);
  --color-bg-positive: var(--color-primitive-green-100);
  --color-bg-positive-secondary: var(--color-primitive-green-200);
  --color-bg-positive-tertiary: var(--color-primitive-green-300);
  --color-bg-negative: var(--color-primitive-red-100);
  --color-bg-negative-secondary: var(--color-primitive-red-200);
  --color-bg-negative-tertiary: var(--color-primitive-red-300);
  --color-bg-warning: var(--color-primitive-orange-100);
  --color-bg-warning-secondary: var(--color-primitive-orange-200);
  --color-bg-warning-tertiary: var(--color-primitive-orange-300);
  --color-bg-disabled: var(--color-primitive-midnight-100);
  --color-bg-disabled-secondary: var(--color-primitive-midnight-50);

  /* Text */
  --color-text-default: var(--color-primitive-raven-500);
  --color-text-secondary: var(--color-primitive-raven-200);
  --color-text-tertiary: var(--color-primitive-midnight-500);
  --color-text-alt: var(--color-primitive-frost-100);
  --color-text-brand: var(--color-primitive-primary-500);
  --color-text-brand-secondary: var(--color-primitive-secondary-500);
  --color-text-positive: var(--color-primitive-green-500);
  --color-text-positive-secondary: var(--color-primitive-green-600);
  --color-text-negative: var(--color-primitive-red-500);
  --color-text-negative-secondary: var(--color-primitive-red-600);
  --color-text-warning: var(--color-primitive-orange-500);
  --color-text-warning-secondary: var(--color-primitive-orange-600);
  --color-text-disabled: var(--color-primitive-midnight-200);

  /* Icon */
  --color-icon-default: var(--color-primitive-raven-500);
  --color-icon-secondary: var(--color-primitive-midnight-500);
  --color-icon-brand: var(--color-primitive-primary-500);
  --color-icon-brand-secondary: var(--color-primitive-secondary-500);
  --color-icon-positive: var(--color-primitive-green-500);
  --color-icon-positive-secondary: var(--color-primitive-green-600);
  --color-icon-negative: var(--color-primitive-red-500);
  --color-icon-negative-secondary: var(--color-primitive-red-600);
  --color-icon-warning: var(--color-primitive-orange-500);
  --color-icon-warning-secondary: var(--color-primitive-orange-600);
  --color-icon-disabled: var(--color-primitive-midnight-100);

  /* Border */
  --color-border-default: var(--color-primitive-midnight-200);
  --color-border-secondary: var(--color-primitive-midnight-100);
  --color-border-alt: var(--color-primitive-primary-600);
  --color-border-brand: var(--color-primitive-primary-500);
  --color-border-brand-secondary: var(--color-primitive-primary-300);
  --color-border-positive: var(--color-primitive-green-500);
  --color-border-positive-secondary: var(--color-primitive-green-600);
  --color-border-negative: var(--color-primitive-red-500);
  --color-border-negative-secondary: var(--color-primitive-red-600);
  --color-border-warning: var(--color-primitive-orange-500);
  --color-border-warning-secondary: var(--color-primitive-orange-600);
  --color-border-disabled: var(--color-primitive-midnight-100);

  /* Shadows */
  --shadow-1: var(--shadow-light-1);
  --shadow-2: var(--shadow-light-2);
  --shadow-3: var(--shadow-light-3);
}


/* --------------------------------------------------------------------------
   DARK THEME — Semantic tokens referencing primitives
   -------------------------------------------------------------------------- */

.report-prose [data-theme="dark"] {

  /* Background */
  --color-bg-default: var(--color-primitive-raven-500);
  --color-bg-default-secondary: var(--color-primitive-raven-400);
  --color-bg-default-tertiary: var(--color-primitive-midnight-500);
  --color-bg-default-binary: var(--color-black-100);
  --color-bg-brand: var(--color-primitive-frost-100);
  --color-bg-brand-hover: var(--color-primitive-frost-300);
  --color-bg-brand-secondary: var(--color-primitive-frost-500);
  --color-bg-brand-secondary-hover: var(--color-primitive-frost-700);
  --color-bg-brand-tertiary: var(--color-primitive-secondary-500);
  --color-bg-brand-tertiary-hover: var(--color-primitive-secondary-700);
  --color-bg-brand-alt: var(--color-primitive-primary-500);
  --color-bg-brand-alt-hover: var(--color-primitive-primary-700);
  --color-bg-positive: var(--color-primitive-green-900);
  --color-bg-positive-secondary: var(--color-primitive-green-800);
  --color-bg-positive-tertiary: var(--color-primitive-green-700);
  --color-bg-negative: var(--color-primitive-red-900);
  --color-bg-negative-secondary: var(--color-primitive-red-800);
  --color-bg-negative-tertiary: var(--color-primitive-red-700);
  --color-bg-warning: var(--color-primitive-orange-900);
  --color-bg-warning-secondary: var(--color-primitive-orange-800);
  --color-bg-warning-tertiary: var(--color-primitive-orange-700);
  --color-bg-disabled: var(--color-primitive-raven-400);
  --color-bg-disabled-secondary: var(--color-primitive-raven-300);

  /* Text */
  --color-text-default: var(--color-primitive-frost-100);
  --color-text-secondary: var(--color-primitive-midnight-200);
  --color-text-tertiary: var(--color-primitive-frost-500);
  --color-text-alt: var(--color-primitive-raven-500);
  --color-text-brand: var(--color-primitive-secondary-500);
  --color-text-brand-secondary: var(--color-primitive-secondary-300);
  --color-text-positive: var(--color-primitive-green-300);
  --color-text-positive-secondary: var(--color-primitive-green-400);
  --color-text-negative: var(--color-primitive-red-300);
  --color-text-negative-secondary: var(--color-primitive-red-400);
  --color-text-warning: var(--color-primitive-orange-300);
  --color-text-warning-secondary: var(--color-primitive-orange-400);
  --color-text-disabled: var(--color-primitive-raven-200);

  /* Icon */
  --color-icon-default: var(--color-primitive-frost-100);
  --color-icon-secondary: var(--color-primitive-frost-500);
  --color-icon-brand: var(--color-primitive-secondary-500);
  --color-icon-brand-secondary: var(--color-primitive-frost-500);
  --color-icon-positive: var(--color-primitive-green-300);
  --color-icon-positive-secondary: var(--color-primitive-green-400);
  --color-icon-negative: var(--color-primitive-red-300);
  --color-icon-negative-secondary: var(--color-primitive-red-400);
  --color-icon-warning: var(--color-primitive-orange-300);
  --color-icon-warning-secondary: var(--color-primitive-orange-400);
  --color-icon-disabled: var(--color-primitive-raven-200);

  /* Border */
  --color-border-default: var(--color-primitive-raven-200);
  --color-border-secondary: var(--color-primitive-raven-300);
  --color-border-alt: var(--color-primitive-frost-300);
  --color-border-brand: var(--color-primitive-secondary-500);
  --color-border-brand-secondary: var(--color-primitive-secondary-700);
  --color-border-positive: var(--color-primitive-green-300);
  --color-border-positive-secondary: var(--color-primitive-green-400);
  --color-border-negative: var(--color-primitive-red-300);
  --color-border-negative-secondary: var(--color-primitive-red-400);
  --color-border-warning: var(--color-primitive-orange-300);
  --color-border-warning-secondary: var(--color-primitive-orange-400);
  --color-border-disabled: var(--color-primitive-raven-400);

  /* Shadows */
  --shadow-1: var(--shadow-dark-1);
  --shadow-2: var(--shadow-dark-2);
  --shadow-3: var(--shadow-dark-3);
}

/* ==========================================================================
   TYPOGRAPHY
   Type scale classes for headings, body text, display, and subtitle.
   Desktop-first with mobile overrides at 768px.
   ========================================================================== */

/* --- Display Sizes (Manrope) --- */

.report-prose .display-large {
  font-family: var(--font-display);
  font-size: 96px;
  font-weight: 300;
  line-height: 104px;
}

.report-prose .display-medium {
  font-family: var(--font-display);
  font-size: 80px;
  font-weight: 300;
  line-height: 88px;
}

.report-prose .display-small {
  font-family: var(--font-display);
  font-size: 64px;
  font-weight: 300;
  line-height: 72px;
}

/* --- Headings --- */

.report-prose .h1 {
  font-family: var(--font-display);
  font-size: 48px;
  font-weight: 300;
  line-height: 120%;
  color: var(--color-text-default);
}

.report-prose .h2 {
  font-family: var(--font-display);
  font-size: 40px;
  font-weight: 400;
  line-height: 120%;
  color: var(--color-text-default);
}

.report-prose .h3 {
  font-family: var(--font-body);
  font-size: 32px;
  font-weight: 400;
  line-height: 120%;
  color: var(--color-text-default);
}

.report-prose .h4 {
  font-family: var(--font-body);
  font-size: 24px;
  font-weight: 500;
  line-height: 140%;
  color: var(--color-text-default);
}

.report-prose .h5 {
  font-family: var(--font-body);
  font-size: 22px;
  font-weight: 500;
  line-height: 140%;
  color: var(--color-text-default);
}

/* --- Subtitle --- */

.report-prose .subtitle {
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 600;
  line-height: 140%;
  text-transform: uppercase;
  color: var(--color-text-default);
}

/* --- Body Text --- */

.report-prose .body-large {
  font-family: var(--font-body);
  font-size: 18px;
  font-weight: 300;
  line-height: 140%;
}

.report-prose .body-medium {
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 300;
  line-height: 140%;
}

.report-prose .body-small {
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 300;
  line-height: 160%;
}

/* --- Mobile Overrides (max-width: 768px) --- */

@media (max-width: 768px) {

  .report-prose .h1 {
    font-size: 33px;
    font-weight: 400;
    line-height: 40px;
  }

  .report-prose .h2 {
    font-size: 30px;
    font-weight: 400;
    line-height: 36px;
  }

  .report-prose .h3 {
    font-family: var(--font-display);
    font-size: 28px;
    font-weight: 400;
    line-height: 36px;
  }

  .report-prose .h4 {
    font-size: 24px;
    font-weight: 400;
    line-height: 30px;
  }

  .report-prose .h5 {
    font-size: 20px;
    font-weight: 400;
    line-height: 28px;
  }

  .report-prose .subtitle {
    font-size: 14px;
  }

  .report-prose .body-large {
    font-size: 16px;
  }

  .report-prose .body-medium {
    font-size: 14px;
    line-height: 160%;
  }

  .report-prose .body-small {
    font-size: 12px;
  }
}

/* ==========================================================================
   UTILITIES
   Spacing helpers, layout, visibility, and color utility classes.
   ========================================================================== */


/* ==========================================================================
   SPACING HELPERS
   Pattern: .{property}{direction}-{token}
   Properties: m (margin), p (padding)
   Directions: t (top), b (bottom), l (left), r (right), x (horizontal), y (vertical)
   ========================================================================== */

/* --- Margin Top --- */
.report-prose .mt-none { margin-top: var(--spacing-none); }
.report-prose .mt-xxs { margin-top: var(--spacing-xxs); }
.report-prose .mt-xs { margin-top: var(--spacing-xs); }
.report-prose .mt-s { margin-top: var(--spacing-s); }
.report-prose .mt-m { margin-top: var(--spacing-m); }
.report-prose .mt-l { margin-top: var(--spacing-l); }
.report-prose .mt-xl { margin-top: var(--spacing-xl); }
.report-prose .mt-xxl { margin-top: var(--spacing-xxl); }
.report-prose .mt-3xl { margin-top: var(--spacing-3xl); }
.report-prose .mt-4xl { margin-top: var(--spacing-4xl); }
.report-prose .mt-5xl { margin-top: var(--spacing-5xl); }
.report-prose .mt-6xl { margin-top: var(--spacing-6xl); }
.report-prose .mt-7xl { margin-top: var(--spacing-7xl); }
.report-prose .mt-8xl { margin-top: var(--spacing-8xl); }

/* --- Margin Bottom --- */
.report-prose .mb-none { margin-bottom: var(--spacing-none); }
.report-prose .mb-xxs { margin-bottom: var(--spacing-xxs); }
.report-prose .mb-xs { margin-bottom: var(--spacing-xs); }
.report-prose .mb-s { margin-bottom: var(--spacing-s); }
.report-prose .mb-m { margin-bottom: var(--spacing-m); }
.report-prose .mb-l { margin-bottom: var(--spacing-l); }
.report-prose .mb-xl { margin-bottom: var(--spacing-xl); }
.report-prose .mb-xxl { margin-bottom: var(--spacing-xxl); }
.report-prose .mb-3xl { margin-bottom: var(--spacing-3xl); }
.report-prose .mb-4xl { margin-bottom: var(--spacing-4xl); }
.report-prose .mb-5xl { margin-bottom: var(--spacing-5xl); }
.report-prose .mb-6xl { margin-bottom: var(--spacing-6xl); }
.report-prose .mb-7xl { margin-bottom: var(--spacing-7xl); }
.report-prose .mb-8xl { margin-bottom: var(--spacing-8xl); }

/* --- Margin Left --- */
.report-prose .ml-none { margin-left: var(--spacing-none); }
.report-prose .ml-xxs { margin-left: var(--spacing-xxs); }
.report-prose .ml-xs { margin-left: var(--spacing-xs); }
.report-prose .ml-s { margin-left: var(--spacing-s); }
.report-prose .ml-m { margin-left: var(--spacing-m); }
.report-prose .ml-l { margin-left: var(--spacing-l); }
.report-prose .ml-xl { margin-left: var(--spacing-xl); }
.report-prose .ml-xxl { margin-left: var(--spacing-xxl); }
.report-prose .ml-3xl { margin-left: var(--spacing-3xl); }
.report-prose .ml-4xl { margin-left: var(--spacing-4xl); }

/* --- Margin Right --- */
.report-prose .mr-none { margin-right: var(--spacing-none); }
.report-prose .mr-xxs { margin-right: var(--spacing-xxs); }
.report-prose .mr-xs { margin-right: var(--spacing-xs); }
.report-prose .mr-s { margin-right: var(--spacing-s); }
.report-prose .mr-m { margin-right: var(--spacing-m); }
.report-prose .mr-l { margin-right: var(--spacing-l); }
.report-prose .mr-xl { margin-right: var(--spacing-xl); }
.report-prose .mr-xxl { margin-right: var(--spacing-xxl); }
.report-prose .mr-3xl { margin-right: var(--spacing-3xl); }
.report-prose .mr-4xl { margin-right: var(--spacing-4xl); }

/* --- Margin Horizontal / Vertical --- */
.report-prose .mx-auto { margin-left: auto; margin-right: auto; }
.report-prose .mx-s { margin-left: var(--spacing-s); margin-right: var(--spacing-s); }
.report-prose .mx-m { margin-left: var(--spacing-m); margin-right: var(--spacing-m); }
.report-prose .mx-l { margin-left: var(--spacing-l); margin-right: var(--spacing-l); }
.report-prose .mx-xl { margin-left: var(--spacing-xl); margin-right: var(--spacing-xl); }
.report-prose .mx-xxl { margin-left: var(--spacing-xxl); margin-right: var(--spacing-xxl); }

.report-prose .my-s { margin-top: var(--spacing-s); margin-bottom: var(--spacing-s); }
.report-prose .my-m { margin-top: var(--spacing-m); margin-bottom: var(--spacing-m); }
.report-prose .my-l { margin-top: var(--spacing-l); margin-bottom: var(--spacing-l); }
.report-prose .my-xl { margin-top: var(--spacing-xl); margin-bottom: var(--spacing-xl); }
.report-prose .my-xxl { margin-top: var(--spacing-xxl); margin-bottom: var(--spacing-xxl); }
.report-prose .my-4xl { margin-top: var(--spacing-4xl); margin-bottom: var(--spacing-4xl); }
.report-prose .my-5xl { margin-top: var(--spacing-5xl); margin-bottom: var(--spacing-5xl); }
.report-prose .my-8xl { margin-top: var(--spacing-8xl); margin-bottom: var(--spacing-8xl); }

/* --- Padding Top --- */
.report-prose .pt-none { padding-top: var(--spacing-none); }
.report-prose .pt-xs { padding-top: var(--spacing-xs); }
.report-prose .pt-s { padding-top: var(--spacing-s); }
.report-prose .pt-m { padding-top: var(--spacing-m); }
.report-prose .pt-l { padding-top: var(--spacing-l); }
.report-prose .pt-xl { padding-top: var(--spacing-xl); }
.report-prose .pt-xxl { padding-top: var(--spacing-xxl); }
.report-prose .pt-4xl { padding-top: var(--spacing-4xl); }
.report-prose .pt-5xl { padding-top: var(--spacing-5xl); }
.report-prose .pt-6xl { padding-top: var(--spacing-6xl); }
.report-prose .pt-8xl { padding-top: var(--spacing-8xl); }

/* --- Padding Bottom --- */
.report-prose .pb-none { padding-bottom: var(--spacing-none); }
.report-prose .pb-xs { padding-bottom: var(--spacing-xs); }
.report-prose .pb-s { padding-bottom: var(--spacing-s); }
.report-prose .pb-m { padding-bottom: var(--spacing-m); }
.report-prose .pb-l { padding-bottom: var(--spacing-l); }
.report-prose .pb-xl { padding-bottom: var(--spacing-xl); }
.report-prose .pb-xxl { padding-bottom: var(--spacing-xxl); }
.report-prose .pb-4xl { padding-bottom: var(--spacing-4xl); }
.report-prose .pb-5xl { padding-bottom: var(--spacing-5xl); }
.report-prose .pb-6xl { padding-bottom: var(--spacing-6xl); }
.report-prose .pb-8xl { padding-bottom: var(--spacing-8xl); }

/* --- Padding Left --- */
.report-prose .pl-none { padding-left: var(--spacing-none); }
.report-prose .pl-xs { padding-left: var(--spacing-xs); }
.report-prose .pl-s { padding-left: var(--spacing-s); }
.report-prose .pl-m { padding-left: var(--spacing-m); }
.report-prose .pl-l { padding-left: var(--spacing-l); }
.report-prose .pl-xl { padding-left: var(--spacing-xl); }
.report-prose .pl-xxl { padding-left: var(--spacing-xxl); }
.report-prose .pl-4xl { padding-left: var(--spacing-4xl); }

/* --- Padding Right --- */
.report-prose .pr-none { padding-right: var(--spacing-none); }
.report-prose .pr-xs { padding-right: var(--spacing-xs); }
.report-prose .pr-s { padding-right: var(--spacing-s); }
.report-prose .pr-m { padding-right: var(--spacing-m); }
.report-prose .pr-l { padding-right: var(--spacing-l); }
.report-prose .pr-xl { padding-right: var(--spacing-xl); }
.report-prose .pr-xxl { padding-right: var(--spacing-xxl); }
.report-prose .pr-4xl { padding-right: var(--spacing-4xl); }

/* --- Padding Horizontal / Vertical --- */
.report-prose .px-s { padding-left: var(--spacing-s); padding-right: var(--spacing-s); }
.report-prose .px-m { padding-left: var(--spacing-m); padding-right: var(--spacing-m); }
.report-prose .px-l { padding-left: var(--spacing-l); padding-right: var(--spacing-l); }
.report-prose .px-xl { padding-left: var(--spacing-xl); padding-right: var(--spacing-xl); }
.report-prose .px-xxl { padding-left: var(--spacing-xxl); padding-right: var(--spacing-xxl); }
.report-prose .px-4xl { padding-left: var(--spacing-4xl); padding-right: var(--spacing-4xl); }

.report-prose .py-s { padding-top: var(--spacing-s); padding-bottom: var(--spacing-s); }
.report-prose .py-m { padding-top: var(--spacing-m); padding-bottom: var(--spacing-m); }
.report-prose .py-l { padding-top: var(--spacing-l); padding-bottom: var(--spacing-l); }
.report-prose .py-xl { padding-top: var(--spacing-xl); padding-bottom: var(--spacing-xl); }
.report-prose .py-xxl { padding-top: var(--spacing-xxl); padding-bottom: var(--spacing-xxl); }
.report-prose .py-4xl { padding-top: var(--spacing-4xl); padding-bottom: var(--spacing-4xl); }
.report-prose .py-5xl { padding-top: var(--spacing-5xl); padding-bottom: var(--spacing-5xl); }
.report-prose .py-8xl { padding-top: var(--spacing-8xl); padding-bottom: var(--spacing-8xl); }
.report-prose .py-11xl { padding-top: var(--spacing-11xl); padding-bottom: var(--spacing-11xl); }

/* --- Gap --- */
.report-prose .gap-none { gap: var(--spacing-none); }
.report-prose .gap-xxs { gap: var(--spacing-xxs); }
.report-prose .gap-xs { gap: var(--spacing-xs); }
.report-prose .gap-s { gap: var(--spacing-s); }
.report-prose .gap-m { gap: var(--spacing-m); }
.report-prose .gap-l { gap: var(--spacing-l); }
.report-prose .gap-xl { gap: var(--spacing-xl); }
.report-prose .gap-xxl { gap: var(--spacing-xxl); }
.report-prose .gap-3xl { gap: var(--spacing-3xl); }
.report-prose .gap-4xl { gap: var(--spacing-4xl); }
.report-prose .gap-5xl { gap: var(--spacing-5xl); }
.report-prose .gap-6xl { gap: var(--spacing-6xl); }
.report-prose .gap-8xl { gap: var(--spacing-8xl); }


/* ==========================================================================
   LAYOUT
   Container, sections, flexbox, and grid helpers.
   ========================================================================== */

.report-prose .container {
  width: 100%;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--spacing-l);
  padding-right: var(--spacing-l);
}

/* --- Sections ---
   Full-width blocks that stack vertically. Content inside uses .container
   for the 1200px constraint. By default sections are transparent —
   use .section--card for the floating card treatment.

   Typical structure:
   <section class="section">
     <div class="container"> ... </div>
   </section>
   <section class="section section--card">
     <div class="container"> ... </div>
   </section>
*/

.report-prose .section {
  width: 100%;
  position: relative;
  padding: var(--spacing-11xl) 0; /* 96px top/bottom */
}

.report-prose .section + .section {
  margin-top: var(--spacing-l); /* 16px gap between sections — prevents rounded corners from touching */
}

.report-prose .section--hero {
  padding: 0; /* Hero sections define their own padding */
  border-radius: var(--radius-4xl); /* 32px — heroes are prominent sections */
}

.report-prose .section--card {
  background: var(--color-bg-default-secondary);
  border-radius: var(--radius-xxl);
}

.report-prose .section--card-prominent {
  background: var(--color-bg-default-secondary);
  border-radius: var(--radius-4xl);
}

/* --- Flexbox --- */
.report-prose .flex { display: flex; }
.report-prose .flex-col { display: flex; flex-direction: column; }
.report-prose .flex-row { display: flex; flex-direction: row; }
.report-prose .flex-wrap { flex-wrap: wrap; }
.report-prose .flex-center { display: flex; align-items: center; justify-content: center; }
.report-prose .flex-between { display: flex; align-items: center; justify-content: space-between; }
.report-prose .flex-start { display: flex; align-items: flex-start; }
.report-prose .flex-end { display: flex; align-items: flex-end; }
.report-prose .items-center { align-items: center; }
.report-prose .items-start { align-items: flex-start; }
.report-prose .items-end { align-items: flex-end; }
.report-prose .justify-center { justify-content: center; }
.report-prose .justify-between { justify-content: space-between; }
.report-prose .justify-end { justify-content: flex-end; }
.report-prose .flex-1 { flex: 1; }
.report-prose .flex-shrink-0 { flex-shrink: 0; }

/* --- Grid --- */
.report-prose .grid { display: grid; gap: var(--spacing-xxl); }
.report-prose .grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--spacing-xxl); }
.report-prose .grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--spacing-xxl); }
.report-prose .grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--spacing-xxl); }

@media (max-width: 1024px) {
  .report-prose .grid-4 { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 768px) {
  .report-prose .grid-4, .report-prose .grid-3 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
  .report-prose .grid-4, .report-prose .grid-3, .report-prose .grid-2 { grid-template-columns: 1fr; }
}


/* --- Image Frame ---
   Constrains images in 1- and 2-column layouts to a consistent 560x560
   area. The image is centered and maintains its aspect ratio via
   object-fit: contain. Use on the parent <div> wrapping the <img>.

   <div class="image-frame">
     <img src="..." alt="...">
   </div>
*/
.report-prose .image-frame {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 560px;
  aspect-ratio: 1 / 1;
  margin: 0 auto;
}
.report-prose .image-frame img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  border-radius: var(--radius-xxl);
}


/* ==========================================================================
   TEXT ALIGNMENT
   ========================================================================== */

.report-prose .text-center { text-align: center; }
.report-prose .text-left { text-align: left; }
.report-prose .text-right { text-align: right; }


/* ==========================================================================
   VISIBILITY
   ========================================================================== */

.report-prose .sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}

.report-prose .hidden { display: none; }


/* ==========================================================================
   COLOR UTILITIES
   Quick semantic color overrides for text and backgrounds.
   ========================================================================== */

/* Text colors */
.report-prose .text-default { color: var(--color-text-default); }
.report-prose .text-secondary { color: var(--color-text-secondary); }
.report-prose .text-tertiary { color: var(--color-text-tertiary); }
.report-prose .text-alt { color: var(--color-text-alt); }
.report-prose .text-brand { color: var(--color-text-brand); }
.report-prose .text-brand-secondary { color: var(--color-text-brand-secondary); }
.report-prose .text-positive { color: var(--color-text-positive); }
.report-prose .text-negative { color: var(--color-text-negative); }
.report-prose .text-warning { color: var(--color-text-warning); }
.report-prose .text-disabled { color: var(--color-text-disabled); }

/* Background colors */
.report-prose .bg-default { background-color: var(--color-bg-default); }
.report-prose .bg-default-secondary { background-color: var(--color-bg-default-secondary); }
.report-prose .bg-default-tertiary { background-color: var(--color-bg-default-tertiary); }
.report-prose .bg-default-binary { background-color: var(--color-bg-default-binary); }
.report-prose .bg-brand { background-color: var(--color-bg-brand); }
.report-prose .bg-brand-secondary { background-color: var(--color-bg-brand-secondary); }
.report-prose .bg-brand-alt { background-color: var(--color-bg-brand-alt); }
.report-prose .bg-positive { background-color: var(--color-bg-positive); }
.report-prose .bg-negative { background-color: var(--color-bg-negative); }
.report-prose .bg-warning { background-color: var(--color-bg-warning); }
.report-prose .bg-disabled { background-color: var(--color-bg-disabled); }

/* Border colors */
.report-prose .border-default { border: 1px solid var(--color-border-default); }
.report-prose .border-secondary { border: 1px solid var(--color-border-secondary); }
.report-prose .border-brand { border: 1px solid var(--color-border-brand); }
.report-prose .border-positive { border: 1px solid var(--color-border-positive); }
.report-prose .border-negative { border: 1px solid var(--color-border-negative); }
.report-prose .border-warning { border: 1px solid var(--color-border-warning); }

/* Border radius */
.report-prose .rounded-xs { border-radius: var(--radius-xs); }
.report-prose .rounded-s { border-radius: var(--radius-s); }
.report-prose .rounded-l { border-radius: var(--radius-l); }
.report-prose .rounded-xxl { border-radius: var(--radius-xxl); }
.report-prose .rounded-4xl { border-radius: var(--radius-4xl); }
.report-prose .rounded-full { border-radius: 9999px; }

/* Shadows */
.report-prose .shadow-1 { box-shadow: var(--shadow-1); }
.report-prose .shadow-2 { box-shadow: var(--shadow-2); }
.report-prose .shadow-3 { box-shadow: var(--shadow-3); }
.report-prose .shadow-none { box-shadow: none; }


/* ==========================================================================
   WIDTH
   ========================================================================== */

.report-prose .w-full { width: 100%; }
.report-prose .max-w-container { max-width: 1200px; }

/* ==========================================================================
   The EV Charging Platform Migration Playbook — reading experience
   Built on AMPECO design tokens. Light theme, editorial long-form.
   ========================================================================== */

:root {
  --measure: 720px;          /* reading column width */
  --wide: 1200px;            /* full content container */
  --sidebar-w: 264px;
  --header-h: 68px;
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
}

/* v2 reset scoped to the chapter content (.site) + hero ONLY — must not clobber
   the ampeco-base chrome (.report-chapnav / .report-pager) padding/margin utilities. */
.report-prose .site, .report-prose .site *, .report-prose .site *::before, .report-prose .site *::after, .report-prose .hero, .report-prose .hero *, .report-prose .hero *::before, .report-prose .hero *::after { box-sizing: border-box; margin: 0; padding: 0; }

.report-prose { scroll-behavior: auto; scroll-padding-top: calc(var(--header-h) + 24px); }
@media (prefers-reduced-motion: reduce) { .report-prose { scroll-behavior: auto; } }

.report-prose {
  font-family: var(--font-body);
  font-weight: 300;
  font-size: 18px;
  line-height: 1.65;
  color: var(--color-text-default);
  background: var(--color-bg-default);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.report-prose img, .report-prose svg { max-width: 100%; display: block; }
.report-prose button { font-family: inherit; cursor: pointer; }
.report-prose ul, .report-prose ol { list-style: none; }

.report-prose #root { isolation: isolate; }

/* --------------------------------------------------------------------------
   HEADER (simplified AMPECO chrome)
   -------------------------------------------------------------------------- */
.report-prose .site-header {
  position: fixed;
  top: 0; left: 0; right: 0;
  height: var(--header-h);
  z-index: 60;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 clamp(20px, 4vw, 48px);
  transition: background-color .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);
  border-bottom: 1px solid transparent;
}
.report-prose .site-header[data-solid="true"] {
  background: rgba(255, 255, 255, 0.82);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom-color: var(--color-border-secondary);
  box-shadow: var(--shadow-3);
}
.report-prose .site-header__logo { height: 26px; width: auto; transition: opacity .3s var(--ease); }
.report-prose .site-header__logo--light { position: absolute; opacity: 0; }
.report-prose .site-header[data-solid="false"] .brand-mark { filter: none; }
.report-prose .site-header__nav {
  display: flex;
  align-items: center;
  gap: clamp(16px, 2.4vw, 34px);
}
.report-prose .site-header__nav a:not(.btn) {
  font-size: 15px;
  font-weight: 400;
  letter-spacing: .01em;
  color: var(--color-text-secondary);
  text-decoration: none;
  transition: color .2s var(--ease);
}
.report-prose .site-header[data-solid="false"] .site-header__nav a:not(.btn) { color: var(--color-text-secondary); }
.report-prose .site-header__nav a:not(.btn):hover { color: var(--color-text-brand); }
.report-prose .site-header[data-solid="false"] .site-header__nav a:not(.btn):hover { color: var(--color-text-brand); }
.report-prose .site-header__nav .nav-hide { }
@media (max-width: 860px) { .report-prose .site-header__nav .nav-hide { display: none; } }

/* --------------------------------------------------------------------------
   BUTTONS
   -------------------------------------------------------------------------- */
.report-prose .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 15px;
  font-weight: 500;
  line-height: 1;
  padding: 12px 20px;
  border-radius: var(--radius-s);
  border: none;
  text-decoration: none;
  transition: background-color .2s var(--ease), color .2s var(--ease), box-shadow .2s var(--ease), transform .15s var(--ease);
  white-space: nowrap;
}
.report-prose .btn--primary { background: var(--color-bg-brand); color: var(--color-text-alt); }
.report-prose .btn--primary:hover { background: var(--color-bg-brand-hover); color: #fff; }
.report-prose .btn--lg { padding: 16px 30px; font-size: 17px; border-radius: var(--radius-m); }
.report-prose .btn--ghost {
  background: transparent;
  color: var(--color-text-brand);
  box-shadow: inset 0 0 0 1px var(--color-border-default);
}
.report-prose .btn--ghost:hover { box-shadow: inset 0 0 0 1px var(--color-border-brand); background: var(--color-bg-brand); color: #fff; }
.report-prose .btn--secondary { background: transparent; color: var(--color-text-default); box-shadow: inset 0 0 0 1px var(--color-border-default); }
.report-prose .btn--secondary:hover { background: var(--color-bg-brand-tertiary); color: var(--color-text-alt); box-shadow: inset 0 0 0 1px var(--color-bg-brand-tertiary); }
.report-prose .btn--on-dark { background: #fff; color: var(--color-primitive-primary-600); }
.report-prose .btn--on-dark:hover { background: var(--color-primitive-frost-300); }
.report-prose .btn--ghost-dark { background: transparent; color: #fff; box-shadow: inset 0 0 0 1px rgba(255,255,255,.4); }
.report-prose .btn--ghost-dark:hover { box-shadow: inset 0 0 0 1px #fff; background: rgba(255,255,255,.1); }
.report-prose .btn .ic { width: 18px; height: 18px; }

/* --------------------------------------------------------------------------
   HERO COVER
   -------------------------------------------------------------------------- */
.report-prose .hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  padding: clamp(96px, 12vh, 150px) clamp(20px, 4vw, 48px) clamp(64px, 9vh, 96px);
  color: var(--color-text-default);
  overflow: hidden;
}
.report-prose .hero__img {
  position: absolute; inset: 0;
  background-size: cover; background-position: center;
  transform: scale(1.04);
}
.report-prose .hero__scrim {
  position: absolute; inset: 0;
  background:
    linear-gradient(180deg, rgba(8,16,28,.55) 0%, rgba(8,16,28,.05) 30%, rgba(8,16,28,.12) 55%, rgba(8,16,28,.82) 100%),
    linear-gradient(90deg, rgba(8,16,28,.5) 0%, rgba(8,16,28,0) 55%);
}
.report-prose .hero__inner {
  position: relative; max-width: var(--wide); width: 100%; margin: 0 auto;
  display: grid; grid-template-columns: 1fr 1.05fr; gap: clamp(28px, 4vw, 72px); align-items: center;
}
.report-prose .hero__content { min-width: 0; }
.report-prose .hero__media { display: flex; justify-content: center; align-items: center; min-width: 0; }
.report-prose .hero__media img { width: 100%; max-width: 640px; height: auto; display: block; }
@media (max-width: 900px) {
  .report-prose .hero__inner { grid-template-columns: 1fr; gap: clamp(24px, 5vw, 44px); }
  .report-prose .hero__content { order: 1; display: flex; flex-direction: column; align-items: center; text-align: center; }
  .report-prose .hero__media { order: 2; }
  .report-prose .hero__media img { max-width: 520px; }
  .report-prose .hero h1 { margin-left: auto; margin-right: auto; }
  .report-prose .hero__sub { margin-left: auto; margin-right: auto; }
  .report-prose .hero__meta, .report-prose .hero__actions { justify-content: center; }
  .report-prose .hero__scrollcue { display: none; }
}

/* ---- Hero: light cloud gradient backdrop ---- */
.report-prose .hero__gradient { position: absolute; inset: 0; background: var(--gradient-cloud-blue); }
.report-prose .hero__gradient::after {
  content: ""; position: absolute; inset: 0;
  background:
    radial-gradient(70% 60% at 88% 18%, rgba(80,164,250,.16), transparent 62%),
    radial-gradient(80% 70% at 5% 95%, rgba(255,255,255,.55), transparent 60%);
}

.report-prose .heroart { width: 100%; max-width: 920px; display: flex; align-items: center; justify-content: center; gap: clamp(10px, 2vw, 22px); }
.report-prose .heroart__node {
  position: relative; flex: 0 1 240px; min-width: 0;
  border: 1px solid rgba(255,255,255,.28); border-radius: var(--radius-l);
  background: rgba(255,255,255,.06); backdrop-filter: blur(4px);
  padding: 14px 14px 30px;
}
.report-prose .heroart__chrome { display: flex; gap: 6px; margin-bottom: 12px; }
.report-prose .heroart__chrome i { width: 7px; height: 7px; border-radius: 50%; background: rgba(255,255,255,.4); }
.report-prose .heroart__chips { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.report-prose .heroart__node--from .heroart__chips { grid-template-columns: repeat(2, 1fr); }
.report-prose .heroart__chip { aspect-ratio: 1; border-radius: var(--radius-s); background: rgba(255,255,255,.08); display: grid; place-items: center; }
.report-prose .heroart__chip .domic { width: 22px; height: 22px; filter: brightness(0) invert(1); }
.report-prose .heroart__node--from { opacity: .82; }
.report-prose .heroart__node--from .heroart__chip { opacity: .6; }
.report-prose .heroart__label { position: absolute; left: 14px; bottom: 9px; font-size: 11px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.72); }
.report-prose .heroart__link { position: relative; flex: 0 0 clamp(34px, 6vw, 80px); height: 2px; background: rgba(255,255,255,.25); border-radius: 2px; }
.report-prose .heroart__dot { position: absolute; top: 50%; left: 0; width: 7px; height: 7px; margin-top: -3.5px; border-radius: 50%; background: var(--color-primitive-secondary-500); }
.report-prose .heroart__hub { flex: none; width: 60px; height: 60px; border-radius: 50%; background: #fff; display: grid; place-items: center; box-shadow: 0 8px 24px rgba(0,0,0,.3); }
.report-prose .heroart__hub img { width: 34px; height: 34px; }
@media (prefers-reduced-motion: no-preference) {
  .report-prose .heroart__dot { animation: heroflow 2.4s var(--ease) infinite; }
  .report-prose .heroart__dot--b { animation-delay: 1.2s; }
  @keyframes heroflow { 0% { left: 0; opacity: 0; } 15% { opacity: 1; } 85% { opacity: 1; } 100% { left: 100%; opacity: 0; } }
}
@media (max-width: 700px) {
  .report-prose .heroart { flex-wrap: wrap; gap: 14px; }
  .report-prose .heroart__link { flex-basis: 40px; }
  .report-prose .heroart__node { flex-basis: 42%; }
}
.report-prose .hero__pill {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 13px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase;
  color: var(--color-text-brand);
  padding: 8px 16px;
  border-radius: 9999px;
  background: rgba(255,255,255,.6);
  backdrop-filter: blur(4px);
  border: 1px solid var(--color-border-secondary);
  margin-bottom: 28px;
}
.report-prose .hero__pill .dot { width: 7px; height: 7px; border-radius: 50%; background: var(--color-primitive-secondary-500); }
.report-prose .hero h1 {
  font-family: var(--font-display);
  font-weight: 300;
  font-size: 48px;
  line-height: 1.2;
  letter-spacing: -0.01em;
  max-width: 15ch;
  margin-bottom: 22px;
  text-wrap: balance;
}
.report-prose .hero__sub {
  font-family: var(--font-body);
  font-size: 18px;
  font-weight: 300;
  line-height: 1.4;
  color: var(--color-text-secondary);
  max-width: 46ch;
  margin-bottom: 40px;
}
.report-prose .hero__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 28px; margin-bottom: 44px; }
.report-prose .hero__meta-item { display: flex; align-items: center; gap: 9px; font-size: 15px; color: var(--color-text-tertiary); }
.report-prose .hero__meta-item .ic { width: 18px; height: 18px; stroke: var(--color-icon-brand); }
.report-prose .hero__actions { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }
.report-prose .hero__scrollcue {
  position: absolute; left: 50%; bottom: 26px; transform: translateX(-50%);
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  color: var(--color-text-tertiary); font-size: 12px; letter-spacing: .14em; text-transform: uppercase;
}
.report-prose .hero__scrollcue .mouse {
  width: 24px; height: 38px; border: 1.5px solid var(--color-border-default); border-radius: 12px;
  position: relative;
}
.report-prose .hero__scrollcue .mouse::after {
  content: ""; position: absolute; left: 50%; top: 7px; transform: translateX(-50%);
  width: 3px; height: 7px; border-radius: 2px; background: var(--color-icon-brand);
  animation: scrollwheel 1.8s var(--ease) infinite;
}
@keyframes scrollwheel { 0% { opacity: 0; top: 7px; } 40% { opacity: 1; } 80% { opacity: 0; top: 17px; } 100% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .report-prose .hero__scrollcue .mouse::after { animation: none; } }

/* --------------------------------------------------------------------------
   READING LAYOUT
   -------------------------------------------------------------------------- */
.report-prose .reader {
  max-width: var(--wide);
  margin: 0 auto;
  padding: 0 clamp(20px, 4vw, 48px);
  display: grid;
  grid-template-columns: var(--sidebar-w) minmax(0, 1fr);
  gap: clamp(32px, 5vw, 80px);
  position: relative;
}
.report-prose .reader[data-nav="minimal"] { grid-template-columns: minmax(0, 1fr); max-width: calc(var(--measure) + 96px); }
.report-prose .reader[data-nav="minimal"] .sidebar { display: none; }
.report-prose .reader[data-nav="minimal"] .mobilenav { display: none; }

/* Mobile nav: sticky top bar + contents drawer (replaces side rail on narrow screens) */
.report-prose .mobilenav { display: none; }
@media (max-width: 760px) {
  .report-prose .reader[data-nav="sidebar"], .report-prose .reader[data-nav="paged"] { grid-template-columns: minmax(0, 1fr); }
  .report-prose .reader .sidebar { display: none; }
  .report-prose .mobilenav {
    display: block; grid-column: 1 / -1;
    position: sticky; top: var(--header-h); z-index: 45;
    background: rgba(245, 250, 255, 0.92);
    backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--color-border-secondary);
  }
}
.report-prose .mobilenav__bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 2px; }
.report-prose .mobilenav__toggle { display: inline-flex; align-items: center; gap: 10px; background: none; border: none; font: inherit; color: var(--color-text-default); font-weight: 500; font-size: 15px; }
.report-prose .mobilenav__toggle .ic { width: 18px; height: 18px; flex: none; }
.report-prose .mobilenav__toggle > .ic:first-child { stroke: var(--color-icon-brand); }
.report-prose .mobilenav__current { font-family: var(--font-display); }
.report-prose .mobilenav__chev { stroke: var(--color-icon-secondary); transition: transform .2s var(--ease); }
.report-prose .mobilenav__chev.is-open { transform: rotate(180deg); }
.report-prose .mobilenav__pct { font-size: 13px; color: var(--color-text-tertiary); font-variant-numeric: tabular-nums; flex: none; }
.report-prose .mobilenav__progress { height: 3px; background: var(--color-border-secondary); border-radius: 2px; overflow: hidden; }
.report-prose .mobilenav__progress span { display: block; height: 100%; background: var(--gradient-blue); transition: width .15s linear; }
.report-prose .mobilenav__scrim { position: fixed; inset: 0; background: rgba(14, 24, 40, .3); z-index: 44; animation: fadein .2s var(--ease); }
.report-prose .mobilenav__drawer { position: absolute; left: 0; right: 0; top: 100%; z-index: 46; background: var(--color-bg-default-binary); box-shadow: var(--shadow-1); border-bottom-left-radius: var(--radius-l); border-bottom-right-radius: var(--radius-l); max-height: 70vh; overflow-y: auto; padding: 16px; }
.report-prose .mnav { display: flex; flex-direction: column; gap: 2px; }
.report-prose .mnav__group + .mnav__group { margin-top: 14px; }
.report-prose .mnav__item { display: flex; align-items: center; gap: 11px; width: 100%; text-align: left; background: none; border: none; padding: 11px 12px; border-radius: var(--radius-s); font-size: 15px; line-height: 1.3; color: var(--color-text-secondary); }
.report-prose .mnav__item[data-active="true"] { background: var(--color-primitive-frost-300); color: var(--color-text-brand); font-weight: 500; }
.report-prose .mnav__item[data-active="true"] .toc__num { background: var(--color-bg-brand); color: #fff; }
.report-prose .mnav__item[data-locked="true"] { color: var(--color-text-disabled); }
.report-prose .mnav__item .toc__lock { margin-left: auto; }

/* Sidebar */
.report-prose .sidebar { position: relative; }
.report-prose .sidebar__sticky {
  position: sticky;
  top: calc(var(--header-h) + 28px);
  padding: 32px 0;
}
.report-prose .sidebar__label {
  font-size: 12px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase;
  color: var(--color-text-tertiary); margin-bottom: 18px;
}
.report-prose .sidebar__progress {
  height: 4px; border-radius: 9999px; background: var(--color-border-secondary);
  margin-bottom: 22px; overflow: hidden;
}
.report-prose .sidebar__progress span { display: block; height: 100%; background: var(--gradient-blue); border-radius: 9999px; transition: width .15s linear; }
.report-prose .toc { display: flex; flex-direction: column; gap: 2px; }
.report-prose .toc__group { display: flex; flex-direction: column; gap: 2px; }
.report-prose .toc__group + .toc__group { margin-top: 13px; }
.report-prose .toc__part { font-size: 11px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--color-text-brand); padding: 0 12px 8px; }
.report-prose .toc__item {
  display: flex; align-items: center; gap: 11px;
  padding: 7px 12px; border-radius: var(--radius-s);
  background: none; border: none; text-align: left; width: 100%;
  font-size: 14.5px; font-weight: 400; line-height: 1.35;
  color: var(--color-text-secondary);
  transition: background-color .2s var(--ease), color .2s var(--ease);
  position: relative;
}
.report-prose .toc__item:hover { background: var(--color-bg-default-secondary); color: var(--color-text-default); }
.report-prose .toc__item[data-active="true"] { color: var(--color-text-brand); font-weight: 500; background: var(--color-primitive-frost-300); }
.report-prose .toc__num {
  flex: none; width: 22px; height: 22px; border-radius: 50%;
  display: grid; place-items: center;
  font-size: 11px; font-weight: 600;
  background: var(--color-bg-default-secondary); color: var(--color-text-tertiary);
  transition: background-color .2s var(--ease), color .2s var(--ease);
}
.report-prose .toc__item[data-active="true"] .toc__num { background: var(--color-bg-brand); color: #fff; }
.report-prose .toc__item[data-locked="true"] { color: var(--color-text-disabled); }
.report-prose .toc__item[data-locked="true"]:hover { background: none; cursor: default; }
.report-prose .toc__lock { margin-left: auto; width: 13px; height: 13px; opacity: .6; flex: none; }
.report-prose .sidebar__cta { margin-top: 22px; padding-top: 20px; border-top: 1px solid var(--color-border-secondary); }

/* Article */
.report-prose .article { padding: clamp(40px, 6vh, 88px) 0 40px; min-width: 0; }
/* byline / dateline (E-E-A-T + AI-citation signal) */
.report-prose .byline { display: flex; align-items: center; gap: 16px; max-width: var(--measure); padding-bottom: 28px; margin-bottom: 4px; border-bottom: 1px solid var(--color-border-secondary); }
.report-prose .byline__avatars { display: flex; flex: none; }
.report-prose .byline__avatars img { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; border: 2px solid var(--color-bg-default); box-shadow: var(--shadow-3); }
.report-prose .byline__avatars img + img { margin-left: -12px; }
.report-prose .byline__names { font-size: 15.5px; font-weight: 500; color: var(--color-text-default); line-height: 1.3; }
.report-prose .byline__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 13.5px; color: var(--color-text-tertiary); margin-top: 3px; }
.report-prose .byline__dot { width: 3px; height: 3px; border-radius: 50%; background: var(--color-border-default); }
.report-prose .chapter { scroll-margin-top: calc(var(--header-h) + 24px); padding-bottom: clamp(56px, 9vh, 104px); }
.report-prose .chapter + .chapter { border-top: 1px solid var(--color-border-secondary); padding-top: clamp(48px, 7vh, 88px); }
.report-prose .chapter__inner { max-width: var(--measure); }
.report-prose .chapter__kicker {
  font-size: 13px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase;
  color: var(--color-text-brand); margin-bottom: 16px;
  display: inline-flex; align-items: center;
}
.report-prose .chapter h2 {
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(30px, 4vw, 50px);
  line-height: 1.1;
  letter-spacing: -0.015em;
  color: var(--color-text-default);
  margin-bottom: 28px;
  text-wrap: balance;
}
.report-prose .lead {
  font-size: clamp(20px, 2.2vw, 25px);
  font-weight: 300;
  line-height: 1.5;
  color: var(--color-text-tertiary);
  margin-bottom: 26px;
}
.report-prose .body-p { font-size: 18px; line-height: 1.7; color: var(--color-text-secondary); margin-bottom: 22px; max-width: var(--measure); }
.report-prose .body-p:last-child { margin-bottom: 0; }

/* signature — author trio: 3 columns, photo above name/title */
.report-prose .signature { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px 24px; margin-top: 36px; padding-top: 32px; border-top: 1px solid var(--color-border-secondary); }
.report-prose .signature__person { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 16px; }
.report-prose .signature__avatar { width: 100%; max-width: 144px; aspect-ratio: 372 / 444; object-fit: contain; }
.report-prose .signature__id { display: flex; flex-direction: column; align-items: center; }
.report-prose .signature__person .nm { font-family: var(--font-display); font-weight: 600; font-size: 18px; color: var(--color-text-default); line-height: 1.25; }
.report-prose .signature__person .rl { font-size: 14px; color: var(--color-text-tertiary); margin-top: 5px; max-width: 22ch; line-height: 1.4; }
@media (max-width: 560px) { .report-prose .signature { grid-template-columns: 1fr; gap: 24px; } .report-prose .signature__avatar { max-width: 160px; } }

/* forces grid */
.report-prose .forces { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; margin: 32px 0; max-width: var(--measure); }
.report-prose .force {
  padding: 24px; border-radius: var(--radius-m);
  background: transparent;
  border: 1px solid var(--color-border-default);
}
.report-prose .force h4 { display: flex; align-items: center; gap: 11px; font-family: var(--font-display); font-weight: 500; font-size: 19px; color: var(--color-text-default); margin-bottom: 9px; }
.report-prose .force__ic { flex: none; width: 26px; height: 26px; }
.report-prose .force p { font-size: 15.5px; line-height: 1.55; color: var(--color-text-secondary); }
@media (max-width: 600px) { .report-prose .forces { grid-template-columns: 1fr; } }

/* generic cards (wider than measure) */
.report-prose .cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 18px; margin: 30px 0; }
.report-prose .card-x {
  padding: 28px; border-radius: var(--radius-l);
  background: transparent;
  border: 1px solid var(--color-border-default);
  transition: box-shadow .25s var(--ease), border-color .25s var(--ease), transform .25s var(--ease);
}
.report-prose .card-x:hover { box-shadow: var(--shadow-2); border-color: var(--color-border-default); }
.report-prose .card-x h4 { display: flex; align-items: center; gap: 11px; font-family: var(--font-display); font-weight: 500; font-size: 21px; color: var(--color-text-default); margin-bottom: 11px; line-height: 1.2; }
.report-prose .card-x__ic { flex: none; width: 28px; height: 28px; }
.report-prose .card-x p { font-size: 16px; line-height: 1.6; color: var(--color-text-secondary); }

/* Divided variant: no card chrome, just a vertical rule between items */
.report-prose .cards--divided { grid-template-columns: repeat(3, 1fr); gap: 0; }
.report-prose .cards--divided .card-x {
  border: none; border-radius: 0; background: transparent;
  padding: 2px 34px;
  border-left: 1px solid var(--color-border-secondary);
  transition: none;
}
.report-prose .cards--divided .card-x:first-child { border-left: none; padding-left: 0; }
.report-prose .cards--divided .card-x:last-child { padding-right: 0; }
.report-prose .cards--divided .card-x { padding-left: 28px; padding-right: 28px; }
.report-prose .cards--divided .card-x h4 { flex-direction: column; align-items: flex-start; gap: 11px; font-size: 18px; margin-bottom: 9px; }
.report-prose .cards--divided .card-x__ic { width: 22px; height: 22px; }
.report-prose .cards--divided .card-x p { font-size: 14.5px; line-height: 1.5; }
.report-prose .cards--divided .card-x:hover { box-shadow: none; border-left-color: var(--color-border-secondary); }
@media (max-width: 700px) {
  .report-prose .cards--divided { grid-template-columns: 1fr; }
  .report-prose .cards--divided .card-x { border-left: none; border-top: 1px solid var(--color-border-secondary); padding: 22px 0; }
  .report-prose .cards--divided .card-x:first-child { border-top: none; padding-top: 2px; }
}

/* myth/reality — 2 columns per row, no accent bars */
.report-prose .myths { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 30px 0; }
.report-prose .myth {
  display: flex; flex-direction: column;
  border-radius: var(--radius-l);
  border: 1px solid var(--color-border-default);
  overflow: hidden;
}
.report-prose .myth__part { padding: 20px 22px; }
.report-prose .myth__part--false { background: color-mix(in srgb, var(--color-bg-negative) 50%, var(--color-bg-default)); }
.report-prose .myth__part--true { background: color-mix(in srgb, var(--color-bg-positive) 50%, var(--color-bg-default)); flex: 1; border-top: 1px solid var(--color-border-default); }
.report-prose .myth__head { display: flex; align-items: center; gap: 9px; margin-bottom: 11px; }
.report-prose .myth__badge { flex: none; width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; }
.report-prose .myth__badge--false { background: var(--color-text-negative); }
.report-prose .myth__badge--true { background: var(--color-text-positive); }
.report-prose .myth__badge svg { width: 13px; height: 13px; stroke: #fff; stroke-width: 2.5; }
.report-prose .myth__kind { font-size: 11.5px; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; }
.report-prose .myth__kind--false { color: var(--color-text-negative); }
.report-prose .myth__kind--true { color: var(--color-text-positive); }
.report-prose .myth__claimtext { font-family: var(--font-display); font-weight: 500; font-size: 17px; line-height: 1.4; color: var(--color-text-default); }
.report-prose .myth__realitytext { font-size: 15px; line-height: 1.58; color: var(--color-text-secondary); }
@media (max-width: 620px) { .report-prose .myths { grid-template-columns: 1fr; } }

/* numbered cards (scope categories) */
.report-prose .ncards { display: flex; flex-direction: column; gap: 0; margin: 30px 0; }
.report-prose .ncard { display: flex; gap: 22px; padding: 24px 0; border-bottom: 1px solid var(--color-border-secondary); }
.report-prose .ncard:first-child { border-top: 1px solid var(--color-border-secondary); }
.report-prose .ncard__n { flex: none; font-family: var(--font-display); font-weight: 300; font-size: 40px; line-height: 1; color: var(--color-border-default); width: 56px; }
.report-prose .ncard__b h4 { font-family: var(--font-display); font-weight: 500; font-size: 21px; color: var(--color-text-default); margin-bottom: 8px; }
.report-prose .ncard__b p { font-size: 16px; line-height: 1.6; color: var(--color-text-secondary); }

/* pills */
.report-prose .pills-block { margin: 34px 0; }
.report-prose .pills-block__label { font-size: 13px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--color-text-tertiary); margin-bottom: 16px; }
.report-prose .pills { display: flex; flex-wrap: wrap; gap: 10px; }
.report-prose .pill {
  font-size: 14.5px; font-weight: 400; color: var(--color-text-tertiary);
  padding: 9px 16px; border-radius: 9999px;
  background: var(--color-bg-default-binary);
  position: relative;
  border: 1px solid transparent;
  background-image: linear-gradient(var(--color-bg-default-binary), var(--color-bg-default-binary)), var(--gradient-sea);
  background-origin: border-box;
  background-clip: padding-box, border-box;
}

/* principles */
.report-prose .principles { display: flex; flex-direction: column; gap: 18px; margin: 30px 0; }
.report-prose .principle {
  display: flex; gap: 22px; padding: 30px;
  border-radius: var(--radius-l);
  background: var(--gradient-cloud-blue);
  border: 1px solid var(--color-border-secondary);
}
.report-prose .principle__n {
  flex: none; width: 52px; height: 52px; border-radius: 50%;
  display: grid; place-items: center;
  font-family: var(--font-display); font-weight: 500; font-size: 26px;
  background: var(--color-bg-brand); color: #fff;
}
.report-prose .principle__b h4 { font-family: var(--font-display); font-weight: 500; font-size: 23px; color: var(--color-text-default); margin-bottom: 10px; }
.report-prose .principle__b p { font-size: 16.5px; line-height: 1.62; color: var(--color-text-secondary); }

/* steps timeline */
.report-prose .steps { margin: 32px 0; position: relative; }
.report-prose .step { display: flex; gap: 24px; padding-bottom: 34px; position: relative; }
.report-prose .step:last-child { padding-bottom: 0; }
.report-prose .step__rail { flex: none; display: flex; flex-direction: column; align-items: center; }
.report-prose .step__num {
  width: 48px; height: 48px; border-radius: 50%; flex: none;
  display: grid; place-items: center;
  font-family: var(--font-display); font-weight: 500; font-size: 18px;
  background: var(--color-bg-default-binary); color: var(--color-text-brand);
  border: 1.5px solid var(--color-border-brand);
  z-index: 1;
}
.report-prose .step__line { width: 2px; flex: 1; background: var(--color-border-secondary); margin: 6px 0; }
.report-prose .step:last-child .step__line { display: none; }
.report-prose .step__b { padding-top: 9px; }
.report-prose .step__b .lbl { font-size: 12px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--color-text-brand-secondary); }
.report-prose .step__b h4 { font-family: var(--font-display); font-weight: 500; font-size: 22px; color: var(--color-text-default); margin: 4px 0 9px; }
.report-prose .step__b p { font-size: 16.5px; line-height: 1.62; color: var(--color-text-secondary); }

/* considerations */
.report-prose .considerations { display: flex; flex-direction: column; gap: 18px; margin: 30px 0; }
.report-prose .consideration {
  padding: 28px; border-radius: var(--radius-l);
  background: var(--color-bg-default-binary);
  border: 1px solid var(--color-border-secondary);
}
.report-prose .consideration h4 { font-family: var(--font-display); font-weight: 500; font-size: 22px; color: var(--color-text-default); }
.report-prose .consideration__head { display: flex; align-items: center; gap: 13px; margin-bottom: 12px; }
.report-prose .consideration__ic { width: 28px; height: 28px; flex: none; display: grid; place-items: center; }
.report-prose .consideration__ic .domic { width: 28px; height: 28px; }
.report-prose .consideration > p { font-size: 16px; line-height: 1.6; color: var(--color-text-secondary); margin-bottom: 18px; }
/* handbooks */
.report-prose .handbooks { margin: 32px 0; }
.report-prose .handbooks__label { font-size: 13px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--color-text-tertiary); margin-bottom: 16px; }
.report-prose .handbooks__list { display: flex; flex-direction: column; gap: 12px; }
.report-prose .handbook { display: grid; grid-template-columns: minmax(180px, 230px) 1fr; gap: 18px; align-items: center; padding: 18px 22px; border-radius: var(--radius-m); background: var(--color-bg-default-binary); border: 1px solid var(--color-border-secondary); transition: box-shadow .2s var(--ease), border-color .2s var(--ease); }
.report-prose .handbook:hover { box-shadow: var(--shadow-3); border-color: var(--color-border-brand-secondary); }
.report-prose .handbook__name { display: flex; align-items: center; gap: 10px; font-family: var(--font-display); font-weight: 600; font-size: 15.5px; color: var(--color-text-brand); line-height: 1.25; }
.report-prose .handbook__name .ic { width: 20px; height: 20px; flex: none; stroke: var(--color-icon-brand); }
.report-prose .handbook__body { font-size: 15px; line-height: 1.55; color: var(--color-text-secondary); }
@media (max-width: 600px) { .report-prose .handbook { grid-template-columns: 1fr; gap: 8px; } }
.report-prose .checks { display: flex; flex-direction: column; gap: 10px; padding-top: 16px; border-top: 1px solid var(--color-border-secondary); }
.report-prose .checks li { display: flex; gap: 11px; align-items: flex-start; font-size: 15px; color: var(--color-text-secondary); }
.report-prose .checks .ic { flex: none; width: 19px; height: 19px; stroke: var(--color-icon-positive); margin-top: 1px; }

/* split */
.report-prose .split { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 30px 0; }
.report-prose .split__col { padding: 32px; border-radius: var(--radius-l); display: flex; flex-direction: column; }
.report-prose .split__col--a { background: var(--gradient-dark); color: #fff; }
.report-prose .split__col--b { background: var(--gradient-blue); color: #fff; }
.report-prose .split__kicker { font-family: var(--font-body); font-size: 12px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: rgba(255,255,255,.65); margin-bottom: 16px; }
.report-prose .split__col--a .split__kicker { color: var(--color-primitive-secondary-500); }
.report-prose .split__big { font-family: var(--font-display); font-weight: 300; font-size: clamp(40px, 4.6vw, 58px); line-height: 1; letter-spacing: -0.02em; color: #fff; }
.report-prose .split__unit { font-size: 13.5px; font-weight: 500; color: rgba(255,255,255,.82); margin: 11px 0 16px; }
.report-prose .split__col p { font-size: 15px; line-height: 1.6; color: rgba(255,255,255,.8); margin: 0; }
@media (max-width: 640px) { .report-prose .split { grid-template-columns: 1fr; } }

/* roster */
.report-prose .roster { margin: 30px 0; padding: 30px; border-radius: var(--radius-l); background: var(--color-bg-default-secondary); }
.report-prose .roster__label { font-size: 13px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--color-text-tertiary); margin-bottom: 16px; }
.report-prose .roster__chips { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 18px; }
.report-prose .roster__chip {
  font-size: 14.5px; font-weight: 400; padding: 9px 15px; border-radius: var(--radius-s);
  background: var(--color-bg-default-binary); color: var(--color-text-secondary);
  border: 1px solid var(--color-border-secondary);
  display: flex; align-items: center; gap: 8px;
}
.report-prose .roster__chip--lead { background: var(--color-bg-brand); color: #fff; border-color: transparent; font-weight: 500; }
.report-prose .roster__note { font-size: 16px; line-height: 1.6; color: var(--color-text-secondary); }

/* checklist */
.report-prose .checklist { margin: 30px 0; }
.report-prose .checklist__label { font-size: 13px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--color-text-tertiary); margin-bottom: 18px; }
.report-prose .checklist__items { display: flex; flex-direction: column; gap: 14px; }
.report-prose .checklist__items li {
  display: flex; gap: 15px; align-items: flex-start;
  padding: 18px 22px; border-radius: var(--radius-m);
  background: var(--color-bg-default-binary); border: 1px solid var(--color-border-secondary);
  font-size: 16px; line-height: 1.55; color: var(--color-text-secondary);
}
.report-prose .checklist__items .dot { flex: none; width: 26px; height: 26px; border-radius: 50%; background: var(--color-primitive-frost-300); display: grid; place-items: center; }
.report-prose .checklist__items .dot svg { width: 15px; height: 15px; stroke: var(--color-icon-brand); }

/* 2-up grid variant of the checklist (cards) */
.report-prose .checklist--grid .checklist__items { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.report-prose .checklist--grid .checklist__items li { height: 100%; }
@media (max-width: 620px) { .report-prose .checklist--grid .checklist__items { grid-template-columns: 1fr; } }

/* 3-up row variant of the checklist */
.report-prose .checklist--3col { margin-top: 44px; }
.report-prose .checklist--3col .checklist__items { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px 18px; }
.report-prose .checklist--3col .checklist__items li { align-items: flex-start; }
@media (max-width: 760px) { .report-prose .checklist--3col .checklist__items { grid-template-columns: 1fr; } }

/* inline CTA link */
.report-prose .inline-cta { margin-top: 30px; }

/* stories */
.report-prose .stories { display: flex; flex-direction: column; gap: 16px; margin: 30px 0; }
.report-prose .story {
  display: flex; flex-direction: row; align-items: stretch; gap: clamp(28px, 4vw, 52px);
  padding: clamp(26px, 3vw, 34px); border-radius: var(--radius-l);
  background: transparent; border: 1px solid var(--color-border-default);
  transition: box-shadow .25s var(--ease), transform .25s var(--ease);
}
.report-prose .story:hover { box-shadow: var(--shadow-2); transform: translateY(-2px); }
.report-prose .story__main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.report-prose .story__logo {
  height: 39px; overflow: hidden; margin-bottom: 18px;
  display: inline-flex; align-self: flex-start; align-items: center;
}
.report-prose .story__logo img { height: 100%; width: auto; display: block; }
.report-prose .story__headline { font-family: var(--font-display); font-weight: 500; font-size: 18px; line-height: 1.3; color: var(--color-text-default); margin-bottom: 14px; }
.report-prose .story__quote { font-family: var(--font-display); font-size: clamp(21px, 1.8vw, 27px); line-height: 1.45; color: var(--color-text-default); font-weight: 300; letter-spacing: -0.01em; margin-bottom: 26px; flex: 1; text-wrap: pretty; }
.report-prose .story__quote::before { content: "\201C"; font-family: var(--font-display); font-size: 64px; line-height: 0; color: var(--color-border-brand-secondary); vertical-align: -24px; margin-right: 4px; }
.report-prose .story__person { display: flex; align-items: center; gap: 15px; }
.report-prose .story__avatar-wrap { width: 58px; height: 58px; border-radius: 50%; overflow: hidden; flex: none; box-shadow: var(--shadow-3); }
.report-prose .story__avatar { width: 52px; height: 52px; border-radius: 50%; object-fit: cover; flex: none; box-shadow: var(--shadow-3); }
.report-prose .story__id { display: flex; flex-direction: column; }
.report-prose .story__person .nm { font-family: var(--font-display); font-weight: 600; font-size: 16.5px; color: var(--color-text-brand); line-height: 1.2; }
.report-prose .story__person .rl { font-size: 13px; color: var(--color-text-tertiary); margin-top: 2px; }
.report-prose .story__stats {
  flex: none; width: clamp(160px, 18vw, 200px);
  display: flex; flex-direction: column; gap: 22px;
  padding-left: clamp(28px, 4vw, 52px);
  border-left: 1px solid var(--color-border-secondary);
  justify-content: center;
}
.report-prose .story__stat .v { font-family: var(--font-display); font-weight: 500; font-size: 27px; color: var(--color-text-default); line-height: 1; letter-spacing: -0.01em; }
.report-prose .story__stat .l { font-size: 12.5px; color: var(--color-text-tertiary); margin-top: 7px; line-height: 1.3; }
@media (max-width: 720px) {
  .report-prose .story { flex-direction: column; gap: 24px; }
  .report-prose .story__stats {
    width: auto; flex-direction: row; flex-wrap: wrap; gap: 16px 24px;
    padding-left: 0; padding-top: 22px;
    border-left: none; border-top: 1px solid var(--color-border-secondary);
  }
  .report-prose .story__stat { flex: 1; min-width: 110px; }
}

/* customer logo strip */
.report-prose .logostrip { border-bottom: 1px solid var(--color-border-secondary); background: var(--color-bg-default); }
.report-prose .logostrip__inner { max-width: var(--wide); margin: 0 auto; padding: var(--spacing-11xl) clamp(20px, 4vw, 48px); }
.report-prose .logostrip__label { text-align: center; font-family: var(--font-body); font-size: 16px; font-weight: 300; line-height: 1.4; color: var(--color-text-secondary); margin-bottom: var(--spacing-6xl); }
.report-prose .logostrip__row { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 14px clamp(32px, 5.2vw, 76px); }
.report-prose .logostrip__logo {
  height: 32px; display: flex; align-items: center; justify-content: center;
  filter: grayscale(1); opacity: .58;
  transition: filter .3s var(--ease), opacity .3s var(--ease), transform .3s var(--ease);
}
.report-prose .logostrip__logo img { height: 100%; width: auto; max-width: 156px; object-fit: contain; display: block; }
.report-prose .logostrip__logo:hover { filter: none; opacity: 1; transform: translateY(-2px); }
@media (max-width: 560px) { .report-prose .logostrip__logo { height: 26px; } }

/* --------------------------------------------------------------------------
   DIVIDER CHAPTERS (full-bleed image bands)
   -------------------------------------------------------------------------- */
.report-prose .band {
  position: relative;
  width: 100%;
  margin: 4px 0;
  padding: clamp(56px, 9vh, 104px) clamp(28px, 5vw, 60px);
  border-radius: var(--radius-4xl);
  color: #fff;
  overflow: hidden;
  border: none !important;
  scroll-margin-top: calc(var(--header-h) + 24px);
}
.report-prose .chapter.band { padding: clamp(56px, 9vh, 104px) clamp(28px, 5vw, 60px); border-top: none; }
.report-prose .band__img { position: absolute; inset: 0; background-size: cover; background-position: center; }
.report-prose .band__scrim { position: absolute; inset: 0; background: linear-gradient(120deg, rgba(8,16,28,.9) 0%, rgba(8,16,28,.72) 45%, rgba(14,38,61,.55) 100%); }
/* illustration divider: brand gradient + visible line-art art panel */
.report-prose .band--illus { box-shadow: inset 0 0 0 1px rgba(255,255,255,.06); }
.report-prose .band__inner--split { display: grid; grid-template-columns: 1.15fr 0.85fr; gap: clamp(28px, 5vw, 64px); align-items: center; }
.report-prose .band__text { min-width: 0; }
.report-prose .band--illus .stats { grid-template-columns: repeat(2, 1fr); max-width: 460px; gap: 18px 24px; margin-bottom: 0; }
.report-prose .band--illus .body-p, .report-prose .band--illus .lead { max-width: 38ch; }
.report-prose .band__art { display: flex; align-items: center; justify-content: center; }
@media (max-width: 820px) {
  .report-prose .band__inner--split { grid-template-columns: 1fr; gap: 36px; }
  .report-prose .band__art { order: -1; }
}

/* BandArt — central icon + orbiting chips on dashed rings */
.report-prose .bandart { position: relative; width: min(100%, 320px); aspect-ratio: 1; }
.report-prose .bandart__ring { position: absolute; inset: 8%; border: 1.5px dashed rgba(255,255,255,.22); border-radius: 50%; }
.report-prose .bandart__ring--2 { inset: 24%; border-style: solid; border-color: rgba(255,255,255,.12); }
.report-prose .bandart__core {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: 33%; aspect-ratio: 1; border-radius: 50%;
  background: rgba(255,255,255,.97); display: grid; place-items: center;
  box-shadow: 0 16px 40px rgba(0,0,0,.34);
}
.report-prose .bandart__core .domic { width: 52%; height: 52%; }
.report-prose .bandart__core img { width: 56%; height: 56%; }
.report-prose .bandart__chip {
  position: absolute; width: 21%; aspect-ratio: 1; border-radius: var(--radius-m);
  background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.28);
  backdrop-filter: blur(4px); display: grid; place-items: center;
}
.report-prose .bandart__chip .domic { width: 54%; height: 54%; filter: brightness(0) invert(1); }
.report-prose .bandart__chip--0 { top: -2%; left: 50%; transform: translateX(-50%); }
.report-prose .bandart__chip--1 { bottom: 12%; left: -2%; }
.report-prose .bandart__chip--2 { bottom: 12%; right: -2%; }
@media (prefers-reduced-motion: no-preference) {
  .report-prose .bandart__ring { animation: bandspin 26s linear infinite; }
  .report-prose .bandart__ring--2 { animation: bandspin 20s linear infinite reverse; }
  @keyframes bandspin { to { transform: rotate(360deg); } }
}
.report-prose .band__inner { position: relative; max-width: var(--wide); margin: 0 auto; }
.report-prose .band .chapter__kicker { color: var(--color-primitive-secondary-500); }
/* H2 + Body Large per AMPECO type scale (ds/typography.css) */
.report-prose .band h2 {
  font-family: var(--font-display); font-weight: 400;
  font-size: 40px; line-height: 120%;
  color: #fff; margin-bottom: 28px; max-width: 18ch;
}
.report-prose .band .lead {
  font-family: var(--font-body); font-weight: 300;
  font-size: 18px; line-height: 140%;
  color: rgba(255,255,255,.9); max-width: 46ch;
}
.report-prose .band .body-p { font-size: 16px; color: rgba(255,255,255,.74); }
@media (max-width: 768px) {
  .report-prose .band h2 { font-size: 30px; }
  .report-prose .band .lead { font-size: 16px; }
}

/* stats row */
.report-prose .stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin: 8px 0 40px; max-width: 920px; }
.report-prose .stat .v { font-family: var(--font-display); font-weight: 300; font-size: clamp(36px, 5vw, 60px); line-height: 1; color: #fff; letter-spacing: -0.02em; }
.report-prose .stat .l { font-size: 14px; color: rgba(255,255,255,.7); margin-top: 10px; line-height: 1.35; }
@media (max-width: 720px) { .report-prose .stats { grid-template-columns: repeat(2, 1fr); } }

/* final cta */
.report-prose .final-cta { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 38px; }

/* --------------------------------------------------------------------------
   GATE
   -------------------------------------------------------------------------- */
.report-prose .gatewrap { position: relative; }
.report-prose .gate-teaser { position: relative; overflow: hidden; }
.report-prose .gate-teaser[data-clip="true"] { max-height: 340px; }
.report-prose .gate-teaser[data-clip="true"]::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 100%;
  background: linear-gradient(180deg, rgba(245,250,255,0) 0%, rgba(245,250,255,.7) 55%, var(--color-bg-default) 95%);
  pointer-events: none;
}

.report-prose .gate {
  position: relative;
  z-index: 5;
  margin-top: -120px;
  padding-bottom: 40px;
}
.report-prose .gate__card {
  max-width: 560px;
  margin: 0 auto;
  background: var(--color-bg-default-binary);
  border: 1px solid var(--color-border-secondary);
  border-radius: var(--radius-4xl);
  box-shadow: var(--shadow-1);
  padding: clamp(32px, 5vw, 52px);
  text-align: center;
}
.report-prose .gate--inline .gate__card { text-align: left; }
.report-prose .gate__lockicon {
  width: 56px; height: 56px; border-radius: 50%;
  display: grid; place-items: center; margin: 0 auto 22px;
  background: var(--gradient-cloud-blue);
}
.report-prose .gate--inline .gate__lockicon { margin-left: 0; }
.report-prose .gate__lockicon svg { width: 26px; height: 26px; stroke: var(--color-icon-brand); }
/* gate success state */
.report-prose .gate__okicon { width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; margin: 0 auto 22px; background: var(--color-bg-positive); }
.report-prose .gate--inline .gate__okicon { margin-left: 0; }
.report-prose .gate__okicon svg { width: 30px; height: 30px; stroke: var(--color-icon-positive); }
.report-prose .gate__card--success { animation: gateok .3s var(--ease); }
@keyframes gateok { from { transform: translateY(10px); } to { transform: none; } }
.report-prose .gate__next { display: inline-flex; align-items: center; justify-content: center; gap: 7px; margin-top: 16px; width: 100%; font-size: 14.5px; font-weight: 500; color: var(--color-text-brand); }
.report-prose .gate__next svg { width: 16px; height: 16px; }
.report-prose .gate__next:hover { color: var(--color-text-brand-secondary); }
.report-prose .gate--inline .gate__next { justify-content: flex-start; }
.report-prose .gate__eyebrow { font-size: 13px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--color-text-brand); margin-bottom: 14px; }
.report-prose .gate__title { font-family: var(--font-display); font-weight: 400; font-size: clamp(26px, 3.4vw, 36px); line-height: 1.12; letter-spacing: -0.01em; color: var(--color-text-default); margin-bottom: 14px; text-wrap: balance; }
.report-prose .gate__desc { font-size: 17px; line-height: 1.55; color: var(--color-text-tertiary); margin-bottom: 28px; }
.report-prose .gate__form { display: flex; flex-direction: column; gap: 14px; text-align: left; }
.report-prose .field { display: flex; flex-direction: column; gap: 7px; }
.report-prose .field label { font-size: 13.5px; font-weight: 500; color: var(--color-text-secondary); }
.report-prose .field input {
  font-family: inherit; font-size: 16px; font-weight: 300;
  padding: 13px 15px; border-radius: var(--radius-s);
  border: none; box-shadow: inset 0 0 0 1px var(--color-border-default);
  background: var(--color-bg-default); color: var(--color-text-default);
  transition: box-shadow .2s var(--ease);
  width: 100%;
}
.report-prose .field input::placeholder { color: var(--color-text-disabled); }
.report-prose .field input:focus { outline: none; box-shadow: inset 0 0 0 2px var(--color-border-brand); }
.report-prose .field input[aria-invalid="true"] { box-shadow: inset 0 0 0 2px var(--color-border-negative); }
.report-prose .field .err { font-size: 12.5px; color: var(--color-text-negative); }
.report-prose .gate__row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 480px) { .report-prose .gate__row2 { grid-template-columns: 1fr; } }
.report-prose .gate__submit { margin-top: 8px; width: 100%; }
.report-prose .gate__fine { font-size: 12.5px; line-height: 1.5; color: var(--color-text-tertiary); margin-top: 16px; }
.report-prose .gate__fine a { color: var(--color-text-brand); }

/* gate style variants */
.report-prose .gate.gate--card { margin-top: -28px; }
.report-prose .gate--card .gate__card { border-radius: var(--radius-xxl); box-shadow: var(--shadow-1), 0 0 0 4px var(--color-primitive-frost-300); }
.report-prose .gate.gate--inline { margin-top: -36px; }
.report-prose .gate--inline .gate__card { margin-left: 0; margin-right: auto; }
.report-prose .gate--inline + *, .report-prose .gate--inline { }

/* locked content fully hidden until unlock */
.report-prose .locked-rest { display: none; }

/* --------------------------------------------------------------------------
   PAGED nav mode
   -------------------------------------------------------------------------- */
.report-prose .pager { display: flex; justify-content: space-between; gap: 16px; margin-top: 20px; padding: 28px 0 10px; border-top: 1px solid var(--color-border-secondary); max-width: var(--measure); }
.report-prose .pager .btn--ghost { flex: 1; max-width: 280px; }
.report-prose .pager .pager__next { margin-left: auto; }
.report-prose .reader[data-nav="paged"] .chapter.is-hidden { display: none; }
.report-prose .reader[data-nav="paged"] .chapter { border-top: none !important; padding-top: clamp(40px, 6vh, 80px); }

/* --------------------------------------------------------------------------
   ACTION DOCK + MODALS
   -------------------------------------------------------------------------- */
.report-prose .dock {
  position: fixed; right: clamp(16px, 3vw, 32px); bottom: clamp(16px, 3vw, 32px);
  z-index: 55;
  display: flex; flex-direction: column; gap: 10px;
  align-items: flex-end;
}
.report-prose .dock__btn {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 13px 20px; border-radius: 9999px;
  background: var(--color-bg-default-binary);
  border: 1px solid var(--color-border-secondary);
  box-shadow: var(--shadow-2);
  font-size: 14.5px; font-weight: 500; color: var(--color-text-default);
  transition: box-shadow .2s var(--ease), transform .15s var(--ease), background-color .2s var(--ease);
}
.report-prose .dock__btn:hover { box-shadow: var(--shadow-1); transform: translateY(-1px); }
.report-prose .dock__btn .ic { width: 19px; height: 19px; stroke: var(--color-icon-brand); flex: none; }
.report-prose .dock__btn--primary { background: var(--color-bg-brand); color: #fff; border-color: transparent; }
.report-prose .dock__btn--primary .ic { stroke: #fff; }
.report-prose .dock__btn--primary:hover { background: var(--color-bg-brand-hover); }
@media (max-width: 640px) { .report-prose .dock__btn span { display: none; } .report-prose .dock__btn { padding: 14px; } }

.report-prose .modal-overlay {
  position: fixed; inset: 0; z-index: 80;
  background: rgba(14, 24, 40, .42);
  backdrop-filter: blur(3px);
  display: grid; place-items: center;
  padding: 24px;
  animation: fadein .2s var(--ease);
}
@keyframes fadein { from { opacity: 0; } to { opacity: 1; } }
.report-prose .modal {
  background: var(--color-bg-default-binary);
  border-radius: var(--radius-xxl);
  box-shadow: var(--shadow-1);
  width: 100%; max-width: 520px;
  padding: clamp(28px, 4vw, 40px);
  position: relative;
  animation: pop .24s var(--ease);
  max-height: 90vh; overflow-y: auto;
}
@keyframes pop { from { opacity: 0; transform: translateY(12px) scale(.98); } to { opacity: 1; transform: none; } }
.report-prose .modal__close {
  position: absolute; top: 18px; right: 18px;
  width: 36px; height: 36px; border-radius: 50%;
  background: var(--color-bg-default-secondary); border: none;
  display: grid; place-items: center;
  transition: background-color .2s var(--ease);
}
.report-prose .modal__close:hover { background: var(--color-bg-default-tertiary); }
.report-prose .modal__close svg { width: 16px; height: 16px; stroke: var(--color-icon-secondary); }
.report-prose .modal__eyebrow { font-size: 13px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--color-text-brand); margin-bottom: 10px; }
.report-prose .modal h3 { font-family: var(--font-display); font-weight: 400; font-size: 27px; line-height: 1.15; color: var(--color-text-default); margin-bottom: 10px; }
.report-prose .modal__desc { font-size: 16px; line-height: 1.55; color: var(--color-text-tertiary); margin-bottom: 24px; }
.report-prose .modal__form { display: flex; flex-direction: column; gap: 14px; }
.report-prose .field textarea {
  font-family: inherit; font-size: 16px; font-weight: 300; line-height: 1.5;
  padding: 13px 15px; border-radius: var(--radius-s); resize: vertical; min-height: 92px;
  border: none; box-shadow: inset 0 0 0 1px var(--color-border-default);
  background: var(--color-bg-default); color: var(--color-text-default); width: 100%;
}
.report-prose .field textarea:focus { outline: none; box-shadow: inset 0 0 0 2px var(--color-border-brand); }

/* copy-link row */
.report-prose .copyrow { display: flex; gap: 10px; align-items: stretch; margin-top: 8px; }
.report-prose .copyrow input { flex: 1; font-size: 14.5px; color: var(--color-text-tertiary); padding: 12px 15px; border-radius: var(--radius-s); border: none; box-shadow: inset 0 0 0 1px var(--color-border-default); background: var(--color-bg-default); }
.report-prose .share-alts { display: flex; gap: 10px; margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--color-border-secondary); }
.report-prose .share-alt {
  flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 9px;
  padding: 13px; border-radius: var(--radius-s);
  background: var(--color-bg-default-secondary); border: 1px solid transparent;
  font-size: 14.5px; font-weight: 500; color: var(--color-text-default);
  transition: background-color .2s var(--ease);
}
.report-prose .share-alt:hover { background: var(--color-bg-default-tertiary); }
.report-prose .share-alt svg { width: 18px; height: 18px; }

/* success state */
.report-prose .modal__success { text-align: center; padding: 12px 0 4px; }
.report-prose .modal__success .ok { width: 60px; height: 60px; border-radius: 50%; background: var(--color-bg-positive); display: grid; place-items: center; margin: 0 auto 20px; }
.report-prose .modal__success .ok svg { width: 30px; height: 30px; stroke: var(--color-icon-positive); }
.report-prose .toast {
  position: fixed; left: 50%; bottom: 32px; transform: translateX(-50%) translateY(20px);
  background: var(--color-primitive-raven-500); color: #fff;
  padding: 14px 22px; border-radius: 9999px; font-size: 14.5px; font-weight: 500;
  box-shadow: var(--shadow-1); z-index: 90; opacity: 0;
  display: flex; align-items: center; gap: 10px;
  transition: opacity .25s var(--ease), transform .25s var(--ease); pointer-events: none;
}
.report-prose .toast[data-show="true"] { opacity: 1; transform: translateX(-50%) translateY(0); }
.report-prose .toast svg { width: 17px; height: 17px; stroke: var(--color-primitive-green-300); }

/* --------------------------------------------------------------------------
   WHERE TO NEXT (migration resources closing zone)
   -------------------------------------------------------------------------- */
.report-prose .wnext { background: var(--color-bg-default-secondary); border-top: 1px solid var(--color-border-secondary); }
.report-prose .wnext__inner { max-width: var(--wide); margin: 0 auto; padding: clamp(56px, 8vh, 96px) clamp(20px, 4vw, 48px); }
.report-prose .wnext__head { max-width: 640px; margin-bottom: 36px; }
.report-prose .wnext__eyebrow { font-size: 13px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--color-text-brand); margin-bottom: 14px; display: inline-flex; align-items: center; gap: 10px; }
.report-prose .wnext__eyebrow::before { content: ""; width: 28px; height: 2px; background: var(--color-bg-brand); border-radius: 2px; }
.report-prose .wnext__title { font-family: var(--font-display); font-weight: 300; font-size: clamp(28px, 3.6vw, 44px); line-height: 1.1; letter-spacing: -0.015em; color: var(--color-text-default); margin-bottom: 14px; }
.report-prose .wnext__sub { font-size: 18px; line-height: 1.5; color: var(--color-text-tertiary); }

.report-prose .wnext__feature {
  display: flex; gap: clamp(20px, 3vw, 36px); align-items: center;
  padding: clamp(26px, 3vw, 40px); margin-bottom: 18px;
  border-radius: var(--radius-xxl); text-decoration: none;
  background: var(--gradient-ocean-deep); color: #fff;
  position: relative; overflow: hidden;
  transition: transform .25s var(--ease), box-shadow .25s var(--ease);
}
.report-prose .wnext__feature:hover { transform: translateY(-2px); box-shadow: var(--shadow-1); }
.report-prose .wnext__feature-ic { flex: none; width: 76px; height: 76px; display: grid; place-items: center; }
.report-prose .wnext__feature-ic .domic { width: 52px; height: 52px; filter: brightness(0) invert(1); }
.report-prose .wnext__feature-body { min-width: 0; }
.report-prose .wnext__feature-body h3 { font-family: var(--font-display); font-weight: 500; font-size: clamp(22px, 2.6vw, 30px); line-height: 1.15; margin: 6px 0 10px; color: #fff; }
.report-prose .wnext__feature-body p { font-size: 16.5px; line-height: 1.55; color: rgba(255,255,255,.86); max-width: 62ch; margin-bottom: 16px; }

.report-prose .wnext__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.report-prose .wnext__card {
  display: flex; flex-direction: column; align-items: flex-start;
  padding: 28px; border-radius: var(--radius-l); text-decoration: none;
  background: var(--color-bg-default-binary); border: 1px solid var(--color-border-secondary);
  transition: transform .25s var(--ease), box-shadow .25s var(--ease), border-color .25s var(--ease);
}
.report-prose .wnext__card:hover { transform: translateY(-2px); box-shadow: var(--shadow-2); border-color: var(--color-border-brand-secondary); }
.report-prose .wnext__card-ic { width: 48px; height: 48px; display: grid; place-items: center; margin-bottom: 18px; }
.report-prose .wnext__card-ic .domic { width: 34px; height: 34px; }
.report-prose .wnext__card-eyebrow { font-size: 12px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--color-text-tertiary); margin-bottom: 8px; }
.report-prose .wnext__feature .wnext__card-eyebrow { color: var(--color-primitive-secondary-500); }
.report-prose .wnext__card h4 { font-family: var(--font-display); font-weight: 500; font-size: 20px; line-height: 1.2; color: var(--color-text-default); margin-bottom: 9px; }
.report-prose .wnext__card p { font-size: 15px; line-height: 1.55; color: var(--color-text-secondary); margin-bottom: 18px; flex: 1; }
.report-prose .wnext__cta { display: inline-flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 600; color: #fff; }
.report-prose .wnext__cta--sm { color: var(--color-text-brand); }
.report-prose .wnext__cta svg { width: 17px; height: 17px; transition: transform .2s var(--ease); }
.report-prose .wnext__feature:hover .wnext__cta svg, .report-prose .wnext__card:hover .wnext__cta svg { transform: translateX(3px); }
@media (max-width: 820px) {
  .report-prose .wnext__grid { grid-template-columns: 1fr; }
  .report-prose .wnext__feature { flex-direction: column; align-items: flex-start; }
}
.report-prose .site-footer {
  margin-top: 0;
  background: var(--gradient-dark);
  color: #fff;
  padding: clamp(48px, 7vh, 80px) clamp(20px, 4vw, 48px) 40px;
}
.report-prose .site-footer__inner { max-width: var(--wide); margin: 0 auto; display: grid; grid-template-columns: 1.4fr 1fr; gap: 40px; align-items: start; }
.report-prose .site-footer__brand img { height: 28px; filter: brightness(0) invert(1); margin-bottom: 18px; }
.report-prose .site-footer__brand p { font-size: 15.5px; line-height: 1.6; color: rgba(255,255,255,.7); max-width: 38ch; }
.report-prose .site-footer__cta { text-align: left; }
.report-prose .site-footer__cta h4 { font-family: var(--font-display); font-weight: 400; font-size: 24px; margin-bottom: 16px; color: #fff; }
.report-prose .site-footer__links { display: flex; gap: 12px; flex-wrap: wrap; }
.report-prose .site-footer__bottom { max-width: var(--wide); margin: 36px auto 0; padding-top: 24px; border-top: 1px solid rgba(255,255,255,.14); display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px; font-size: 13.5px; color: rgba(255,255,255,.55); }
@media (max-width: 720px) { .report-prose .site-footer__inner { grid-template-columns: 1fr; } }

/* ===== Migrate map ====================================================== */
.report-prose .migrate-map { margin: 34px 0; }
.report-prose .migrate-map__label { font-size: 13px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--color-text-tertiary); margin-bottom: 18px; }
.report-prose .migrate-map__grid { display: grid; grid-template-columns: 1fr 1.5fr 1fr; gap: 14px; align-items: start; }
.report-prose .migrate-map__side { display: flex; flex-direction: column; gap: 14px; }
.report-prose .mtile {
  display: flex; flex-direction: column; gap: 10px;
  padding: 16px; border-radius: var(--radius-m);
  background: var(--color-bg-default-binary); border: 1px solid var(--color-border-secondary);
  transition: box-shadow .2s var(--ease), transform .2s var(--ease), border-color .2s var(--ease);
}
.report-prose .mtile:hover { box-shadow: var(--shadow-3); border-color: var(--color-border-brand-secondary); transform: translateY(-1px); }
.report-prose .mtile span { font-size: 14px; font-weight: 500; color: var(--color-text-default); line-height: 1.3; }
.report-prose .mtile .domic { width: 26px; height: 26px; }
.report-prose .migrate-core { border-radius: var(--radius-l); background: var(--gradient-cloud-blue); border: 1px solid var(--color-border-brand-secondary); overflow: hidden; }
.report-prose .migrate-core__head { display: flex; align-items: center; gap: 10px; padding: 16px 18px; background: var(--color-bg-brand); }
.report-prose .migrate-core__head span { font-size: 14.5px; font-weight: 600; color: #fff; }
.report-prose .migrate-core__head .domic { width: 22px; height: 22px; filter: brightness(0) invert(1); }
.report-prose .migrate-core__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 14px; }
.report-prose .mtile--core { padding: 13px; background: rgba(255,255,255,.75); }
.report-prose .mtile--core .domic { width: 22px; height: 22px; }
.report-prose .mtile--core span { font-size: 13px; }
@media (max-width: 640px) {
  .report-prose .migrate-map__grid { grid-template-columns: 1fr 1fr; }
  .report-prose .migrate-core { grid-column: 1 / -1; order: -1; }
}

/* ===== Approaches comparison ============================================ */
.report-prose .approaches { margin: 32px 0; }
.report-prose .approaches__label { font-size: 13px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--color-text-tertiary); margin-bottom: 16px; }
.report-prose .approaches__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.report-prose .approach { border-radius: var(--radius-l); border: 1px solid var(--color-border-secondary); overflow: hidden; background: var(--color-bg-default-binary); }
.report-prose .approach__head { padding: 15px 22px; font-family: var(--font-display); font-weight: 600; font-size: 17px; color: #fff; }
.report-prose .approach--blue .approach__head { background: var(--color-bg-brand); }
.report-prose .approach--green .approach__head { background: var(--color-primitive-green-500); }
.report-prose .approach__body { padding: 18px 22px 6px; font-size: 15.5px; line-height: 1.55; color: var(--color-text-secondary); }
.report-prose .approach__points { padding: 8px 22px 22px; display: flex; flex-direction: column; gap: 9px; }
.report-prose .approach__points li { display: flex; gap: 10px; align-items: flex-start; font-size: 14.5px; color: var(--color-text-secondary); }
.report-prose .approach__points .ic { flex: none; width: 18px; height: 18px; margin-top: 1px; }
.report-prose .approach--blue .approach__points .ic { stroke: var(--color-icon-brand); }
.report-prose .approach--green .approach__points .ic { stroke: var(--color-icon-positive); }
@media (max-width: 600px) { .report-prose .approaches__grid { grid-template-columns: 1fr; } }

/* ===== OCPP proxy flow ================================================== */
.report-prose .proxy { margin: 30px 0; }
.report-prose .proxy__title { font-family: var(--font-display); font-weight: 500; font-size: 22px; color: var(--color-text-default); margin-bottom: 18px; }
.report-prose .proxy__diagram { padding: 32px 26px; border-radius: var(--radius-l); background: var(--gradient-cloud-blue); border: 1px solid var(--color-border-brand-secondary); }
.report-prose .proxy__row { display: flex; align-items: center; gap: 8px; }
.report-prose .proxy-node {
  flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 9px; text-align: center;
  padding: 18px 12px; border-radius: var(--radius-m);
  background: var(--color-bg-default-binary); border: 1px solid var(--color-border-secondary);
  font-size: 13.5px; font-weight: 500; color: var(--color-text-default); line-height: 1.25;
}
.report-prose .proxy-node .domic { width: 30px; height: 30px; }
.report-prose .proxy-node--proxy { border-color: var(--color-border-brand); box-shadow: var(--shadow-3); }
.report-prose .proxy-node--legacy { background: var(--color-primitive-orange-100); border-color: var(--color-primitive-orange-300); }
.report-prose .proxy-node--legacy .domic { filter: sepia(1) saturate(4) hue-rotate(-18deg) brightness(.95); }
.report-prose .proxy-wire { flex: 0 0 36px; height: 2px; position: relative; background: var(--color-primitive-frost-600); border-radius: 2px; }
.report-prose .proxy-wire--amber { background: var(--color-primitive-orange-300); }
.report-prose .proxy-dot { position: absolute; top: 50%; left: 0; width: 7px; height: 7px; margin-top: -3.5px; border-radius: 50%; background: var(--color-bg-brand); }
.report-prose .proxy-dot--amber { background: var(--color-primitive-orange-500); }
.report-prose .proxy__branch { position: relative; height: 46px; display: flex; justify-content: center; }
.report-prose .proxy__branch::before { content: ""; position: absolute; top: 0; bottom: 0; left: 50%; width: 2px; background: var(--color-primitive-frost-600); }
.report-prose .proxy__ocpp { position: relative; align-self: center; background: var(--color-bg-default-binary); border: 1px solid var(--color-border-default); color: var(--color-text-tertiary); font-size: 11px; font-weight: 600; letter-spacing: .1em; padding: 4px 12px; border-radius: 9999px; }
.report-prose .proxy__chargers { display: flex; justify-content: center; gap: 16px; }
.report-prose .proxy-charger { width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; background: var(--color-bg-default-binary); border: 1px solid var(--color-border-brand-secondary); }
.report-prose .proxy-charger .domic { width: 26px; height: 26px; }
.report-prose .proxy__body { margin-top: 20px; font-size: 16.5px; line-height: 1.62; color: var(--color-text-secondary); }
@media (prefers-reduced-motion: no-preference) {
  .report-prose .proxy-dot { animation: flow 2s var(--ease) infinite; }
  .report-prose .proxy-dot--amber { animation-delay: .4s; }
  @keyframes flow { 0% { left: 0; opacity: 0; } 20% { opacity: 1; } 80% { opacity: 1; } 100% { left: 100%; opacity: 0; } }
}
@media (max-width: 560px) {
  .report-prose .proxy__row { flex-direction: column; }
  .report-prose .proxy-wire { width: 2px; height: 28px; flex-basis: 28px; }
  @keyframes flow { 0% { top: 0; left: 50%; opacity: 0; } 20% { opacity: 1; } 100% { top: 100%; left: 50%; opacity: 0; } }
}

/* ===== Team org chart =================================================== */
.report-prose .org { margin: 30px 0; border-radius: var(--radius-l); overflow: hidden; border: 1px solid var(--color-border-brand-secondary); }
.report-prose .org__head { padding: 15px 22px; background: var(--color-bg-brand); color: #fff; font-family: var(--font-display); font-weight: 600; font-size: 16px; text-align: center; }
.report-prose .org__lead { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; padding: 18px 18px 0; }
.report-prose .org__spec { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; padding: 12px 18px 0; }
.report-prose .org-card { display: flex; flex-direction: column; align-items: center; gap: 9px; text-align: center; padding: 16px 10px; border-radius: var(--radius-m); background: var(--color-bg-default-binary); border: 1px solid var(--color-border-secondary); }
.report-prose .org-card__ic { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: var(--color-primitive-frost-300); }
.report-prose .org-card__ic .domic { width: 22px; height: 22px; }
.report-prose .org-card span:last-child { font-size: 13px; font-weight: 500; color: var(--color-text-default); line-height: 1.25; }
.report-prose .org-card--lead { background: var(--gradient-cloud-blue); border-color: var(--color-border-brand-secondary); }
.report-prose .org-card--lead .org-card__ic { background: var(--color-bg-brand); }
.report-prose .org-card--lead .org-card__ic .domic { filter: brightness(0) invert(1); }
.report-prose .org__note { padding: 18px 22px 22px; font-size: 15.5px; line-height: 1.6; color: var(--color-text-secondary); }
@media (max-width: 600px) { .report-prose .org__lead, .report-prose .org__spec { grid-template-columns: repeat(2, 1fr); } }

/* six-step colour coding */
.report-prose .step:nth-child(1) .step__num { border-color: var(--color-primitive-midnight-200); color: var(--color-primitive-midnight-500); }
.report-prose .step:nth-child(2) .step__num { border-color: var(--color-primitive-primary-500); color: var(--color-primitive-primary-500); }
.report-prose .step:nth-child(3) .step__num { border-color: var(--color-primitive-secondary-500); color: var(--color-primitive-secondary-500); }
.report-prose .step:nth-child(4) .step__num { border-color: var(--color-primitive-orange-400); color: var(--color-primitive-orange-500); }
.report-prose .step:nth-child(5) .step__num { border-color: var(--color-primitive-green-400); color: var(--color-primitive-green-500); }
.report-prose .step:nth-child(6) .step__num { border-color: #8b5cf6; color: #8b5cf6; }
.report-prose .step:nth-child(1) .step__b .lbl { color: var(--color-primitive-midnight-500); }
.report-prose .step:nth-child(2) .step__b .lbl { color: var(--color-primitive-primary-500); }
.report-prose .step:nth-child(3) .step__b .lbl { color: var(--color-primitive-secondary-500); }
.report-prose .step:nth-child(4) .step__b .lbl { color: var(--color-primitive-orange-500); }
.report-prose .step:nth-child(5) .step__b .lbl { color: var(--color-primitive-green-500); }
.report-prose .step:nth-child(6) .step__b .lbl { color: #8b5cf6; }

/* entrance animation for chapters — base state is fully visible;
   the .in class only adds a one-shot rise so content is never hidden if JS lags */
@media (prefers-reduced-motion: no-preference) {
  .report-prose .reveal.in { animation: rise .6s var(--ease) both; }
  @keyframes rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
}



/* ==========================================================================
   SUSTAINABILITY REPORT OVERRIDES & EXTENSIONS
   ========================================================================== */

/* Header over dark hero (non-solid state) */
.report-prose .site-header[data-solid="false"] .brand-mark { filter: brightness(0) invert(1); }
.report-prose .site-header[data-solid="false"] .site-header__nav a:not(.btn) { color: rgba(255,255,255,.82); }
.report-prose .site-header[data-solid="false"] .site-header__nav a:not(.btn):hover { color: #fff; }

/* Accordion table of contents */
.report-prose .toc__head {
  display: flex; align-items: center; gap: 11px;
  padding: 9px 12px; border-radius: var(--radius-s);
  background: none; border: none; text-align: left; width: 100%;
  font-size: 14.5px; font-weight: 500; line-height: 1.35;
  color: var(--color-text-default);
  cursor: pointer; text-decoration: none;
  transition: background-color .2s var(--ease), color .2s var(--ease);
}
.report-prose .toc__head:hover { background: var(--color-bg-default-secondary); }
.report-prose .toc__head[data-active="true"] { color: var(--color-text-brand); background: var(--color-primitive-frost-300); }
.report-prose .toc__head[data-active="true"] .toc__num { background: var(--color-bg-brand); color: #fff; }
.report-prose .toc__chev { margin-left: auto; flex: none; width: 14px; height: 14px; stroke: var(--color-icon-secondary); transition: transform .2s var(--ease); }
.report-prose .toc__head[data-open="true"] .toc__chev { transform: rotate(180deg); }
.report-prose .toc__sub {
  display: none; flex-direction: column; gap: 1px;
  margin: 2px 0 8px; padding-left: 23px; position: relative;
}
.report-prose .toc__sub::before { content: ""; position: absolute; left: 22px; top: 4px; bottom: 4px; width: 1px; background: var(--color-border-secondary); }
.report-prose .toc__sub[data-open="true"] { display: flex; }
.report-prose .toc__subitem {
  display: block; padding: 6px 10px 6px 14px; border-radius: var(--radius-s);
  font-size: 13px; line-height: 1.35; color: var(--color-text-tertiary);
  background: none; border: none; text-align: left; width: 100%;
  text-decoration: none; cursor: pointer; position: relative;
  transition: color .2s var(--ease), background-color .2s var(--ease);
}
.report-prose .toc__subitem:hover { color: var(--color-text-default); background: var(--color-bg-default-secondary); }
.report-prose .toc__subitem[data-active="true"] { color: var(--color-text-brand); font-weight: 500; }
.report-prose .toc__subitem[data-active="true"]::before { content: ""; position: absolute; left: -1px; top: 5px; bottom: 5px; width: 2px; border-radius: 2px; background: var(--color-bg-brand); }

/* Multi-column running text */
.report-prose .cols-2 { columns: 2; column-gap: 44px; max-width: none; margin-bottom: 22px; }
.report-prose .cols-3 { columns: 3; column-gap: 40px; max-width: none; margin-bottom: 22px; }
.report-prose .cols-2 .body-p, .report-prose .cols-3 .body-p { max-width: none; break-inside: avoid-column; font-size: 16.5px; line-height: 1.65; }
.report-prose .cols-3 .body-p { font-size: 15.5px; }
@media (max-width: 960px) { .report-prose .cols-3 { columns: 2; } }
@media (max-width: 680px) { .report-prose .cols-2, .report-prose .cols-3 { columns: 1; } }

/* Text + component side-by-side layout */
.report-prose .duo { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 56px); align-items: start; margin: 8px 0 22px; }
.report-prose .duo .body-p { max-width: none; }
@media (max-width: 860px) { .report-prose .duo { grid-template-columns: 1fr; } }
/* text-heavy duo: wider left text column, narrower right panel */
.report-prose .duo--text { grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr); align-items: stretch; }
/* SCI dark stat panel — fills column height, horizontal dividers between stats */
.report-prose .scistats { background: var(--gradient-dark); border-radius: 20px; padding: 4px 32px; display: flex; flex-direction: column; }
.report-prose .scistats .stat { flex: 1; display: flex; flex-direction: column; justify-content: center; padding: 26px 0; border-top: 1px solid rgba(255,255,255,0.16); }
.report-prose .scistats .stat:first-child { border-top: none; }
@media (max-width: 860px) { .report-prose .duo--text { grid-template-columns: 1fr; } }

/* Tinted full-width section panel (content stays put — padding cancels the bleed) */
.report-prose .section-panel {
  background: color-mix(in srgb, var(--color-primitive-secondary-500) 8%, var(--color-bg-default));
  border-radius: 16px;
  padding: clamp(28px, 3vw, 40px) clamp(20px, 3.3vw, 48px);
  margin-inline: calc(-1 * clamp(20px, 3.3vw, 48px));
  margin-block: calc(-1 * clamp(28px, 3vw, 40px));
}

/* Uptime mandate stat cards */
.report-prose .upstats__label { font-size: 13px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--color-text-tertiary); margin: 26px 0 16px; }
.report-prose .upstats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; margin-bottom: 38px; }
.report-prose .upstat { background: transparent; border: none; border-radius: 0; padding: 2px 26px; border-left: 1px solid var(--color-border-default); }
.report-prose .upstat:first-child { border-left: none; padding-left: 0; }
.report-prose .upstat:last-child { padding-right: 0; }
.report-prose .upstat__v { font-family: var(--font-display); font-weight: 300; font-size: clamp(40px, 4vw, 56px); line-height: 1; letter-spacing: -0.02em; color: var(--color-text-brand); margin-bottom: 8px; }
.report-prose .upstat__head { display: flex; align-items: center; gap: 9px; margin-bottom: 16px; }
.report-prose .upstat__flag { width: 30px; height: 20px; border-radius: 3px; flex: none; display: block; object-fit: cover; box-shadow: inset 0 0 0 1px rgba(0,0,0,.12); }
.report-prose .upstat__country { font-weight: 600; font-size: 14.5px; color: var(--color-text-default); margin: 0; }
.report-prose .upstat__bar { height: 5px; border-radius: 9999px; background: var(--color-border-secondary); margin: 0 0 14px; overflow: hidden; }
.report-prose .upstat__bar i { display: block; height: 100%; border-radius: 9999px; background: var(--gradient-blue); }
.report-prose .upstat__reg { font-size: 12.5px; line-height: 1.45; color: var(--color-text-tertiary); }
@media (max-width: 860px) {
  .report-prose .upstats { grid-template-columns: 1fr; }
  .report-prose .upstat { border-left: none; border-top: 1px solid var(--color-border-default); padding: 20px 0; }
  .report-prose .upstat:first-child { border-top: none; padding-top: 2px; }
}

/* Two-up reliability cards (white, pop on the tinted panel) */
.report-prose .relcards { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 22px 0; }
.report-prose .relcard { background: var(--color-bg-default-binary); border: 1px solid var(--color-border-secondary); border-radius: var(--radius-l); padding: 26px 26px 28px; }
.report-prose .relcard__ic { width: 30px; height: 30px; display: block; margin-bottom: 14px; }
.report-prose .relcard h4 { font-family: var(--font-display); font-weight: 500; font-size: 18px; color: var(--color-text-default); margin-bottom: 9px; }
.report-prose .relcard p { font-size: 15px; line-height: 1.6; color: var(--color-text-secondary); margin: 0; }
@media (max-width: 760px) { .report-prose .relcards { grid-template-columns: 1fr; } }

/* Readiness rows — no card chrome, separated by horizontal lines, icon + title left, body right */
.report-prose .rcards { display: flex; flex-direction: column; gap: 0; margin: 22px 0 0; }
.report-prose .rcard { display: grid; grid-template-columns: minmax(190px, 230px) 1fr; gap: clamp(20px, 3vw, 40px); align-items: start; padding: 24px 0; background: transparent; border: none; border-radius: 0; border-top: 1px solid var(--color-border-default); }
.report-prose .rcard:last-child { border-bottom: none; }
.report-prose .rcard__head { display: flex; align-items: center; gap: 12px; }
.report-prose .rcard__head img { width: 26px; height: 26px; flex: none; display: block; }
.report-prose .rcard h4 { font-family: var(--font-display); font-weight: 500; font-size: 18px; color: var(--color-text-default); margin: 0; line-height: 1.25; }
.report-prose .rcard p { font-size: 15px; line-height: 1.6; color: var(--color-text-secondary); margin: 0; }
@media (max-width: 700px) { .report-prose .rcard { grid-template-columns: 1fr; gap: 12px; } }

/* EMS pillars — 2x2 icon grid (no icon backgrounds) */
.report-prose .emsgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px clamp(28px, 4vw, 52px); margin-top: 22px; }
.report-prose .emsitem { display: grid; grid-template-columns: 26px 1fr; gap: 14px; align-items: start; }
.report-prose .emsitem img { width: 26px; height: 26px; display: block; margin-top: 2px; }
.report-prose .emsitem h4 { font-family: var(--font-display); font-weight: 500; font-size: 17px; color: var(--color-text-default); margin: 0 0 5px; }
.report-prose .emsitem p { font-size: 15px; line-height: 1.55; color: var(--color-text-secondary); margin: 0; }
@media (max-width: 720px) { .report-prose .emsgrid { grid-template-columns: 1fr; } }

/* 2x2 emsgrid with internal divider lines */
.report-prose .emsgrid--divided { gap: 0; }
.report-prose .emsgrid--divided .emsitem { padding: 26px clamp(24px, 3.2vw, 40px); }
.report-prose .emsgrid--divided .emsitem:nth-child(odd) { padding-left: 0; border-right: 1px solid var(--color-border-default); }
.report-prose .emsgrid--divided .emsitem:nth-child(even) { padding-right: 0; }
.report-prose .emsgrid--divided .emsitem:nth-child(-n+2) { padding-top: 0; border-bottom: 1px solid var(--color-border-default); }
.report-prose .emsgrid--divided .emsitem:nth-child(n+3) { padding-bottom: 0; }
/* Integrity grid wrapped in one big card */
.report-prose .intcard { background: var(--color-bg-default-binary); border: 1px solid var(--color-border-secondary); border-radius: var(--radius-l); padding: clamp(18px, 2vw, 26px) clamp(20px, 2.4vw, 30px); margin-top: 22px; }
.report-prose .intcard .emsgrid { margin-top: 0; }
.report-prose .intcard .cards { margin: 0; }
.report-prose .intcard + .chapter__inner, .report-prose .intcard + .cols-2 { margin-top: 30px; }
/* ctxsplit right column: one card, horizontal dividers between items */
.report-prose .ctxsplit__cardstack { margin: 0; display: flex; flex-direction: column; }
.report-prose .ctxsplit__cardstack .card-x { flex: 1 1 0; display: flex; flex-direction: column; justify-content: center; padding: 24px 0; }
.report-prose .ctxsplit__cardstack .card-x:first-child { padding-top: 0; }
.report-prose .ctxsplit__cardstack .card-x:last-child { padding-bottom: 0; }
.report-prose .ctxsplit__cardstack .card-x { border: none; border-radius: 0; background: transparent; box-shadow: none; padding: 16px 0; border-top: 1px solid var(--color-border-default); }
.report-prose .ctxsplit__cardstack .card-x:hover { box-shadow: none; }
.report-prose .ctxsplit__cardstack .card-x:first-child { border-top: none; padding-top: 0; }
.report-prose .ctxsplit__cardstack .card-x:last-child { padding-bottom: 0; }
.report-prose .ctxsplit__cardstack .card-x p { font-size: 15px; }

/* Generic stacked card: items separated by horizontal lines inside one card */
.report-prose .cardstack { display: flex; flex-direction: column; margin: 0; }
.report-prose .cardstack .card-x { border: none; border-radius: 0; background: transparent; box-shadow: none; padding: 18px 0; border-top: 1px solid var(--color-border-default); }
.report-prose .cardstack .card-x:hover { box-shadow: none; }
.report-prose .cardstack .card-x:first-child { border-top: none; padding-top: 0; }
.report-prose .cardstack .card-x:last-child { padding-bottom: 0; }
@media (max-width: 720px) {
  /* Stack to 1 column: the desktop 2x2 dividers use :nth-child selectors (higher
     specificity), so a plain `.emsitem` reset here loses — the odd-item border-right
     and uneven padding leak onto mobile as stray vertical lines. Match those selectors
     to actually neutralize them. */
  .report-prose .emsgrid--divided .emsitem,
  .report-prose .emsgrid--divided .emsitem:nth-child(odd),
  .report-prose .emsgrid--divided .emsitem:nth-child(even),
  .report-prose .emsgrid--divided .emsitem:nth-child(-n+2),
  .report-prose .emsgrid--divided .emsitem:nth-child(n+3) { padding: 22px 0; border-right: none; border-bottom: 1px solid var(--color-border-default); }
  .report-prose .emsgrid--divided .emsitem:first-child { padding-top: 0; }
  .report-prose .emsgrid--divided .emsitem:last-child { border-bottom: none; padding-bottom: 0; }
}

/* Centered label with edge-to-edge decorative rules */
.report-prose .ems-divider, .report-prose .center-divider { display: flex; align-items: center; gap: 20px; margin: 34px 0 8px; }
.report-prose .ems-divider::before, .report-prose .ems-divider::after, .report-prose .center-divider::before, .report-prose .center-divider::after { content: ""; flex: 1; height: 1px; background: var(--color-border-default); }
.report-prose .ems-divider span, .report-prose .center-divider span { font-size: 13px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--color-text-tertiary); white-space: nowrap; }

/* Full-width certification logo row */
.report-prose .logorow { display: grid; grid-template-columns: repeat(5, 1fr); gap: 18px; align-items: center; justify-items: center; width: 100%; max-width: 880px; margin: 0 auto; }
.report-prose .certlogo { width: 100%; height: 84px; object-fit: contain; display: block; }
@media (max-width: 900px) { .report-prose .logorow { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 560px) { .report-prose .logorow { grid-template-columns: repeat(2, 1fr); } }

/* Full-width banner image */.report-prose .bannerimg { width: 100%; height: clamp(280px, 32vw, 420px); object-fit: cover; border-radius: var(--radius-xxl); display: block; margin: 10px 0 28px; }

/* Credit pathways list (scheme · region) */
.report-prose .creditpaths__label { font-size: 13px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--color-text-tertiary); margin: 22px 0 6px; }
.report-prose .creditpaths { display: flex; flex-direction: column; }
.report-prose .creditpaths li { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 12px 0; border-top: 1px solid var(--color-border-secondary); }
.report-prose .creditpaths li:first-child { border-top: none; }
.report-prose .creditpaths__scheme { font-family: var(--font-display); font-weight: 500; font-size: 16px; color: var(--color-text-default); }
.report-prose .creditpaths__region { font-size: 13.5px; color: var(--color-text-tertiary); white-space: nowrap; }

/* Media split — text + image placeholder, alternating sides */
.report-prose .msplit { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(28px, 4vw, 56px); align-items: center; margin-top: 8px; }
.report-prose .msplit__text .body-p { max-width: none; }
.report-prose .msplit__text .body-p:first-child { margin-top: 0; }
.report-prose .msplit__media { width: 100%; border-radius: var(--radius-xxl); overflow: hidden; }
.report-prose .msplit--stretch { align-items: stretch; }
.report-prose .msplit--stretch .msplit__media { height: 100%; }
.report-prose .msplit--stretch .msplit__media img { width: 100%; height: 100%; object-fit: cover; display: block; min-height: 300px; }
@media (max-width: 820px) { .report-prose .msplit { grid-template-columns: 1fr; gap: 26px; } .report-prose .msplit__media { order: 2; } }

/* Full-width image band */
.report-prose .imgband { width: 100%; border-radius: var(--radius-xxl); overflow: hidden; margin-top: 26px; }

/* Product-window frame (for product spotlights) */
.report-prose .prodwin { border: 1px solid var(--color-border-secondary); border-radius: var(--radius-l); overflow: hidden; background: var(--color-bg-default-binary); box-shadow: var(--shadow-light-2); }
.report-prose .prodwin__bar { height: 40px; display: flex; align-items: center; gap: 8px; padding: 0 16px; border-bottom: 1px solid var(--color-border-secondary); background: var(--color-primitive-frost-100); }
.report-prose .prodwin__bar i { width: 11px; height: 11px; border-radius: 50%; background: var(--color-primitive-frost-800); display: block; }
/* decoupling: text left, numbered cards right */
.report-prose .decouple-duo .ncards { margin: 0; }
.report-prose .decouple-duo .ncard:first-child { border-top: none; padding-top: 0; }

/* Context section — text left, cards stacked right */
.report-prose .ctxsplit { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(34px, 4.5vw, 64px); align-items: stretch; }
.report-prose .ctxsplit .chapter__inner { max-width: none; display: flex; flex-direction: column; justify-content: space-between; }
.report-prose .ctxsplit .body-p { max-width: none; }
.report-prose .ctxsplit__cards { grid-template-columns: 1fr; margin: 0; gap: 14px; }
.report-prose .ctxsplit__cards .card-x { padding: 18px 22px; }
.report-prose .ctxsplit__cards .card-x p { font-size: 15px; line-height: 1.5; }
@media (max-width: 860px) {
  .report-prose .ctxsplit { grid-template-columns: 1fr; gap: 28px; }
  .report-prose .ctxsplit .chapter__inner { justify-content: flex-start; }
}

/* CEO message — editorial two-column composition */
.report-prose .ceomsg { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: clamp(34px, 4.5vw, 66px); align-items: start; margin-top: 8px; }
.report-prose .ceomsg__aside { position: sticky; top: 156px; display: flex; flex-direction: column; }
.report-prose .ceomsg__portrait { width: 100%; height: 340px; border-radius: 16px; overflow: hidden; box-shadow: var(--shadow-3); }
.report-prose .ceomsg__name { font-family: var(--font-display); font-weight: 600; font-size: 19px; color: var(--color-text-default); margin-top: 22px; }
.report-prose .ceomsg__role { font-size: 14px; color: var(--color-text-tertiary); margin-top: 4px; }
.report-prose .ceomsg__pull {
  font-family: var(--font-display); font-weight: 300; font-size: clamp(21px, 1.5vw, 25px);
  line-height: 1.34; letter-spacing: -0.01em; color: var(--color-text-brand);
  margin-top: 26px; padding-top: 24px; border-top: 1px solid var(--color-border-secondary);
  text-wrap: pretty;
}
.report-prose .ceomsg__body { min-width: 0; }
.report-prose .ceomsg__body > p:first-child { margin-top: 0; }
.report-prose .ceomsg__body > p { max-width: none; }
@media (max-width: 860px) {
  .report-prose .ceomsg { grid-template-columns: 1fr; gap: 26px; }
  .report-prose .ceomsg__aside { position: static; flex-direction: row; align-items: center; flex-wrap: wrap; gap: 18px; }
  .report-prose .ceomsg__portrait { width: 116px; height: 116px; }
  .report-prose .ceomsg__pull { flex-basis: 100%; margin-top: 0; padding-top: 20px; }
}

/* Stats on light ground → single bordered card, transparent bg, vertical dividers */
.report-prose .stats--light {
  display: flex; align-items: stretch; gap: 0;
  border: 1px solid var(--color-border-default);
  border-radius: var(--radius-l);
  background: transparent;
  padding: clamp(20px, 2.6vw, 30px) 0;
}
.report-prose .stats--light .stat {
  flex: 1; min-width: 0;
  padding: 2px clamp(18px, 3vw, 34px);
  border-left: 1px solid var(--color-border-secondary);
}
.report-prose .stats--light .stat:first-child { border-left: none; }
.report-prose .stats--light .stat .v { color: var(--color-text-default); }
.report-prose .stats--light .stat .l { color: var(--color-text-tertiary); }
.report-prose .stats--3 { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 680px) {
  .report-prose .stats--light { flex-direction: column; padding: 6px clamp(20px, 5vw, 28px); }
  .report-prose .stats--light .stat { border-left: none; border-top: 1px solid var(--color-border-secondary); padding: 18px 2px; }
  .report-prose .stats--light .stat:first-child { border-top: none; }
}

/* Subsection heading + anchor */
.report-prose .subsec { scroll-margin-top: calc(var(--header-h) + 24px); }
.report-prose .chapter h3 {
  font-family: var(--font-display); font-weight: 400;
  font-size: 26px; line-height: 1.25; letter-spacing: -0.01em;
  color: var(--color-text-default);
  margin: 44px 0 16px; max-width: var(--measure); text-wrap: balance;
}
.report-prose .chapter h3:first-of-type { margin-top: 36px; }

/* Data table — card style */
.report-prose .dtable-wrap { border: 1px solid var(--color-border-default); border-radius: var(--radius-l); overflow: hidden; margin: 28px 0; box-shadow: var(--shadow-light-2); }
.report-prose .dtable { width: 100%; border-collapse: collapse; font-size: 15.5px; margin: 0; }
.report-prose .dtable thead th { text-align: left; font-size: 11.5px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--color-text-brand); padding: 14px 18px; background: color-mix(in srgb, var(--color-primitive-secondary-500) 14%, #fff); border-bottom: 1px solid var(--color-border-default); }
.report-prose .dtable td { padding: 14px 18px; border-bottom: 1px solid var(--color-border-secondary); color: var(--color-text-secondary); }
.report-prose .dtable tbody tr:last-child td { border-bottom: none; }
.report-prose .dtable tbody tr:nth-child(even) td { background: color-mix(in srgb, var(--color-primitive-secondary-500) 5%, #fff); }
.report-prose .dtable td:first-child { color: var(--color-text-default); font-weight: 500; }
.report-prose .dtable td:nth-child(2) { font-variant-numeric: tabular-nums; font-weight: 600; color: var(--color-text-default); }
.report-prose .dtable td:last-child, .report-prose .dtable th:last-child { text-align: right; font-variant-numeric: tabular-nums; }
.report-prose .dtable tbody tr:hover td { background: var(--color-bg-default-secondary); }
/* group header + spacer rows for multi-section data tables */
.report-prose .dtable tr.dt-group td { background: color-mix(in srgb, var(--color-primitive-secondary-500) 12%, #fff); font-weight: 700; color: var(--color-text-default); letter-spacing: .01em; }
.report-prose .dtable tr.dt-group:hover td { background: color-mix(in srgb, var(--color-primitive-secondary-500) 12%, #fff); }
.report-prose .dtable tr.dt-spacer td { padding: 4px 18px; background: #fff; border-bottom: 1px solid var(--color-border-secondary); }
.report-prose .dtable tr.dt-spacer:hover td { background: #fff; }
/* plain variant: all rows white, no zebra */
.report-prose .dtable.dtable--plain tbody tr td, .report-prose .dtable.dtable--plain tbody tr:nth-child(even) td { background: #fff; }
.report-prose .dtable.dtable--plain tbody tr:hover td { background: var(--color-bg-default-secondary); }
.report-prose .dtable.dtable--plain tr.dt-group td { background: #fff; border-bottom: 1px solid var(--color-border-default); }
.report-prose .dtable.dtable--plain tr.dt-group:hover td { background: var(--color-bg-default-secondary); }
/* spacer rows: blank space, no doubled divider line */
.report-prose .dtable.dtable--plain tr.dt-spacer td { border: none; }
.report-prose .dtable.dtable--plain tr.dt-spacer:hover td { background: #fff; }
.report-prose .dt-delta { display: inline-flex; align-items: center; gap: 4px; font-size: 12.5px; font-weight: 600; padding: 3px 9px; border-radius: 9999px; background: var(--color-bg-positive); color: var(--color-text-positive-secondary); }
.report-prose .dt-delta svg { width: 11px; height: 11px; }
.report-prose .dt-na { color: var(--color-text-tertiary); font-size: 13px; }


/* Compact sidebar on narrow viewports (sidebar stays visible down to 760px) */
@media (max-width: 1060px) {
  :root { --sidebar-w: 212px; }
  .report-prose .reader { gap: clamp(24px, 3vw, 40px); }
  .report-prose .toc__head { font-size: 13.5px; padding: 8px 10px; }
  .report-prose .toc__subitem { font-size: 12.5px; }
  .report-prose .toc__sub { padding-left: 19px; }
  .report-prose .toc__sub::before { left: 18px; }
}


/* ==========================================================================
   V2 — WEBSITE MODE (horizontal nav, paged topics)
   ========================================================================== */

/* Floating rounded navbar (per Figma frame 7) */
.report-prose .v2nav__link {
  display: inline-block; padding: 9px 13px; border-radius: 10px;
  font-family: var(--font-body); font-size: 13.5px; font-weight: 500; line-height: 1;
  color: var(--color-text-secondary); text-decoration: none; white-space: nowrap;
  transition: background-color .2s var(--ease), color .2s var(--ease);
}
.report-prose .v2nav__link:hover { background: var(--color-primitive-frost-100); color: var(--color-text-default); }
.report-prose .v2nav__link[data-active="true"] { background: var(--color-primitive-frost-300); color: var(--color-text-brand); }

/* Page visibility */
.report-prose .site .pagewrap .chapter { display: none; }
.report-prose .site .page-home-wrap { display: block; }
.report-prose .site[data-page="intro"] #intro { display: block; }
.report-prose .site[data-page="strategy"] #strategy { display: block; }
.report-prose .site[data-page="emobility"] #emobility { display: block; }
.report-prose .site[data-page="digital"] #digital { display: block; }
.report-prose .site[data-page="enablers"] #enablers { display: block; }
.report-prose .site[data-page="people"] #people { display: block; }
.report-prose .site[data-page="trust"] #trust { display: block; }
.report-prose .site[data-page="engagement"] #engagement { display: block; }
.report-prose .site[data-page="ahead"] #ahead { display: block; }
.report-prose .site[data-page="appendix"] #appendix { display: block; }
.report-prose .site[data-page="home"] .v2pager, .report-prose .site[data-page=""] .v2pager { display: none !important; }
.report-prose .site .pagewrap .chapter { border-top: none; padding-top: 0; }

/* Highlights bento (Figma frame 7) */
.report-prose .bento { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin: 28px 0; }
.report-prose .bento__card {
  background: var(--color-bg-default-binary);
  border: 1px solid var(--color-border-secondary);
  border-radius: var(--radius-xxl);
  padding: 26px 24px; min-height: 172px;
  display: flex; flex-direction: column; justify-content: center; align-items: center;
  text-align: center; gap: 10px;
  transition: box-shadow .2s var(--ease), border-color .2s var(--ease);
}
.report-prose .bento__card:hover { box-shadow: var(--shadow-3); }
.report-prose .bento__v {
  font-family: var(--font-display); font-weight: 300; font-size: clamp(36px, 3vw, 50px);
  line-height: 1; letter-spacing: -0.015em; color: var(--color-text-brand);
}
.report-prose .bento__l {
  font-family: var(--font-body); font-weight: 400; font-size: 14.5px; line-height: 1.45;
  color: var(--color-text-secondary); max-width: 30ch;
}
/* wide tiles: left-aligned, larger numeral (alternate composition) */
.report-prose .bento__card--wide { grid-column: span 2; align-items: flex-start; text-align: left; }
.report-prose .bento__card--wide .bento__v { font-size: clamp(44px, 4.4vw, 64px); }
.report-prose .bento__card--wide .bento__l { font-size: 15.5px; max-width: 42ch; }
/* dark navy variant */
.report-prose .bento__card--dark { background: var(--gradient-dark); border: none; }
.report-prose .bento__card--dark .bento__v { color: #fff; }
.report-prose .bento__card--dark .bento__l { color: rgba(255, 255, 255, 0.72); }
/* brand-blue variant */
.report-prose .bento__card--brand { background: var(--gradient-blue); border: none; }
.report-prose .bento__card--brand .bento__v { color: #fff; }
.report-prose .bento__card--brand .bento__l { color: rgba(255, 255, 255, 0.88); }
/* trend delta chip */
.report-prose .bento__delta {
  display: inline-flex; align-items: center; gap: 5px;
  font-family: var(--font-body); font-size: 12.5px; font-weight: 600; line-height: 1;
  padding: 5px 10px; border-radius: 9999px;
  background: var(--color-bg-positive); color: var(--color-text-positive-secondary);
}
.report-prose .bento__delta svg { width: 12px; height: 12px; }
.report-prose .bento__card--dark .bento__delta, .report-prose .bento__card--brand .bento__delta { background: rgba(255,255,255,0.18); color: #9CD2BB; }
.report-prose .bento__photo { border-radius: var(--radius-xxl); overflow: hidden; min-height: 172px; }
.report-prose .bento__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 980px) { .report-prose .bento { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) {
  .report-prose .bento { grid-template-columns: 1fr; }
  .report-prose .bento__card--wide { grid-column: span 1; align-items: center; text-align: center; }
}

/* Radial company highlights (Figma frame 8) */
.report-prose .radial { display: grid; grid-template-columns: 1fr auto 1fr; gap: 22px 28px; align-items: center; margin: 30px 0; }
.report-prose .radial__card {
  background: var(--color-primitive-frost-100); border: 1px solid var(--color-primitive-frost-500);
  border-radius: 14px; padding: 22px 22px 18px; position: relative; margin-top: 14px;
}
.report-prose .radial__month {
  position: absolute; top: -13px; left: 50%; transform: translateX(-50%);
  background: var(--color-primitive-frost-300); color: var(--color-primitive-secondary-500);
  font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  padding: 5px 14px; border-radius: 6px; white-space: nowrap;
}
.report-prose .radial__card p { font-size: 15px; line-height: 1.5; color: var(--color-primitive-midnight-500); text-align: center; }
.report-prose .radial__hub {
  width: clamp(160px, 18vw, 230px); height: clamp(160px, 18vw, 230px); border-radius: 50%;
  background: var(--color-primitive-frost-100);
  display: grid; place-items: center; margin: 0 auto;
}
.report-prose .radial__hub img { width: 38%; height: auto; }
@media (max-width: 860px) { .report-prose .radial { grid-template-columns: 1fr; } .report-prose .radial__hub { display: none; } }

/* Pillar wheels (Figma frame 11) */
.report-prose .wheels { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin: 30px 0; align-items: stretch; }
.report-prose .wheel__col { display: flex; flex-direction: column; }
.report-prose .wheel__col > p { flex: 1 0 auto; }
.report-prose .wheel__col h4 { font-family: var(--font-body); font-weight: 600; font-size: 19px; color: var(--color-primitive-midnight-500); margin-bottom: 12px; }
.report-prose .wheel__col > p { font-size: 14.5px; line-height: 1.6; color: var(--color-text-secondary); margin-bottom: 20px; }
.report-prose .wheel__panel { border-radius: 16px; padding: 28px 20px 22px; display: flex; flex-direction: column; align-items: center; gap: 16px; margin-top: auto; }
.report-prose .wheel__caption { font-family: var(--font-body); font-weight: 600; font-size: 16.5px; }
@media (max-width: 900px) { .report-prose .wheels { grid-template-columns: 1fr; } }

/* Age distribution chart (Figma frame 47) */
.report-prose .agechart { background: var(--color-primitive-frost-100); border-radius: 24px; padding: clamp(24px, 3vw, 44px); margin: 26px 0 18px; }
.report-prose .agechart__row { display: grid; grid-template-columns: 74px 1fr; align-items: center; gap: 14px; margin-bottom: 18px; }
.report-prose .agechart__row:last-child { margin-bottom: 0; }
.report-prose .agechart__label { font-size: 15px; font-weight: 500; color: var(--color-primitive-raven-500); text-align: right; }
.report-prose .agechart__track { position: relative; height: 34px; }
.report-prose .agechart__bar { position: absolute; left: 0; top: 0; bottom: 0; background: var(--color-primitive-secondary-500); border-radius: 8px; display: flex; align-items: center; justify-content: flex-end; padding-right: 10px; color: #fff; font-size: 13px; font-weight: 500; min-width: 26px; }
.report-prose .agechart__bar[data-small="true"] { color: var(--color-primitive-raven-500); justify-content: flex-start; padding-left: calc(100% + 8px); padding-right: 0; overflow: visible; white-space: nowrap; }
.report-prose .natpills { display: flex; flex-wrap: wrap; gap: 10px; }
.report-prose .natpill { display: inline-flex; align-items: center; gap: 7px; font-size: 12px; color: var(--color-primitive-midnight-500); padding: 6px 13px 6px 8px; border-radius: 9999px; border: 1px solid var(--color-primitive-frost-800); background: #fff; }
.report-prose .natflag { width: 18px; height: 12px; border-radius: 2px; object-fit: cover; flex: none; box-shadow: inset 0 0 0 1px rgba(0,0,0,.12); }

/* Vertical bar chart with axes (age distribution) */
.report-prose .vbar { max-width: none; margin: 4px 0 0; }
.report-prose .vbar__sub { font-size: 13px; color: var(--color-text-tertiary); margin: 0 0 20px; }
.report-prose .vbar__area { display: grid; grid-template-columns: 40px 1fr; gap: 10px; }
.report-prose .vbar__y { display: flex; flex-direction: column; justify-content: space-between; height: 280px; text-align: right; font-family: var(--font-body); font-size: 12px; color: var(--color-text-tertiary); }
.report-prose .vbar__plot {
  position: relative; height: 280px;
  border-left: 1.5px solid var(--color-border-default);
  border-bottom: 1.5px solid var(--color-border-default);
  background-image: repeating-linear-gradient(to top, var(--color-border-secondary) 0 1px, transparent 1px calc(100% / 6));
  display: grid; grid-template-columns: repeat(6, 1fr); align-items: end;
}
.report-prose .vbar__col { display: flex; align-items: flex-end; justify-content: center; height: 100%; }
.report-prose .vbar__bar { position: relative; width: 52%; max-width: 76px; min-height: 3px; border-radius: 7px 7px 0 0; background: linear-gradient(180deg, var(--color-primitive-secondary-500), var(--color-primitive-primary-500)); }
.report-prose .vbar__bar b { position: absolute; top: -23px; left: 0; right: 0; text-align: center; font-family: var(--font-body); font-weight: 600; font-size: 13px; color: var(--color-text-default); }
.report-prose .vbar__x { display: grid; grid-template-columns: 40px 1fr; gap: 10px; margin-top: 9px; }
.report-prose .vbar__xcats { grid-column: 2; display: grid; grid-template-columns: repeat(6, 1fr); font-family: var(--font-body); font-size: 12.5px; color: var(--color-text-secondary); text-align: center; }
.report-prose .vbar__pilllabel { font-size: 13px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--color-text-tertiary); margin: 34px 0 16px; }
.report-prose .vbar .natpills { margin-top: 30px; }

/* Figma-style data tables (appendix) */
.report-prose .ftable { width: 100%; border-collapse: collapse; margin: 22px 0 34px; font-size: 13.5px; line-height: 1.45; }
.report-prose .ftable th { background: var(--color-primitive-primary-500); color: #fff; text-align: left; font-weight: 600; font-size: 13px; padding: 10px 14px; }
.report-prose .ftable th:first-child { border-top-left-radius: 8px; }
.report-prose .ftable th:last-child { border-top-right-radius: 8px; }
.report-prose .ftable td { padding: 10px 14px; border-bottom: 1px solid var(--color-primitive-midnight-50); color: var(--color-text-secondary); vertical-align: top; }
.report-prose .ftable td:first-child { color: var(--color-text-default); }
.report-prose .ftable tr:nth-child(even) td { background: var(--color-primitive-frost-100); }
.report-prose .ftable .ftable__group td { background: var(--color-primitive-midnight-50); font-weight: 600; color: var(--color-primitive-raven-500); }

/* In-text endnote reference markers */
.report-prose .enref { font-size: 0.64em; line-height: 0; vertical-align: super; font-weight: 600; }
.report-prose .enref a { color: var(--color-text-brand); text-decoration: none; }
.report-prose .enref a:hover { text-decoration: underline; }
.report-prose .endnotes-list li:target { color: var(--color-text-default); }
.report-prose .endnotes-list { counter-reset: en; }
.report-prose .endnotes-list li { counter-increment: en; position: relative; padding-left: 26px; }
.report-prose .endnotes-list li::before { content: counter(en) "."; position: absolute; left: 0; color: var(--color-text-brand); font-weight: 600; }

/* Governance model chart (Figma frame 76) */
.report-prose .orgchart { background: var(--color-primitive-frost-100); border-radius: 24px; padding: clamp(24px, 3.4vw, 48px); margin: 26px 0; }
.report-prose .orgchart__title { text-align: center; font-weight: 600; font-size: 18px; color: var(--color-primitive-midnight-500); margin-bottom: 28px; }
.report-prose .orgbox { border: 1px solid var(--color-primitive-frost-700); background: #fff; padding: 14px 18px; text-align: center; font-size: 14px; line-height: 1.45; color: var(--color-text-secondary); border-radius: 6px; }
.report-prose .orgbox strong { display: block; font-size: 14.5px; color: var(--color-primitive-midnight-500); margin-bottom: 2px; }
.report-prose .orgline { width: 1px; height: 18px; background: var(--color-primitive-frost-700); margin: 0 auto; }
.report-prose .orgcols { display: grid; grid-template-columns: 1fr 1fr; gap: 0 40px; }
@media (max-width: 760px) { .report-prose .orgcols { grid-template-columns: 1fr; row-gap: 24px; } }

/* SDG grid (Figma frame 78) */
.report-prose .sdg { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin: 24px 0 34px; }
.report-prose .sdg__card { border: 1px solid var(--color-primitive-midnight-50); background: var(--color-primitive-frost-100); border-radius: 12px; padding: 18px 20px; font-size: 13.5px; line-height: 1.5; color: var(--color-text-secondary); }
.report-prose .sdg__card strong { color: var(--color-primitive-primary-500); }
.report-prose .sdg__actions { margin-top: 8px; color: var(--color-primitive-midnight-500); }
.report-prose .sdg__actions b { font-weight: 600; }
@media (max-width: 900px) { .report-prose .sdg { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .report-prose .sdg { grid-template-columns: 1fr; } }

/* Hero + certifications stay visible; the sticky chapter bar sits between them and the content */
.report-prose .site .pagewrap { padding-top: 8px; }

.report-prose .chapnav {
  position: sticky;
  top: var(--stickynav-top, 76px);
  z-index: 50;
  background: var(--color-bg-default);
  border-bottom: 1px solid var(--color-border-secondary);
  transition: top .32s var(--ease);
}
.report-prose .chapnav__inner {
  max-width: var(--wide); margin: 0 auto;
  display: flex; justify-content: space-between; align-items: center;
  gap: 2px;
  padding: 8px clamp(20px, 4vw, 48px);
}
.report-prose .chapnav__tab {
  display: inline-flex; align-items: center; justify-content: center;
  flex: 0 1 auto; padding: 11px 13px;
  border-bottom: 2px solid transparent; margin-bottom: -1px;
  font-family: var(--font-body); font-size: 13.5px; font-weight: 500; line-height: 1;
  color: var(--color-text-secondary); text-decoration: none; white-space: nowrap;
  transition: color .2s var(--ease), border-color .2s var(--ease), background-color .2s var(--ease);
}
.report-prose .chapnav__tab:hover { color: var(--color-text-default); background: var(--color-bg-default-secondary); border-radius: 4px; }
.report-prose .chapnav__tab[data-active="true"] { color: var(--color-text-brand); background: color-mix(in srgb, var(--color-primitive-secondary-500) 14%, #fff); border-radius: 4px; border-bottom-color: transparent; }
.report-prose .chapnav__progress { position: absolute; left: 0; right: 0; bottom: -1px; height: 3px; background: transparent; pointer-events: none; }
.report-prose .chapnav__progress-fill { height: 100%; width: 0%; background: var(--color-primitive-primary-500); transition: width .12s linear; }

/* Governance hierarchy chart */
.report-prose .govchart { display: flex; flex-direction: column; align-items: center; width: 100%; max-width: 680px; margin: 30px auto 44px; background: color-mix(in srgb, var(--color-primitive-secondary-500) 5%, var(--color-bg-default)); border: 1px solid var(--color-border-secondary); border-radius: var(--radius-l); padding: clamp(26px, 3vw, 36px) clamp(20px, 3vw, 36px); box-sizing: border-box; }
.report-prose .govnode { width: 100%; max-width: 300px; text-align: center; border-radius: var(--radius-m); padding: 15px 22px; box-sizing: border-box; }
.report-prose .govnode--ceo { background: var(--gradient-blue); }
.report-prose .govnode--ceo .govnode__name { color: #fff; }
.report-prose .govnode--ceo .govnode__role { color: rgba(255,255,255,.82); }
.report-prose .govnode--lead { background: var(--color-bg-default-binary); border: 1px solid var(--color-border-brand-secondary); }
.report-prose .govnode__role { font-family: var(--font-body); font-size: 11px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--color-text-tertiary); }
.report-prose .govnode__name { font-family: var(--font-display); font-weight: 500; font-size: 16px; color: var(--color-text-default); margin-top: 3px; }
.report-prose .govconn { width: 2px; height: 26px; background: var(--color-border-default); }
.report-prose .govteams { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; width: 100%; padding-top: 26px; }
.report-prose .govteams::before { content: ""; position: absolute; top: 0; left: calc((100% - 32px) / 6); right: calc((100% - 32px) / 6); height: 2px; background: var(--color-border-default); }
.report-prose .govteam { position: relative; display: flex; flex-direction: column; align-items: center; gap: 10px; border: 1px solid var(--color-border-secondary); border-radius: var(--radius-m); padding: 18px 12px; text-align: center; font-size: 13.5px; line-height: 1.35; color: var(--color-text-default); font-weight: 500; background: var(--color-bg-default-binary); box-shadow: var(--shadow-light-3); }
.report-prose .govteam img { width: 26px; height: 26px; display: block; }
.report-prose .govteam::before { content: ""; position: absolute; top: -26px; left: 50%; transform: translateX(-50%); width: 2px; height: 26px; background: var(--color-border-default); }
@media (max-width: 1040px) {
  .report-prose .chapnav__tab { font-size: 12.5px; padding: 10px 8px; }
}


/* V2: article column — each section spans the ~900px page column. Headings and
   the intro lead keep the 720px reading measure; running body prose fills the
   full column width (per design direction). */
.report-prose .site .chapter__inner { max-width: none; }      /* container fills the ~900px column */
.report-prose .site .body-p { max-width: none; }               /* body paragraphs fill their container */
.report-prose .site .lead { max-width: var(--measure); }       /* subheading / intro lead stays capped */
.report-prose .site .chapter h3 { max-width: var(--measure); } /* headings stay capped */
.report-prose .site .byline { max-width: var(--measure); }
.report-prose .site .forces { max-width: none; }               /* 2-up grid uses the full column */
.report-prose .site .duo .body-p { max-width: none; }          /* duo text already fills its column */

/* V2: roomier separation between each titled content subsection */
.report-prose .site .subsec { margin-top: clamp(60px, 6.5vw, 92px); }
.report-prose .site .subsec .chapter h3:first-of-type, .report-prose .site .subsec h3:first-of-type { margin-top: 0; }

/* Highlights timeline (horizontal) -------------------------------------- */
.report-prose .htimeline {
  position: relative; max-width: none; margin: 40px 0 32px;
  display: grid; grid-template-columns: repeat(6, 1fr); gap: 20px;
  padding-top: 2px;
}
.report-prose .htimeline::before {
  content: ""; position: absolute; top: 9px;
  left: calc((100% - 100px) / 12); right: calc((100% - 100px) / 12);
  height: 2px; transform: translateY(-50%);
  background: linear-gradient(90deg, var(--color-primitive-primary-500), var(--color-primitive-secondary-500));
  opacity: .4;
}
.report-prose .htl-item { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; }
.report-prose .htl-dot {
  width: 14px; height: 14px; border-radius: 50%; z-index: 1; margin-bottom: 18px;
  background: var(--color-bg-brand);
  box-shadow: 0 0 0 4px var(--color-bg-default), 0 0 0 5px var(--color-border-brand-secondary);
}
.report-prose .htl-month {
  font-family: var(--font-body); font-weight: 600; font-size: 13px; letter-spacing: .05em;
  text-transform: uppercase; color: var(--color-text-brand); margin-bottom: 10px;
}
.report-prose .htl-item p { margin: 0; font-size: 13.5px; line-height: 1.5; color: var(--color-text-secondary); text-wrap: pretty; }
@media (max-width: 720px) {
  .report-prose .htimeline { grid-template-columns: repeat(2, 1fr); gap: 30px 20px; }
  .report-prose .htimeline::before { display: none; }
  .report-prose .htl-item { align-items: flex-start; text-align: left; }
  .report-prose .htl-dot { margin-bottom: 12px; }
}
@media (max-width: 460px) { .report-prose .htimeline { grid-template-columns: 1fr; } }


/* Cross-document View Transitions — makes navigating between chapter URLs look
   like a seamless transition (not a page reload). The content is positioned at
   the chapter (past the hero) on pagereveal, before the transition snapshot. */
@view-transition { navigation: auto; }
@media (prefers-reduced-motion: no-preference) {
  ::view-transition-old(root) { animation: sr-vt-out .22s ease both; }
  ::view-transition-new(root) { animation: sr-vt-in .3s ease both; }
}
@keyframes sr-vt-out { to   { opacity: 0; } }
@keyframes sr-vt-in  { from { opacity: 0; } }

/* --- Chapter pager (prev/next) — v2 design: .btn--secondary + .btn--primary. --- */
.report-prose .report-pager { max-width: 996px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 28px clamp(20px,4vw,48px) 64px; border-top: 1px solid var(--color-border-secondary); }
@media (max-width: 560px) { .report-prose .report-pager { padding-bottom: 40px; } }
/* Long chapter titles overflow the two nowrap buttons on narrow screens — the next
   button gets pushed off the clipped row (invisible + untappable). Stack the pager
   vertically and let each button be full-width with a wrapping label. */
@media (max-width: 700px) {
  .report-prose .report-pager { flex-direction: column; align-items: stretch; gap: 12px; }
  .report-prose .report-pager .btn { width: 100%; margin-left: 0 !important; white-space: normal; text-align: center; padding-top: 14px; padding-bottom: 14px; }
}

/* --- Chapnav tab sizing self-contained here (so it doesn't depend on the
   ampeco-base superset build; structural utilities stay from ampeco-base). --- */
.report-prose .report-chapnav > div { gap: 2px; }
.report-prose .report-chapnav a { font-size: 13.5px; padding: 11px 13px; line-height: 1; }
@media (max-width: 1040px) {
  .report-prose .report-chapnav a { font-size: 12.5px; padding: 10px 8px; }
}

/* --- Chapnav colours self-contained (prod ampeco-base lacks these var() utilities):
   nav bg/border, tab colours + active state, and the progress fill. --- */
.report-prose .report-chapnav { background: var(--color-bg-default); border-bottom: 1px solid var(--color-border-secondary); }
.report-prose .report-chapnav a { color: var(--color-text-secondary); border-radius: 4px; text-decoration: none; transition: color .15s ease, background-color .15s ease; }
.report-prose .report-chapnav a:hover { color: var(--color-text-default); background: var(--color-bg-default-secondary); }
.report-prose .report-chapnav a[aria-current="page"] { color: var(--color-text-brand); background: #E6F2FE; }
.report-prose .report-chapnav .report-progress-fill { background: var(--color-text-brand); }

/* === Requested fixes 2026-07-01 === */
/* 1. No horizontal scroll on the chapnav. */
.report-prose .report-chapnav > div { overflow-x: clip; }
/* 3,4,5. Grid/3-col checklists span the FULL container width — but KEEP their
   structure (--grid stays 2-per-row, --3col stays 3-per-row); only drop the
   760px ul/li cap so the grid uses the whole column. */
.report-prose .checklist--grid .checklist__items,
.report-prose .checklist--3col .checklist__items { max-width: none; }
.report-prose .checklist--grid .checklist__items li,
.report-prose .checklist--3col .checklist__items li { max-width: none; }
/* 6. Kill the theme's blockquote left-border (the blue vertical line) on story quotes. */
.report-prose .story__quote { border-left: 0; padding-left: 0; margin-left: 0; }
/* 7. Mobile: the chapnav (10 tabs) must scroll horizontally on a phone — re-enable
   overflow-x (beats the desktop `overflow-x: clip` above) but hide the scrollbar. */
@media (max-width: 768px) {
  .report-prose .report-chapnav > div { overflow-x: auto; scrollbar-width: none; -ms-overflow-style: none; }
  .report-prose .report-chapnav > div::-webkit-scrollbar { width: 0; height: 0; display: none; }
}

/* ======================================================================
   MOBILE-ONLY FIXES (client-reported, 2026-07-01) — desktop untouched.
   ====================================================================== */
@media (max-width: 768px) {
  /* #2 + #3: context-split panel — stack to 1 column and drop the full-bleed
     negative margins that were overflowing the viewport and bleeding/overlapping
     the neighbouring section. */
  /* minmax(0,1fr) (not bare 1fr = minmax(auto,1fr)): the auto minimum would let
     the single column grow to its children's min-content (~914px from the export's
     fixed-width body copy) and overflow the 334px container. The 0 minimum lets the
     column shrink to the container so the content wraps. */
  .report-prose .ctxsplit { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .report-prose .section-panel { margin-inline: 0; margin-block: 24px; padding: clamp(20px, 5vw, 28px); }

  /* ROOT CAUSE of #2/#3: the intro ctxsplit section carries DESKTOP pixel
     dimensions baked INLINE by the design export (the panel is width:1002px /
     height:1253px; its left column .chapter__inner is 437x932; the right card
     .intcard is 438x936). Inline styles beat normal stylesheet rules, so at
     mobile these force a 1002px-wide box that overflows the 390px viewport and
     clips the body text. Override them with !important so the stacked 1-col grid
     can go fluid. Desktop is untouched — this @media block never applies there,
     where the inline dims remain the source of truth. */
  .report-prose .ctxsplit,
  .report-prose .ctxsplit .chapter__inner,
  .report-prose .ctxsplit__cardstack,
  .report-prose .intcard { width: auto !important; height: auto !important; }

  /* #5: governance team boxes were crammed into 3 tiny columns — stack them. */
  .report-prose .govteams { grid-template-columns: 1fr; gap: 26px; padding-top: 0; }
  .report-prose .govteams::before { display: none; }
  /* Keep a vertical connector between the STACKED team boxes on mobile so the chart
     reads as one continuous chain (the govconn already links Lead → the first team,
     so the first team's connector stays hidden to avoid doubling it). */
  .report-prose .govteam::before { display: block; top: -26px; height: 26px; }
  .report-prose .govteam:first-child::before { display: none; }
  .report-prose .govchart { max-width: 100%; }

  /* long uppercase divider labels must wrap instead of forcing overflow. */
  .report-prose .ems-divider span,
  .report-prose .center-divider span { white-space: normal; }

  /* #8: appendix data tables scroll sideways inside their box (were clipped). */
  .report-prose .ftable-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 22px 0 34px; }
  .report-prose .ftable-scroll .ftable { margin: 0; min-width: 620px; }

  /* #1: the chapter band clears the sticky chapnav when a chapter is opened. */
  .report-prose .site .chapter { scroll-margin-top: 72px; }

  /* Chapnav: on mobile the 10 tabs need ~835px but only ~374px shows. The desktop
     rule clips the overflow (overflow-x:clip) + spreads tabs (justify:space-between),
     so 6-7 chapters were unreachable. Make the strip horizontally SWIPEABLE instead:
     scroll, pack tabs to the left, hide the scrollbar. report.js scrolls the active
     tab into view on load. */
  .report-prose .report-chapnav > div {
    overflow-x: auto;
    justify-content: flex-start;
    scroll-behavior: smooth;
    scrollbar-width: none;              /* Firefox */
    -ms-overflow-style: none;           /* old Edge */
  }
  .report-prose .report-chapnav > div::-webkit-scrollbar { display: none; }  /* WebKit */
  /* Edge fades = "more chapters, swipe" affordance (sit above the 3px progress bar).
     report.js toggles .is-overflow-left / .is-overflow-right on the nav by scroll
     position, so the fade only shows on the side that actually has hidden tabs. */
  .report-prose .report-chapnav::before,
  .report-prose .report-chapnav::after {
    content: "";
    position: absolute;
    top: 0; bottom: 3px;
    width: 34px;
    pointer-events: none;
    z-index: 1;
    opacity: 0;
    transition: opacity .15s ease;
  }
  .report-prose .report-chapnav::before { left: 0;  background: linear-gradient(to left,  transparent, var(--color-bg-default)); }
  .report-prose .report-chapnav::after  { right: 0; background: linear-gradient(to right, transparent, var(--color-bg-default)); }
  .report-prose .report-chapnav.is-overflow-left::before  { opacity: 1; }
  .report-prose .report-chapnav.is-overflow-right::after  { opacity: 1; }
}