/* AmiEnLigne.fr — thème unifié, sans styles contradictoires. 2026-10-15 */
:root{color-scheme:dark;--bg:#060e1c;--panel:#0b182c;--border:#273c5b;--text:#f4f7ff;--muted:#bac9e1;--pink:#fa3189}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:96px}body{margin:0;background:var(--bg);color:var(--text);font:16px/1.58 system-ui,-apple-system,'Segoe UI',Arial,sans-serif;overflow-x:hidden}a{color:inherit}
.wrap{width:calc(100% - 48px);max-width:1340px;margin:0 auto}.top{position:sticky;top:0;z-index:30;background:#09182d;border-bottom:1px solid var(--border)}.nav{min-height:82px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{font-size:29px;font-weight:850;white-space:nowrap;text-decoration:none;letter-spacing:-.8px}.brand span:not(.flag){color:#ff4697}.brand small{font-size:18px}.flag{margin-right:8px;font-size:25px}.nav nav{display:flex;flex-wrap:wrap;gap:26px}.nav nav a{text-decoration:none;font-size:16px}.nav nav a:hover{color:#ff83b9}
.hero{background:linear-gradient(90deg,#08172ef2,#08172ee8 70%,#08172eb5),url('../img/hero-design.webp') center/cover;min-height:300px}.hero .wrap{padding:42px 0}.hero h1{font-size:clamp(30px,3.4vw,48px);line-height:1.16;margin:14px 0}.hero p{max-width:800px;color:var(--muted);font-size:17px}.eyebrow{font-size:13px;color:#ff65a9;font-weight:800;text-transform:uppercase;letter-spacing:.04em}
.section{padding:30px 0}.section h2{font-size:clamp(23px,2.4vw,32px);margin:0 0 22px;line-height:1.25}.section>p,.intro{max-width:1000px}.grid,.three{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.card,.panel{background:var(--panel);border:1px solid var(--border);border-radius:19px;overflow:hidden}.card{display:flex;flex-direction:column;min-width:0}.panel{padding:23px}.card .banner-link{display:block;position:relative;width:100%;height:auto;aspect-ratio:1.82/1;background:#071120;overflow:hidden;flex:none}.card .app-banner{display:block;width:100%;height:100%;object-fit:contain;object-position:center;background:#071120}.card .pad{display:flex;flex-direction:column;flex:1;padding:22px 24px 24px}.card h3{font-size:27px;margin:8px 0 14px;line-height:1.2}.card p,.panel p{font-size:16px;color:var(--muted);margin:0 0 19px}.card .buttons{margin-top:auto}.rank{display:inline-block;align-self:flex-start;background:#1a2d4c;border:1px solid #38557b;border-radius:99px;color:#d5e4ff;font-size:13px;font-weight:800;padding:4px 12px;margin-bottom:13px}.buttons{display:flex;gap:12px}.btn{display:inline-flex;align-items:center;justify-content:center;text-align:center;min-width:0;flex:1;border:1px solid #f43a91;border-radius:11px;padding:12px 11px;text-decoration:none;font-weight:750;font-size:15px;line-height:1.3}.btn.primary{background:var(--pink);border-color:var(--pink);color:white}.btn:hover{filter:brightness(1.12)}
.article{max-width:950px}.article h1{font-size:clamp(30px,3.3vw,44px);line-height:1.2}.article h2{font-size:26px;margin:30px 0 13px}.article p,.article li{font-size:17px;line-height:1.72;color:var(--muted)}.article a:not(.btn),.section a:not(.btn){color:#ff8cbd}.article-banner-wrap .app-banner{display:block;width:100%;height:auto;max-height:480px;object-fit:contain;background:#071120;border-radius:15px;margin:20px 0}.lead{font-size:19px!important}.crumb{margin:18px 0;color:#9eb5d7}.crumb a{color:#ff9cc9}.foot{background:#09182d;border-top:1px solid var(--border);padding:34px 0;color:var(--muted)}.foot a{color:#fff}details{border-bottom:1px solid var(--border);padding:16px 0}summary{cursor:pointer;font-weight:750}table{width:100%;border-collapse:collapse;background:#0c1b31}th,td{padding:12px;border:1px solid var(--border);text-align:left;vertical-align:top}th{background:#152942}
@media(max-width:1050px){.grid,.three{grid-template-columns:repeat(2,minmax(0,1fr))}.nav nav{gap:13px}}
@media(max-width:700px){.wrap{width:calc(100% - 30px)}.nav{padding:13px 0;flex-direction:column;align-items:flex-start;gap:9px}.nav nav{gap:14px}.nav nav a{font-size:13px}.grid,.three,.two{grid-template-columns:1fr}.hero{min-height:0}.hero .wrap{padding:35px 0}.section{padding:25px 0}.card .pad{padding:19px}.buttons{flex-wrap:wrap}.btn{font-size:14px}.article p{font-size:16px}}

/* Shared video components: portable across locales */
.video-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px}.video-card{border:1px solid rgba(160,135,190,.35);border-radius:18px;padding:12px;background:rgba(35,25,58,.35)}.video-card video{display:block;width:100%;height:260px;object-fit:contain;background:#110e1e;border-radius:12px}.video-card h3{font-size:1rem;margin:12px 5px 4px}

/* V6 — shared editorial layout, visual reference adapted to real HTML */
:root{--bg:#041020;--panel:#071b31;--border:#294263;--pink:#ff2b88}
.wrap{max-width:1640px;width:calc(100% - 38px)}
.top{background:#07182e}.nav{min-height:66px}
.grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:15px}
.card{border-radius:13px;background:linear-gradient(165deg,#09203b,#07182c);box-shadow:0 5px 18px #0002}
.card .banner-link{aspect-ratio:1.16/1;background:#0b1426}
.card .app-banner{object-fit:cover;object-position:center}
.card .pad{padding:12px 14px 15px}
.card h3{font-size:21px;margin:3px 0 7px}
.card p{font-size:13px;line-height:1.43;margin-bottom:12px}
.card .eyebrow{font-size:11px}
.rank{margin-bottom:8px;font-size:11px;padding:3px 10px}
.buttons{gap:6px}
.btn{font-size:11px;padding:10px 6px;border-radius:7px}
.card:hover{border-color:#f82d886b;transform:translateY(-2px);transition:transform .2s,border-color .2s}
@media(max-width:1399px){.grid{grid-template-columns:repeat(3,minmax(0,1fr))}.card .banner-link{aspect-ratio:1.5/1}.card h3{font-size:24px}.card p{font-size:15px}.btn{font-size:13px}}
@media(max-width:850px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.three{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.grid,.three,.two{grid-template-columns:1fr}.wrap{width:calc(100% - 28px)}.card .banner-link{aspect-ratio:1.35/1}.card .pad{padding:18px}.card p{font-size:15px}.btn{font-size:13px}.nav{min-height:unset}}
