:root,
:root[data-cw-landing],
[data-cw-landing] {
  --landing-font-family-base: var(--ds-font-family-base, Formular, "Segoe UI", Arial, sans-serif);
  --landing-color-text: var(--ds-color-text);
  --landing-color-text-muted: var(--ds-color-text-muted);
  --landing-color-surface: var(--ds-color-surface);
  --landing-color-surface-muted: var(--ds-color-surface-muted);
  --landing-color-surface-card: var(--ds-color-surface);
  --landing-color-surface-elevated: var(--ds-color-surface-elevated);
  --landing-color-surface-subtle: var(--ds-color-product-bg-surface-subtle);
  --landing-color-overlay: var(--ds-color-overlay, rgba(12, 22, 33, 0.56));
  --landing-color-border-soft: var(--ds-color-border-soft);
  --landing-color-border-strong: var(--ds-color-border-strong);
  --landing-color-border-input: var(--ds-color-border-soft);
  --landing-color-border-focus: var(--ds-color-border-focus, var(--landing-color-primary));
  --landing-color-divider: var(--ds-color-divider);
  --landing-color-input-border: var(--ds-color-border-soft);
  --landing-color-on-primary: var(--ds-color-on-primary);
  --landing-color-state-success-bg: var(--ds-color-product-success-bg);
  --landing-color-state-success-text: var(--ds-color-product-success-text);
  --landing-color-state-warning-bg: var(--ds-color-status-warning-bg);
  --landing-color-state-warning-text: var(--ds-color-status-warning-text);
  --landing-color-state-error-bg: var(--ds-color-status-error-bg);
  --landing-color-state-error-border: var(--ds-color-status-error-border);
  --landing-color-state-error-text: var(--ds-color-status-error-text);
  --landing-color-state-info-bg: var(--ds-color-status-info-bg);
  --landing-color-state-info-border: var(--ds-color-status-info-border);
  --landing-color-state-info-text: var(--ds-color-status-info-text);
  --landing-color-accent: var(--landing-color-primary);
  --landing-color-accent-soft: var(--landing-color-hero-title);
  --landing-color-text-section-heading: var(--ds-color-text-strong);
  --landing-color-text-soft: var(--ds-color-text-soft);
  --landing-color-text-strong: var(--ds-color-text-strong);
  --landing-color-text-chip: var(--landing-color-state-info-text);
  --landing-color-text-disabled: var(--ds-color-text-disabled);
  --landing-color-status-danger-text: var(--landing-color-state-error-text);
  --landing-color-status-error-text: var(--landing-color-state-error-text);
  --landing-color-on-inverse: var(--ds-color-on-inverse);
  --landing-color-surface-base: var(--landing-color-surface);
  --landing-color-surface-chip: var(--landing-color-state-info-bg);
  --landing-color-surface-chip-soft: var(--landing-color-state-info-bg);
  --landing-color-card-neutral: var(--landing-color-surface-card);
  --landing-color-card-trust: var(--landing-color-state-info-bg);
  --landing-color-card-note: var(--landing-color-surface-warm-soft);
  --landing-color-surface-disabled: var(--ds-color-surface-disabled);
  --landing-color-surface-inverse: var(--ds-color-surface-inverse);
  --landing-color-surface-status-danger: var(--landing-color-state-error-bg);
  --landing-color-surface-gradient-start: var(--ds-color-bg-soft);
  --landing-color-surface-accent-ghost: var(--landing-color-state-info-bg);
  --landing-color-surface-warm: var(--landing-color-state-warning-bg);
  --landing-color-surface-warm-strong: var(--landing-color-state-warning-bg);
  --landing-color-surface-warm-soft: var(--landing-color-state-warning-bg);
  --landing-color-surface-note: var(--landing-color-state-warning-bg);
  --landing-color-surface-accent-soft: var(--landing-color-state-error-bg);
  --landing-color-surface-badge: var(--landing-color-state-warning-bg);
  --landing-color-border-chip: var(--landing-color-state-info-border);
  --landing-color-border-chip-soft: var(--landing-color-state-info-border);
  --landing-color-border-muted: var(--ds-color-border-muted);
  --landing-color-border-subtle: var(--landing-color-border-soft);
  --landing-color-border-panel: var(--landing-color-border-strong);
  --landing-color-border-control: var(--landing-color-border-strong);
  --landing-color-border-status-danger: var(--landing-color-state-error-border);
  --landing-color-border-status-error: var(--ds-color-status-error-border-strong);
  --landing-color-border-note: var(--ds-color-status-warning-border);
  --landing-radius-scale-2xs: 8px;
  --landing-radius-scale-xs: 10px;
  --landing-radius-scale-14: 14px;
  --landing-radius-scale-sm: var(--ds-radius-sm, 12px);
  --landing-radius-scale-md: var(--ds-radius-md, 16px);
  --landing-radius-scale-lg: var(--ds-radius-lg, 20px);
  --landing-radius-scale-xl: 24px;
  --landing-radius-scale-pill: var(--ds-radius-pill, 999px);
  --landing-radius-scale-circle: 50%;
  --landing-radius-card: var(--landing-radius-scale-lg);
  --landing-radius-media: var(--landing-radius-scale-md);
  --landing-radius-cta: 34px;
  --landing-radius-media-card: var(--landing-radius-scale-lg);
  --landing-radius-pill: var(--landing-radius-scale-pill);
  --landing-radius-circle: var(--landing-radius-scale-circle);
  --landing-radius-lesson-chip: var(--landing-radius-scale-xs);
  --landing-space-scale-4: var(--ds-space-1, 4px);
  --landing-space-scale-5: 5px;
  --landing-space-scale-6: 6px;
  --landing-space-scale-8: var(--ds-space-2, 8px);
  --landing-space-scale-9: 9px;
  --landing-space-scale-10: 10px;
  --landing-space-scale-12: var(--ds-space-3, 12px);
  --landing-space-scale-14: 14px;
  --landing-space-scale-15: 15px;
  --landing-space-scale-16: var(--ds-space-4, 16px);
  --landing-space-scale-17: 17px;
  --landing-space-scale-18: 18px;
  --landing-space-scale-20: 20px;
  --landing-space-scale-22: 22px;
  --landing-space-scale-24: var(--ds-space-5, 24px);
  --landing-space-scale-25: 25px;
  --landing-space-scale-26: 26px;
  --landing-space-scale-30: 30px;
  --landing-space-scale-32: var(--ds-space-6, 32px);
  --landing-space-scale-37: 37px;
  --landing-space-scale-40: 40px;
  --landing-space-scale-41: 41px;
  --landing-space-scale-48: var(--ds-space-7, 48px);
  --landing-space-scale-90: 90px;

  --landing-cta-radius: var(--landing-radius-cta);
  --landing-cta-padding-wide: var(--landing-space-scale-17) var(--landing-space-scale-90) var(--landing-space-scale-17) var(--landing-space-scale-32);
  --landing-cta-padding: var(--landing-space-scale-17) var(--landing-space-scale-32);
  --landing-cta-padding-compact: var(--landing-space-scale-10) var(--landing-space-scale-32);
  --landing-cta-control-radius: var(--landing-radius-scale-14);
  --landing-cta-min-height: var(--ds-button-min-height, var(--ds-touch-target-min, 3rem));
  --landing-cta-min-height-lg: var(--landing-cta-min-height);

  --landing-modal-viewport-padding: 16px;
  --landing-modal-panel-radius: var(--landing-radius-scale-lg);
  --landing-modal-panel-padding: 28px 24px 24px;
  --landing-shadow-modal-panel: 0 24px 50px rgba(0, 0, 0, 0.22);
  --landing-shadow-hero-image: 0 22px 32px rgba(0, 0, 0, 0.12);
  --landing-modal-alert-radius: var(--landing-radius-scale-xs);
  --landing-modal-alert-padding: var(--landing-space-scale-10) var(--landing-space-scale-12);
  --landing-modal-alert-margin-bottom: var(--landing-space-scale-14);
  --landing-modal-form-gap: var(--landing-space-scale-10);
  --landing-modal-field-gap: 6px;
  --landing-modal-field-margin-bottom: var(--landing-space-scale-12);
  --landing-modal-input-radius: var(--landing-radius-scale-sm);
  --landing-modal-input-padding: 0 var(--landing-space-scale-14);
  --landing-shadow-input-focus: 0 0 0 3px rgba(116, 122, 177, 0.18);
  --landing-modal-submit-min-height: 48px;
  --landing-modal-submit-padding: var(--landing-space-scale-10) var(--landing-space-scale-20);
  --landing-modal-submit-radius: var(--landing-radius-scale-14);
  --landing-shadow-card-soft: var(--ds-shadow-md);
  --landing-shadow-card: var(--ds-shadow-sm);
  --landing-shadow-chip: var(--ds-shadow-sm);
  --landing-shadow-elevated: var(--ds-shadow-md);
  --landing-shadow-cta: 0 10px 24px rgba(0, 0, 0, 0.16);

  --landing-line-none: 0;
  --landing-line-reset: 1;
  --landing-line-tight: var(--ds-line-height-tight, 1.15);
  --landing-line-heading: 1.2;
  --landing-line-caption: 1.35;
  --landing-line-body-compact: 1.4;
  --landing-line-body-soft: 1.45;
  --landing-line-body: var(--ds-line-height-body, 1.5);
  --landing-line-loose: 1.6;
  --landing-line-ui: 1.25;
  --landing-line-ui-relaxed: 1.3;

  --landing-type-scale-12: 12px;
  --landing-type-scale-13: 13px;
  --landing-type-scale-14: var(--ds-font-size-100, 14px);
  --landing-type-scale-15: 15px;
  --landing-type-scale-16: var(--ds-font-size-200, 16px);
  --landing-type-scale-17: 17px;
  --landing-type-scale-18: var(--ds-font-size-300, 18px);
  --landing-type-scale-20: 20px;
  --landing-type-scale-22: 22px;
  --landing-type-scale-24: var(--ds-font-size-400, 24px);
  --landing-type-scale-28: 28px;
  --landing-type-scale-30: 30px;
  --landing-type-scale-32: var(--ds-font-size-500, 32px);
  --landing-type-scale-36: 36px;
  --landing-type-scale-40: 40px;
  --landing-type-scale-44: 44px;
  --landing-type-scale-48: var(--ds-font-size-600, 48px);
  --landing-type-scale-52: 52px;
  --landing-type-scale-56: 56px;

  --landing-space-problem-title-margin-bottom: 48px;
  --landing-space-problem-heading-margin-bottom: var(--landing-space-problem-title-margin-bottom);
  --landing-space-problem-grid-gap: 16px;
  --landing-space-problem-items-gap: var(--landing-space-problem-grid-gap);
  --landing-space-problem-card-padding: 20px 16px;
  --landing-space-problem-item-padding: var(--landing-space-problem-card-padding);
  --landing-space-problem-card-gap: 12px;
  --landing-space-problem-item-gap: var(--landing-space-problem-card-gap);
  --landing-space-problem-icon-padding: var(--landing-space-scale-10);
  --landing-radius-problem-item: var(--landing-radius-card);
  --landing-radius-problem-icon: var(--landing-radius-scale-circle);
  --landing-radius-problem-item-icon: var(--landing-radius-problem-icon);

  --landing-space-proof-heading-margin-bottom: 16px;
  --landing-space-proof-text-margin-bottom: var(--ds-space-5, 24px);
  --landing-space-proof-badge-padding: var(--landing-space-scale-6) var(--landing-space-scale-12);
  --landing-radius-proof-badge: var(--landing-radius-scale-pill);
  --landing-space-proof-quote-padding: var(--landing-space-scale-12) var(--landing-space-scale-14);
  --landing-radius-proof-quote: var(--landing-radius-scale-14);
  --landing-space-proof-accordion-item-margin-bottom: var(--landing-space-scale-15);
  --landing-radius-proof-accordion-item: var(--landing-radius-scale-md);
  --landing-space-proof-accordion-title-padding: var(--landing-space-scale-15) var(--landing-space-scale-20);
  --landing-space-proof-accordion-title-gap: 12px;
  --landing-space-proof-accordion-title-padding-right: 52px;
  --landing-space-proof-accordion-num-margin-right: var(--landing-space-scale-15);
  --landing-radius-proof-accordion-num: var(--landing-radius-scale-circle);
  --landing-space-proof-accordion-info-padding: 0 40px 20px 40px;
  --landing-space-proof-accordion-list-padding-left: 20px;
  --landing-space-proof-accordion-li-margin-bottom: 8px;
  --landing-space-proof-grid-item-padding: 20px;
  --landing-space-proof-grid-margin-bottom: 20px;
  --landing-space-proof-subtitle-padding-bottom: var(--landing-space-scale-30);
  --landing-space-proof-reviews-gap: 24px;
  --landing-space-proof-reviews-margin-bottom: 24px;
  --landing-space-proof-reviews-track-gap: 24px;
  --landing-space-proof-reviews-track-padding: 0 48px;
  --landing-space-proof-reviews-video-margin-top: 24px;
  --landing-radius-proof-reviews-item: var(--landing-radius-media);
  --landing-radius-proof-carousel-button: var(--landing-radius-scale-circle);
  --landing-space-proof-carousel-button-padding: 0;

  --landing-space-faq-heading-margin-bottom: var(--landing-space-scale-41);
  --landing-space-faq-accordion-item-margin-bottom: var(--landing-space-scale-15);
  --landing-radius-faq-accordion-item: var(--landing-radius-scale-md);
  --landing-space-faq-accordion-item-padding: 0;
  --landing-space-faq-accordion-title-padding: var(--landing-space-scale-15) var(--landing-space-scale-20);
  --landing-space-faq-accordion-title-gap: 12px;
  --landing-space-faq-accordion-num-margin-right: var(--landing-space-scale-15);
  --landing-radius-faq-accordion-num: var(--landing-radius-scale-circle);
  --landing-space-faq-accordion-info-padding: 0 40px;
  --landing-space-faq-accordion-info-expanded-padding: 0 var(--landing-space-scale-40) var(--landing-space-scale-25) var(--landing-space-scale-40);
  --landing-space-faq-note-margin: 16px auto 0;
  --landing-space-faq-note-padding: 16px 20px;
  --landing-radius-faq-note: var(--landing-radius-scale-md);

  --landing-space-section-padding-y: var(--ds-space-6, 32px);
  --landing-space-section-heading-margin-bottom: var(--ds-space-5, 24px);
  --landing-space-rhythm-4: var(--landing-space-scale-4);
  --landing-space-rhythm-6: var(--landing-space-scale-6);
  --landing-space-rhythm-8: var(--landing-space-scale-8);
  --landing-space-rhythm-10: var(--landing-space-scale-10);
  --landing-space-rhythm-12: var(--landing-space-scale-12);
  --landing-space-rhythm-14: var(--landing-space-scale-14);
  --landing-space-rhythm-16: var(--landing-space-scale-16);
  --landing-space-rhythm-20: var(--landing-space-scale-20);
  --landing-space-rhythm-24: var(--landing-space-scale-24);
  --landing-space-rhythm-32: var(--landing-space-scale-32);
  --landing-space-rhythm-40: var(--landing-space-scale-40);
  --landing-space-rhythm-48: var(--landing-space-scale-48);
  /* Product parity extensions: non-4px values are isolated in --landing-space-scale-* only. */
  --landing-space-utility-section-heading-margin-bottom: var(--landing-space-section-heading-margin-bottom);
  --landing-space-hero-grid-gap: var(--ds-space-6, 32px);
  --landing-space-list-indent: var(--landing-space-scale-15);
  --landing-space-list-item-offset: var(--landing-space-scale-37);
  --landing-space-list-item-margin-bottom: var(--landing-space-scale-15);
  --landing-space-help-card-padding: 12px;
  --landing-space-help-card-margin-top: 20px;
  --landing-space-help-icon-gap: 8px;
  --landing-space-help-why-padding: 16px 20px;
  --landing-space-help-why-margin-top: 16px;
  --landing-space-card-inset-compact: var(--landing-space-scale-20);
  --landing-space-card-inset-stack: var(--landing-space-scale-32);
  --landing-space-card-inset-list: var(--landing-space-scale-26);
  --landing-space-card-inset-decision: var(--landing-space-scale-32);
  --landing-space-expert-title-margin-bottom: var(--landing-space-scale-22);
  --landing-space-expert-list-margin-top: 20px;
  --landing-space-expert-list-padding-left: var(--landing-space-scale-15);
  --landing-space-program-grid-gap: 24px;
  --landing-space-program-card-padding: var(--landing-space-scale-26);
  --landing-space-program-card-gap: var(--landing-space-scale-14);
  --landing-space-program-list-padding-left: var(--landing-space-scale-15);
  --landing-space-offer-cta-margin-top: 20px;
  --landing-radius-help-card: var(--landing-radius-scale-2xs);
  --landing-radius-help-icon: var(--landing-radius-scale-circle);
  --landing-radius-help-why: var(--landing-radius-scale-md);
  --landing-radius-utility-chip: var(--landing-radius-scale-pill);
  /* Semantic size policy: width/padding/media-slot first; height only for true parallel families. */
  --landing-size-card-compact-min-height: auto;
  --landing-size-card-feature-min-height: auto;
  --landing-size-card-list-min-height: auto;
  --landing-size-section-reading-max-width: 42rem;
  --landing-size-section-stack-max-width: 48.75rem;
  --landing-size-section-shell-max-width: var(--ds-container-max);
  --landing-size-card-summary-max-width: 48.75rem;
  --landing-size-card-media-tile-width: 15rem;
  --landing-size-card-media-frame-max-width: 40rem;
  --landing-size-card-decision-max-width: 53.75rem;
  --landing-size-card-composition-media-max-width: 31.5rem;
  --landing-size-card-composition-min-height: 32rem;
  --landing-size-input-height: 55px;
  --landing-space-input-margin-bottom: var(--landing-space-scale-10);
  --landing-space-footer-padding-y: 32px;
  --landing-space-footer-content-margin-bottom: 24px;
  --landing-space-footer-section-margin-bottom: var(--landing-space-scale-30);
  --landing-space-footer-heading-margin-bottom: 20px;
  --landing-space-footer-text-margin-bottom: var(--landing-space-scale-10);
  --landing-space-footer-link-margin-bottom: var(--landing-space-scale-5);
  --landing-space-footer-icon-gap: 12px;
  --landing-space-footer-logo-gap: 16px;
  --landing-space-footer-payments-margin-left: 20px;
  --landing-space-footer-social-gap: 12px;

  --landing-space-responsive-container-inline-desktop: 48px;
  --landing-space-responsive-container-inline-tablet: 24px;
  --landing-space-responsive-container-inline-mobile: 20px;
  --landing-space-responsive-hero-columns-gap: 56px;
  --landing-space-responsive-hero-image-margin-top: 32px;
  --landing-radius-responsive-hero-image: var(--landing-radius-scale-xl);
  --landing-space-responsive-hero-title-margin-top: 12px;
  --landing-space-responsive-hero-title-margin-top-compact: 16px;
  --landing-space-responsive-hero-subtitle-margin-top: 12px;
  --landing-space-responsive-hero-subtitle-margin-top-compact: 12px;
  --landing-space-responsive-hero-proof-margin-top: 16px;
  --landing-space-responsive-hero-highlights-gap: 12px;
  --landing-space-responsive-hero-highlights-margin-top: 8px;
  --landing-space-responsive-badge-padding: var(--landing-space-scale-6) var(--landing-space-scale-10);
  --landing-space-responsive-chip-padding: var(--landing-space-scale-6) var(--landing-space-scale-9);
  --landing-space-responsive-quote-padding: var(--landing-space-scale-10) var(--landing-space-scale-12);
  --landing-space-responsive-cta-padding: var(--landing-space-scale-10) var(--landing-space-scale-32);
  --landing-radius-responsive-cta: var(--landing-radius-scale-14);
  --landing-space-responsive-sticky-inline: 16px;
  --landing-space-responsive-problem-gap: 12px;
  --landing-space-responsive-card-gap: 16px;
  --landing-space-responsive-card-padding: var(--landing-space-scale-18);
  --landing-space-responsive-card-inset-compact: var(--landing-space-scale-18);
  --landing-space-responsive-card-inset-stack: var(--landing-space-scale-18);
  --landing-space-responsive-card-inset-list: var(--landing-space-scale-18);
  --landing-space-responsive-card-inset-decision: var(--landing-space-scale-18);
  --landing-space-responsive-footer-padding-bottom: 64px;
  --landing-space-responsive-footer-logo-gap: var(--landing-space-scale-10);
  --landing-space-responsive-footer-item-margin-top: var(--landing-space-scale-10);
  --landing-space-responsive-modal-panel-padding: var(--landing-space-scale-24) var(--landing-space-scale-20) var(--landing-space-scale-22);
  --landing-radius-responsive-modal-panel: var(--landing-radius-scale-lg);
  --landing-space-responsive-modal-subtitle-margin-bottom: 12px;
  --landing-space-responsive-lesson-padding: var(--landing-space-scale-5) var(--landing-space-scale-10);
  --landing-space-responsive-itemsli-padding: var(--landing-space-scale-24) var(--landing-space-scale-18);
  --landing-space-responsive-grid-gap-xs: var(--landing-space-scale-10);
  --landing-space-responsive-foundations-item-padding: var(--landing-space-scale-16) var(--landing-space-scale-10);
  --landing-size-responsive-foundations-icon: 68px;

  --landing-type-body-size: var(--landing-type-scale-18);
  --landing-type-body-weight: 400;
  --landing-type-body-line-height: 1.5;
  --landing-type-section-h2-size: var(--landing-type-scale-36);
  --landing-type-section-h3-size: var(--landing-type-scale-24);
  --landing-type-section-h3-weight: 500;
  --landing-type-section-h3-line-height: 1.35;
  --landing-type-text-base-size: var(--landing-type-scale-16);
  --landing-type-text-sm-size: var(--landing-type-scale-14);
  --landing-type-text-xs-size: var(--landing-type-scale-12);
  --landing-type-input-size: var(--landing-type-scale-18);
  --landing-type-button-size: var(--landing-type-scale-18);
  --landing-type-hero-cta-size: var(--landing-type-scale-22);
  --landing-type-hero-price-current-size: var(--landing-type-scale-32);
  --landing-type-hero-price-note-size: var(--landing-type-scale-12);
  --landing-type-hero-cta-note-size: var(--landing-type-scale-14);
  --landing-type-hero-benefit-item-size: var(--landing-type-scale-16);
  --landing-type-hero-benefit-icon-size: var(--landing-type-scale-16);
  --landing-type-hero-price-old-size: var(--landing-type-scale-24);
  --landing-type-help-title-size: var(--landing-type-scale-18);
  --landing-type-help-body-size: var(--landing-type-scale-15);
  --landing-type-help-number-size: var(--landing-type-scale-14);
  --landing-type-help-number-line-height: 28px;
  --landing-type-help-note-size: var(--landing-type-scale-14);
  --landing-type-help-icon-size: var(--landing-type-scale-16);
  --landing-type-problem-item-size: var(--landing-type-scale-14);
  --landing-type-accordion-title-size: var(--landing-type-scale-16);
  --landing-type-accordion-num-size: var(--landing-type-scale-12);
  --landing-type-accordion-info-size: var(--landing-type-scale-14);
  --landing-type-footer-title-size: var(--landing-type-scale-18);
  --landing-type-modal-close-size: var(--landing-type-scale-28);
  --landing-type-problem-item-title-size: var(--landing-type-scale-18);
  --landing-type-program-lesson-desc-size: var(--landing-type-scale-16);
  --landing-type-addon-card-title-size: var(--landing-type-scale-18);
  --landing-type-addon-card-body-size: var(--landing-type-scale-20);
  --landing-type-addon-note-size: var(--landing-type-scale-16);
  --landing-type-expert-body-size: var(--landing-type-scale-15);
  --landing-type-program-list-size: var(--landing-type-scale-15);
  --landing-type-section-body-size: var(--landing-type-scale-18);
  --landing-type-cta-secondary-size: var(--landing-type-scale-18);
  --landing-type-offer-lead-size: var(--landing-type-scale-20);
  --landing-type-offer-price-size: var(--landing-type-scale-20);
  --landing-type-offer-price-value-size: var(--landing-type-scale-30);

  --landing-type-modal-title-size: var(--landing-type-scale-32);
  --landing-type-modal-title-weight: 700;
  --landing-type-modal-title-line-height: 1.2;
  --landing-type-modal-h3-size: var(--landing-type-modal-title-size);
  --landing-type-modal-h3-weight: var(--landing-type-modal-title-weight);
  --landing-type-modal-h3-line-height: var(--landing-type-modal-title-line-height);
  --landing-type-modal-subtitle-size: var(--landing-type-scale-22);
  --landing-type-modal-subtitle-line-height: 1.3;
  --landing-type-modal-price-size: var(--landing-type-scale-24);
  --landing-type-modal-price-weight: 700;
  --landing-type-modal-price-line-height: 1.2;
  --landing-type-modal-server-error-size: var(--landing-type-scale-14);
  --landing-type-modal-server-error-line-height: 1.4;
  --landing-type-modal-label-size: var(--landing-type-scale-14);
  --landing-type-modal-label-weight: 600;
  --landing-type-modal-input-size: var(--landing-type-scale-16);
  --landing-type-modal-error-size: var(--landing-type-scale-13);
  --landing-type-modal-error-line-height: 1.35;
  --landing-type-modal-submit-size: var(--landing-type-scale-17);
  --landing-type-modal-submit-weight: 700;
  --landing-type-modal-submit-note-size: var(--landing-type-scale-13);
  --landing-type-modal-submit-note-line-height: 1.4;
  --landing-type-responsive-section-h2-tablet-size: var(--landing-type-scale-32);
  --landing-type-responsive-section-h2-mobile-size: var(--landing-type-scale-30);
  --landing-type-responsive-section-h3-mobile-size: var(--landing-type-scale-20);
  --landing-type-responsive-hero-title-desktop-size: var(--landing-type-scale-52);
  --landing-type-responsive-hero-title-tablet-size: var(--landing-type-scale-52);
  --landing-type-responsive-hero-title-mobile-size: var(--landing-type-scale-32);
  --landing-type-responsive-hero-subtitle-desktop-size: var(--landing-type-scale-24);
  --landing-type-responsive-hero-subtitle-tablet-size: var(--landing-type-scale-24);
  --landing-type-responsive-hero-subtitle-mobile-size: var(--landing-type-scale-20);
  --landing-type-responsive-hero-emphasis-mobile-size: var(--landing-type-scale-30);
  --landing-type-responsive-hero-price-old-mobile-size: var(--landing-type-scale-22);
  --landing-type-responsive-hero-price-current-mobile-size: var(--landing-type-scale-32);
  --landing-type-responsive-hero-price-note-mobile-size: var(--landing-type-scale-14);
  --landing-type-responsive-hero-benefits-mobile-size: var(--landing-type-scale-18);
  --landing-type-responsive-hero-benefit-item-mobile-size: var(--landing-type-scale-16);
  --landing-type-responsive-proof-badge-mobile-size: var(--landing-type-scale-13);
  --landing-type-responsive-proof-quote-mobile-size: var(--landing-type-scale-15);
  --landing-type-responsive-cta-mobile-size: var(--landing-type-scale-18);
  --landing-type-responsive-cta-mobile-min-height: 40px;
  --landing-type-responsive-precheckout-title-mobile-size: var(--landing-type-scale-28);
  --landing-type-responsive-precheckout-subtitle-mobile-size: var(--landing-type-scale-20);
  --landing-type-responsive-precheckout-submit-mobile-size: var(--landing-type-scale-16);
  --landing-type-responsive-precheckout-submit-mobile-min-height: 46px;
  --landing-type-responsive-inline-note-mobile-size: var(--landing-type-scale-12);
  --landing-type-responsive-utility-heading-mobile-size: var(--landing-type-scale-18);
  --landing-type-responsive-program-lesson-mobile-size: var(--landing-type-scale-14);
  --landing-type-responsive-addon-foundations-mobile-size: var(--landing-type-scale-14);
  --landing-type-responsive-icon-mobile-size: var(--landing-type-scale-16);
  --landing-size-responsive-icon-mobile: 24px;
  --landing-size-responsive-footer-social-icon: 32px;
  --landing-size-responsive-iframe-height: 300px;

  /* Legacy alias compatibility (short/irem old variable names) */
  --landing-space-cta-padding: var(--landing-cta-padding-wide);
  --landing-space-cta-input-padding: var(--landing-cta-padding);
  --landing-space-cta-compact-padding: var(--landing-cta-padding-compact);
  --landing-radius-cta-control: var(--landing-cta-control-radius);
  --landing-size-cta-min-height: var(--landing-cta-min-height);
  --landing-space-modal-inset: var(--landing-modal-viewport-padding);
  --landing-radius-modal-panel: var(--landing-modal-panel-radius);
  --landing-space-modal-panel-padding: var(--landing-modal-panel-padding);
  --landing-modal-panel-shadow: var(--landing-shadow-modal-panel);
  --landing-radius-modal-error: var(--landing-modal-alert-radius);
  --landing-space-modal-error-padding: var(--landing-modal-alert-padding);
  --landing-radius-modal-input: var(--landing-modal-input-radius);
  --landing-space-modal-input-padding: var(--landing-modal-input-padding);
  --landing-modal-input-focus-ring: var(--landing-shadow-input-focus);
  --landing-cta-shadow: var(--landing-shadow-cta);
  --landing-modal-submit-shadow: var(--landing-shadow-cta);
  --landing-size-modal-submit-min-height: var(--landing-modal-submit-min-height);
  --landing-space-modal-submit-padding: var(--landing-modal-submit-padding);
  --landing-radius-modal-submit: var(--landing-modal-submit-radius);
}

