
:root{
  --bg:#1f0f0b;
  --paper:#fff8f1;
  --ink:#231815;
  --accent:#d97706;
  --accent-2:#16a34a;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:var(--bg);color:#f8f5f2;line-height:1.5}
a{color:inherit}
.container{max-width:1100px;margin:0 auto;padding:0 20px}
header{padding:28px 0;border-bottom:1px solid #ffffff1a;position:sticky;top:0;background:rgba(31,15,11,.8);backdrop-filter:saturate(120%) blur(6px)}
.brand{display:flex;gap:12px;align-items:center;font-weight:800;letter-spacing:.4px}
.brand .logo{width:36px;height:36px;border-radius:50%;background:var(--accent);display:grid;place-items:center;color:var(--ink);font-weight:900}
nav a{margin-left:18px;text-decoration:none;opacity:.9}
nav a:hover{opacity:1;text-decoration:underline}
.hero{padding:70px 0 40px;background:linear-gradient(180deg, #2a140e 0%, #1f0f0b 100%)}
.hero h1{font-size:46px;margin:8px 0 12px}
.hero p{max-width:760px;opacity:.9;font-size:18px}
.cta{display:inline-block;margin-top:18px;background:var(--accent);color:#211; padding:12px 18px;border-radius:12px;text-decoration:none;font-weight:700}
.cta:hover{filter:brightness(.95)}
.grid{display:grid;gap:18px}
.features{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));margin:30px 0}
.card{background:#2b160f;border:1px solid #ffffff14;border-radius:18px;padding:18px}
.card h3{margin:8px 0 6px}
.card p{opacity:.9}
.deck{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin:12px 0 28px}
.playcard{background:var(--paper);color:var(--ink);border-radius:14px;box-shadow:0 10px 30px rgba(0,0,0,.35);padding:14px;border:2px solid #e2d7c7}
.playcard .title{font-weight:900;margin-bottom:8px;letter-spacing:.5px}
.playcard svg{width:100%;height:140px;background:#fff3e0;border-radius:10px;border:1px solid #ead8c6}
.section{padding:30px 0}
.section h2{font-size:28px;margin:0 0 8px}
.badge{display:inline-block;padding:6px 10px;border-radius:999px;background:#ffffff16;border:1px solid #ffffff20;font-size:13px}
form.signup{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
input[type=email]{padding:12px;border-radius:10px;border:1px solid #ffffff30;background:#00000020;color:#fff;min-width:260px}
button[type=submit]{padding:12px 16px;border-radius:10px;border:none;background:var(--accent-2);color:#071b10;font-weight:800;cursor:pointer}
button[type=submit]:hover{filter:brightness(.95)}
footer{padding:30px 0;border-top:1px solid #ffffff1a;margin-top:20px;opacity:.9;font-size:14px}
.small{font-size:12px;opacity:.75}
