/* Socle public 2026 : cette peau est chargée uniquement par PublicLayout.
   Le cockpit conserve tokens.css et site.css sans ces surcharges. */

body[data-ne-shell="public"] {
  --ne-bg: #ffffff;
  --ne-surface: #ffffff;
  --ne-surface-2: #f1f3f5;
  --ne-image-stage: #ffffff;
  --ne-ink: #12161d;
  --ne-ink-2: #68717d;
  --ne-ink-3: #68717d;
  --ne-line: #d5d9df;
  --ne-line-2: #d5d9df;
  --ne-action: #2457f5;
  --ne-action-strong: #2457f5;
  --ne-cyan-soft: #f1f3f5;
  --ne-font-display: "Roboto Condensed", "Arial Narrow", sans-serif;
  --ne-font-sans: "Hanken Grotesk", system-ui, -apple-system, sans-serif;
  --ne-font-mono: "Geist Mono", ui-monospace, monospace;
  --ne-header-h: 68px;
  --ne-wrap-max: 1180px;
  --ne-wrap-pad: 32px;
  /* Échelle de l'accueil validé ; rôles communs à toutes les rubriques. */
  --ne-fs-h1: clamp(1.65rem, 2.45vw, 2.45rem);
  --ne-fs-h2: clamp(1.8rem, 2.3vw, 2.3rem);
  --ne-fs-h3: 1.3rem;
  --ne-fs-h4: 1rem;
  --ne-fs-body: 1rem;
  --ne-fs-body-sm: .875rem;
  --ne-fs-small: .875rem;
  --ne-fs-caption: .75rem;
}

@media (max-width: 680px) {
  body[data-ne-shell="public"] { --ne-fs-h1: clamp(1.8rem, 9vw, 2.35rem); --ne-wrap-pad: 16px; }
}

/* Le masquage d'un état public (offre périmée, panneau fermé) prime sur
   les display:grid/flex des composants. Le cockpit reste hors périmètre. */
body[data-ne-shell="public"] [hidden] {
  display: none !important;
}

/* Les légendes de tableau restent disponibles aux lecteurs d’écran sans
   répéter visuellement le titre placé juste au-dessus. */
body[data-ne-shell="public"] .sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Un seul cadre, celui de la sélection Sauvegarde validée. Les limites de
   lecture restent sur les textes, jamais sur le cadre des pages et outils. */
@layer ne-public-layout {
  body[data-ne-shell="public"] :is(.ne-page, .pp, .model-wrap, .site-header__inner, .site-footer > .wrap) {
    box-sizing: border-box !important;
    width: min(100%, var(--ne-wrap-max)) !important;
    max-width: var(--ne-wrap-max) !important;
    margin-inline: auto !important;
    padding-inline: var(--ne-wrap-pad) !important;
  }
}

/* Les tailles sont prioritaires sur les anciennes règles Astro, y compris
   leurs !important. Cette couche ne concerne ni l'accueil de référence, ni
   l'admin, ni les chiffres de prix/score. Les couleurs et contenus restent locaux. */
