/* LOT94b — approved, narrow presentation corrections.
   Loaded last from index.html. Route-scoped; no renderer, content, controls,
   calculations, destinations, media, or loader behavior is changed. */

/* Academy: preserve the desktop sticky/reveal choreography, but let the
   existing message and actions lead every stacked layout. The reduced-motion
   presentation is stacked at every width by design; normal desktop is not. */
@media (max-width: 1024px) {
  body[data-route="/academy"] #app .page-hero-scroll {
    min-height: auto;
    margin-top: 0;
  }
  body[data-route="/academy"] #app .page-hero-scroll .hero-sticky {
    position: relative;
    display: flex;
    flex-direction: column;
    height: auto;
    padding: var(--space-4) 0 var(--space-8);
  }
  body[data-route="/academy"] #app .page-hero-scroll .hero-left {
    position: relative;
    inset: auto;
    order: 1;
    display: block;
    transform: none !important;
    filter: none !important;
    opacity: 1 !important;
  }
  body[data-route="/academy"] #app .page-hero-scroll .hero-left-inner {
    width: auto;
    min-height: 0;
    margin: 0 auto;
    padding: 0 var(--space-6);
    display: block;
  }
  body[data-route="/academy"] #app .page-hero-scroll .hero-left-inner h1,
  body[data-route="/academy"] #app .page-hero-scroll .hero-left-inner .lead,
  body[data-route="/academy"] #app .page-hero-scroll .hero-left-inner .hero-sub {
    max-width: none;
  }
  body[data-route="/academy"] #app .page-hero-scroll .hero-card {
    position: relative;
    inset: auto;
    order: 2;
    width: auto;
    height: auto;
    aspect-ratio: 16 / 9;
    margin: var(--space-7) var(--space-6) 0;
    transform: none !important;
    border-radius: var(--radius-ui);
    border: 1px solid var(--border);
    box-shadow: none;
  }
  body[data-route="/academy"] #app .page-hero-scroll .reveal-stage {
    position: relative;
    inset: auto;
    order: 3;
    width: 100%;
    height: auto;
    justify-content: center;
    margin-top: var(--space-6);
    transform: none !important;
    filter: none !important;
    opacity: 1 !important;
  }
  body[data-route="/academy"] #app .page-hero-scroll .reveal-img {
    width: min(78%, 420px);
    max-height: none;
  }
  body[data-route="/academy"] #app .page-hero-scroll .reveal-flip {
    width: min(78%, 420px);
  }
  body[data-route="/academy"] #app .page-hero-scroll .hero-marquee {
    order: 4;
  }
  body[data-route="/academy"] #app .page-hero-scroll .hero-cue {
    display: none;
  }
}

/* Desktop reduced-motion mode is already static in site.css. Only change its
   flex order so its existing desktop sizing and spacing remain intact. */
@media (prefers-reduced-motion: reduce) and (min-width: 1025px) {
  body[data-route="/academy"] #app .page-hero-scroll .hero-sticky {
    display: flex;
    flex-direction: column;
  }
  body[data-route="/academy"] #app .page-hero-scroll .hero-left {
    order: 1;
  }
  body[data-route="/academy"] #app .page-hero-scroll .hero-card {
    order: 2;
  }
  body[data-route="/academy"] #app .page-hero-scroll .reveal-stage {
    order: 3;
  }
  body[data-route="/academy"] #app .page-hero-scroll .hero-marquee {
    order: 4;
  }
}

/* Keep the Academy switcher, search and menu on one row at the audited
   360px width; the logo and controls remain present and operable. */
@media (max-width: 390px) {
  body[data-route="/academy"] #site-nav .nav-inner {
    flex-wrap: nowrap;
    gap: 8px;
    padding: 10px 12px;
  }
  body[data-route="/academy"] #site-nav .nav-switcher {
    flex: 1 1 auto;
    min-width: 0;
    margin-right: 0;
  }
  body[data-route="/academy"] #site-nav .universe-trigger {
    min-width: 0;
    max-width: 100%;
    padding: 4px 0;
  }
  body[data-route="/academy"] #site-nav .universe-brand {
    height: 30px;
    max-width: 48vw;
  }
  body[data-route="/academy"] #site-nav :is(.nav-search-btn, .nav-burger) {
    flex: 0 0 42px;
    width: 42px;
    margin: 0;
  }
  body[data-route="/academy"] #site-nav .nav-search-btn {
    justify-content: center;
    padding: 0;
  }
}