:root[data-cw-landing="short"],
[data-cw-landing="short"],
:root[data-cw-landing="reboot"],
[data-cw-landing="reboot"] {
  --landing-color-heading: var(--landing-color-text);
  --landing-color-primary: var(--product-primary, var(--ds-color-primary));
  --landing-color-primary-strong: var(--product-primary-strong, var(--ds-color-primary-strong));
  --landing-color-hero-title: var(--ds-color-product-short-accent);
  --landing-color-surface: var(--ds-color-surface);
  --landing-color-surface-muted: var(--ds-color-product-bg-soft-peach);
  --landing-color-surface-card: var(--ds-color-product-bg-card);
  --landing-color-surface-elevated: var(--ds-color-product-bg-card);
  --landing-color-surface-subtle: var(--ds-color-product-bg-surface-subtle);
  --landing-color-overlay: var(--ds-color-overlay, rgba(12, 22, 33, 0.56));
  --landing-color-border-soft: var(--ds-color-product-short-border-soft);
  --landing-color-border-strong: var(--ds-color-border-strong);
  --landing-color-border-input: var(--ds-color-border-input);
  --landing-color-border-focus: var(--landing-color-primary);
  --landing-color-divider: var(--landing-color-border-soft);
  --landing-color-state-warning-bg: var(--ds-color-product-short-surface-note);
  --landing-color-state-warning-text: var(--ds-color-status-warning-text);
  --landing-color-state-error-bg: var(--ds-color-status-error-bg);
  --landing-color-state-error-border: var(--ds-color-status-error-border);
  --landing-color-state-error-text: var(--ds-color-status-error-text);
  --landing-color-state-info-bg: var(--ds-color-product-short-surface-quote);
  --landing-color-state-info-border: var(--ds-color-product-short-border-soft);
  --landing-color-state-info-text: var(--ds-color-product-short-text-info);
  --landing-color-badge-text: var(--ds-color-product-text-badge);
  --landing-color-price-old: var(--ds-color-product-short-price-old);
  --landing-color-price-old-strike: var(--ds-color-product-short-price-old);
  --landing-color-accent: var(--ds-color-product-short-accent);
  --landing-color-accent-soft: var(--ds-color-product-short-accent-soft);
  --landing-color-text-section-heading: var(--ds-color-text-muted);
  --landing-color-text-soft: var(--ds-color-text-soft);
  --landing-color-text-strong: var(--ds-color-text-strong);
  --landing-color-text-chip: var(--ds-color-product-short-text-info);
  --landing-color-text-disabled: var(--ds-color-text-disabled);
  --landing-color-status-danger-text: var(--ds-color-status-error-text);
  --landing-color-status-error-text: var(--ds-color-status-error-text-strong);
  --landing-color-on-inverse: var(--ds-color-on-inverse);
  --landing-color-surface-base: var(--ds-color-bg-canvas);
  --landing-color-surface-chip: var(--ds-color-product-short-surface-note);
  --landing-color-surface-chip-soft: var(--ds-color-product-short-surface-quote);
  --landing-color-surface-disabled: var(--ds-color-surface-disabled);
  --landing-color-surface-inverse: var(--ds-color-surface-inverse);
  --landing-color-surface-status-danger: var(--ds-color-status-error-bg);
  --landing-color-surface-gradient-start: var(--ds-color-surface-gradient-start);
  --landing-color-surface-accent-ghost: rgba(239, 135, 123, 0.1);
  --landing-color-surface-warm: var(--ds-color-product-short-surface-warm);
  --landing-color-surface-warm-strong: var(--ds-color-product-short-surface-warm-strong);
  --landing-color-surface-warm-soft: var(--ds-color-product-short-surface-warm-soft);
  --landing-color-surface-note: var(--ds-color-product-short-surface-note);
  --landing-color-surface-accent-soft: var(--ds-color-product-bg-soft-peach);
  --landing-color-surface-badge: var(--ds-color-product-short-surface-badge);
  --landing-color-card-neutral: var(--landing-color-surface-card);
  --landing-color-card-trust: var(--landing-color-surface-card);
  --landing-color-card-note: var(--landing-color-surface-warm-soft);
  --landing-color-border-chip: var(--ds-color-product-short-border-soft);
  --landing-color-border-chip-soft: var(--ds-color-product-short-border-soft);
  --landing-color-border-muted: var(--ds-color-border-muted);
  --landing-color-border-subtle: var(--ds-color-product-short-border-subtle);
  --landing-color-border-panel: var(--ds-color-border-panel);
  --landing-color-border-control: var(--ds-color-border-strong);
  --landing-color-border-status-danger: var(--ds-color-status-error-border);
  --landing-color-border-status-error: var(--ds-color-status-error-border-strong);
  --landing-color-border-note: var(--ds-color-product-short-border-note);
  /* Ensure product palette wins even when legacy aliases were originally defined on :root.
     In Next shell, [data-cw-landing] lives on <main>, so we override legacy aliases in that scope. */
  --legacy-color-accent: var(--landing-color-accent);
  --legacy-color-accent-soft: var(--landing-color-accent-soft);
  --legacy-color-accent-hero: var(--landing-color-hero-title, var(--landing-color-accent-soft));
  --legacy-color-link: var(--landing-color-state-info-text);
  --legacy-color-note: var(--landing-color-state-warning-text);
  --legacy-color-proof-text: var(--landing-color-state-info-text);
  --legacy-color-surface-note: var(--landing-color-surface-note);
  --legacy-color-surface-quote: var(--landing-color-state-info-bg);
  --legacy-color-surface-warm: var(--landing-color-surface-warm);
  --legacy-color-surface-warm-strong: var(--landing-color-surface-warm-strong);
  --legacy-color-surface-warm-soft: var(--landing-color-surface-warm-soft);
  --legacy-color-surface-badge: var(--landing-color-surface-badge);
  --legacy-color-border-quote: var(--landing-color-state-info-border);
  --legacy-color-border-note: var(--landing-color-border-note);
  --landing-shadow-cta: 0 10px 24px rgba(201, 0, 8, 0.2);
  --landing-cta-shadow: var(--landing-shadow-cta);
  --landing-modal-submit-shadow: var(--landing-shadow-cta);
  --landing-space-proof-reviews-track-padding: 0;

  --landing-type-h1-size: var(--landing-type-scale-40);
  --landing-type-h1-weight: 900;
  --landing-type-h1-line-height: 1;
  --landing-type-hero-h1-size: var(--landing-type-scale-56);
  --landing-type-hero-h1-weight: 600;
  --landing-type-hero-h1-line-height: 1.05;
  --landing-type-hero-h3-size: var(--landing-type-scale-20);
  --landing-type-hero-h3-weight: 500;
  --landing-type-hero-h3-line-height: 1.45;
  --landing-type-hero-benefits-size: var(--landing-type-scale-18);
  --landing-type-hero-benefits-weight: 500;
  --landing-type-hero-benefits-line-height: 1.6;
  --landing-type-badge-size: var(--landing-type-scale-14);
  --landing-type-badge-weight: 350;
  --landing-type-proof-badge-size: var(--landing-type-scale-14);
  --landing-type-proof-badge-weight: 700;
  --landing-type-proof-badge-line-height: 1.2;
  --landing-type-proof-text-size: var(--landing-type-scale-16);
  --landing-type-proof-text-line-height: 1.35;
  --landing-line-hero-mobile-tight: 1.06;
  --landing-type-responsive-hero-title-desktop-size: var(--landing-type-scale-52);
  --landing-type-responsive-hero-title-tablet-size: var(--landing-type-scale-52);
  --landing-type-responsive-hero-title-mobile-size: var(--landing-type-scale-32);
  --landing-type-responsive-hero-subtitle-desktop-size: var(--landing-type-scale-24);
  --landing-type-responsive-hero-subtitle-tablet-size: var(--landing-type-scale-24);
  --landing-type-responsive-hero-subtitle-mobile-size: var(--landing-type-scale-20);
  --landing-type-responsive-hero-emphasis-mobile-size: var(--landing-type-scale-30);
  --landing-type-responsive-hero-price-old-mobile-size: var(--landing-type-scale-22);
  --landing-type-responsive-hero-price-current-mobile-size: var(--landing-type-scale-32);
  --landing-type-responsive-proof-badge-mobile-size: var(--landing-type-scale-13);
  --landing-type-responsive-proof-quote-mobile-size: var(--landing-type-scale-15);
  --landing-type-responsive-hero-benefits-mobile-size: var(--landing-type-scale-18);
  --landing-type-responsive-hero-benefit-item-mobile-size: var(--landing-type-scale-16);
  --landing-type-responsive-icon-mobile-size: var(--landing-type-scale-16);
  --landing-color-icon-accent-soft: var(--landing-color-accent-soft);
  --landing-space-hero-grid-gap: 48px;
}

