/*
 * Shared readability and resilience layer for the dedicated feature pages.
 * Every feature route loads this file after its page-specific stylesheet so
 * the visual theme stays intact while controls and small copy remain legible.
 */

:where(
  .galette-gallery-page,
  .nbox-dedicated-page,
  .alphard-dedicated-page,
  .sienta-special-shell,
  .spacia-special-shell,
  .delica-dedicated-page,
  .triton-special-shell,
  .hsf-special-shell,
  .freed-special-shell,
  .prius-special-shell,
  .canbus-special-shell,
  .lapin-special-shell,
  .hilux-refinad-shell,
  .jeep-heritage-shell,
  .jimny-page
) {
  --feature-polish-tap-size: 44px;
}

:where(
  .galette-gallery-page,
  .nbox-dedicated-page,
  .alphard-dedicated-page,
  .sienta-special-shell,
  .spacia-special-shell,
  .delica-dedicated-page,
  .triton-special-shell,
  .hsf-special-shell,
  .freed-special-shell,
  .prius-special-shell,
  .canbus-special-shell,
  .lapin-special-shell,
  .hilux-refinad-shell,
  .jeep-heritage-shell,
  .jimny-page
) :where(main, section, article, header, footer, nav, div, figure, dl) {
  min-width: 0;
}

:where(
  .galette-gallery-page,
  .nbox-dedicated-page,
  .alphard-dedicated-page,
  .sienta-special-shell,
  .spacia-special-shell,
  .delica-dedicated-page,
  .triton-special-shell,
  .hsf-special-shell,
  .freed-special-shell,
  .prius-special-shell,
  .canbus-special-shell,
  .lapin-special-shell,
  .hilux-refinad-shell,
  .jeep-heritage-shell,
  .jimny-page
) :where(h1, h2, h3, h4, p, li, dt, dd, figcaption, a, button) {
  overflow-wrap: anywhere;
}

/* CTA labels stay readable and touchable without replacing their theme. */
:where(
  .galette-gallery-page,
  .nbox-dedicated-page,
  .alphard-dedicated-page,
  .sienta-special-shell,
  .spacia-special-shell,
  .delica-dedicated-page,
  .triton-special-shell,
  .hsf-special-shell,
  .freed-special-shell,
  .prius-special-shell,
  .canbus-special-shell,
  .lapin-special-shell,
  .hilux-refinad-shell,
  .jeep-heritage-shell,
  .jimny-page
) :where(
  [class*='-actions']:not(.header-actions) a,
  [class*="-actions"]:not(.header-actions) button,
  [class*="-cta"] a,
  [class*="-cta"] button,
  [class*="-links"] a,
  [class*="-routes"] a,
  a[class*="product-link"],
  a[class*="product-cta"],
  a[class~="button"],
  .dd5-story-copy > a,
  .dd5-story-footer a,
  .nbox-product-copy > a,
  .jm-style-copy > a,
  .jm-install-guide a,
  .jm-final-copy a,
  .canbus-style-copy > a
) {
  min-height: var(--feature-polish-tap-size);
  height: auto;
  font-size: clamp(14px, 1.1vw, 16px) !important;
  line-height: 1.45;
  white-space: normal;
}

/* Local navigation is supporting UI, but still needs a usable touch target. */
:where(
  .galette-gallery-page,
  .nbox-dedicated-page,
  .alphard-dedicated-page,
  .sienta-special-shell,
  .spacia-special-shell,
  .delica-dedicated-page,
  .triton-special-shell,
  .hsf-special-shell,
  .freed-special-shell,
  .prius-special-shell,
  .canbus-special-shell,
  .lapin-special-shell,
  .hilux-refinad-shell,
  .jeep-heritage-shell,
  .jimny-page
) :where(
  nav[class*="local-nav"] a,
  nav[class*="series-nav"] a,
  nav[class*="style-nav"] a,
  .nbox-series-nav a,
  .dd5-series-nav a,
  [class*="swipe-guide"] button,
  [class*="series-guide"] button
) {
  min-height: var(--feature-polish-tap-size) !important;
  font-size: clamp(11px, 1vw, 13px) !important;
  line-height: 1.35;
  white-space: normal;
}

/* Known supporting notes stay legible without resizing semantic small/dt
 * elements or display typography across every feature theme. */
:where(
  .galette-gallery-page,
  .nbox-dedicated-page,
  .alphard-dedicated-page,
  .sienta-special-shell,
  .spacia-special-shell,
  .delica-dedicated-page,
  .triton-special-shell,
  .hsf-special-shell,
  .freed-special-shell,
  .prius-special-shell,
  .canbus-special-shell,
  .lapin-special-shell,
  .hilux-refinad-shell,
  .jeep-heritage-shell,
  .jimny-page
) :where(
  .nbox-product-meta,
  .nbox-copy-label,
  .alphard-relief-launch-note,
  .sienta-color-note,
  .spacia-custom-note,
  .freed-material-note,
  .freed-color-note,
  .freed-fitment-note,
  .prius-fitment-note,
  .canbus-fitment-note,
  .hsf-fitment-note,
  .lsf-hero-note,
  .lsf-colors-note,
  .lsf-fitment-note,
  .hrf-fitment-note,
  .jhf-fitment-note,
  .jm-answer-note,
  .jm-fitment-note
) {
  font-size: clamp(10px, .85vw, 12px) !important;
  line-height: 1.5;
}

:where(
  .galette-gallery-page,
  .nbox-dedicated-page,
  .alphard-dedicated-page,
  .sienta-special-shell,
  .spacia-special-shell,
  .delica-dedicated-page,
  .triton-special-shell,
  .hsf-special-shell,
  .freed-special-shell,
  .prius-special-shell,
  .canbus-special-shell,
  .lapin-special-shell,
  .hilux-refinad-shell,
  .jeep-heritage-shell,
  .jimny-page
) :where(
  .dd5-hero-spec,
  .triton-feature-hero-facts,
  .hsf-hero-facts,
  .lsf-hero-facts,
  .canbus-hero-count,
  .hrf-hero-count,
  .jm-hero-count
) :where(span, small, p, dt, dd) {
  font-size: clamp(10px, .85vw, 12px) !important;
  line-height: 1.45;
}

@media (max-width: 720px) {
  :where(
    .galette-gallery-page,
    .nbox-dedicated-page,
    .alphard-dedicated-page,
    .sienta-special-shell,
    .spacia-special-shell,
    .delica-dedicated-page,
    .triton-special-shell,
    .hsf-special-shell,
    .freed-special-shell,
    .prius-special-shell,
    .canbus-special-shell,
    .lapin-special-shell,
    .hilux-refinad-shell,
    .jeep-heritage-shell,
    .jimny-page
  ) :where(img, video) {
    max-width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto !important;
  }

  [data-feature-motion-root] :where(
    [data-motion-hero],
    [data-motion-reveal],
    [data-motion-parallax-media],
    [data-motion-card],
    [data-motion-card-media]
  ) {
    opacity: 1 !important;
    translate: 0 0 !important;
    scale: 1 !important;
    clip-path: none !important;
    animation: none !important;
    transition: none !important;
  }

  [data-motion-ticker-track] {
    animation: none !important;
    transform: none !important;
  }
}
