/* LOT97 — public-site coherence, presentation-only.
   Loaded as a final visual layer. No DOM adapters, content, behavior, or
   editorial composition are changed. Form, dialog, booking, and tunnel UI is
   intentionally outside the structural treatments below. */

/* Private, deliberately small geometry system. It does not replace the Hub's
   shared tokens or alter icon/circle silhouettes. */
body[data-route] #app,
body[data-route] #app :is(.page, .nk70-detail, .fc80-page, .fc90-page) {
  --lot97-radius-control: 10px;
  --lot97-radius-card: 14px;
  --lot97-radius-panel: 18px;
  --lot97-radius-pill: 999px;
  --lot97-card-shadow: 0 6px 18px rgba(14, 36, 56, .085);
  --lot97-orange: #FE9F14;
  --lot97-orange-ink: #1C1C1C;
  --lot97-badge-sky: #EAF7FD;
  --lot97-badge-ink: #1C1C1C;
}

/* Lot70 consumes these values through its inline presentation declarations.
   Calendar, essentials containing controls, and any protected surface retain
   their existing treatment. */
body[data-route] #app .nk70-detail {
  --nk70-radius-sm: var(--lot97-radius-control);
  --nk70-radius-md: var(--lot97-radius-control);
  --nk70-radius-lg: var(--lot97-radius-card);
  --nk70-radius-pill: var(--lot97-radius-pill);
  --nk70-card-radius: var(--lot97-radius-card);
  --nk70-fact-radius: var(--lot97-radius-control);
  --nk70-faq-radius: var(--lot97-radius-card);
  --nk70-price-radius: var(--lot97-radius-card);
  --nk70-shadow: var(--lot97-card-shadow);
  --nk70-section-space-block: clamp(46px, 5.2vw, 72px);
}

body[data-route] #app .nk70-detail .nk70-card:not(.nk70-calendar):not(:where(
    form, form *, dialog, dialog *, [role="dialog"], [role="dialog"] *,
    [aria-modal="true"], [aria-modal="true"] *, [class*="modal"], [class*="modal"] *,
    [class*="Modal"], [class*="Modal"] *)):not(:has(
      .nk70-calendar, form, dialog, [role="dialog"], [aria-modal="true"],
      [class*="modal"], [class*="Modal"])) {
  --nk70-card-radius: var(--lot97-radius-card) !important;
  --nk70-card-shadow: var(--lot97-card-shadow) !important;
}

/* The prior Lot89 detail opt-in carries more selector weight than the base
   Lot70 token rule, so repeat the safe override at that existing boundary. */
body[data-route] #app .nk70-detail.nk89-detail-page .nk70-card:not(.nk70-calendar):not(:where(
    form, form *, dialog, dialog *, [role="dialog"], [role="dialog"] *,
    [aria-modal="true"], [aria-modal="true"] *, [class*="modal"], [class*="modal"] *,
    [class*="Modal"], [class*="Modal"] *)):not(:has(
      .nk70-calendar, form, dialog, [role="dialog"], [aria-modal="true"],
      [class*="modal"], [class*="Modal"])) {
  --nk70-card-radius: var(--lot97-radius-card) !important;
  --nk70-card-shadow: var(--lot97-card-shadow) !important;
}

body[data-route] #app .nk70-detail .nk70-badge:not(:where(
  form, form *, dialog, dialog *, [role="dialog"], [role="dialog"] *,
  [aria-modal="true"], [aria-modal="true"] *, [class*="modal"], [class*="modal"] *,
  [class*="Modal"], [class*="Modal"] *)) {
  --nk70-badge-surface: var(--lot97-badge-sky) !important;
  --nk70-badge-image: none !important;
  color: var(--lot97-badge-ink) !important;
}

/* Primary presentation links share the same warm orange/ink pair. Explicit
   route exclusions keep reservation, inscription, booking and checkout flows
   owned by their existing systems. */
