/* =========================================================
   efootball.me — header.css (hero section + buttons)
   ========================================================= */
.hero{margin:clamp(14px, 2.2vw, 18px) 0}
.pro-hero{display:grid; grid-template-columns:1.4fr 1fr; gap:var(--gap)}
.hero-media, .hero-text{border-radius:var(--radius-lg)}
.hero-media iframe{border:0; border-radius:var(--radius-lg)}
.hero-text{padding:18px; background:var(--bg-elev); border:1px solid var(--border); box-shadow:var(--shadow)}
.hero-text h2{margin:0 0 6px; font-size:clamp(22px, 3.3vw, 30px); line-height:1.2}
.hero-text .muted{color:var(--muted)}
.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:10px 14px; border-radius:12px; border:1px solid var(--border); background:var(--surface); color:var(--text); font-weight:700; transition:background .2s, transform .06s}
.btn:hover{background:var(--bg-elev); text-decoration:none}
.btn.primary{background:linear-gradient(135deg, var(--primary), var(--accent)); color:#0b1220; border:0}
.btn.primary:hover{filter:brightness(1.03)}
button:active, .btn:active{transform:translateY(1px)}
.theme-toggle svg{width:20px; height:20px}
@media (max-width:860px){ .pro-hero{grid-template-columns:1fr} .hero-media iframe{height:54vw; max-height:420px} }