/* Espace de Willy — couche de style commune aux pages principales (accueil, blog, messages, démo, paie, espace client).
   Elle reprend le style des pages Jeux / Experts : Fraunces + DM Sans, icônes Ionicons, mouvements doux. */
.ew-root{--display:"Fraunces",Georgia,"Times New Roman",serif;--sans:"DM Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--mono:"JetBrains Mono",Consolas,monospace;--ease:cubic-bezier(.2,.8,.2,1);--gold:#F59E0B;
  font-family:var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.ew-root ::selection{background:#F59E0B;color:#0A1F44}

/* ---------- typographie ---------- */
.ew-root [style*="Sora"]{font-family:var(--sans)!important}
.ew-root h1,.ew-root h2,.ew-root h3,.ew-root h1[style],.ew-root h2[style],.ew-root h3[style]{font-family:var(--display)!important;font-weight:500!important;letter-spacing:-.03em!important;font-variation-settings:"opsz" 144}
.ew-root h1{line-height:1!important}
.ew-root h1 span,.ew-root h2 span[style*="color"]{font-style:italic;font-weight:400}
.ew-root h3{letter-spacing:-.02em!important}
/* gros chiffres (prix, statistiques) */
.ew-root b[style*="font-size: 3"],.ew-root b[style*="font-size: 4"],.ew-root span[style*="font-size: 4"][style*="font-weight: 800"],.ew-root b[style*="font-size: 2"][style*="font-weight: 800"]{font-family:var(--display)!important;font-weight:500!important;letter-spacing:-.02em}
/* logo texte */
.ew-root>header>div>a:first-child span[style*="Sora"],.ew-root>header a>div>span:first-child{font-family:var(--display)!important;font-size:20px!important;font-weight:500!important;letter-spacing:-.01em!important}
.ew-root>header>div>a:first-child span[style*="Sora"] b,.ew-root>header a>div>span:first-child b{font-weight:600!important}
.ew-root>header a svg{transition:transform .5s var(--ease)}
.ew-root>header a:hover svg{transform:rotate(-8deg) scale(1.06)}
/* surtitres : trait doré + lettres espacées */
.ew-root span[style*="text-transform: uppercase"][style*="letter-spacing: 0.1em"]{display:inline-flex;align-items:center;gap:10px;font-size:13px!important;letter-spacing:.14em!important}
.ew-root span[style*="text-transform: uppercase"][style*="letter-spacing: 0.1em"]::before{content:"";width:28px;height:1px;background:var(--gold);flex-shrink:0}

/* ---------- menu ---------- */
.ew-root>header nav>a{position:relative;transition:color .25s}
.ew-root>header nav>a::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;border-radius:2px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.ew-root>header nav>a:hover::after{transform:scaleX(1)}

/* ---------- boutons d'action ---------- */
.ew-root a[style*="min-height: 5"],.ew-root button[style*="min-height: 5"]{border-radius:999px!important;transition:transform .3s var(--ease),box-shadow .3s,background-color .25s,border-color .25s!important}
.ew-root a[style*="min-height: 5"]:hover,.ew-root button[style*="min-height: 5"]:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 16px 30px -18px var(--shadow)}
.ew-root a[style*="min-height: 5"]:active,.ew-root button[style*="min-height: 5"]:active{transform:scale(.98)}
.ew-root a[style*="min-height: 5"] span[aria-hidden="true"],.ew-root a span[aria-hidden="true"]:last-child{display:inline-block;transition:transform .3s var(--ease)}
.ew-root a:hover>span[aria-hidden="true"]:last-child{transform:translateX(4px)}

/* ---------- cartes ---------- */
.ew-root .ew-card,.ew-root .wn-card{transition:transform .45s var(--ease),box-shadow .45s var(--ease),border-color .3s!important}
.ew-root .ew-card:hover,.ew-root .wn-card:hover{transform:translateY(-6px);box-shadow:0 30px 50px -30px var(--shadow)}
.ew-root .ew-ico{transition:transform .5s var(--ease),border-radius .5s}
.ew-root .ew-card:hover .ew-ico,.ew-root .wn-card:hover .ew-ico{transform:rotate(-8deg) scale(1.08);border-radius:50%}
.ew-root img{transition:transform .8s var(--ease)}
.ew-root .wn-card:hover img,.ew-root .ew-card:hover img{transform:scale(1.03)}

/* ---------- héros de l'accueil : bleu nuit, halos, grille de points ---------- */
#accueil{--blob:#1D4ED8;--t-cyan:#7C3AED;background:#071433!important;isolation:isolate}
#accueil>div[style*="position: relative"]>div:first-child{--ink:#FFFFFF;--ink2:#C9D6F2;--ink3:#9FB0D2;--link:#FBBF24;--accent-ink:#FBBF24;--kicker:#FBBF24;--line2:rgba(255,255,255,.18);--line:rgba(255,255,255,.12);color:#fff}
#accueil::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background-image:radial-gradient(rgba(255,255,255,.09) 1px,transparent 1px);background-size:22px 22px;-webkit-mask-image:linear-gradient(180deg,#000 20%,transparent 100%);mask-image:linear-gradient(180deg,#000 20%,transparent 100%)}
#accueil>div[style*="position: absolute"]{filter:blur(70px);opacity:.7;animation:ewFloat 16s ease-in-out infinite alternate}
#accueil>div[style*="position: absolute"]:nth-child(2){opacity:.45;animation-duration:22s}
#accueil>div[style*="position: relative"]{z-index:1}
#accueil h1{color:#fff}
#accueil h1 span{color:#FBBF24!important}
#accueil div[style*="border-radius: 999px"][style*="background: var(--surface)"]{background:rgba(255,255,255,.08)!important;backdrop-filter:blur(8px)}
#accueil a[href="#contact"]{background:transparent!important;color:#fff!important;border-color:rgba(255,255,255,.35)!important}
#accueil a[href="#contact"]:hover{background:rgba(255,255,255,.08)!important}
/* autres héros (blog, paie) : même fond bleu nuit, colonne de texte en clair */
.ew-root section[style*="overflow: hidden"]:has(h1):not(#accueil){background:#071433!important;isolation:isolate}
.ew-root section[style*="overflow: hidden"]:has(h1):not(#accueil)::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(520px 360px at 92% 0%,rgba(29,78,216,.55),transparent 70%),radial-gradient(420px 300px at 0% 100%,rgba(245,158,11,.22),transparent 70%),radial-gradient(rgba(255,255,255,.08) 1px,transparent 1px) 0 0/22px 22px}
.ew-root section[style*="overflow: hidden"]:has(h1):not(#accueil)>div[style*="position: absolute"]{display:none}
.ew-root section[style*="overflow: hidden"]:has(h1):not(#accueil)>div:not([style*="position: absolute"]){position:relative;z-index:1}
.ew-root section[style*="overflow: hidden"]:has(h1):not(#accueil)>div:not([style*="position: absolute"])>div:first-child{--ink:#FFFFFF;--ink2:#C9D6F2;--ink3:#9FB0D2;--link:#FBBF24;--accent-ink:#FBBF24;--kicker:#FBBF24;--line2:rgba(255,255,255,.3);color:#fff}
.ew-root section[style*="overflow: hidden"]:has(h1):not(#accueil) h1{color:#fff}
.ew-root section[style*="overflow: hidden"]:has(h1):not(#accueil)>div>div:first-child [style*="background: var(--surface)"]{background:rgba(255,255,255,.08)!important;color:#fff!important}
@keyframes ewFloat{0%{transform:translate(0,0) scale(1)}100%{transform:translate(-40px,30px) scale(1.12)}}

/* ---------- apparition au défilement (navigateurs récents ; sinon tout reste visible) ---------- */
@supports (animation-timeline: view()){
  .ew-root section:not(:has(h1))>div>*:not([style*="position: absolute"]):not([style*="position: fixed"]):not(:has(input,select,textarea)):not(input,select,textarea,form),
  .ew-root section:not(:has(h1)) [style*="display: grid"]>*:not([style*="position: fixed"]):not(:has(input,select,textarea)):not(input,select,textarea,label){animation:ewReveal linear both;animation-timeline:view();animation-range:entry 0% cover 16%}
  .ew-root section [style*="position: fixed"] *{animation:none!important}
}
@keyframes ewReveal{from{opacity:0;transform:translateY(28px);filter:blur(3px)}to{opacity:1;transform:none;filter:none}}
@media (prefers-reduced-motion: reduce){.ew-root *,.ew-root *::before,.ew-root *::after{animation:none!important;transition:none!important}}

/* aperçu des articles d'astuce : image nette sur fond flouté */
.ew-root .wn-card .ew-tipcover{transition:transform .6s var(--ease)}
.ew-root .wn-card:hover .ew-tipcover{transform:rotate(-3deg) scale(1.06)}

/* mode jour par défaut ; empêche le navigateur d'assombrir le site de force (le mode nuit se choisit avec la lune) */
html{color-scheme:light only}
html:has(.ew-root[data-theme="dark"]){color-scheme:dark}