body:not([data-route="/numeriklub/reservation"]):not([data-route^="/numeriklub/reservation/"]):not([data-route="/reservation"]):not([data-route^="/reservation/"]):not([data-route*="booking"]):not([data-route*="checkout"]):not([data-route*="inscription"])
  #app#app a:is(.btn-primary, .btn-reserve, .nk70-cta, .fcv-btn-primary):not(:where(
    form, form *, dialog, dialog *, [role="dialog"], [role="dialog"] *,
    [aria-modal="true"], [aria-modal="true"] *, [class*="modal"], [class*="modal"] *,
    [class*="Modal"], [class*="Modal"] *, .lot95-channel-cta)) {
  border-radius: var(--lot97-radius-control);
  /* FC79 owns a doubled-ID important fill. Resolve its existing local token
     on the button, rather than changing FC theme tokens or DOM adapters. */
  --fc79-magenta: var(--lot97-orange);
  background-color: var(--lot97-orange) !important;
  background-image: none !important;
  border-color: var(--lot97-orange) !important;
  color: var(--lot97-orange-ink) !important;
  -webkit-text-fill-color: var(--lot97-orange-ink) !important;
}

body[data-route] #app .nk70-detail .nk70-cta:is(.btn-primary, .btn-reserve):not(:where(
  form, form *, dialog, dialog *, [role="dialog"], [role="dialog"] *,
  [aria-modal="true"], [aria-modal="true"] *, [class*="modal"], [class*="modal"] *,
  [class*="Modal"], [class*="Modal"] *)) {
  --nk70-cta-surface: var(--lot97-orange) !important;
  --nk70-cta-copy: var(--lot97-orange-ink) !important;
  --nk70-cta-border: var(--lot97-orange) !important;
  --nk70-cta-image: none !important;
  --nk70-radius-md: var(--lot97-radius-control) !important;
}

/* Editorial sections only. Sticky/reveal hero structures, brush choreography,
   and their own spacing are explicitly excluded. */
body[data-route] #app :is(.nk70-detail, .page) section.section:not(.page-hero):not(
  :has(.page-hero, .page-hero-scroll, .hero-sticky, .reveal-stage, .brush)) {
  padding-block: clamp(46px, 5.2vw, 72px);
}

/* Sections that use the established Lot70 class also consume its section token;
   never apply it to the hero or to any section containing hero choreography. */
body[data-route] #app .nk70-detail section.nk70-section:not(.page-hero):not(:has(
  .page-hero, .page-hero-scroll, .hero-sticky, .reveal-stage, .brush)) {
  --nk70-section-space-block: clamp(46px, 5.2vw, 72px);
}

/* Known FC presentation cards: one restrained elevation, with existing grids
   responsible for sizing and flex alignment keeping their CTAs on a common
   baseline. No price/form/cart/tunnel surfaces are included. */
body:is([data-route="/formation-continue"], [data-route^="/formation-continue/"])
  #app :is(.fc80-page, .fc90-page) :is(
    .fcv-start-card, .fcv-path, .fcv-info-card, .fc-pp-mod, .fc-pp-socle-price
  ):not(:where(form, form *, dialog, dialog *, [role="dialog"], [role="dialog"] *,
    [aria-modal="true"], [aria-modal="true"] *, [class*="modal"], [class*="modal"] *,
    [class*="Modal"], [class*="Modal"] *)) {
  border-radius: var(--lot97-radius-card);
  box-shadow: var(--lot97-card-shadow);
}

body:is([data-route="/formation-continue"], [data-route^="/formation-continue/"])
  #app :is(.fc80-page, .fc90-page) :is(.fcv-start-grid, .fcv-path-grid) {
  align-items: stretch;
}

body:is([data-route="/formation-continue"], [data-route^="/formation-continue/"])
  #app :is(.fc80-page, .fc90-page) :is(.fcv-start-card, .fcv-path) {
  display: flex;
  flex-direction: column;
}

body:is([data-route="/formation-continue"], [data-route^="/formation-continue/"])
  #app :is(.fc80-page, .fc90-page) :is(.fcv-start-card, .fcv-path)
  :is(.fcv-btn-primary, .btn-primary) {
  margin-block-start: auto;
}

