:root{
  --red:#C1121F; --ink:#121316; --text:#1F2937; --muted:#6B7280; --bg:#F3F4F7; --card:#ffffff;
  --max:1180px;
}
*{box-sizing:border-box}html,body{margin:0;padding:0;scroll-behavior:smooth}
body{font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; color:var(--text); background:var(--bg); line-height:1.65}
.container{max-width:var(--max); margin:0 auto; padding:0 24px}
a{color:var(--red)}a:hover{text-decoration:none;filter:brightness(.92)}
.btn{display:inline-flex; align-items:center; gap:10px; padding:1rem 1.25rem; border-radius:12px; border:2px solid var(--red); background:var(--red); color:#fff; font-weight:800; letter-spacing:.3px}
.btn--ghost{background:transparent; color:var(--red)}
.header{position:sticky; top:0; z-index:50; background:rgba(255,255,255,.9); border-bottom:1px solid #e6e8ee; backdrop-filter: blur(6px)}
.nav{display:flex; align-items:center; justify-content:space-between; padding:.8rem 0; gap:18px}
.brand{display:flex; align-items:center; gap:14px}
.brand img{height:60px}
.brand .name{font-weight:900; letter-spacing:.4px}
.nav__links{display:flex; gap:18px; flex-wrap:wrap}
.mobile-toggle{display:none}
.hero{background:#0e0f12 url('assets/hero-decor.svg') center/cover no-repeat; color:#fff}
.hero__grid{display:grid; grid-template-columns:1.15fr .85fr; gap:36px; align-items:center; padding:90px 0 40px}
.kicker{text-transform:uppercase; letter-spacing:.18em; color:#a3aab6; font-size:.9rem; margin:0 0 .65rem}
.hero h1{font-size:clamp(32px, 3.8vw, 60px); line-height:1.06; margin:.3rem 0 1.1rem}
.hero p.big{font-size:1.1rem; color:#e5e7eb}
.panel{background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.16); border-radius:16px; padding:22px}
.panel label{display:block; margin:.5rem 0 .25rem; font-weight:600; color:#f2f4f7}
.panel input{width:100%; padding:.9rem; border-radius:12px; border:1.6px solid #e8e9ee; background:#fff; font:inherit}
.wave{display:block; margin-top:-1px}
.section{padding:76px 0}
.section.alt{background:#fff; border-top:1px solid #eef0f4; border-bottom:1px solid #eef0f4}
.section h2{font-size:clamp(26px, 3vw, 42px); margin:0 0 16px}
.lead{color:#4B5563; max-width:820px}
.grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:26px}
.card{background:var(--card); border:1px solid #e8eaf0; border-radius:16px; padding:22px; box-shadow:0 16px 30px rgba(13,16,23,.05)}
.card h3{margin-top:0}
.icon{width:28px; height:28px; vertical-align:middle; margin-right:8px}
.feature{display:flex; align-items:flex-start; gap:12px}
.feature img{width:28px; margin-top:3px}
.banner{background:linear-gradient(90deg, #C1121F, #7e0b12); color:#fff; padding:26px; border-radius:16px; display:flex; justify-content:space-between; align-items:center; gap:16px}
footer{background:#0F1012; color:#c9cfd8}
.footer{padding:44px 0}
.footer-grid{display:grid; grid-template-columns:2fr 1fr 1fr; gap:26px}
footer a{color:#fff}
.small{font-size:.92rem; color:#9aa1ac}
@media (max-width: 900px){
  .hero__grid{grid-template-columns:1fr; padding:70px 0 20px}
  .grid-3{grid-template-columns:1fr}
  .banner{flex-direction:column; align-items:flex-start}
  .nav__links{display:none}
  .mobile-toggle{display:inline-flex; border:1px solid #e5e7eb; padding:.5rem .8rem; border-radius:10px; background:#fff}
}