:root[data-cw-landing="irem"],
[data-cw-landing="irem"] {
  --landing-color-heading: var(--ds-color-accent);
  --landing-color-primary: var(--ds-color-accent);
  --landing-color-primary-strong: var(--product-primary-strong, var(--ds-color-accent));
  --landing-color-accent: var(--product-primary, var(--ds-color-accent-strong));
  --landing-color-hero-title: var(--landing-color-primary);
  --landing-color-surface: var(--ds-color-surface);
  --landing-color-surface-muted: var(--ds-color-product-irem-surface-chip-soft);
  --landing-color-surface-card: var(--ds-color-surface);
  --landing-color-surface-elevated: var(--ds-color-surface);
  --landing-color-surface-subtle: var(--ds-color-product-bg-surface-subtle);
  --landing-color-overlay: var(--ds-color-overlay, rgba(12, 22, 33, 0.56));
  --landing-color-border-soft: var(--ds-color-product-irem-border-soft);
  --landing-color-border-strong: var(--ds-color-product-irem-border-strong);
  --landing-color-border-input: var(--ds-color-border-input);
  --landing-color-border-focus: var(--landing-color-primary);
  --landing-color-divider: var(--landing-color-border-soft);
  --landing-color-state-warning-bg: var(--ds-color-product-bg-badge);
  --landing-color-state-warning-text: var(--ds-color-product-irem-warning-text);
  --landing-color-state-error-bg: var(--ds-color-status-error-bg);
  --landing-color-state-error-border: var(--ds-color-status-error-border);
  --landing-color-state-error-text: var(--ds-color-status-error-text);
  --landing-color-state-info-bg: var(--ds-color-status-info-bg);
  --landing-color-state-info-border: var(--ds-color-status-info-border);
  --landing-color-state-info-text: var(--ds-color-status-info-text);
  --landing-color-accent-soft: var(--ds-color-accent-strong);
  --landing-color-text-section-heading: var(--ds-color-text-muted);
  --landing-color-text-soft: var(--ds-color-text-soft);
  --landing-color-text-strong: var(--ds-color-text-strong);
  --landing-color-text-chip: var(--ds-color-status-info-text);
  --landing-color-text-disabled: var(--ds-color-text-disabled);
  --landing-color-status-danger-text: var(--ds-color-status-error-text);
  --landing-color-status-error-text: var(--ds-color-status-error-text-strong);
  --landing-color-on-inverse: var(--ds-color-on-inverse);
  --landing-color-surface-base: var(--ds-color-bg-canvas);
  --landing-color-surface-chip: var(--ds-color-product-bg-warm);
  --landing-color-surface-chip-soft: var(--ds-color-product-irem-surface-chip-soft);
  --landing-color-surface-disabled: var(--ds-color-surface-disabled);
  --landing-color-surface-inverse: var(--ds-color-surface-inverse);
  --landing-color-surface-status-danger: var(--ds-color-status-error-bg);
  --landing-color-surface-gradient-start: var(--ds-color-surface-gradient-start);
  --landing-color-surface-accent-ghost: rgba(116, 122, 177, 0.15);
  --landing-color-border-chip: var(--ds-color-product-irem-border-soft);
  --landing-color-border-chip-soft: var(--ds-color-product-irem-border-chip-soft);
  --landing-color-border-muted: var(--ds-color-border-muted);
  --landing-color-border-subtle: var(--ds-color-product-irem-border-subtle);
  --landing-color-border-panel: var(--ds-color-border-panel);
  --landing-color-border-control: var(--ds-color-border-strong);
  --landing-color-border-status-danger: var(--ds-color-status-error-border);
  --landing-color-border-status-error: var(--ds-color-status-error-border-strong);
  --landing-color-border-note: var(--ds-color-product-irem-border-soft);
  /* Mirror product aliases in landing scope so irem rules stay stable in Next shell scope. */
  --product-primary: var(--ds-color-accent-strong);
  --product-primary-strong: var(--ds-color-accent);
  --color-primary: var(--landing-color-primary);
  --color-accent: var(--landing-color-accent);
  --color-accent-dark: var(--landing-color-primary-strong);
  --color-bg-warm: var(--landing-color-surface-chip);
  --color-bg-warm-light: var(--landing-color-surface-chip-soft);
  --color-surface-chip: var(--landing-color-surface-chip);
  --color-surface-chip-soft: var(--landing-color-surface-chip-soft);
  --color-border-chip: var(--landing-color-border-chip);
  --color-border-chip-soft: var(--landing-color-border-chip-soft);
  --color-text-chip: var(--landing-color-text-chip);
  --landing-shadow-cta: 0 10px 24px rgba(245, 130, 32, 0.3);
  --landing-cta-shadow: var(--landing-shadow-cta);
  --landing-modal-submit-shadow: var(--landing-shadow-cta);
  --landing-space-proof-accordion-info-padding: 0 40px 20px 40px;
  --landing-space-proof-reviews-track-padding: 0 48px;

  --landing-type-hero-h1-size: var(--landing-type-scale-40);
  --landing-type-hero-h1-weight: 700;
  --landing-type-hero-h1-line-height: 1.05;
  --landing-type-hero-h2-size: var(--landing-type-scale-40);
  --landing-type-hero-h2-weight: 700;
  --landing-type-hero-h2-line-height: 1.1;
  --landing-type-hero-h4-size: var(--landing-type-scale-20);
  --landing-type-hero-h4-weight: 600;
  --landing-type-hero-badge-size: var(--landing-type-scale-14);
  --landing-type-hero-badge-weight: 700;
  --landing-type-hero-badge-line-height: 1;
  --landing-type-hero-highlights-title-size: var(--landing-type-scale-16);
  --landing-type-hero-highlights-title-weight: 700;
  --landing-type-hero-chip-size: var(--landing-type-scale-14);
  --landing-type-hero-chip-weight: 600;
  --landing-type-hero-chip-line-height: 1.2;
  --landing-type-hero-note-size: var(--landing-type-scale-16);
  --landing-type-hero-note-line-height: 1.45;
  --landing-type-hero-price-size: var(--landing-type-scale-32);
  --landing-type-hero-price-weight: 700;
  --landing-type-hero-price-current-size: var(--landing-type-hero-price-size);
  --landing-type-offer-price-value-size: var(--landing-type-scale-28);
  --landing-type-responsive-hero-title-desktop-size: var(--landing-type-scale-48);
  --landing-type-responsive-hero-title-tablet-size: var(--landing-type-scale-44);
  --landing-type-responsive-hero-title-mobile-size: var(--landing-type-scale-30);
  --landing-type-responsive-hero-subtitle-mobile-size: var(--landing-type-scale-18);
  --landing-type-responsive-hero-emphasis-mobile-size: var(--landing-type-scale-28);
  --landing-type-responsive-hero-price-current-mobile-size: var(--landing-type-scale-28);
  --landing-type-responsive-hero-price-old-mobile-size: var(--landing-type-scale-28);
}

