/*
Theme Name: GAYAR 2026
Theme URI: https://www.festivalgayar.com
Description: Thème enfant sur-mesure du Festival GAYAR 2026 — design pixel-près, responsive, futuriste. Basé sur festivalgayar.
Author: Netdev Creative
Template: festivalgayar
Version: 1.0.0
Text Domain: gayar2026
*/

/* ============================================================
   TOKENS — Palette officielle GAYAR (extraite du logo)
   ============================================================ */
:root{
  --g-vert:      #2B9D67;
  --g-vert-dark: #1F7C50;
  --g-jaune:     #FDC405;
  --g-orange:    #FD8A24;
  --g-rouge:     #FC3E38;
  --g-turq:      #2A6264;
  --g-turq-2:    #5C8391;

  --g-bg:        #0B0D0E;   /* fond général */
  --g-bg-2:      #101315;   /* alt */
  --g-panel:     #16191B;   /* cartes/panneaux */
  --g-panel-2:   #1D2124;
  --g-stroke:    rgba(255,255,255,.10);
  --g-stroke-2:  rgba(255,255,255,.06);

  --g-text:      #E9ECEF;
  --g-muted:     #A7AEB3;
  --g-white:     #FFFFFF;

  --g-radius:    18px;
  --g-radius-lg: 26px;
  --g-gap:       clamp(16px, 2.2vw, 28px);
  --g-container: 1200px;

  --g-font: "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --g-shadow: 0 20px 60px rgba(0,0,0,.45);
  --g-glass: rgba(16,19,21,.72);
}

/* ============================================================
   BASE
   ============================================================ */