/* FC parcours composeur: permit the existing price columns and long group
   labels to shrink/wrap at mobile widths instead of widening the page. */
@media (max-width: 767px) {
  body[data-route^="/formation-continue/parcours/"] #app .fc-pricing-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    min-width: 0;
  }
  body[data-route^="/formation-continue/parcours/"] #app .fc-pricing-grid > *,
  body[data-route^="/formation-continue/parcours/"] #app .fc-pricing-col,
  body[data-route^="/formation-continue/parcours/"] #app .fc-pricing-left {
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }
  body[data-route^="/formation-continue/parcours/"] #app .fc90-group-toggle {
    min-width: 0;
    max-width: 100%;
    gap: 8px;
  }
  body[data-route^="/formation-continue/parcours/"] #app .fc90-group-title {
    flex: 1 1 auto;
    min-width: 0;
    white-space: normal;
    overflow-wrap: anywhere;
  }
  body[data-route^="/formation-continue/parcours/"] #app .fc90-group-toggle :is(.fc90-group-count, .fc90-group-chevron) {
    flex: 0 0 auto;
  }
}

/* Planifier: restore semantic text color to the S0/S1/... labels and allow
   both table columns to wrap within the viewport rather than forcing a rail. */
@media (max-width: 767px) {
  body[data-route="/formation-continue/organiser-sa-formation/planifier"]
    #app .fc-rich-table-wrap {
    min-width: 0;
  }
  body[data-route="/formation-continue/organiser-sa-formation/planifier"]
    #app .fc-rich-table {
    width: 100%;
    min-width: 0 !important;
    table-layout: fixed;
  }
  body[data-route="/formation-continue/organiser-sa-formation/planifier"]
    #app .fc-rich-table :is(th, td) {
    min-width: 0;
    white-space: normal;
    overflow-wrap: anywhere;
  }
  body[data-route="/formation-continue/organiser-sa-formation/planifier"]
    #app .fc-rich-table td:first-child {
    color: inherit !important;
  }
}

body[data-route="/formation-continue/organiser-sa-formation/planifier"]
  #app .fc-rich-table td:first-child {
  color: inherit !important;
}

/* Academy admissions callout: brighten only text on its dark teal surface. */
@media (max-width: 390px) {
  body[data-route^="/formation-continue"] #site-nav .universe-brand {
    height: 30px;
    max-width: 48vw;
  }
  body[data-route^="/formation-continue"] #site-nav :is(.nav-search-btn, .nav-burger) {
    flex: 0 0 42px;
    width: 42px;
    margin: 0;
  }
  body[data-route^="/formation-continue"] #site-nav .nav-search-btn {
    justify-content: center;
    padding: 0;
  }
}

body[data-route="/academy"] #app #hub-fomo-academy > .hub-fomo-copy > .eyebrow,
body[data-route="/academy"] #app #hub-fomo-academy .hub-fomo-note {
  color: var(--text) !important;
}
body[data-route="/academy"] #app #hub-fomo-academy .hub-fomo-meta {
  color: var(--text-secondary) !important;
}

/* Keep the existing WhatsApp green and actions; use readable navy for the
   label and its currentColor SVG in the routes named by LOT94a. */
