/* bandeau-construction.css — Bandeau « Site en construction » (accueil V3). * * Masqué par défaut : il n'apparaît que si scripts/bandeau-construction.js a * posé la classe `te-construction` sur , c'est-à-dire si le drapeau * constructionBanner de parametres/flags.js vaut true. Ce défaut à « masqué » * est volontaire — un fichier de drapeaux absent ou cassé ne doit pas produire * un bandeau fantôme. * * Contraste : texte presque noir sur l'orange --warning. Du blanc sur cet * orange tomberait autour de 2,9:1, sous le seuil AA ; le texte sombre passe * largement. */ .bandeau-construction { display: none; } html.te-construction .bandeau-construction { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px 10px; padding: 10px clamp(16px, 4vw, 54px); background: var(--warning, #FF7700); color: #1F1300; font-size: 0.875rem; line-height: 1.35; text-align: center; } .bandeau-construction-titre { font-weight: 800; letter-spacing: -0.01em; } .bandeau-construction-detail { font-weight: 500; } .bandeau-construction-icone { flex: 0 0 auto; width: 18px; height: 18px; } /* Compensation de hauteur. .container.center-in-page ET .index-v3-shell sont calées sur min-height:100vh (index-v3.css). Le bandeau s'ajoutant AU-DESSUS, la page mesurerait 100vh + sa hauteur : une barre de défilement apparaîtrait sur un écran où tout tenait juste. On retire donc sa hauteur des deux règles, uniquement quand il est là. La valeur est une approximation assumée : si le texte passe sur deux lignes, il reste quelques pixels de défilement — sans conséquence. */ html.te-construction { --te-construction-h: 44px; } /* Depuis le 2026-08-20, la page d'accès est une colonne flex de la hauteur de l'écran (section « Page à hauteur d'écran » d'index-v3.css) : le bandeau y est un frère de la page, donc sa hauteur est déduite structurellement, exacte même sur deux lignes. La compensation en pixels ci-dessous ne sert plus que sous le plancher de 520px, où la page redevient scrollable. */ @media (max-height: 520px) { html.te-construction #page-root .container.center-in-page, html.te-construction .index-v3-shell { min-height: calc(100vh - var(--te-construction-h)); } } @media (max-width: 640px) { html.te-construction { --te-construction-h: 62px; } html.te-construction .bandeau-construction { padding: 9px 14px; font-size: 0.8125rem; } }