/* ==========================================================================
   Style « Classique » : celui du site de la V1, pour que le passage à la V2 change peu de chose côté public.
   Nuit bleutée profonde, cartes bleu nuit à liseré de la couleur du club en haut, titres Cinzel,
   texte Raleway, chiffres Rajdhani, ornement ♦ entre deux filets sous les titres.
   Ne redéfinit que les jetons et le décor : la structure est dans site.css.
   ========================================================================== */
@font-face { font-family: Cinzel; font-weight: 400 900; font-display: swap; src: url(../../fonts/cinzel-latin-var.woff2) format("woff2"); }
@font-face { font-family: Raleway; font-weight: 100 900; font-display: swap; src: url(../../fonts/raleway-latin-var.woff2) format("woff2"); }
@font-face { font-family: Rajdhani; font-weight: 700; font-display: swap; src: url(../../fonts/rajdhani-latin-700.woff2) format("woff2"); }

.style-classique {
  /* Mêmes teintes que la V1 (css/style_public.css) */
  --s-bg: #070A0F; --s-surface: #111820; --s-surface-2: #161E28; --s-text: #F0F2F8; --s-muted: #93ACC1; --s-line: #1E2D3D;
  --s-head-bg: rgba(13, 17, 23, .94); --s-head-text: #F0F2F8;
  --s-hero-bg: transparent; --s-hero-text: #F0F2F8; --s-hero-muted: #C4D4E4;
  --s-foot-bg: #0D1117; --s-foot-text: #93ACC1;
  /* La couleur du club joue le rôle de l'or de la V1 ; un peu éclaircie pour rester lisible sur la nuit */
  --accent-vif: color-mix(in srgb, var(--accent) 82%, white);
  --classique-carte: linear-gradient(135deg, #0F2540 0%, #0B1626 55%, #0D1117 100%);
  --titre: Cinzel, Georgia, serif; --corps: Raleway, system-ui, sans-serif; --chiffres: Rajdhani, Raleway, sans-serif;
  --titre-poids: 600; --titre-espace: .02em;
  --r: 8px;
  background: #070A0F radial-gradient(ellipse 120% 900px at 50% -10%, #0F1C2E 0%, #0A111B 45%, #070A0F 100%) no-repeat;
}
.style-classique input, .style-classique select, .style-classique textarea { background: #0D1117; border-color: #2A3F57; }

/* ---------- Boutons : dégradé de la couleur du club (comme « Devenir membre » de la V1), sinon contour ---------- */
.style-classique .btn-primary { background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 70%, white), var(--accent)); border-color: transparent; color: #14100A; font-weight: 700; box-shadow: 0 4px 18px color-mix(in srgb, var(--accent) 25%, transparent); }
.style-classique .btn-primary:hover { filter: brightness(1.07); }
.style-classique .btn:not(.btn-primary) { color: var(--accent-vif); border-color: color-mix(in srgb, var(--accent) 55%, transparent); }
.style-classique .btn:not(.btn-primary):hover { background: color-mix(in srgb, var(--accent) 10%, transparent); border-color: var(--accent-vif); }

/* ---------- En-tête : barre sombre, onglet en cours souligné ---------- */
.style-classique .site-head { backdrop-filter: blur(10px); border-bottom: 1px solid #1E2D3D; }
.style-classique .site-nav a { color: #C4D4E4; font-weight: 500; }
.style-classique .site-nav a:hover { color: #F0F2F8; background: transparent; }
.style-classique .site-nav a[aria-current] { color: #F0F2F8; box-shadow: inset 0 -2px 0 var(--accent-vif); }
.style-classique .site-nav .site-account { background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 70%, white), var(--accent)); color: #14100A; font-weight: 700; }
.style-classique .site-brand-nom { letter-spacing: .06em; }

/* ---------- Titres : surtitre de la couleur du club, titre Cinzel centré, ornement ♦ entre deux filets ---------- */
.style-classique .sec-tete { flex-direction: column; align-items: center; text-align: center; gap: 6px; position: relative; }
.style-classique .sec-tete h2, .style-classique .page-hero h1 { font-size: clamp(1.7rem, 3.4vw, 2.4rem); }
.style-classique .sec-tete h2::after, .style-classique .page-hero h1::after, .style-classique .h-hero h1::after {
  content: "♦"; display: block; margin: 14px auto 0; width: min(260px, 70vw); font-size: .55rem; line-height: 1; text-align: center; color: var(--accent-vif);
  /* traits qui s'estompent vers l'extérieur (plus de trait plein) */
  background: linear-gradient(90deg, transparent, var(--accent-vif)) left center / 42% 1px no-repeat, linear-gradient(270deg, transparent, var(--accent-vif)) right center / 42% 1px no-repeat;
}
.style-classique .sec-tete .surtitre, .style-classique .surtitre { text-transform: none; letter-spacing: .02em; font-weight: 600; font-size: .9rem; }
.style-classique .sec-tete > a { position: absolute; right: 0; bottom: 0; }
.style-classique .page-hero { text-align: center; background: transparent; padding: 44px 0 24px; }
.style-classique .page-hero h1 { margin-left: auto; margin-right: auto; }

/* ---------- Accueil : grande carte bleu nuit à gauche, prochain tournoi « à la une » à droite ---------- */
.style-classique .h-hero-in { align-items: stretch; padding-top: 56px; padding-bottom: 40px; gap: 28px; }
.style-classique .h-hero-in > div:first-child {
  background: var(--classique-carte); border: 1px solid #1E2D3D; border-radius: var(--r); padding: 40px 40px 36px; position: relative; overflow: hidden;
  box-shadow: 0 4px 30px rgba(0, 0, 0, .6);
}
/* Liseré de la couleur du club en haut de chaque grande carte, comme en V1 */
.style-classique .h-hero-in > div:first-child::before, .style-classique .h-next::before, .style-classique .news-card::before, .style-classique .h-rejoindre .wrap > div::before {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: linear-gradient(90deg, transparent, var(--accent-vif) 20%, var(--accent-vif) 80%, transparent);
}
/* Jeton décoratif en filigrane, comme les piles de jetons de la V1 */
.style-classique .h-hero-in > div:first-child::after { content: "♠"; position: absolute; right: -20px; top: -40px; font-size: 12rem; line-height: 1; color: rgba(196, 212, 228, .04); pointer-events: none; }
.style-classique .h-hero h1 { font-size: clamp(2.2rem, 5vw, 3.6rem); line-height: 1.05; }
.style-classique .h-hero h1::after { margin-left: auto; }   /* nom du club centré au-dessus de la carte, comme la V1 */
.style-classique .h-hero .lead { font-style: italic; border-left: 3px solid var(--accent-vif); padding-left: 18px; color: #C4D4E4; }
.style-classique .h-hero.avec-photo::after { background: linear-gradient(180deg, rgba(7, 10, 15, .82), rgba(7, 10, 15, .95)); }
.style-classique .h-next { position: relative; overflow: hidden; background: #111820; border: 1px solid #1E2D3D; border-radius: var(--r); backdrop-filter: none; box-shadow: 0 4px 30px rgba(0, 0, 0, .6); }
.style-classique .h-next-lbl { display: inline-block; text-transform: none; letter-spacing: 0; font-size: .78rem; padding: 3px 10px; border-radius: 999px; background: color-mix(in srgb, var(--accent) 14%, transparent); border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent); }
.style-classique .h-next-lbl::before { content: "♠ "; }
.style-classique .compte div { background: #0D1117; border: 1px solid #1E2D3D; border-radius: 8px; }
.style-classique .compte b, .style-classique .h-stats b, .style-classique .billet-date b { font-family: var(--chiffres); font-variant-numeric: tabular-nums; }
.style-classique .compte b { color: var(--accent-vif); font-size: 2.1rem; }
.style-classique .jauge { background: #0D1117; }

/* Chiffres du club : quatre pavés sombres, nombre de la couleur du club */
.style-classique .h-stats { background: transparent; border: 0; padding-bottom: 20px; }
.style-classique .h-stats .wrap { gap: 14px; }
.style-classique .h-stats .wrap > div, .style-classique .h-stats .wrap > div:first-child { background: rgba(13, 17, 23, .7); border: 1px solid #1E2D3D; border-radius: var(--r); text-align: center; padding: 18px 12px; }
.style-classique .h-stats b { color: var(--accent-vif); font-size: 2.3rem; }
.style-classique .h-stats span { font-size: .85rem; }

/* ---------- Cartes : tournois, actualités, événements ---------- */
.style-classique .billet, .style-classique .event, .style-classique .news-card, .style-classique .panel, .style-classique .carte, .style-classique .tuile { background: #111820; border-color: #1E2D3D; box-shadow: 0 4px 24px rgba(0, 0, 0, .45); }
.style-classique .news-card { position: relative; }
.style-classique .billet:hover, .style-classique .event:hover, .style-classique .news-card:hover { border-color: color-mix(in srgb, var(--accent) 60%, transparent); box-shadow: 0 8px 30px rgba(0, 0, 0, .6), 0 0 20px color-mix(in srgb, var(--accent) 18%, transparent); }
/* Date des billets : pavé sombre encadré, jour en gros chiffres de la couleur du club */
.style-classique .billet-date { background: #0D1117; color: var(--accent-vif); border-right: 1px solid #1E2D3D; }
.style-classique .billet-date small { color: #93ACC1; }
.style-classique .billet-date::after { display: none; }
.style-classique .news-card .vignette img { filter: saturate(.9); }

/* ---------- Classements et tableaux ---------- */
.style-classique .table-site th { background: #0D1117; color: var(--accent-vif); font-family: var(--titre); font-weight: 600; letter-spacing: .04em; }
.style-classique .table-site tr:hover td { background: rgba(196, 212, 228, .03); }
.style-classique .tabs-site a[aria-current] { background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 70%, white), var(--accent)); color: #14100A; font-weight: 700; }

/* ---------- Appel à rejoindre et pied de page ---------- */
.style-classique .h-rejoindre .wrap > div { position: relative; overflow: hidden; background: var(--classique-carte); color: #F0F2F8; border: 1px solid #1E2D3D; box-shadow: 0 4px 30px rgba(0, 0, 0, .6); }
.style-classique .site-foot { border-top: 1px solid #1E2D3D; }
.style-classique .site-foot-col strong, .style-classique .site-foot .site-brand { color: var(--accent-vif); font-family: var(--titre); }

/* Apparition douce des sections au défilement (comme la V1), seulement si l'utilisateur accepte les animations */
@media (prefers-reduced-motion: no-preference) {
  @supports (animation-timeline: view()) {
    .style-classique .section-site, .style-classique .h-stats .wrap > div { animation: classique-apparition linear both; animation-timeline: view(); animation-range: entry 0% entry 35%; }
  }
}
@keyframes classique-apparition { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }

@media (max-width: 860px) {
  .style-classique .h-hero-in > div:first-child { padding: 28px 22px; }
  .style-classique .sec-tete > a { position: static; }
  .style-classique .h-stats .wrap { gap: 10px; padding-top: 4px; }
  .style-classique .h-stats .wrap > div:nth-child(3) { padding-left: 12px; }
}