/* Mobile: reliable 16px section gutters and presentation-link touch targets.
   The hero is omitted so its established responsive composition remains intact. */
@media (max-width: 767px) {
  body[data-route] #app :is(.nk70-detail, .page) section.section:not(.page-hero):not(
    :has(.page-hero, .page-hero-scroll, .hero-sticky, .reveal-stage, .brush))
    > .container {
    box-sizing: border-box;
    width: min(calc(100% - 32px), 1180px);
    margin-inline: auto;
  }

  body:is([data-route="/formation-continue"], [data-route^="/formation-continue/"])
    #app :is(.fc80-page, .fc90-page) .fc79-section:not(:has(
      .page-hero, .page-hero-scroll, .hero-sticky, .reveal-stage, .brush))
    > .container,
  body:is([data-route="/formation-continue"], [data-route^="/formation-continue/"])
    #app :is(.fc80-page, .fc90-page) section.section:not(.page-hero):not(:has(
      .page-hero, .page-hero-scroll, .hero-sticky, .reveal-stage, .brush))
    > .container {
    box-sizing: border-box;
    width: min(calc(100% - 32px), 1180px);
    margin-inline: auto;
  }

  body:not([data-route="/numeriklub/reservation"]):not([data-route^="/numeriklub/reservation/"]):not([data-route="/reservation"]):not([data-route^="/reservation/"]):not([data-route*="booking"]):not([data-route*="checkout"]):not([data-route*="inscription"])
    #app#app .page a:is(.btn-primary, .btn-reserve, .nk70-cta, .fcv-btn-primary):not(:where(
      form, form *, dialog, dialog *, [role="dialog"], [role="dialog"] *,
      [aria-modal="true"], [aria-modal="true"] *, [class*="modal"], [class*="modal"] *,
      [class*="Modal"], [class*="Modal"] *, .lot95-channel-cta)) {
    box-sizing: border-box;
    min-height: 48px;
    padding-block: 12px;
    white-space: normal;
    text-wrap: balance;
  }

  body[data-route] #app .nk70-detail {
    --nk70-section-space-block: 44px;
  }

  body[data-route] #app :is(.nk70-detail, .page) section.section:not(.page-hero):not(
    :has(.page-hero, .page-hero-scroll, .hero-sticky, .reveal-stage, .brush)) {
    padding-block: 44px;
  }

  body:is([data-route="/formation-continue"], [data-route^="/formation-continue/"])
    #app :is(.fc80-page, .fc90-page) :is(.fcv-start-card, .fcv-path) {
    border-radius: var(--lot97-radius-control);
  }
}

@media (prefers-reduced-motion: reduce) {
  body[data-route] #app :is(.nk70-detail, .fc80-page, .fc90-page) :is(
    .nk70-card, .fcv-start-card, .fcv-path, .fcv-info-card, .fc-pp-mod
  ) {
    scroll-behavior: auto;
  }
}

/* Shared editorial primitives also used by the global home, Academy, LPs and
   generic public pages. Never resize controls or structural form wrappers. */
body[data-route] #app {
  --lot97-space-section: clamp(48px, 5vw, 72px);
  --lot97-space-card: clamp(20px, 2vw, 28px);
  --lot97-gap: 24px;
  --lot97-cta-height: 48px;
}
body[data-route]:not([data-route*="president"]) #app .card:not(:where(form, form *, dialog *, [role="dialog"] *, [id*="president"] *, [class*="president"] *))
  :is(h3, h4) { font-style: normal; }
body[data-route] #app :is(.card, .fcv-path, .fcv-start-card, .fc-pp-mod, .fc-rich-card)
  :is(.btn) { font-variant-numeric: tabular-nums; }