@layer ne-public-type {
  body[data-ne-shell="public"] main:not(.model-page) :is(h1, h2, h3, h4) {
    font-family: var(--ne-font-display) !important;
    font-weight: 700 !important;
    letter-spacing: -.025em !important;
    overflow-wrap: anywhere !important;
  }
  body[data-ne-shell="public"] main:not(.model-page) h1 {
    font-size: var(--ne-fs-h1) !important;
    line-height: 1.06 !important;
  }
  body[data-ne-shell="public"] main:not(.model-page) h1 :is(span, strong, em) {
    font-size: inherit !important;
    line-height: inherit !important;
  }
  body[data-ne-shell="public"] main:not(.model-page) h2 {
    font-size: var(--ne-fs-h2) !important;
    line-height: 1.12 !important;
  }
  body[data-ne-shell="public"] main:not(.model-page) h3 {
    font-size: var(--ne-fs-h3) !important;
    line-height: 1.18 !important;
  }
  body[data-ne-shell="public"] main:not(.model-page) h4 {
    font-size: var(--ne-fs-h4) !important;
    line-height: 1.3 !important;
  }
  /* Un titre de carte garde sa taille, même si sa sémantique exige un h2. */
  body[data-ne-shell="public"] main:not(.model-page) :is(
    .guide-door-card, .analysis-card, .ne-card, .configuration-notice,
    .app-intro-card, .comparison-intro-card, [class$="-intro-card"],
    .lounch-card, .lounch-note, .radar-editorial, .radar-cta, .baro-cta,
    .mnas-cta-band, .pp-usage-detail, .mtb-intro, .mtb-faq__head
  ) h2,
  body[data-ne-shell="public"] main:not(.model-page) :is(.about-author__name, .about-contact__title, .pp-content-h2--brand) {
    font-size: var(--ne-fs-h3) !important;
    line-height: 1.18 !important;
  }
  body[data-ne-shell="public"] main:not(.model-page) .pp-nas-signal h2 {
    font-size: var(--ne-fs-body) !important;
    line-height: 1.3 !important;
    letter-spacing: 0 !important;
    text-transform: none;
  }
  body[data-ne-shell="public"] main:not(.model-page) p {
    font-size: var(--ne-fs-body) !important;
    line-height: 1.6 !important;
  }
  body[data-ne-shell="public"] main:not(.model-page) :is(
    .ne-card, .product-card, .documented-device-card, .guide-door-card,
    .guide-featured-card, .analysis-card, .configuration-card, .tool-card,
    .brand-card, .app-card, .ai-app-card, .os-card, .search-result
  ) p {
    font-size: var(--ne-fs-body-sm) !important;
    line-height: 1.5 !important;
  }
  body[data-ne-shell="public"] main.checklist-index .ne-card p {
    font-size: var(--ne-fs-body) !important;
  }
  body[data-ne-shell="public"] main:not(.model-page) :is(
    .kicker, .ne-kicker, .ne-eyebrow, [class$="-kicker"], [class$="__kicker"], [class$="__eyebrow"],
    [class$="__meta"], [class$="__badge"], [class$="__category"],
    [class$="__origin"], .guide-authorship, .method-hero__date, figcaption,
    .catalog-section__head > p, .corrections-hero__copy > p
  ) {
    font-size: var(--ne-fs-caption) !important;
    line-height: 1.45 !important;
  }
  body[data-ne-shell="public"] main:not(.model-page) :is(input, select, textarea) {
    font-size: var(--ne-fs-body) !important;
    line-height: 1.5 !important;
  }
  body[data-ne-shell="public"] main:not(.model-page) :is(button, .btn, label) {
    font-size: var(--ne-fs-small) !important;
    line-height: 1.4 !important;
  }
  body[data-ne-shell="public"] main:not(.model-page) :is(.ne-faq-item, .guide-faq__item) > summary {
    font-size: var(--ne-fs-h3) !important;
    line-height: 1.18 !important;
  }
}

body[data-ne-shell="public"].ne-halo-bg,
body[data-ne-shell="public"].ne-halo-bg::before {
  background: #ffffff !important;
}

body[data-ne-shell="public"] h1,
body[data-ne-shell="public"] h2,
body[data-ne-shell="public"] h3,
body[data-ne-shell="public"] h4,
body[data-ne-shell="public"] h5,
body[data-ne-shell="public"] h6 {
  font-family: var(--ne-font-display) !important;
  font-weight: 700;
  letter-spacing: -0.025em;
}

body[data-ne-shell="public"] .site-header {
  background: #12161d;
  border-bottom-color: #12161d;
  box-shadow: none;
  /* Les pages éditoriales et outils ne modifient pas l'interligne du chrome. */
  line-height: 1.5;
}

