/* Etoile Server -- NOUVEAU SITE : le style commun. v1.000 -- 14 oct 2026.
   Reprend le site Google du club (bandeau or, fond ciel/eau gris-bleu, bleu nuit #1f2a44) en plus lisible ;
   pense TELEPHONE d'abord : l'accueil tient dans un ecran sans defiler. */
:root {
  --nuit: #1f2a44; --nuit-2: #2b3a5c; --ciel-1: #c9d6e2; --ciel-2: #8ea4ba; --or: #f3d58a; --or-fonce: #c99a2e;
  --carte: rgba(255,255,255,.92); --texte: #1b2333; --doux: #4f5b6e; --bord: rgba(31,42,68,.14); --accent: #3c78d8;
}
@media (prefers-color-scheme: dark) {
  :root { --ciel-1: #2a3850; --ciel-2: #141c2c; --carte: rgba(27,35,54,.92); --texte: #edf1f7; --doux: #aab5c6; --bord: rgba(255,255,255,.12); --accent: #8db7ef; }
}
* { box-sizing: border-box; }
html, body { margin: 0; }
body {
  min-height: 100vh; min-height: 100dvh; color: var(--texte);
  font: 16px/1.4 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  background: linear-gradient(180deg, var(--ciel-1) 0%, var(--ciel-2) 100%) fixed;
}
a { color: inherit; }
.barre {
  position: sticky; top: 0; z-index: 5; display: flex; align-items: center; gap: 10px;
  padding: 8px 12px; background: var(--nuit); color: #fff; box-shadow: 0 1px 6px rgba(0,0,0,.25);
}
.barre .marque { display: flex; align-items: center; gap: 8px; text-decoration: none; min-width: 0; flex: 1; }
.barre .marque img { width: 30px; height: 30px; object-fit: contain; }
.barre .marque span { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.portail {
  flex: none; text-decoration: none; font-weight: 700; font-size: .92rem; color: var(--nuit);
  background: var(--or); border: 1px solid var(--or-fonce); border-radius: 999px; padding: 7px 14px;
}
.portail:focus-visible, .tuile:focus-visible, button:focus-visible { outline: 3px solid var(--or); outline-offset: 2px; }
.contenu { max-width: 980px; margin: 0 auto; padding: 12px 16px 24px; }
.bandeau { display: block; width: min(560px, 100%); height: auto; margin: 4px auto 10px; filter: drop-shadow(0 2px 3px rgba(0,0,0,.35)); }
h1.titre { margin: 4px 0 2px; font-size: 1.4rem; color: var(--nuit); }
@media (prefers-color-scheme: dark) { h1.titre { color: #fff; } }
.sous { margin: 0 0 10px; color: var(--doux); }
.pied { text-align: center; font-size: .8rem; color: var(--doux); padding: 6px 16px 14px; }