body[data-route] #app :is(.card, .fcv-path, .fcv-start-card, .fc-pp-mod, .fc-rich-card):not(:where(
  form, form *, dialog, dialog *, [role="dialog"], [role="dialog"] *,
  [id*="president"], [id*="president"] *, [class*="president"], [class*="president"] *
)):not(:has(form, dialog, [role="dialog"], input, select, textarea)) {
  border-radius: var(--lot97-radius-card) !important;
  box-shadow: var(--lot97-card-shadow) !important;
}
body[data-route] #app .card:not(:where(
  form, form *, dialog, dialog *, [role="dialog"], [role="dialog"] *,
  [id*="president"], [id*="president"] *, [class*="president"], [class*="president"] *
)):not(:has(form, input, select, textarea)):not(.campus):not(.program-logo-panel) {
  padding: var(--lot97-space-card) !important;
}
body[data-route^="/formation-continue"] #app .fcv-path-body {
  display: flex;
  flex-direction: column;
  flex: 1;
}
body[data-route^="/formation-continue"] #app .fcv-path-body > :is(.btn, .fcv-btn) {
  margin-top: auto;
}
body[data-route] #app :is(.badge, .tag, .fcv-badge, .fc90-tool-badge):not(:where(
  form *, dialog *, [role="dialog"] *, [id*="president"] *, [class*="president"] *
)) {
  border-radius: var(--lot97-radius-pill);
  background: var(--lot97-badge-sky) !important;
  color: var(--lot97-badge-ink) !important;
}
body[data-route] #app :is(.grid-2,.grid-3,.grid-4,.fcv-path-grid,.fc-rich-grid,.fc-module-grid) {
  align-items: stretch;
  gap: var(--lot97-gap);
}
body[data-route] #app :is(.grid-2,.grid-3,.grid-4,.fcv-path-grid,.fc-rich-grid,.fc-module-grid)
  > :is(a.card, article.card,.fcv-path) {
  align-self: stretch;
}
body[data-route]:not([data-route*="president"]) #app :is(h1,h2,h3,h4):not(:where([id*="president"] *, [class*="president"] *)) {
  font-style: normal !important;
}
body[data-route]:not([data-route*="president"]) #app :is(h1,h2,h3,h4):not(:where([id*="president"] *, [class*="president"] *)) :is(em,i) {
  font-style: normal !important;
}
/* The legacy presentation sheets use doubled-root IDs. This narrowly scoped
   control rule clears their 44px minimum without editing those owners. */
body[data-route] #app#app#app :is(a.btn,a.fcv-btn):not(:where(form *,dialog *,[role="dialog"] *)) {
  min-height: var(--lot97-cta-height) !important;
  border-radius: var(--lot97-radius-control) !important;
}
body[data-route] #app :is(.fcv-hero-actions,.hero-ctas,.hero-cta,.cta-row)
  > a.btn-primary + a.btn-primary:not(.btn-wa) {
  background: transparent;
  background-image: none;
  color: var(--text);
  border: 1px solid currentColor;
}
body[data-route] #app :is(header, .fcv-hero)
  a:is(.btn-primary,.fcv-btn-primary) ~ a:is(.btn-primary,.fcv-btn-primary):not(.btn-wa) {
  background: transparent !important;
  background-image: none !important;
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
  border-color: currentColor !important;
}
@media(max-width:767px) {
  body[data-route] #app {
    --lot97-gap: 20px;
    --lot97-space-section: 44px;
  }
  body[data-route] #app .page > section > .container {
    width: calc(100% - 32px);
    max-width: var(--container-max, 1180px);
    margin-inline: auto;
    padding-inline: 0;
  }
  /* Old FC edge-to-edge carousels had -18px margins. They must not exceed
     the new 16px mobile page gutter. Keep their swipe behavior intact. */
  body[data-route^="/formation-continue"] #app .fc-ui-carousel {
    margin-inline: 0;
    max-width: 100%;
    padding-inline: 0;
    scroll-padding-inline: 0;
  }
}
/* Repeated ID raises CSS specificity only; no duplicate DOM ID is created.
   Legacy presentation rules must not erase a keyboard-only CTA indicator. */
body[data-route] #app#app a.btn:focus-visible {
  outline: 3px solid #007fa3 !important;
  outline-offset: 3px !important;
}