body[data-ne-shell="public"] .site-header__inner {
  grid-template-columns: 118px minmax(0, 1fr) auto;
  gap: clamp(16px, 2vw, 32px);
  max-width: 1180px;
}

body[data-ne-shell="public"] .site-header__brand {
  min-height: 44px;
}

body[data-ne-shell="public"] .site-header__logo {
  display: block;
  width: 118px;
  height: auto;
}

body[data-ne-shell="public"] .site-header__nav {
  gap: clamp(14px, 1.6vw, 25px);
  color: #f1f3f5;
  font-size: 14px;
  font-weight: 600;
}

body[data-ne-shell="public"] .site-header__nav-link,
body[data-ne-shell="public"] .site-header__nav a {
  min-height: 44px;
  color: #f1f3f5;
  border-bottom-width: 1px;
}

body[data-ne-shell="public"] .site-header__nav-link:hover,
body[data-ne-shell="public"] .site-header__nav-link[aria-current="page"],
body[data-ne-shell="public"] .site-header__nav a:hover,
body[data-ne-shell="public"] .site-header__nav a[aria-current="page"] {
  color: #ffffff;
  border-bottom-color: #2457f5;
}

body[data-ne-shell="public"] .site-header__icon,
body[data-ne-shell="public"] .site-header__mobile-toggle {
  border-color: #68717d;
  border-radius: 0;
  background: transparent;
  color: #ffffff;
}

body[data-ne-shell="public"] .site-header__icon:hover,
body[data-ne-shell="public"] .site-header__mobile-toggle:hover {
  border-color: #f1f3f5;
  color: #ffffff;
  box-shadow: none;
}

body[data-ne-shell="public"] .site-header__cta {
  background: #ffffff;
  border-color: #ffffff;
  border-radius: 0;
  box-shadow: none;
  color: #12161d;
  font-weight: 700;
}

body[data-ne-shell="public"] .site-header__cta:hover {
  background: #f1f3f5;
  border-color: #f1f3f5;
  color: #12161d;
}

.site-header__cta-short { display: none; }

body[data-ne-shell="public"] .site-header__need-popover,
body[data-ne-shell="public"] .site-header__search-popover {
  border-radius: 0;
  border-color: #d5d9df;
  box-shadow: none;
}

/* Le même menu éditorial et les mêmes actions dans chaque rubrique. */
body[data-ne-shell="public"] .site-header__need-popover {
  left: auto;
  right: 0;
}
body[data-ne-shell="public"] .site-header__need-popover::before {
  left: auto;
  right: 24px;
}
body[data-ne-shell="public"] .site-header :is(a, button, summary, input):focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 3px;
}

body[data-ne-shell="public"] .site-header__need-popover a {
  color: #12161d;
}

body[data-ne-shell="public"] .site-header__need-popover a small {
  color: #606976;
}

body[data-ne-shell="public"] .site-header__need-popover a:is(:hover, [aria-current="page"]) {
  background: #f1f3f5;
  color: #12161d;
}

body[data-ne-shell="public"] .site-header__need-popover a:is(:hover, [aria-current="page"]) :is(strong, span) {
  color: #12161d;
}

/* Le cadre appartient à la carte, pas une seconde fois à son image. */
body[data-ne-shell="public"] :is(.product-card, .documented-device-card) > :is(.product-card__media, .documented-device-card__media) {
  border: 0;
  border-bottom: 1px solid var(--ne-line);
  border-radius: 0;
  box-shadow: none;
}

/* Un titre de carte-lien reste identifiable avant le survol, aussi au clavier
   et sur téléphone. Les cartes non cliquables gardent leurs titres noirs. */
body[data-ne-shell="public"] main a:is(.ne-card-standard, .ne-card-decision) :is(h2, h3) {
  color: var(--ne-action);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: .2em;
}

body[data-ne-shell="public"] .site-header__need-popover a,
body[data-ne-shell="public"] .header-search-item,
body[data-ne-shell="public"] .site-header__mobile-nav a {
  border-radius: 0;
}

