/* verification mode (?fast / ?p) — nothing animates, so a screenshot is the state */
.novfx *,.novfx *::before,.novfx *::after{ transition:none !important; animation:none !important; }
@media (prefers-reduced-motion:reduce){
  .js .rise,.js .rv{ opacity:1; transform:none; filter:none; transition:none; }
  .cue-line::after,.race__hint i{ animation:none; }
}

/* =====================================================================
   alinma.com integration
   The portal's global CSS (Bootstrap and the theme) styles plain elements
   and common class names. These rules undo that inside the campaign only.
   end.css loads after the portal CSS, so a rule here wins whenever its
   specificity is equal or higher. Nothing outside the campaign is touched.
   ===================================================================== */
:root{
  --sans:'AlinmaTextTT','IBM Plex Sans Arabic','Jost',system-ui,-apple-system,'Segoe UI',Tahoma,Arial,sans-serif;
  --display:'AlinmaDisplay','AlinmaTextTT','IBM Plex Sans Arabic','Jost',system-ui,sans-serif;
}

/* 1. the portal fixes every <header> (position:fixed, z-index:99999, headerdown, navy .header-bg) */
header#hero.hero{ z-index:auto; width:auto; animation:none; }
:where(#hero, #storyA, #race, #storyB) header.ch__head,
:where(#hero, #storyA, #race, #storyB) header.ch__head.header-bg{ position:static; top:auto; z-index:auto; width:auto; animation:none; background:none; }

/* 2. the theme's .hero h1 and .hero p */
#hero h1.display{ position:static; font-size:clamp(40px,5.4vw,82px); line-height:1.1; font-weight:400; color:inherit; }
#hero p{ color:inherit; line-height:inherit; }
#hero p.eyebrow{ color:var(--cop); }
#hero p.sub{ color:rgba(255,255,255,.86); line-height:1.8; }
@media (max-width:760px){ #hero h1.display{ font-size:clamp(34px,10vw,48px); } }

/* 3. Bootstrap reboot and theme element rules */
:where(#hero, #storyA, #race, #storyB) :is(p, h1, h2, h3, h4, h5, h6){ margin:0; color:inherit; font-size:revert; font-weight:revert; line-height:inherit; }
:where(#hero, #storyA, #race, #storyB) :is(ol, ul){ padding-left:revert; margin-top:revert; margin-bottom:revert; }
:where(#hero, #storyA, #race, #storyB) a:hover{ color:inherit; }
:where(#hero, #storyA, #race, #storyB) :is(svg, img){ vertical-align:revert; }
:where(#hero, #storyA, #race, #storyB) :is(thead, tbody, tfoot, tr){ border-style:revert; border-width:revert; border-color:revert; }
:where(#hero, #storyA, #race, #storyB) :is(td, th){ border-top-style:revert; border-top-width:revert; }
:where(#hero, #storyA, #race, #storyB) .cta:hover{ color:var(--ink); }

/* 4. Bootstrap .toast hits the race's points toast */
#race .toast{ display:block; width:auto; max-width:none; border:0; background-clip:border-box; }

/* 5. the theme's .list adds a checkmark, padding and spacing */
:where(#hero, #storyA, #race, #storyB) .list li{ position:static; padding-inline-start:0; color:inherit; }
:where(#hero, #storyA, #race, #storyB) .list li::before{ content:none; }
:where(#hero, #storyA, #race, #storyB) .list li:not(:first-child){ margin-top:0; }

/* 6. Arabic pages: the theme's html[dir=rtl] h2..h5 { line-height:1.4 } outranks the campaign's headings */
html[dir="rtl"] :where(#hero, #storyA, #race, #storyB) :is(h2, h3, h4, h5){ line-height:inherit; }
html[dir="rtl"] .display{ line-height:1.1; }
html[dir="rtl"] .sub{ line-height:1.8; }
html[dir="rtl"] .ch__h{ line-height:1.3; }
html[dir="rtl"] .lead{ line-height:1.85; }
html[dir="rtl"] .stat__n{ line-height:1.05; }
html[dir="rtl"] .stat__l{ line-height:1.5; }
html[dir="rtl"] .step__i{ line-height:1; }
html[dir="rtl"] .step__h{ line-height:1.45; }
html[dir="rtl"] .step__p{ line-height:1.75; }
html[dir="rtl"] .tier .n{ line-height:1.1; }
html[dir="rtl"] .perk__ic{ line-height:1; }
html[dir="rtl"] .perk__h{ line-height:1.45; }
html[dir="rtl"] .perk__p{ line-height:1.7; }
html[dir="rtl"] .fine li{ line-height:1.75; }
html[dir="rtl"] .list li{ line-height:1.6; }
html[dir="rtl"] .fact__v{ line-height:1.55; }
html[dir="rtl"] .tgroup__h{ line-height:1.4; }
html[dir="rtl"] .titem__t{ line-height:1.85; }
html[dir="rtl"] .pkg li{ line-height:1.6; }
html[dir="rtl"] .pill .n{ line-height:1; }
html[dir="rtl"] .meter__v .n{ line-height:1.05; }
html[dir="rtl"] .chip5__s .n, html[dir="rtl"] .chip5__p .n{ line-height:1.1; }
html[dir="rtl"] .race__final-h{ line-height:1.12; }
html[dir="rtl"] .race__final-p{ line-height:1.8; }
html[dir="rtl"] .final__stats .n{ line-height:1.1; }
@media (max-width:760px){
html[dir="rtl"] .titem__t{ line-height:1.8; }
html[dir="rtl"] .race__final-p{ line-height:1.7; }
}