body:is(
  [data-route="/academy"],
  [data-route="/lp/formation-initiale"],
  [data-route="/lp/formation-continue"],
  [data-route="/lp/partenariat"],
  [data-route="/contact"]
) :is(#site-nav, #app, #site-footer) .btn-wa {
  color: var(--blue-950, #081420) !important;
}

/* LP Formation Continue: darken only the existing primary CTA fill; retain
   its white label and all CTA copy/behavior. Semantic text colors adapt to
   the active light/dark surfaces rather than forcing white on a light page. */
body[data-route="/lp/formation-continue"] #app
  .page[data-page="/lp/formation-continue"] .btn-primary:not(.btn-wa) {
  background: var(--fc-magenta, #b91459) !important;
  border-color: var(--fc-magenta, #b91459) !important;
  color: #fff !important;
}
body[data-route="/lp/formation-continue"] #app
  .page[data-page="/lp/formation-continue"] :is(.section-head .num, .count-frag, .info-item .k, .fc-info-k, .hero-certs-label) {
  color: var(--text-secondary) !important;
}
body[data-route="/lp/formation-continue"] #app
  .page[data-page="/lp/formation-continue"] .badge {
  color: var(--text) !important;
}

/* Reservation CTA text alone: a small move to the existing deeper NK ink
   clears the worst orange stop. No questions, fields, or form descendants. */
body[data-route="/numeriklub/reservation"] #app
  .btn-primary,
body[data-route="/numeriklub/reservation"] #app
  .btn-primary :is(.nk-cta-label,.nk-cta-arrow-phrase,.nk-cta-arrow) {
  color: var(--blue-950, #08212f) !important;
  -webkit-text-fill-color: var(--blue-950, #08212f) !important;
}
/* The legacy CTA adapter owns inline text fill. Keep its ink and lighten
   only the gradient's darkest stop, using the existing orange tokens. */
body[data-route="/numeriklub/reservation"] #app .btn-primary {
  background-image: linear-gradient(165deg,var(--orange-500),var(--orange-400)) !important;
}

/* Existing labels only: no field, association, form or event is changed. */
body[data-route="/lp/formation-continue"] #app label {
  color: var(--text) !important;
}

/* Inline legacy font-style references this variable. Resolve it locally,
   rather than rewriting the NK presentation renderer or its callbacks. */
body:is([data-route^="/numeriklub"],[data-route^="/lp/numeriklub"]) #app :is(h1,h2,h3) {
  --nk70-display-style: normal !important;
}

@media (max-width: 720px) {
  body[data-route^="/formation-continue/parcours/"] #app .fc-price-packs-grid {
    grid-template-columns: minmax(0,1fr) !important;
  }
  body[data-route^="/formation-continue/parcours/"] #app .fc-price-pack {
    min-width: 0 !important;
    max-width: 100% !important;
  }
  body[data-route^="/formation-continue/parcours/"] #app .fc-price-pack-top {
    flex-wrap: wrap !important;
  }
  body[data-route^="/formation-continue/parcours/"] #app .fc-price-pack-badge {
    max-width: 100% !important;
    white-space: normal !important;
  }
}

/* Editorial direction: upright H1/H2/H3, including authored emphasis,
   on the audited routes only. The President-board route is intentionally
   absent from this allowlist. Font families, weights, sizes and copy remain
   owned by their existing rules. */
body:is(
  [data-route="/"],
  [data-route="/formation-continue"],
  [data-route^="/formation-continue/"],
  [data-route="/numeriklub"],
  [data-route^="/numeriklub/"],
  [data-route="/academy"],
  [data-route^="/academy/"],
  [data-route="/lp/numeriklub"],
  [data-route^="/lp/numeriklub/"],
  [data-route="/lp/formation-initiale"],
  [data-route="/lp/formation-continue"],
  [data-route="/lp/partenariat"],
  [data-route="/contact"],
  [data-route="/cgv"],
  [data-route="/mentions-legales"],
  [data-route="/politique-confidentialite"],
  [data-route="/accessibilite"]
) #app :is(h1, h2, h3):not([id*="president"] *):not([class*="president"] *),
body:is(
  [data-route="/"],
  [data-route="/formation-continue"],
  [data-route^="/formation-continue/"],
  [data-route="/numeriklub"],
  [data-route^="/numeriklub/"],
  [data-route="/academy"],
  [data-route^="/academy/"],
  [data-route="/lp/numeriklub"],
  [data-route^="/lp/numeriklub/"],
  [data-route="/lp/formation-initiale"],
  [data-route="/lp/formation-continue"],
  [data-route="/lp/partenariat"],
  [data-route="/contact"],
  [data-route="/cgv"],
  [data-route="/mentions-legales"],
  [data-route="/politique-confidentialite"],
  [data-route="/accessibilite"]
) #app :is(h1, h2, h3) :is(em, i):not([id*="president"] *):not([class*="president"] *) {
  font-style: normal !important;
}