*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body.gayar2026{
  margin:0; background:var(--g-bg); color:var(--g-text);
  font-family:var(--g-font); font-size:16px; line-height:1.6;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
.gayar2026 img{ max-width:100%; height:auto; display:block; }
.gayar2026 a{ color:inherit; text-decoration:none; }
.g-container{ width:100%; max-width:var(--g-container); margin:0 auto; padding:0 20px; }
.g-section{ padding: clamp(48px, 7vw, 96px) 0; position:relative; }
.g-kicker{ display:inline-flex; align-items:center; gap:.5rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; font-size:.78rem; color:var(--g-vert); }
.g-h1{ font-size:clamp(2.4rem,6vw,4.2rem); font-weight:800; line-height:1.05; margin:.2em 0; }
.g-h2{ font-size:clamp(1.8rem,3.6vw,2.8rem); font-weight:800; margin:0 0 .4em; }
.g-lead{ color:var(--g-muted); font-size:clamp(1rem,1.4vw,1.15rem); max-width:60ch; }

/* Barre multicolore signature GAYAR */
.g-rainbow{ height:6px; width:100%; border:0;
  background:linear-gradient(90deg,var(--g-turq) 0 20%,var(--g-vert) 20% 40%,var(--g-jaune) 40% 60%,var(--g-orange) 60% 80%,var(--g-rouge) 80% 100%);
}

/* Boutons */
.g-btn{ display:inline-flex; align-items:center; gap:.6rem; padding:.9rem 1.5rem; border-radius:999px; font-weight:700; transition:.2s ease; border:1px solid transparent; cursor:pointer; }
.g-btn-primary{ background:var(--g-vert); color:#fff; }
.g-btn-primary:hover{ background:var(--g-vert-dark); transform:translateY(-2px); }
.g-btn-ghost{ background:rgba(255,255,255,.06); border-color:var(--g-stroke); color:#fff; }
.g-btn-ghost:hover{ background:rgba(255,255,255,.12); transform:translateY(-2px); }

/* Cartes */
.g-card{ background:var(--g-panel); border:1px solid var(--g-stroke-2); border-radius:var(--g-radius); padding:clamp(20px,2.4vw,32px); }

/* ============================================================
   RESPONSIVE — breakpoints
   ============================================================ */
@media (max-width: 980px){ :root{ --g-container: 100%; } }
@media (max-width: 640px){ body.gayar2026{ font-size:15px; } }

/* Reveal au scroll */
.g-reveal{ opacity:0; transform:translateY(24px); transition:opacity .6s ease, transform .6s ease; }
.g-reveal.is-visible{ opacity:1; transform:none; }
.g-header.is-scrolled{ box-shadow:0 8px 30px rgba(0,0,0,.35); }
.g-header.is-scrolled .g-header-row{ min-height:64px; }

/* ===== AJUSTEMENTS GLOBAUX — largeur + typographie ===== */
:root{
  --g-container: 1320px;   /* plus large */
}
.gayar2026{ font-size:17px; }              /* base plus grande */
.gayar2026 .g-container{ padding:0 32px; }  /* respiration latérale */
.gayar2026 .g-lead{ font-size:clamp(1.05rem,1.4vw,1.25rem); max-width:64ch; line-height:1.7; }
.gayar2026 .g-h2{ font-size:clamp(2rem,3.8vw,3rem); }
.gayar2026 .g-kicker{ font-size:.85rem; }
.gayar2026 .g-section{ padding:clamp(56px,8vw,110px) 0; }

/* boutons plus généreux */
.gayar2026 .g-btn{ padding:1rem 1.8rem; font-size:1.05rem; }
@media (max-width:980px){ :root{ --g-container:100%; } }

/* ===== LARGEUR 1800 + BASE 1.5rem (demande client) ===== */
:root{ --g-container: 1800px; }
.gayar2026{ font-size:1.5rem; }                 /* base 1.5rem partout */
.gayar2026 .g-container{ max-width:1800px; padding:0 40px; }
.gayar2026 .g-lead{ font-size:1.5rem; max-width:none; line-height:1.65; }
.gayar2026 p{ font-size:1.5rem; }
.gayar2026 .g-btn{ font-size:1.5rem; padding:1rem 2rem; }
.gayar2026 .g-kicker{ font-size:1.05rem; }

/* Menu : 1.5rem */
.gayar2026 .g-menu > li > a{ font-size:1.5rem !important; padding:.7rem 1.2rem !important; }

/* Titres recalés en proportion d'une base 1.5rem */
.gayar2026 .g-h2{ font-size:clamp(2.6rem,4.5vw,3.6rem); }

@media (max-width:1860px){ .gayar2026 .g-container{ max-width:100%; } }
@media (max-width:980px){ .gayar2026{ font-size:1.15rem; } .gayar2026 .g-menu > li > a{ font-size:1.2rem !important; } }

/* ===== TEXTE COURANT AGRANDI (tout le site) ===== */
.gayar2026 .g-lead,
.gayar2026 .g-main p,
.gayar2026 .ga-theme p,
.gayar2026 p.g-lead{
  font-size:1.65rem !important;
  line-height:1.7 !important;
}
.gayar2026 .ga-day-body p{ font-size:1.35rem !important; }
.gayar2026 .ga-hl-sub,
.gayar2026 .ga-artist-body span{ font-size:1.35rem !important; }
.gayar2026 .ga-hl strong,
.gayar2026 .ga-artist-body strong,
.gayar2026 .ga-day-tag{ font-size:1.5rem !important; }
.gayar2026 .g-kicker{ font-size:1.15rem !important; }

/* ===== TITRES EN BLANC CASSÉ (tout le site) ===== */
:root{ --g-titre:#F2EFE9; }   /* blanc cassé chaud */
.gayar2026 .g-h1,
.gayar2026 .g-h2,
.gayar2026 .ga-famy,
.gayar2026 .ga-theme-head .g-h2,
.gayar2026 .ga-days .g-h2,
.gayar2026 .ga-highlights .g-h2,
.gayar2026 .ga-artists .g-h2,
.gayar2026 .ga-day-date,
.gayar2026 .ga-hl strong,
.gayar2026 .ga-artist-body strong{
  color:var(--g-titre) !important;
}

/* ===== TITRES EN MONTSERRAT BOLD (intégral, conforme maquette) ===== */
:root{ --g-font-title:"Montserrat", "Poppins", sans-serif; }
.gayar2026 .g-h1,
.gayar2026 .g-h2,
.gayar2026 h1, .gayar2026 h2, .gayar2026 h3,
.gayar2026 .ga-famy,
.gayar2026 .g-kicker,
.gayar2026 .ga-day-date,
.gayar2026 .gp-time,
.gayar2026 .gf-stat strong,
.gayar2026 .gl-num, .gayar2026 .gl-step-num,
.gayar2026 .gpl-panel-title,
.gayar2026 .ge-fiche-cat,
.gayar2026 .g-footer-col strong{
  font-family:var(--g-font-title) !important;
  font-weight:800 !important;
  letter-spacing:.005em;
}
/* Kickers un peu moins gras pour l'élégance */
.gayar2026 .g-kicker{ font-weight:700 !important; letter-spacing:.08em; }

/* ===== TIRET VERT SOUS CHAQUE TITRE H1 (conforme maquette) ===== */
.gayar2026 .g-h1{ position:relative; padding-bottom:.4em; margin-bottom:.5em; }
.gayar2026 .g-h1::after{ content:""; position:absolute; left:0; bottom:0; width:120px; height:5px; border-radius:3px;
  background:var(--g-vert); box-shadow:0 0 16px rgba(43,157,103,.5); }
/* Sur le hero accueil, le titre LA FAMY garde sa barre rainbow, pas le tiret vert */
.gayar2026 .ga-hero .g-h1::after{ display:none; }

/* ===== MASQUER les barres verticales gpl-scene-bar ===== */
.gayar2026 .gpl-scene-bar{ display:none !important; }
.gayar2026 .gpl-scene{ padding-left:0 !important; }

/* ===== OPTIMISATION DES ESPACEMENTS (plus compact) ===== */
/* Padding vertical des sections réduit */
.gayar2026 .g-section{ padding:clamp(24px,3vw,44px) 0 !important; }
/* Padding latéral du conteneur réduit */
.gayar2026 .g-container{ padding:0 clamp(20px,2.5vw,32px) !important; }
/* Padding intérieur des cartes réduit */
.gayar2026 .g-card{ padding:clamp(18px,2vw,26px) !important; }
/* Marges des titres resserrées */
.gayar2026 .g-h2{ margin:0 0 1rem !important; }
.gayar2026 .g-h1{ margin-bottom:.4em !important; }
/* Grilles : gap un peu réduit */
.gayar2026 .ga-days-grid,
.gayar2026 .ga-hl-grid,
.gayar2026 .ga-artists-grid,
.gayar2026 .gf-stats,
.gayar2026 .gf-porte-grid,
.gayar2026 .ge-familles,
.gayar2026 .gpa-familles{ gap:18px !important; margin-top:1rem !important; }

/* ===== ANTI-MOUVEMENT HORIZONTAL (mobile pro) ===== */
html, body.gayar2026{ overflow-x:hidden !important; max-width:100%; }
.gayar2026 *{ max-width:100%; }
/* Désactiver le tilt 3D du plan sur tactile */
@media (hover:none), (pointer:coarse){
  .gayar2026 .gpl-imgwrap{ transform:none !important; transition:none !important; }
  .gayar2026 .g-header-glow,
  .gayar2026 .g-footer-glow{ animation:none !important; }
}
/* Empêcher tout élément de dépasser la largeur */
.gayar2026 .g-section,
.gayar2026 .g-container{ overflow-x:clip; }

/* ===== CENTRAGE UNIFORME DES CARTES À ICÔNE (tout le site) ===== */
.gayar2026 .gf-porte-card,
.gayar2026 .ge-famille,
.gayar2026 .gpa-famille{
  display:flex !important; flex-direction:column; align-items:center; text-align:center;
}
.gayar2026 .gf-porte-card .gf-ic,
.gayar2026 .gf-porte-card h3,
.gayar2026 .gf-porte-card p{ text-align:center; }
.gayar2026 .gf-ic,
.gayar2026 .ge-ic,
.gayar2026 .gpa-ic{ margin-left:auto !important; margin-right:auto !important; }

/* Icônes rondes en scène (festival) : garder icône à gauche mais bien alignée */
.gayar2026 .gf-scene{ align-items:center; }

/* Cohérence responsive : sur tablette/mobile tout reste centré et lisible */
@media (max-width:980px){
  .gayar2026 .gf-porte-grid,
  .gayar2026 .ge-familles,
  .gayar2026 .gpa-familles{ grid-template-columns:repeat(2,1fr) !important; }
}
@media (max-width:600px){
  .gayar2026 .gf-porte-grid,
  .gayar2026 .ge-familles,
  .gayar2026 .gpa-familles,
  .gayar2026 .gf-stats,
  .gayar2026 .gf-scenes-grid,
  .gayar2026 .gpa-visi,
  .gayar2026 .ga-days-grid,
  .gayar2026 .ga-hl-grid,
  .gayar2026 .ga-artists-grid{ grid-template-columns:1fr !important; }
  /* Cartes scène/visibilité : icône au-dessus, centrées sur mobile */
  .gayar2026 .gf-scene,
  .gayar2026 .gpa-visi-card,
  .gayar2026 .ge-jour{ flex-direction:column; text-align:center; align-items:center; }
  .gayar2026 .gf-scene-txt,
  .gayar2026 .gpa-visi-txt,
  .gayar2026 .ge-jour-txt{ text-align:center; }
}

/* ============================================================
   DYNAMISME GLOBAL · Netdev Creative — Michael John
   ============================================================ */

/* Barre de progression scroll (rainbow GAYAR) */
.g-scrollbar{ position:fixed; top:0; left:0; height:4px; width:0; z-index:9999; pointer-events:none;
  background:linear-gradient(90deg,var(--g-turq),var(--g-vert),var(--g-jaune),var(--g-orange),var(--g-rouge));
  box-shadow:0 0 14px rgba(43,157,103,.6); transition:width .1s linear; }

/* Cartes : profondeur + glow réactif au survol (partout) */
.gayar2026 .g-card{ transition:transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s, border-color .3s; }
.gayar2026 .g-card:hover{ transform:translateY(-5px); box-shadow:0 20px 50px rgba(0,0,0,.4); }

/* Reflet qui passe une fois au reveal */
.gayar2026 .g-reveal{ position:relative; }
.gayar2026 .g-reveal.is-visible::after{ content:""; position:absolute; inset:0; pointer-events:none; z-index:1; border-radius:inherit;
  background:linear-gradient(120deg,transparent 35%,rgba(255,255,255,.06) 50%,transparent 65%);
  transform:translateX(-120%); animation:gShine 1.2s ease-out .2s 1; }
@keyframes gShine{ to{ transform:translateX(120%); } }

/* Icônes : pulsation douce continue */
.gayar2026 .gf-ic, .gayar2026 .ge-ic, .gayar2026 .gpa-ic, .gayar2026 .gl-ic, .gayar2026 .gf-scene-ic{
  animation:gIconPulse 3.5s ease-in-out infinite; }
@keyframes gIconPulse{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-4px);} }
.gayar2026 .gf-ic:hover, .gayar2026 .ge-ic:hover, .gayar2026 .gpa-ic:hover{ filter:drop-shadow(0 0 12px currentColor); }

/* Chiffres qui pulsent légèrement */
.gayar2026 .gf-stat strong, .gayar2026 .gl-num, .gayar2026 .gl-keys strong{ transition:transform .3s; }
.gayar2026 .gf-stat:hover strong{ transform:scale(1.08); }

/* Séparateur rainbow : dégradé qui défile */
.gayar2026 .g-rainbow, .gayar2026 .ga-sep{
  background:linear-gradient(90deg,var(--g-turq),var(--g-vert),var(--g-jaune),var(--g-orange),var(--g-rouge),var(--g-turq)) !important;
  background-size:200% 100% !important; animation:gRainbowFlow 6s linear infinite; }
@keyframes gRainbowFlow{ to{ background-position:200% 0; } }

/* Reveal amélioré : montée + fondu plus fluide */
.gayar2026 .g-reveal{ opacity:0; transform:translateY(28px); transition:opacity .7s cubic-bezier(.2,.8,.2,1), transform .7s cubic-bezier(.2,.8,.2,1); }
.gayar2026 .g-reveal.is-visible{ opacity:1; transform:none; }

/* Titres de section : soulignement qui se dessine */
.gayar2026 .g-h2{ position:relative; }

/* Accessibilité : couper les animations si demandé */
@media (prefers-reduced-motion:reduce){
  .gayar2026 *, .g-scrollbar{ animation:none !important; transition:none !important; }
}
/* Mobile tactile : alléger */
@media (pointer:coarse){
  .gayar2026 .gf-ic, .gayar2026 .ge-ic, .gayar2026 .gpa-ic, .gayar2026 .gl-ic{ animation:none !important; }
}

/* ============================================================
   CALME VISUEL — retrait des animations fatigantes
   ============================================================ */
/* Stop flottement icônes */
.gayar2026 .gf-ic, .gayar2026 .ge-ic, .gayar2026 .gpa-ic, .gayar2026 .gl-ic, .gayar2026 .gf-scene-ic{ animation:none !important; transform:none !important; }
/* Stop reflet au reveal */
.gayar2026 .g-reveal.is-visible::after{ display:none !important; animation:none !important; }
/* Stop dégradé rainbow qui défile (rainbow fixe, propre) */
.gayar2026 .g-rainbow, .gayar2026 .ga-sep{ animation:none !important; background-size:100% 100% !important;
  background:linear-gradient(90deg,var(--g-turq) 0 20%,var(--g-vert) 20% 40%,var(--g-jaune) 40% 60%,var(--g-orange) 60% 80%,var(--g-rouge) 80% 100%) !important; }
/* Stop halos qui respirent (header, footer, repères) */
.gayar2026 .g-header-glow, .gayar2026 .g-footer-glow{ animation:none !important; opacity:.25 !important; }
.gayar2026 .gf-reperes::before{ animation:none !important; }
.gayar2026 .gf-reperes::after{ animation:none !important; opacity:.25 !important; }
.gayar2026 .gf-reperes li{ animation:none !important; opacity:1 !important; transform:none !important; }
/* Stop pulse hotspots plan trop vif → ralenti et discret */
.gayar2026 .gpl-pulse{ animation-duration:4s !important; opacity:.4 !important; }
.gayar2026 .gpl-hot::before{ animation:none !important; }
/* Badge shine, orbites, scanline : off */
.gayar2026 .gpl-panel-badge::after, .gayar2026 .gpl-scanline, .gayar2026 .gpl-mapwrap::before{ display:none !important; }
.gayar2026 .gpl-panel::before, .gayar2026 .gpl-panel-ic{ animation:none !important; }

/* Ce qu'on GARDE : barre scroll discrète + élévation douce des cartes au survol */
.g-scrollbar{ height:3px !important; box-shadow:none !important; opacity:.8; }
.gayar2026 .g-card:hover{ transform:translateY(-3px) !important; box-shadow:0 12px 30px rgba(0,0,0,.25) !important; }

/* Compteurs : on garde (montée douce), mais rien qui clignote */

/* Respect total de prefers-reduced-motion */
@media (prefers-reduced-motion:reduce){ .gayar2026 *, .g-scrollbar{ animation:none !important; transition:none !important; } }

/* ===== HALO INTERACTIF GÉNÉRIQUE (cartes à couleur --c) ===== */
.gayar2026 .ga-day, .gayar2026 .ga-artist, .gayar2026 .ge-famille, .gayar2026 .gpa-famille,
.gayar2026 .gf-porte-card, .gayar2026 .gl-atelier{ position:relative; overflow:hidden; }
.gayar2026 .ga-day::after, .gayar2026 .ge-famille::after, .gayar2026 .gpa-famille::after,
.gayar2026 .gf-porte-card::after{ content:""; position:absolute; width:240px; height:240px; border-radius:50%; pointer-events:none;
  left:var(--mx,50%); top:var(--my,50%); transform:translate(-50%,-50%);
  background:radial-gradient(circle, color-mix(in oklab,var(--c,#2B9D67) 20%,transparent), transparent 70%);
  opacity:0; transition:opacity .3s; z-index:0; }
.gayar2026 .ga-day:hover::after, .gayar2026 .ge-famille:hover::after,
.gayar2026 .gpa-famille:hover::after, .gayar2026 .gf-porte-card:hover::after{ opacity:1; }
.gayar2026 .ga-day > *, .gayar2026 .ge-famille > *, .gayar2026 .gpa-famille > *, .gayar2026 .gf-porte-card > *{ position:relative; z-index:1; }

/* ===== SÉPARATEUR RAINBOW — ANIMATION FUTURISTE ===== */
.gayar2026 .ga-sep-wrap{ position:relative; overflow:hidden; }
.gayar2026 .ga-sep{ position:relative; overflow:visible; }
/* lueur qui balaie la barre en continu */
.gayar2026 .ga-sep::after{ content:""; position:absolute; top:-3px; bottom:-3px; width:120px; border-radius:6px; pointer-events:none;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.7), transparent);
  filter:blur(2px); mix-blend-mode:screen;
  animation:gSepScan 3.5s ease-in-out infinite; }
@keyframes gSepScan{ 0%{ left:-120px; opacity:0; } 15%{ opacity:1; } 85%{ opacity:1; } 100%{ left:100%; opacity:0; } }
/* halo diffus sous la barre qui pulse doucement */
.gayar2026 .ga-sep::before{ content:""; position:absolute; inset:-8px 0; border-radius:8px; pointer-events:none; z-index:-1;
  background:linear-gradient(90deg,var(--g-turq),var(--g-vert),var(--g-jaune),var(--g-orange),var(--g-rouge));
  filter:blur(10px); opacity:.35; animation:gSepGlow 4s ease-in-out infinite alternate; }
@keyframes gSepGlow{ from{ opacity:.2; } to{ opacity:.5; } }

@media (prefers-reduced-motion:reduce){ .gayar2026 .ga-sep::after, .gayar2026 .ga-sep::before{ animation:none !important; } }