/* Gueoula Identité - Nav + Base (Astro / Prénoms / Lettres liées) */
:root{--bg1:#070b22;--bg2:#0b2a5a;--gold:#ffd84d;--gold2:#d4af37;--ink:#0b1222;--card:rgba(255,255,255,.06);--card2:rgba(0,0,0,.22);--line:rgba(255,216,77,.22);--muted:rgba(255,255,255,.78);}
*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}
body{font-family:Georgia,'Times New Roman',serif;color:#fff;background:radial-gradient(1200px 700px at 30% 10%, rgba(255,216,77,.08), transparent 50%),linear-gradient(135deg,var(--bg1), #111a46 45%, var(--bg2));min-height:100vh;overflow-x:hidden;}
a{color:inherit}
.bsd{position:fixed;top:18px;right:20px;z-index:10002;font-size:1.5rem;font-weight:700;color:var(--gold);text-shadow:0 2px 10px rgba(255,216,77,.35);pointer-events:none;letter-spacing:2px;}
#stars{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.75}
.star{position:absolute;background:#fff;border-radius:50%;opacity:.9;animation:twinkle var(--dur) ease-in-out infinite;animation-delay:var(--del)}
@keyframes twinkle{0%,100%{opacity:.15;transform:scale(.9)}50%{opacity:1;transform:scale(1.1)}}
.menu-toggle{position:fixed;top:16px;left:16px;width:50px;height:50px;background:rgba(212,175,55,.92);border:none;border-radius:10px;cursor:pointer;z-index:10003;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;transition:transform .2s ease,background .2s ease;box-shadow:0 10px 28px rgba(0,0,0,.35);}
.menu-toggle:hover{transform:scale(1.04);background:rgba(255,216,77,.95)}
.menu-toggle span{width:30px;height:3px;background:var(--ink);border-radius:2px;transition:transform .25s ease,opacity .2s ease;}
.menu-toggle.active span:nth-child(1){transform:rotate(45deg) translate(7px,7px)}
.menu-toggle.active span:nth-child(2){opacity:0}
.menu-toggle.active span:nth-child(3){transform:rotate(-45deg) translate(7px,-7px)}
.nav-overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:10000;opacity:0;pointer-events:none;transition:opacity .25s ease;}
.nav-overlay.active{opacity:1;pointer-events:auto}
.side-menu{position:fixed;top:0;left:-320px;width:320px;height:100vh;z-index:10001;background:linear-gradient(180deg, rgba(10,15,44,.98), rgba(26,35,126,.98));backdrop-filter:blur(10px);box-shadow:2px 0 26px rgba(0,0,0,.55);transition:left .28s ease;padding-top:86px;}
.side-menu.active{left:0}
.side-menu .menu-title{padding:0 26px 12px 26px;color:var(--gold);font-weight:800;font-family:'Cinzel',serif;letter-spacing:.5px;}
.side-menu a{display:block;padding:14px 26px;text-decoration:none;color:var(--gold);border-bottom:1px solid rgba(255,216,77,.18);transition:background .2s ease,padding-left .2s ease,color .2s ease;font-size:1.05rem;}
.side-menu a:hover{background:rgba(255,216,77,.12);padding-left:34px;color:#ffe58a}
.side-menu a.small{font-size:.98rem;color:rgba(255,255,255,.88)}
.side-menu a.small:hover{color:#fff}
.container{position:relative;z-index:2;max-width:1000px;margin:0 auto;padding:110px 18px 70px 18px;}
.hero{background:var(--card2);border:1px solid var(--line);border-radius:22px;padding:34px 22px;text-align:center;box-shadow:0 20px 60px rgba(0,0,0,.38);margin-bottom:22px;}
.hero h1{font-family:'Cinzel',serif;font-size:2.2rem;color:var(--gold);margin-bottom:10px;}
.hero p{color:var(--muted);font-size:1.08rem;line-height:1.6}
.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:14px;}
.card{grid-column:span 6;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:18px 18px;box-shadow:0 16px 44px rgba(0,0,0,.25);}
.card h2{font-family:'Cinzel',serif;font-size:1.35rem;color:#ffe58a;margin-bottom:10px;}
.card p{color:rgba(255,255,255,.9);line-height:1.75}
.badges{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:14px}
.badge{padding:8px 12px;border-radius:999px;border:1px solid rgba(255,216,77,.35);background:rgba(0,0,0,.18);color:rgba(255,255,255,.92);font-size:.92rem;}
.kv{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:14px;}
.kv .chip{padding:10px 12px;border-radius:14px;border:1px solid rgba(255,216,77,.28);background:rgba(0,0,0,.2);min-width:132px;}
.kv .chip .k{display:block;font-size:.8rem;color:rgba(255,255,255,.72)}
.kv .chip .v{display:block;font-weight:800;color:#fff;margin-top:2px}
.letters-grid{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:12px;}
.letter-box{width:92px;height:104px;border-radius:16px;border:1px solid rgba(255,216,77,.35);background:rgba(0,0,0,.20);display:flex;flex-direction:column;align-items:center;justify-content:center;}
.letter-box .letter{font-size:2.4rem;font-weight:900;color:var(--gold)}
.letter-box .value{font-size:.86rem;color:rgba(255,255,255,.85);margin-top:4px}
.letter-box a{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;text-decoration:none}
.footer{margin-top:34px;padding-top:18px;border-top:1px solid rgba(255,216,77,.18);text-align:center;color:rgba(255,255,255,.75);font-size:.95rem;}
.footer a{color:#ffe58a;text-decoration:none}
.footer a:hover{text-decoration:underline}
@media (max-width:820px){.card{grid-column:span 12}.hero h1{font-size:1.9rem}.container{padding-top:102px}}
/* --- FIX: empêcher le menu principal (menu-uniforme) de bloquer les clics sur Identité --- */
#menuUniforme,
#menuOverlay,
.menu-overlay,
#menuDrawer,
.menu-drawer {
  display: none !important;
  pointer-events: none !important;
}