/* ============================================================
   Shared burger navigation — entry landings (short + irem).
   Markup lives in each index.html (adapted per site); the toggle
   behaviour lives in shared/js/landing-runtime.js. Class-prefixed
   `cw-nav` to stay clear of per-product styles. Both files load on
   the served entry path via config.styles / config.runtimeScript.
   ============================================================ */
/* NB: `body { overflow-x: hidden }` (irem's theme) turns the body into a scroll
   container and silently kills `position: sticky` on this header. It is swapped
   to `overflow-x: clip` from landing-runtime.js — not here, because on the served
   entry path `data-cw-landing` lands on <main>, so no selector in this file can
   reach <body> per-site. */
.cw-nav {
  position: sticky;
  top: 0;
  z-index: var(--ds-z-sticky, 999);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 10px clamp(16px, 4vw, 32px);
  background: rgba(255, 253, 247, 0.82);
  backdrop-filter: saturate(1.4) blur(12px);
  -webkit-backdrop-filter: saturate(1.4) blur(12px);
  border-bottom: 1px solid var(--ds-color-border-soft, #e7eaf0);
  transition: transform 0.3s ease;
  /* NB: no `transform`/`will-change` in the base state on purpose — either would
     make .cw-nav a containing block for the fixed drawer panel nested inside it,
     breaking the panel's viewport positioning. The hide transform is applied
     only via .cw-nav--hidden (when the drawer is closed). */
}
/* Hide on scroll-down, reveal on scroll-up (toggled from landing-runtime.js). */
.cw-nav.cw-nav--hidden { transform: translateY(-100%); }
.cw-nav__brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-weight: 700;
  font-size: 17px;
  line-height: 1;
  color: var(--ds-color-text, #111);
  text-decoration: none;
}
.cw-nav__mark {
  display: block;
  width: 32px;
  height: 32px;
  object-fit: contain;
  /* Brand mark ships in ink green; render it solid black per request. */
  filter: brightness(0);
}
.cw-nav__wordmark {
  /* No font-family here on purpose: inherits the site body font (DS). */
  font-weight: 700;
  font-size: 18px;
  letter-spacing: 0.01em;
  color: var(--ds-color-text, #111);
}
/* Desktop inline nav — hidden on mobile, shown as a row >= 900px. */
.cw-nav__desktop { display: none; }
.cw-nav__desktop a {
  display: inline-flex;
  align-items: center;
  padding: 8px 14px;
  font-size: 15px;
  font-weight: 600;
  color: var(--ds-color-text, #111);
  text-decoration: none;
  border-radius: var(--ds-radius-sm, 12px);
}
.cw-nav__desktop a:hover { background: rgba(17, 17, 17, 0.05); }
.cw-nav__burger {
  position: relative;
  z-index: 2;
  display: grid;
  place-items: center;
  color: var(--ds-color-text, #111);
  width: 44px;
  height: 44px;
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: var(--ds-radius-sm, 12px);
  background: transparent;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
/* The burger is the sprite glyph now, not three divs: three rules and a core,
   carrying the same baked hand as every other icon on the page and reading at
   the brand mark's scale rather than a heavier one of its own. */
.cw-nav__burger-ico {
  grid-area: 1 / 1;
  color: currentColor;
  transition: opacity 0.2s ease, transform 0.25s ease;
}
.cw-nav__burger-ico--close,
.cw-nav__burger[aria-expanded="true"] .cw-nav__burger-ico {
  opacity: 0;
  transform: scale(0.88);
}
.cw-nav__burger[aria-expanded="true"] .cw-nav__burger-ico--close {
  opacity: 1;
  transform: none;
}
/* Short's global `button::before` injects an arrow image on every button; kill it
   on the burger and close so no stray arrow bleeds onto the nav controls. */
.cw-nav__burger::before,
.cw-nav__close::before { content: none; display: none; }

/* Mobile drawer: a full-viewport fixed wrapper with overflow:hidden. It clips the
   sliding panel so the closed (translateX 100%) panel never extends the page's
   scroll width — which was inflating fixed `width:100%` CTAs (the sticky button). */
.cw-nav__drawer {
  position: fixed;
  inset: 0;
  z-index: var(--ds-z-modal, 1200);
  overflow: hidden;
  visibility: hidden;
  pointer-events: none;
}
body.cw-nav-open .cw-nav__drawer { visibility: visible; pointer-events: auto; }
.cw-nav__backdrop {
  position: absolute;
  inset: 0;
  background: transparent;
}
.cw-nav__panel {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  flex-direction: column;
  width: min(86vw, 360px);
  height: 100%;
  padding: 84px 24px 28px;
  background: var(--ds-color-bg-canvas, #fffdf7);
  box-shadow: var(--ds-shadow-md, 0 6px 16px rgba(17, 17, 17, 0.12));
  transform: translateX(100%);
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  overflow-y: auto;
  overscroll-behavior: contain;
}
.cw-nav__close {
  position: absolute;
  /* Mirror the burger exactly: same 44px box, same offset from the top-right
     corner (header has padding: 10px clamp(16px,4vw,32px)), so the glyph sits
     where the burger was. */
  top: 10px;
  right: clamp(16px, 4vw, 32px);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  /* Reset the global `button { padding: 17px 90px 17px 32px }` on short, which
     with border-box otherwise inflates this to ~122px and shoves the glyph left. */
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: var(--ds-radius-sm, 12px);
  background: transparent;
  line-height: 1;
  text-transform: none;
  color: var(--ds-color-text, #111);
  cursor: pointer;
}
.cw-nav__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
}
.cw-nav__list a {
  display: block;
  padding: 14px 8px;
  font-size: 18px;
  font-weight: 600;
  color: var(--ds-color-text, #111);
  text-decoration: none;
  border-bottom: 1px solid var(--ds-color-border-soft, #e7eaf0);
}
.cw-nav__list a:active { opacity: 0.6; }
.cw-nav__cta { margin-top: 22px; }
.cw-nav__cta .openModal,
.cw-nav__cta .btn { width: 100%; }
/* Short's base .openModal is coral/uppercase/arrowed (the generic `button` rule);
   its real CTAs (hero/offer/sticky `#menu .openModal`) override all of that to a
   compact red pill with no arrow. Copy that override here 1:1 so the drawer CTA
   is the same button, not a different-looking one. */
[data-cw-landing="short"] .cw-nav__cta .openModal {
  max-width: 360px;
  padding: var(--landing-space-cta-compact-padding, 10px 32px);
  font-size: var(--landing-type-cta-secondary-size, 18px);
  font-weight: 700;
  text-transform: none;
  background: var(--landing-color-primary, #c90008);
  border-radius: var(--ds-radius-sm, 12px);
  box-shadow: var(--landing-shadow-cta);
  min-height: var(--landing-size-cta-min-height, var(--ds-button-min-height, var(--ds-touch-target-min, 3rem)));
}
[data-cw-landing="short"] .cw-nav__cta .openModal::before { display: none; }
[data-cw-landing="short"] .cw-nav__cta .openModal:hover {
  background: var(--landing-color-primary-strong, #c90008);
}

body.cw-nav-open { overflow: hidden; }
body.cw-nav-open .cw-nav__panel { transform: translateX(0); }

[data-section],
section[id],
main[id] { scroll-margin-top: 72px; }

/* Desktop: single-row nav — brand left, links right; burger drawer off. */
@media (min-width: 900px) {
  /* Bar spans full width; its content aligns to each site's own content
     wrapper (max-width + inner padding), so the row lines up with the hero. */
  [data-cw-landing="short"] .cw-nav { padding-inline: calc(max(0px, (100% - 1200px) / 2) + 48px); }
  [data-cw-landing="irem"] .cw-nav { padding-inline: calc(max(0px, (100% - 1160px) / 2) + 40px); }
  .cw-nav__burger { display: none; }
  .cw-nav__drawer { display: none; }
  .cw-nav__desktop { display: flex; align-items: center; gap: 4px; }
  body.cw-nav-open { overflow: visible; }
}

/* Narrow desktops: six links + brand need tighter cells to stay on one row. */
@media (min-width: 900px) and (max-width: 1180px) {
  .cw-nav__desktop { gap: 0; }
  .cw-nav__desktop a { padding: 8px 9px; font-size: 14px; white-space: nowrap; }
}

@media (prefers-reduced-motion: reduce) {
  .cw-nav,
  .cw-nav__panel,
  .cw-nav__burger-ico { transition: none; }
}