
/* SVALLON v3.2 cinematic silver-blue */
:root{--ink:#0f172a;--muted:#475569;--line:#e5e7eb;--accent1:#60a5fa;--accent2:#c7d2fe}
*{box-sizing:border-box}html,body{margin:0;padding:0;color:var(--ink);font:16px/1.6 Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}
body{background:linear-gradient(to bottom,#eaf2ff,#d2e0ff,#ffffff);animation:fade .8s ease-out}@keyframes fade{from{opacity:0}to{opacity:1}}
.container{max-width:1200px;margin:0 auto;padding:16px}
.site-header{display:flex;align-items:center;gap:14px;padding:12px 16px;position:sticky;top:0;z-index:50;background:#ffffffcc;border-bottom:1px solid var(--line);backdrop-filter:blur(8px)}
.brand img{height:42px}
.nav{display:flex;gap:12px;flex:1;flex-wrap:wrap}.nav a{padding:6px 10px;border-radius:10px;color:#1f2937;font-weight:500}.nav a:hover{background:#f3f4f6}
.lang-wrap{position:relative}.lang-trigger{display:flex;align-items:center;gap:8px;border:1px solid var(--line);padding:6px 10px;border-radius:999px;background:#fff;cursor:pointer}
.lang-menu{position:absolute;right:0;top:calc(100% + 8px);background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.12);width:220px;padding:8px;display:none}
.lang-menu.show{display:block}.lang-menu button{width:100%;display:flex;gap:10px;align-items:center;padding:8px 10px;border:0;background:transparent;border-radius:10px;cursor:pointer}
.grid{display:grid;gap:16px;grid-template-columns:repeat(4,minmax(0,1fr))}
.card{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:0 6px 18px rgba(2,6,23,.06)}
.card .img{aspect-ratio:4/3;background:#e5e7eb}.card img{width:100%;height:100%;object-fit:cover;display:block}.card .body{padding:12px}
.badge{position:absolute;right:10px;top:10px;background:#0f172a;color:#fff;padding:6px 10px;border-radius:999px;font-size:12px}
.ad-top,.ad-infeed,.ad-side{border:1px dashed #cbd5e1;border-radius:12px;padding:8px;text-align:center;color:#64748b;background:#fff}
.ad-side{position:sticky;top:80px}
@media (max-width:900px){.ad-side{display:none}.grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.grid{grid-template-columns:1fr}.brand img{height:36px}}
.sub-btn{position:fixed;right:16px;bottom:90px;z-index:60;padding:12px 16px;border-radius:999px;background:linear-gradient(135deg,var(--accent2),var(--accent1));color:#0b1220;font-weight:800;border:none;box-shadow:0 10px 20px rgba(2,6,23,.15)}
.sub-btn.hide{display:none}.modal{position:fixed;inset:0;background:rgba(15,23,42,.45);display:none;align-items:center;justify-content:center;z-index:70}
.modal.show{display:flex}.modal .panel{background:#fff;border-radius:16px;padding:18px;max-width:420px;width:92%;box-shadow:0 20px 50px rgba(2,6,23,.25),0 0 0 1px #e5e7eb}
.cookie-bar{position:fixed;left:16px;right:16px;bottom:16px;z-index:65;max-width:720px;margin:0 auto;background:rgba(255,255,255,.92);border:1px solid #e5e7eb;box-shadow:0 10px 40px rgba(96,165,250,.35);border-radius:16px;padding:16px;display:none}
.cookie-bar.show{display:block}
.footer{margin-top:20px;border-top:1px solid var(--line);background:#fff}.footer .cols{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:18px;padding:16px}
.social{display:flex;gap:14px;align-items:center}.social a{color:#6b7280}.social a:hover{color:#111}
.btn{display:inline-block;padding:10px 14px;border-radius:12px;border:1px solid var(--line);background:#fff;font-weight:600}.btn-primary{background:linear-gradient(135deg,var(--accent2),var(--accent1));color:#0b1220;border:none}
