/* EsoterHost — Design system sombre premium (partagé) */
:root{
  --bg:#08090c; --bg-soft:#0c0e12;
  --surface:rgba(255,255,255,.04); --surface-2:rgba(255,255,255,.07); --surface-3:rgba(255,255,255,.10);
  --border:rgba(255,255,255,.10); --border-strong:rgba(255,255,255,.18);
  --text:#edeff3; --text-dim:#a2a9b4; --text-mute:#6b7280;
  --accent:#22c55e; --accent-2:#16a34a; --accent-ink:#04130a; --accent-soft:rgba(34,197,94,.12);
}
/* base */
html{scroll-behavior:auto!important;overflow-x:hidden;background:var(--bg)}
body{background:var(--bg)!important;color:var(--text)!important;overflow:visible!important}
body::before{content:'';position:fixed;inset:0;z-index:-2;pointer-events:none;background:
  radial-gradient(1100px 680px at 82% -10%,rgba(34,197,94,.16),transparent 56%),
  radial-gradient(820px 700px at 6% 2%,rgba(34,197,94,.07),transparent 52%),
  radial-gradient(1000px 1100px at 50% 118%,rgba(56,120,255,.06),transparent 60%),
  var(--bg);}
body::after{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.02;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}
/* nav */
nav{background:rgba(8,9,12,.66)!important;-webkit-backdrop-filter:blur(18px) saturate(160%);backdrop-filter:blur(18px) saturate(160%);border-bottom:1px solid var(--border)!important}
.logo span{color:var(--text)!important}
.logo-mark{background:var(--surface-2)!important;border:1px solid var(--border)}
.nav-links a{color:var(--text-dim)!important}
.nav-links a:hover{color:var(--text)!important}
.nav-hamburger span{background:var(--text)!important}
.mobile-menu{background:rgba(8,9,12,.97)!important;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-bottom-color:var(--border)!important}
.mobile-menu a{color:var(--text)!important;border-bottom-color:var(--border)!important}