body[data-ne-shell="public"] .site-header__mobile-panel {
  border-top-color: #68717d;
  background: #12161d;
}

body[data-ne-shell="public"] .site-header__mobile-kicker {
  color: #d5d9df;
}

body[data-ne-shell="public"] .site-header__mobile-nav a {
  border-color: #68717d;
  background: transparent;
  color: #ffffff;
}

body[data-ne-shell="public"] .site-footer {
  margin-top: var(--ne-s-11);
  padding: var(--ne-s-10) 0 var(--ne-s-7);
  border-top: 1px solid #d5d9df;
  background: #fafafa;
  color: #12161d;
}

/* La fiche porte déjà son espacement final : ne pas cumuler quatre marges. */
body[data-ne-shell="public"] #main-content > .pp-main { padding-bottom: 0; }
body[data-ne-shell="public"] .pp-main .pp-trust-section { margin-bottom: 0; }
body[data-ne-shell="public"]:has(.pp-main) .site-footer { margin-top: 0; }

body[data-ne-shell="public"] .site-footer__grid {
  gap: clamp(20px, 2.5vw, 40px);
}

body[data-ne-shell="public"] .site-footer__transparency {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px 32px;
  padding-bottom: 24px;
  margin-bottom: 28px;
  border-bottom: 1px solid var(--ne-line);
  font-size: var(--ne-fs-small);
  line-height: 1.6;
}
body[data-ne-shell="public"] .site-footer__transparency p { margin: 0; }
body[data-ne-shell="public"] .site-footer__transparency a {
  color: var(--ne-action);
  text-decoration: underline;
  text-underline-offset: .18em;
}

body[data-ne-shell="public"] .site-footer__logo-current { display: block; }

body[data-ne-shell="public"] .site-footer__name,
body[data-ne-shell="public"] .site-footer__grid ul a,
body[data-ne-shell="public"] .site-footer__legal,
body[data-ne-shell="public"] .site-footer__tag {
  color: #68717d;
}

body[data-ne-shell="public"] .site-footer__grid > div > .kicker {
  color: #12161d;
  font-family: var(--ne-font-display);
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
}

body[data-ne-shell="public"] .site-footer__cta,
body[data-ne-shell="public"] .site-footer__grid ul a:hover,
body[data-ne-shell="public"] .site-footer__links a:hover {
  color: #2457f5;
}

body[data-ne-shell="public"] .site-footer__legal {
  border-top-color: #d5d9df;
  white-space: normal;
  overflow: visible;
}

body[data-ne-shell="public"] .site-footer__links {
  flex-wrap: wrap;
}

@media (max-width: 1080px) {
  body[data-ne-shell="public"] .site-header__inner { grid-template-columns: 118px minmax(0, 1fr) auto; }
}

@media (max-width: 940px) {
  body[data-ne-shell="public"] .site-header__inner { grid-template-columns: 1fr auto; }
}

@media (max-width: 720px) {
  body[data-ne-shell="public"] .site-footer__transparency { grid-template-columns: 1fr; }
  body[data-ne-shell="public"] .site-footer { margin-top: var(--ne-s-9); }
  body[data-ne-shell="public"] .site-footer__grid > div:not(.site-footer__brand) { border-top-color: #d5d9df; }
}

@media (max-width: 520px) {
  body[data-ne-shell="public"] .site-header__logo { width: 108px; }
  body[data-ne-shell="public"] .site-header__inner { gap: 8px; }
  body[data-ne-shell="public"] .site-header__cta { width: auto; padding-inline: 10px; gap: 6px; font-size: 12px; }
  body[data-ne-shell="public"] .site-header__cta-short { display: inline; }
  body[data-ne-shell="public"] .site-header__cta svg { display: none; }
  body[data-ne-shell="public"] .site-footer { padding-top: var(--ne-s-8); }
}

@media (max-width: 360px) {
  body[data-ne-shell="public"] .site-header__logo { width: 92px; }
}