/* =====================================================
   HAKUNA — SITE FINAL COMPACT / COSMIC PREMIUM
   ===================================================== */
:root{
  --bg:#020307;--gold:#d7aa52;--gold-2:#f1c868;--text:#f8f4e9;--muted:rgba(248,244,233,.74);
  --yellow:#ffd35c;--green:#25e56b;--blue:#1597ff;--violet:#bc49ff;--nav-h:64px;
  --font-title:'Cinzel',Georgia,serif;--font-body:'Raleway',Arial,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{min-height:100vh;overflow-x:hidden;background:var(--bg);color:var(--text);font-family:var(--font-body)}a{color:inherit;text-decoration:none}button{font-family:inherit}
body::before{content:"";position:fixed;inset:0;z-index:-5;background:linear-gradient(rgba(0,0,0,.18),rgba(0,0,0,.28)),url("../assets/fond-hakuna-cosmic.jpg");background-size:cover;background-position:center;background-repeat:no-repeat;background-attachment:fixed;filter:brightness(1.18) saturate(1.22)}
body::after{content:"";position:fixed;inset:0;z-index:-4;pointer-events:none;background:radial-gradient(circle at center,rgba(255,210,90,.08),transparent 32%),linear-gradient(to bottom,rgba(0,0,0,.08),rgba(0,0,0,.30))}
.site-header{position:fixed;top:0;left:0;right:0;height:var(--nav-h);z-index:50;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(18px,5vw,70px);background:rgba(0,0,0,.76);backdrop-filter:blur(16px);border-bottom:1px solid rgba(255,255,255,.08)}
.brand{display:flex;align-items:center;gap:11px;color:var(--gold-2)}.brand-mark{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(241,200,104,.45);font-size:22px;box-shadow:0 0 18px rgba(241,200,104,.16)}.brand-name{font-family:var(--font-title);font-size:28px;letter-spacing:2px;line-height:1}.main-nav{display:flex;align-items:center;gap:clamp(16px,2vw,30px)}.main-nav a{position:relative;color:rgba(255,255,255,.88);font-size:12px;font-weight:700;letter-spacing:1px;padding:24px 0 22px;transition:.25s}.main-nav a:hover,.main-nav a.active{color:var(--gold-2)}.main-nav a.active::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:linear-gradient(90deg,var(--gold),transparent)}.header-cta{padding:11px 21px;border-radius:7px;border:1px solid rgba(241,200,104,.55);background:rgba(255,255,255,.03);color:var(--gold-2);font-size:12px;font-weight:900;letter-spacing:1px;cursor:pointer}.menu-toggle{display:none;background:none;border:1px solid rgba(241,200,104,.45);color:var(--gold-2);border-radius:9px;padding:8px 10px;font-size:20px}
.home-hero{min-height:58vh;display:grid;place-items:center;padding:calc(var(--nav-h) + 26px) 24px 62px;text-align:center;position:relative}.hero-inner{max-width:920px;margin:0 auto}.hero-title{font-family:var(--font-title);font-size:clamp(58px,7vw,96px);line-height:.82;font-weight:400;letter-spacing:8px;color:transparent;background:linear-gradient(180deg,#ffe39a 0%,#d6a04b 52%,#75501e 100%);-webkit-background-clip:text;background-clip:text;text-shadow:0 0 12px rgba(255,200,80,.35),0 0 30px rgba(255,180,50,.25)}.hero-subtitle{margin-top:17px;color:#fff;font-size:clamp(14px,1.2vw,19px);letter-spacing:2px;font-weight:500}.kicker-symbol{display:flex;align-items:center;justify-content:center;gap:16px;margin:13px 0 9px;color:var(--gold)}.kicker-symbol::before,.kicker-symbol::after{content:"";width:90px;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent)}.sacred-small{font-size:22px;text-shadow:0 0 18px rgba(245,196,91,.38)}.hero-text{margin:13px auto 0;max-width:580px;color:rgba(255,255,255,.92);font-size:clamp(14px,1vw,17px);line-height:1.45}.hero-actions{margin-top:19px;display:flex;justify-content:center;gap:20px;flex-wrap:wrap}.btn{min-width:210px;padding:13px 23px;border-radius:8px;border:1px solid rgba(255,255,255,.24);font-size:12px;font-weight:900;letter-spacing:.8px;transition:.25s}.btn-gold{color:#16100a;border-color:rgba(255,226,127,.62);background:linear-gradient(180deg,#ffe27d,#d79d32);box-shadow:0 0 28px rgba(232,177,62,.24),inset 0 1px 0 rgba(255,255,255,.45)}.btn-ghost{color:white;background:rgba(0,0,0,.32)}.btn:hover{transform:translateY(-3px);filter:brightness(1.08)}
.portal-row{width:min(1120px,92vw);margin:-50px auto 0;position:relative;z-index:3;display:grid;grid-template-columns:repeat(5,1fr);gap:16px}.portal-card{min-height:190px;padding:22px 18px 18px;border:1px solid rgba(255,255,255,.10);border-radius:12px;background:linear-gradient(180deg,rgba(10,12,18,.70),rgba(2,3,7,.78));backdrop-filter:blur(15px);text-align:center;overflow:hidden;position:relative;transition:.28s ease}.portal-card::before{content:"";position:absolute;inset:-45px -35px auto;height:105px;background:radial-gradient(circle,var(--card-color),transparent 62%);opacity:.24;filter:blur(18px)}.portal-card:hover{transform:translateY(-8px) scale(1.02);box-shadow:0 0 40px color-mix(in srgb,var(--card-color) 30%,transparent);border-color:color-mix(in srgb,var(--card-color) 60%,white 0%)}.card-symbol{width:72px;height:72px;margin:0 auto 18px;display:grid;place-items:center;color:var(--card-color);font-size:45px;text-shadow:0 0 20px var(--card-color)}.portal-card h3{font-size:15px;letter-spacing:1.6px;font-weight:800;margin-bottom:12px}.portal-card p{font-size:12px;line-height:1.5;color:var(--muted);min-height:54px}.portal-card span{display:block;margin-top:16px;color:var(--card-color);font-size:12px;font-weight:900;letter-spacing:1px}.card-univers{--card-color:var(--yellow)}.card-jeux{--card-color:var(--violet)}.card-art{--card-color:var(--blue)}.card-tech{--card-color:var(--green)}.card-shakuna{--card-color:#d05cff}
.frequency-footer{margin-top:8px;padding:16px 20px 22px;text-align:center;background:linear-gradient(180deg,rgba(0,0,0,.12),rgba(0,0,0,.48));border-top:1px solid rgba(255,255,255,.04)}.frequency-footer h2{font-size:18px;letter-spacing:3px;color:var(--gold-2);font-weight:500}.frequency-footer p{margin-top:10px;color:rgba(255,255,255,.86);font-size:14px}.footer-sigil{margin:8px auto;display:flex;align-items:center;justify-content:center;gap:12px;color:var(--gold)}.footer-sigil::before,.footer-sigil::after{content:"";height:1px;width:85px;background:linear-gradient(90deg,transparent,var(--gold),transparent)}.socials{display:flex;justify-content:center;gap:28px;margin-top:8px}.socials a{width:28px;height:28px;display:grid;place-items:center;border-radius:50%;color:var(--gold-2);font-size:22px;transition:.2s}.socials a:hover{transform:translateY(-3px);text-shadow:0 0 18px var(--gold)}
.page-main{min-height:100vh;padding:calc(var(--nav-h) + 54px) 24px 46px}.page-shell{width:min(1120px,92vw);margin:0 auto}.page-hero{padding:45px 34px 35px;border:1px solid rgba(255,255,255,.09);border-radius:20px;background:linear-gradient(180deg,rgba(0,0,0,.48),rgba(0,0,0,.26));backdrop-filter:blur(16px);text-align:center;box-shadow:0 0 60px rgba(0,0,0,.28)}.page-hero h1{font-family:var(--font-title);font-size:clamp(42px,6vw,76px);font-weight:400;color:var(--gold-2);letter-spacing:4px}.page-hero p{max-width:760px;margin:18px auto 0;color:rgba(255,255,255,.83);font-size:16px;line-height:1.6}.content-grid{margin-top:24px;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.info-block{padding:24px;border-radius:15px;background:rgba(0,0,0,.50);border:1px solid rgba(255,255,255,.09);backdrop-filter:blur(14px)}.info-block h2{font-size:18px;color:var(--gold-2);letter-spacing:1px;margin-bottom:12px}.info-block p,.info-block li{font-size:14px;line-height:1.62;color:var(--muted)}.info-block ul{padding-left:18px}.full{grid-column:1/-1}.two{grid-column:span 2}.contact-box{max-width:760px;margin:24px auto 0;padding:26px;border-radius:16px;background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.10)}.contact-box a{color:var(--gold-2)}
@media(max-width:1180px){.brand-name{font-size:24px}.main-nav{gap:16px}.main-nav a{font-size:11px}.header-cta{display:none}.portal-row{grid-template-columns:repeat(3,1fr);margin-top:-28px}.content-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:820px){:root{--nav-h:70px}.site-header{padding:0 18px}.brand-mark{width:38px;height:38px}.brand-name{font-size:22px}.menu-toggle{display:block}.main-nav{position:absolute;top:var(--nav-h);left:0;right:0;display:none;flex-direction:column;gap:0;background:rgba(0,0,0,.95);border-bottom:1px solid rgba(255,255,255,.1);padding:12px 0}.main-nav.open{display:flex}.main-nav a{width:100%;text-align:center;padding:15px}.home-hero{min-height:auto;padding:calc(var(--nav-h) + 45px) 18px 50px}.hero-title{letter-spacing:4px}.hero-actions{flex-direction:column}.btn{width:100%}.portal-row{grid-template-columns:1fr;margin-top:0}.content-grid{grid-template-columns:1fr}.two{grid-column:auto}}

/* =====================================================
   MODAL HAKUNA — info-block détail
   ===================================================== */
.info-block[data-modal]{position:relative;transition:.25s}
.info-block[data-modal]:hover{border-color:rgba(215,170,82,.45);box-shadow:0 0 22px rgba(215,170,82,.12);transform:translateY(-3px)}
.info-block[data-modal]::after{content:"＋";position:absolute;top:14px;right:16px;font-size:18px;color:var(--gold);opacity:.55;line-height:1}
.block-detail{display:none}

#hk-modal{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.72);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;padding:20px;opacity:0;pointer-events:none;transition:.22s}
#hk-modal.open{opacity:1;pointer-events:all}
.hk-modal-box{width:min(640px,100%);max-height:80vh;overflow-y:auto;background:linear-gradient(160deg,rgba(12,14,24,.97),rgba(4,5,10,.97));border:1px solid rgba(215,170,82,.35);border-radius:18px;padding:34px 32px 28px;box-shadow:0 0 60px rgba(0,0,0,.6),0 0 40px rgba(215,170,82,.08);transform:translateY(18px);transition:.22s}
#hk-modal.open .hk-modal-box{transform:translateY(0)}
.hk-modal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;gap:12px}
#hk-modal-title{font-family:'Cinzel',Georgia,serif;font-size:22px;color:var(--gold-2);letter-spacing:2px}
#hk-modal-close{background:none;border:1px solid rgba(255,255,255,.18);color:rgba(255,255,255,.7);border-radius:8px;width:34px;height:34px;font-size:18px;cursor:pointer;flex-shrink:0;display:grid;place-items:center;transition:.18s}
#hk-modal-close:hover{border-color:var(--gold);color:var(--gold)}
#hk-modal-body p{font-size:14px;line-height:1.7;color:rgba(255,255,255,.85);margin-bottom:10px}
#hk-modal-body ul{padding-left:20px;margin-bottom:10px}
#hk-modal-body li{font-size:14px;line-height:1.7;color:rgba(255,255,255,.82);margin-bottom:4px}
#hk-modal-body h3{font-size:15px;color:var(--gold-2);letter-spacing:1px;margin:16px 0 8px}
#hk-modal-body strong{color:var(--gold)}

/* =====================================================
   IMAGES DANS LES BLOCS
   ===================================================== */
.block-img{width:100%;max-height:200px;object-fit:cover;border-radius:10px;margin-bottom:14px;opacity:.9}
.block-img-portrait{width:100%;height:220px;object-fit:cover;object-position:top;border-radius:10px;margin-bottom:14px;filter:grayscale(20%)}

/* MODAL image */
#hk-modal-body img{width:100%;border-radius:12px;margin-bottom:14px;display:block}

/* GALERIE cartes / oracle */
.card-gallery{margin-top:28px}
.card-gallery h2{font-size:18px;color:var(--gold-2);letter-spacing:2px;margin-bottom:18px;font-family:var(--font-title)}
.cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:14px}
.card-item{cursor:pointer;border-radius:10px;overflow:hidden;border:1px solid rgba(255,255,255,.10);transition:.25s;background:rgba(0,0,0,.4)}
.card-item img{width:100%;display:block;border-radius:10px 10px 0 0}
.card-item:hover{transform:translateY(-5px) scale(1.03);border-color:rgba(215,170,82,.5);box-shadow:0 0 24px rgba(215,170,82,.15)}
.card-item-label{text-align:center;font-size:11px;font-weight:700;letter-spacing:1px;color:var(--gold);padding:8px 4px}

@media(max-width:820px){.cards-grid{grid-template-columns:repeat(auto-fill,minmax(110px,1fr))}}

/* =====================================================
   SECTION DOCUMENTS / CREDENTIALS
   ===================================================== */
.doc-section{margin-top:28px}
.doc-section h2{font-size:18px;color:var(--gold-2);letter-spacing:2px;margin-bottom:18px;font-family:var(--font-title)}
.doc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.doc-card{padding:18px 20px;border:1px solid rgba(255,255,255,.09);border-radius:12px;background:rgba(0,0,0,.48);backdrop-filter:blur(12px);transition:.22s;cursor:default}
.doc-card:hover{border-color:rgba(215,170,82,.35);background:rgba(0,0,0,.62)}
.doc-card-tag{font-size:10px;font-weight:900;letter-spacing:1.5px;color:var(--gold);opacity:.7;margin-bottom:6px}
.doc-card h3{font-size:14px;font-weight:700;letter-spacing:.5px;color:var(--text);margin-bottom:8px}
.doc-card p{font-size:12px;line-height:1.55;color:var(--muted)}
.doc-stats{display:flex;gap:18px;flex-wrap:wrap;margin-top:24px;padding:18px 20px;border:1px solid rgba(215,170,82,.2);border-radius:12px;background:rgba(215,170,82,.04)}
.stat-item{text-align:center}
.stat-num{display:block;font-size:28px;font-weight:800;color:var(--gold-2);font-family:var(--font-title);line-height:1}
.stat-label{display:block;font-size:10px;letter-spacing:1px;color:var(--muted);margin-top:4px}
.system-img{width:100%;border-radius:12px;margin-top:18px;border:1px solid rgba(255,255,255,.08);opacity:.88}

/* =====================================================
   GALERIE PEINTURES — SÉRIES
   ===================================================== */
.paint-section{margin-top:38px}
.paint-section-title{font-family:var(--font-title);font-size:16px;color:var(--gold-2);letter-spacing:3px;margin-bottom:16px;padding-bottom:8px;border-bottom:1px solid rgba(215,170,82,.18)}
.paint-series{margin-bottom:36px}
.paint-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.paint-item{position:relative;overflow:hidden;border-radius:10px;cursor:pointer;border:1px solid rgba(255,255,255,.07);aspect-ratio:4/3;background:#000}
.paint-item img{width:100%;height:100%;object-fit:cover;transition:.3s;display:block}
.paint-item:hover img{transform:scale(1.06);opacity:.85}
.paint-item-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.75) 0%,transparent 50%);opacity:0;transition:.25s;display:flex;align-items:flex-end;padding:12px}
.paint-item:hover .paint-item-overlay{opacity:1}
.paint-item-label{font-size:11px;font-weight:700;color:var(--gold);letter-spacing:1px}
/* portrait ratio for some */
.paint-item.portrait{aspect-ratio:3/4}
@media(max-width:640px){.paint-grid{grid-template-columns:repeat(2,1fr)}}

/* ── FOOTER LEGAL ── */
.footer-legal{margin-top:14px;padding-top:12px;border-top:1px solid rgba(255,255,255,.06);font-size:11px;color:rgba(255,255,255,.45);text-align:center;line-height:1.8}
.footer-legal a{color:rgba(215,170,82,.6);text-decoration:none;letter-spacing:.5px;transition:.18s}
.footer-legal a:hover{color:var(--gold-2,#f1c868)}