/* type */
h1,h2,h3{color:var(--text)!important}
.hero-section h1{background:linear-gradient(180deg,#ffffff 28%,#aab2c0);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent!important}
p.lead{color:var(--text-dim)!important}
.section-tag{color:var(--accent)!important}
hr{border-top-color:var(--border)!important}

/* buttons */
.btn-dark{background:var(--accent)!important;color:var(--accent-ink)!important;border-color:transparent!important;font-weight:600;box-shadow:0 1px 0 rgba(255,255,255,.22) inset,0 10px 30px -10px rgba(34,197,94,.6)}
.btn-dark:hover{background:#2bd46a!important}
.btn-outline{background:var(--surface)!important;color:var(--text)!important;border-color:var(--border-strong)!important;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.btn-outline:hover{border-color:var(--accent)!important;color:#fff!important;background:var(--accent-soft)!important}

/* carousel */
.gc{background:var(--surface)!important;border-color:var(--border)!important;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.gc:hover{border-color:rgba(34,197,94,.32)!important;box-shadow:0 30px 70px -26px rgba(0,0,0,.85),0 0 0 1px rgba(34,197,94,.12)!important}
.gc-tag{background:var(--surface-2)!important;color:var(--text-dim)!important}
.gc-footer{border-top-color:var(--border)!important}
.gc-price{color:var(--text)!important}
.gc-from{color:var(--text-mute)!important}
.gc-cta{background:var(--accent)!important;color:var(--accent-ink)!important;font-weight:600}
.gc-cta:hover{background:#2bd46a!important}
.gf-btn{background:var(--surface)!important;border-color:var(--border)!important;color:var(--text-dim)!important}
.gf-btn.active{background:var(--accent)!important;color:var(--accent-ink)!important;border-color:transparent!important}
.gf-btn:hover:not(.active){border-color:var(--border-strong)!important;color:var(--text)!important}
.gc-nav-btn{background:var(--surface)!important;border-color:var(--border)!important;color:var(--text)!important;box-shadow:none!important}
.gc-nav-btn:hover{background:var(--accent)!important;color:var(--accent-ink)!important;border-color:transparent!important}
.gc-dot{background:var(--border-strong)!important}
.gc-dot.active{background:var(--accent)!important}

/* plans */
.plan-card{background:var(--surface)!important;border-color:var(--border)!important;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.plan-card:hover{box-shadow:0 36px 80px -32px rgba(0,0,0,.85)!important}
.plan-featured{border-color:rgba(34,197,94,.5)!important;box-shadow:0 0 0 1px rgba(34,197,94,.18),0 40px 90px -34px rgba(34,197,94,.3)!important}
.feat-list li{color:var(--text-dim)!important}
.feat-list li.yes::before{color:var(--accent)!important}
.feat-list li.no,.feat-list li.no::before{color:var(--text-mute)!important}

/* compare */
.cmp-table th{color:var(--text-mute)!important;border-bottom-color:var(--border)!important}
.cmp-table td{color:var(--text-dim)!important;border-bottom-color:var(--border)!important}
.tick{color:var(--accent)!important}
.cross{color:var(--text-mute)!important}

/* testimonials */
.testi-card{background:var(--surface)!important;border-color:var(--border)!important;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.testi-star{background:var(--accent)!important}
.avatar{background:var(--surface-2)!important;color:var(--text-dim)!important}
.spec{background:var(--surface-2)!important;color:var(--text-dim)!important}

/* faq */
details{border-top-color:var(--border)!important}
details:last-child{border-bottom-color:var(--border)!important}
details summary{color:var(--text)!important}
details summary .ico{color:var(--text-mute)!important}
details .faq-body{color:var(--text-dim)!important}

/* announce + footer */
.announce-bar{background:rgba(6,7,10,.92)!important;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--border)}
footer{background:#070809!important;border-top:1px solid var(--border)}
footer a:hover{color:var(--text)!important}

/* hero dot grid */
.hero-dotgrid{background-image:radial-gradient(circle,rgba(255,255,255,.06) 1px,transparent 1px)!important;opacity:1!important}

/* ── inline-style override net ── */
[style*="background:#fff"],[style*="background:#ffffff"],[style*="background:#fafaf8"],[style*="background:#f7f7f5"],[style*="background:#f0f0ee"],[style*="background:#f4f4f1"],[style*="background:#f4f4f2"]{background-color:var(--surface)!important}
[style*="background:#e2e2de"],[style*="background:#e8e8e4"]{background-color:var(--border)!important}
[style*="background:#2a2a2a"],[style*="background:#333"]{background-color:var(--surface-2)!important}
[style*="background:#f0fdf4"],[style*="background:#f3f7f3"]{background-color:var(--accent-soft)!important}
[style*="linear-gradient(135deg,#fcfcfb"]{background-image:none!important;background-color:var(--surface)!important}
[style*="color:#1a1a1a"],[style*="color:#111"],[style*="color:#f7f7f5"],[style*="color:#fff"]{color:var(--text)!important}
[style*="color:#333"],[style*="color:#444"],[style*="color:#555"],[style*="color:#666"]{color:var(--text-dim)!important}
[style*="color:#777"],[style*="color:#888"],[style*="color:#999"],[style*="color:#aaa"],[style*="color:#bbb"]{color:var(--text-mute)!important}
[style*="solid #e2e2de"],[style*="solid #f0f0ee"],[style*="solid #e8e8e4"],[style*="solid #d4d4d0"],[style*="solid #c8c8c4"],[style*="solid #cfcfca"],[style*="solid #f0f0ee"]{border-color:var(--border)!important}
[style*="background:#1a1a1a"]{background-color:var(--bg-soft)!important}

/* éléments animés par GSAP : ciblage par classe/structure (l'attribut style normalisé casse [style*]) */
.stats-grid{background:var(--border)!important}
.hero-grid > div:first-child > div:first-child{background:var(--surface)!important;border-color:var(--border)!important}
#launchToast{background:var(--bg-soft)!important;box-shadow:0 12px 44px rgba(0,0,0,.6),0 0 0 1px var(--border)!important}
#launchToast > div:first-child{background:var(--accent-soft)!important}

/* illustrations SVG (plans + schéma infra) recolorées pour le sombre — logos/icônes exclus */
.plan-card svg [fill="#e8e8e4"],#infrastructure svg [fill="#fff"],#infrastructure svg [fill="#e8e8e4"]{fill:rgba(255,255,255,.09)}
.plan-card svg [fill="#1a1a1a"],#infrastructure svg [fill="#1a1a1a"]{fill:rgba(255,255,255,.2)}
.plan-card svg [fill="#333"]{fill:rgba(255,255,255,.34)}
.plan-card svg [fill="#d4d4d0"],#infrastructure svg [fill="#f0f0ee"]{fill:rgba(255,255,255,.22)}
.plan-card svg [stroke="#d4d4d0"],.plan-card svg [stroke="#c8c8c4"],#infrastructure svg [stroke="#e2e2de"],#infrastructure svg [stroke="#d4d4d0"]{stroke:rgba(255,255,255,.16)}
.plan-card svg [fill="#aaa"],.plan-card svg [fill="#888"],#infrastructure svg [fill="#aaa"],#infrastructure svg [fill="#bbb"],#infrastructure svg [fill="#666"]{fill:var(--text-mute)}

/* reveal initial states (GSAP) */
.r-up{opacity:0;transform:translateY(28px)}
@media (prefers-reduced-motion:reduce){.r-up{opacity:1!important;transform:none!important}}

/* ════════ Composants spécifiques — page Jeux (games.html) ════════ */
.filter-btn{background:var(--surface)!important;border-color:var(--border)!important;color:var(--text-dim)!important}
.filter-btn:hover{border-color:var(--border-strong)!important;color:var(--text)!important}
.filter-btn.active{background:var(--accent)!important;color:var(--accent-ink)!important;border-color:transparent!important}
.gc-desc{color:var(--text-dim)!important}
.gc-from-label{color:var(--text-mute)!important}
.gc-meta .gc-name{color:var(--text)!important}
/* pastilles de catégorie : couleur conservée, version sombre translucide */
.cat-fps{background:rgba(239,68,68,.16)!important;color:#fca5a5!important}
.cat-survie{background:rgba(34,197,94,.16)!important;color:#86efac!important}
.cat-sandbox{background:rgba(59,130,246,.16)!important;color:#93c5fd!important}
.cat-aventure{background:rgba(245,158,11,.18)!important;color:#fcd34d!important}

/* ════════ Formes rgb() normalisées (quand un JS touche el.style et resérialise l'attribut) ════════ */
[style*="background: rgb(255, 255, 255)"],[style*="background: rgb(250, 250, 248)"],[style*="background: rgb(247, 247, 245)"],[style*="background: rgb(240, 240, 238)"]{background-color:var(--surface)!important}
[style*="background: rgb(226, 226, 222)"],[style*="background: rgb(232, 232, 228)"]{background-color:var(--border)!important}
[style*="rgb(226, 226, 222)"],[style*="rgb(212, 212, 208)"],[style*="rgb(240, 240, 238)"],[style*="rgb(200, 200, 196)"]{border-color:var(--border)!important}
[style*="color: rgb(26, 26, 26)"],[style*="color: rgb(17, 17, 17)"]{color:var(--text)!important}
[style*="color: rgb(51, 51, 51)"],[style*="color: rgb(68, 68, 68)"],[style*="color: rgb(85, 85, 85)"],[style*="color: rgb(102, 102, 102)"]{color:var(--text-dim)!important}
[style*="color: rgb(136, 136, 136)"],[style*="color: rgb(153, 153, 153)"],[style*="color: rgb(170, 170, 170)"],[style*="color: rgb(187, 187, 187)"]{color:var(--text-mute)!important}

/* ════════ Composants spécifiques — page Conteneur Pro (pro.html) ════════ */
.use-card{background:var(--surface)!important;border-color:var(--border)!important}
.use-icon{background:var(--surface-2)!important}
.use-icon svg{color:var(--accent)!important}
.use-icon svg [stroke="#1a1a1a"],.use-icon svg [stroke="#111"],.use-icon svg [stroke="#333"]{stroke:var(--accent)!important}
.use-icon svg [fill="#1a1a1a"]:not([fill="none"]),.use-icon svg [fill="#333"]:not([fill="none"]){fill:var(--accent)!important}

/* ════════ Composants spécifiques — page Infrastructure (infrastructure.html) ════════ */
.stat-box{background:var(--surface)!important;border-color:var(--border)!important}
.hw-row{border-bottom-color:var(--border)!important}
.hw-icon{background:var(--surface-2)!important}
.hw-icon svg{color:var(--accent)!important}
.hw-icon svg [stroke="#1a1a1a"],.hw-icon svg [stroke="#333"]{stroke:var(--accent)!important}
.hw-icon svg [fill="#1a1a1a"]:not([fill="none"]){fill:var(--accent)!important}
.dc-soon{background:var(--surface)!important;color:var(--text-mute)!important;border-color:var(--border)!important}
.dc-active{background:var(--accent-soft)!important;color:#86efac!important;border:1px solid rgba(34,197,94,.32)!important}
[style*="background:#f5f5f3"],[style*="background: rgb(245, 245, 243)"]{background-color:var(--surface-2)!important}

/* ════════ Pages secondaires (faq, offres, sponsore, status, docs, api-docs, légal…) ════════ */
/* cartes & panneaux blancs → verre */
.card,.partner-card,.platform-card,.highlight-box,.dc-card,.history-wrap,.sus-card,.article,.feature-card,.value-card,.team-card,.contact-card{background:var(--surface)!important;border-color:var(--border)!important}
.search-bar input{background:var(--surface)!important;border-color:var(--border)!important;color:var(--text)!important}
/* tags / chips / petits fonds gris → verre 2 */
.spec-row,.partner-tag,.tag-optional,.badge-grey,.inc-service-tag,.comp-icon,.sus-ref,.category-chip.inactive,.param-table th,.docs-nav a:hover,.docs-nav a.active{background:var(--surface-2)!important;color:var(--text-dim)!important;border-color:var(--border)!important}
.category-chip:not(.inactive){background:var(--accent)!important;color:var(--accent-ink)!important;border-color:transparent!important}
/* boutons blancs / ghost */
.btn-white,.sus-btn.ghost{background:var(--surface)!important;color:var(--text)!important;border-color:var(--border-strong)!important}
.btn-white:hover,.sus-btn.ghost:hover{background:var(--surface-2)!important}
/* colonne / ligne mise en avant */
.compare-table .col-hi{background:var(--accent-soft)!important}
.comp-row:hover{background:var(--surface)!important}
/* code inline */
.article-body code{background:var(--surface-2)!important;border-color:var(--border)!important;color:#fca5a5!important}
/* callouts & badges colorés → translucides sur sombre */
.article-body .warn,.banner.warn,.badge-warn,.m-patch,.cat-files{background:rgba(245,158,11,.13)!important;border-color:rgba(245,158,11,.3)!important;color:#fcd34d!important}
.article-body .info,.cat-start{background:rgba(59,130,246,.13)!important;border-color:rgba(59,130,246,.3)!important;color:#93c5fd!important}
.banner.critical,.badge-err,.tag-required,.m-delete,.cat-security{background:rgba(239,68,68,.13)!important;border-color:rgba(239,68,68,.3)!important;color:#fca5a5!important}
.cat-billing,.platform-card-twitch{background:rgba(168,85,247,.14)!important;color:#d8b4fe!important}
.sus-icon{background:rgba(239,68,68,.14)!important}
.hbar.nodata{background:var(--border)!important}
.badge-ok,.banner.ok,.cat-survie{background:rgba(34,197,94,.13)!important;border-color:rgba(34,197,94,.32)!important;color:#86efac!important}
.cat-server{background:rgba(34,197,94,.13)!important;color:#86efac!important}
.cat-advanced{background:var(--surface-2)!important;color:var(--text-dim)!important}
.footer-col-title{color:var(--text-mute)!important}
.plan-grid{background:var(--border)!important}

/* ════════ Pastels colorés inline (badges/chips/callouts) → translucides sombres ════════ */
[style*="#dcfce7"],[style*="#d1fae5"],[style*="#ecfdf5"],[style*="rgb(220, 252, 231)"]{background-color:rgba(34,197,94,.16)!important}
[style*="#fee2e2"],[style*="#fef2f2"],[style*="#fecaca"],[style*="rgb(254, 226, 226)"]{background-color:rgba(239,68,68,.15)!important}
[style*="#fef3c7"],[style*="#fefce8"],[style*="#fde68a"],[style*="#fff7ed"]{background-color:rgba(245,158,11,.15)!important}
[style*="#eff6ff"],[style*="#dbeafe"],[style*="#bfdbfe"],[style*="#e0f2fe"]{background-color:rgba(59,130,246,.15)!important}
[style*="#fdf4ff"],[style*="#f9f5ff"],[style*="#faf5ff"],[style*="#f3e8ff"]{background-color:rgba(168,85,247,.15)!important}
[style*="color:#166534"],[style*="color:#15803d"],[style*="color:#16a34a"],[style*="color:#166f3c"]{color:#86efac!important}
[style*="color:#dc2626"],[style*="color:#991b1b"],[style*="color:#b91c1c"],[style*="color:#ef4444"]{color:#fca5a5!important}
[style*="color:#92400e"],[style*="color:#854d0e"],[style*="color:#b45309"],[style*="color:#a16207"]{color:#fcd34d!important}
[style*="color:#1d4ed8"],[style*="color:#1e40af"],[style*="color:#2563eb"],[style*="color:#1e3a8a"]{color:#93c5fd!important}
[style*="color:#7e22ce"],[style*="color:#7c3aed"],[style*="color:#6b21a8"]{color:#d8b4fe!important}
[style*="#ede8f5"],[style*="#fae8ff"]{background-color:rgba(168,85,247,.14)!important}
[style*="#ebebea"],[style*="#e0e0de"],[style*="background:#ccc"],[style*="background: #ccc"],[style*="background:#cccccc"]{background-color:var(--surface-2)!important}
.platform-grid,.step-line,.step-sep,.strength-track,.node-mini-bar-wrap{background:var(--border)!important}

/* ════════ Blocs de code (sélecteurs d'élément) ════════ */
code{background:var(--surface-2)!important;color:#e6c07b!important;border-color:var(--border)!important}
pre{background:#0c0e12!important;border:1px solid var(--border)!important;color:var(--text-dim)!important}
pre code{background:none!important;border:none!important;color:inherit!important}
.m-get{background:rgba(59,130,246,.16)!important;color:#93c5fd!important}
.m-post{background:rgba(34,197,94,.16)!important;color:#86efac!important}
.m-put{background:rgba(168,85,247,.16)!important;color:#d8b4fe!important}

/* ════════ Pages auth (login, register, forgot-password, reset-password, verify-email) ════════ */
input[type=text],input[type=email],input[type=password],input[type=search],input[type=number],input[type=tel],textarea,select,.form-input{background:var(--surface)!important;border-color:var(--border)!important;color:var(--text)!important}
.form-input:focus,input:focus,textarea:focus{border-color:var(--accent)!important}
.form-input::placeholder,input::placeholder{color:var(--text-mute)!important}
.form-label,.subtitle,.footer-link,.back-link{color:var(--text-dim)!important}
.footer-link a,.back-link:hover{color:var(--text)!important}
.divider{color:var(--text-mute)!important}
.divider::before,.divider::after{background:var(--border)!important}
.error-msg{background:rgba(239,68,68,.13)!important;border-color:rgba(239,68,68,.3)!important;color:#fca5a5!important}
.mark{background:var(--surface-2)!important}
.split-right{background:transparent!important}
.step-dot.idle{background:var(--surface-2)!important;color:var(--text-mute)!important;border-color:var(--border)!important}
.step-dot.active{background:var(--accent)!important;color:var(--accent-ink)!important}
[style*="#fff8f8"],[style*="#fffafa"]{background-color:rgba(239,68,68,.1)!important}

/* ════════ Autofill navigateur sur fond sombre (Chrome force sinon un fond clair) ════════ */
input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,input:-webkit-autofill:active,textarea:-webkit-autofill,select:-webkit-autofill{
  -webkit-text-fill-color:var(--text)!important;
  -webkit-box-shadow:0 0 0 1000px #15181e inset!important;
  box-shadow:0 0 0 1000px #15181e inset!important;
  caret-color:var(--text)!important;
  border:1px solid var(--border)!important;
  transition:background-color 99999s ease-in-out 0s!important;
}

/* ════════ Hero secondaires : halo vert + mot en dégradé (cohérence homepage) ════════ */
.page-hero{position:relative;overflow:hidden}
.page-hero::before{content:'';position:absolute;left:50%;top:-42%;transform:translateX(-50%);width:1100px;max-width:132vw;height:700px;background:radial-gradient(closest-side,rgba(34,197,94,.16),transparent 70%);pointer-events:none;z-index:0}
.page-hero > *{position:relative;z-index:1}
.grad{background:linear-gradient(100deg,#34d399,#22d3ee);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
