/*
 * StreamNovo — pages claires : toutes les pages sauf l'accueil (body.sn-light).
 * Aucun fond nuit ni noir : header, footer, menus et cartes passent sur les fonds clairs du design system v2
 * (papier #ecebe6, carte #f6f5f1), texte encre, le corail reste l'accent unique.
 * Les petits éléments d'interface encre (badges « Save », sélecteur d'écrans, bouton du bandeau corail) sont conservés.
 *
 * Règles « premium » communes à ces pages (établies sur la page Contact v1.6) :
 * - le corail est réservé à 3 usages par page : la barre du titre h1 et deux éléments clés choisis par page ;
 * - le relief vient des surfaces (blanc franc + ombre très légère), pas des cadres ;
 * - capitales condensées pour les titres uniquement ; boutons, étiquettes et intitulés secondaires en minuscules.
 * Le header garde son bouton « Get started » et son soulignement corail, communs à tout le site.
 */
body.sn-light { background: var(--papier); color: var(--encre); color-scheme: light;
  --carte: #ffffff;
  --relief: 0 1px 2px rgba(16,19,28,.05), 0 12px 32px rgba(16,19,28,.07);
  --relief-fort: 0 2px 4px rgba(16,19,28,.06), 0 18px 40px rgba(16,19,28,.10); }
.sn-light main h2::before { background: var(--encre); }
.sn-light main .btn { font: 600 16px/1 var(--font-texte); letter-spacing: 0; text-transform: none; }
.sn-light main .text-link { font: 600 16px/22px var(--font-texte); letter-spacing: 0; text-transform: none; color: var(--encre); }

/* Titre de page <h1> : affiché comme les titres de section (h2) de la maquette, taille 44/34 px et barre corail */
.sn-light main h1 { font-weight: 700; font-size: 44px; line-height: 44px; }
.sn-light main h1::before { content: ""; display: block; width: 48px; height: 4px; background: var(--direct); margin-bottom: 20px; }
@media (max-width: 640px) { .sn-light main h1 { font-size: 34px; line-height: 36px; } }
body.sn-light::before { background: var(--papier); }
.sn-light .btn:focus-visible, .sn-light .nav a:focus-visible, .sn-light summary:focus-visible { outline-color: var(--encre); }

/* Header */
.sn-light .top { background: var(--papier); border-bottom-color: rgba(16,19,28,.14); }
.sn-light .nav a, .sn-light .dd summary { color: var(--encre-douce); }
.sn-light .nav a:hover, .sn-light .nav a[aria-current], .sn-light .dd summary:hover, .sn-light .dd[open] summary { color: var(--encre); }
.sn-light .dd-menu { background: var(--carte); border: 0; box-shadow: var(--relief-fort); }
.sn-light .dd-menu a { border-bottom-color: rgba(16,19,28,.14); }
.sn-light .dd-menu a:hover { background: var(--papier); }
.sn-light .burger summary { color: var(--encre); border-color: rgba(16,19,28,.22); }
.sn-light .burger-menu { background: var(--carte); border-bottom: 0; box-shadow: var(--relief-fort); }
.sn-light .burger-menu a { border-bottom-color: rgba(16,19,28,.14); }
.sn-light .top .btn-primary:hover { background: var(--encre); border-color: var(--encre); color: var(--papier); }

/* Footer */
.sn-light .foot { background: var(--papier); color: var(--encre-douce); border-top: 1px solid rgba(16,19,28,.14); }
.sn-light .foot .fh { color: var(--encre); }
.sn-light .foot a:hover { color: var(--encre); }
.sn-light .foot-grid { border-bottom-color: rgba(16,19,28,.14); }
.sn-light .foot .social a { border-color: rgba(16,19,28,.22); color: var(--encre-douce); }
.sn-light .foot .social a:hover { color: var(--encre); border-color: var(--encre-douce); }

/* Bouton contact flottant : menu clair */
.sn-light .fab summary:hover { background: var(--encre); color: var(--papier); }
.sn-light .fab summary:focus-visible { outline-color: var(--encre); }
.sn-light .fab-menu { background: var(--carte); border: 0; box-shadow: var(--relief-fort); }
.sn-light .fab-menu p { color: var(--encre-douce); }
.sn-light .fab-menu a { color: var(--encre); }
.sn-light .fab-menu a:hover { background: var(--papier); }

/* Offre mise en avant : carte claire, contour corail au lieu du fond nuit */
.sn-light .plan.feat { color: var(--encre); box-shadow: var(--relief-fort), inset 0 0 0 2px var(--encre); }
.sn-light .feat .permo { color: var(--encre); }
.sn-light .feat .billed { color: var(--encre-douce); }
.sn-light .feat .ico, .sn-light main .ico { stroke: var(--encre); }
.sn-light main .ico .dot { fill: var(--encre); }
.sn-light .plan.feat li { border-top-color: rgba(16,19,28,.14); }

/* Page Tarifs : la FAQ suit la section des offres, toutes deux sur papier : un filet les sépare */
.sn-light #before-you-buy { border-top: 1px solid rgba(16,19,28,.14); }

/* Bouton contact flottant : corail comme dans la maquette, sur toutes les pages (choix du client) ; au survol, encre */
.sn-light .fab summary { box-shadow: var(--relief-fort); }

/* Badge d'en-tête (pages Contact, Affiliation…) : forme du badge « Live » de l'accueil, en encre — le corail est réservé */
.sn-badge { display: inline-flex; align-items: center; gap: 12px; margin: 0 0 36px; padding-right: 12px; border: 1px solid rgba(16,19,28,.16); font: 600 13px/16px var(--font-etiquette); letter-spacing: .06em; text-transform: uppercase; color: var(--encre-douce); }
.sn-badge span { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; background: var(--encre); color: var(--papier); }
.sn-badge span::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--papier); animation: sn-pulse 2.4s ease-in-out infinite; }
@keyframes sn-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .3; } }
@media (max-width: 600px) { .sn-badge { margin-bottom: 22px; } }
@media (prefers-reduced-motion: reduce) { .sn-badge span::before { animation: none; } }

/* v1.68.8 — badge : le texte passe sous l'étiquette au lieu de se couper en colonnes */
.sn-badge { flex-wrap: wrap; max-width: 100%; }
.sn-badge span { white-space: nowrap; }
@media (max-width: 600px) { .sn-badge { gap: 8px 12px; padding: 0 12px 0 0; } }
/* Allemand : mots très longs (Rückerstattungsrichtlinie), le titre rétrécit un peu sur téléphone pour tenir sans couper */
@media (max-width: 640px) { .sn-light main h1:lang(de) { font-size: min(34px, 8.4vw); } }
/* Téléphone : badge sans cadre, la date passe proprement sous l'étiquette */
@media (max-width: 600px) { .sn-light .sn-badge { border: 0; padding: 0; } }