:root{
  --black:#000000;
  --charcoal:#1C1C1C;
  --white:#FFFFFF;
  --orange:#FF5C00;
  --gray:#F3F3F3;
  --muted:#888;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--charcoal);background:#fff;line-height:1.6}
img{max-width:100%;display:block}
a{color:var(--orange);text-decoration:none}
a:hover{text-decoration:underline}
.container{width:min(1100px,92%);margin:0 auto}

/* Header / Nav */
.header{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid #eee}
.navbar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 0}
.brand{display:flex;align-items:center;gap:14px}
.brand img{height:36px;width:auto}
.brand .name{font-weight:800;letter-spacing:.2px}
.nav{display:flex;align-items:center;gap:20px}
.nav a{color:#222;font-weight:600}
.nav .cta{background:var(--orange);color:#fff;padding:10px 14px;border-radius:10px}
.burger{display:none;background:none;border:0;font-size:28px;line-height:1}
@media (max-width:900px){
  .nav{display:none;position:absolute;left:0;right:0;top:64px;background:#fff;border-top:1px solid #eee;flex-direction:column;padding:14px}
  .nav.open{display:flex}
  .burger{display:block}
}

/* Abstract Hero */
.hero{position:relative;isolation:isolate;background:
  radial-gradient(800px 300px at 20% 0%, rgba(255,92,0,.12), transparent 60%),
  radial-gradient(700px 300px at 95% 20%, rgba(0,0,0,.12), transparent 60%),
  linear-gradient(135deg,#fff 0%,#f8f8f8 40%,#f3f3f3 100%);
  padding:90px 0 70px;border-bottom:1px solid #eee;
}
.hero .overlay{position:absolute;inset:0;background:
  repeating-linear-gradient(135deg, rgba(0,0,0,.03) 0 12px, transparent 12px 24px);
  pointer-events:none;mix-blend-mode:multiply;
}
.hero h1{font-size:42px;line-height:1.1;margin:0 0 12px}
.hero p{max-width:760px;color:#444;margin:0 0 22px}
.btns{display:flex;gap:12px;flex-wrap:wrap}
.btn{display:inline-block;padding:12px 16px;border-radius:12px;font-weight:700;border:2px solid var(--orange);color:var(--orange);background:#fff}
.btn.primary{background:var(--orange);color:#fff}
.section{padding:60px 0}
.section.alt{background:var(--gray)}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{background:#fff;border:1px solid #eee;border-radius:16px;padding:18px}
.card h3{margin-top:0}
.kicker{font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}

.cta-banner{background:var(--orange);color:#fff;padding:38px 0}
.cta-banner .btn{border-color:#fff;color:var(--orange);background:#fff}

.footer{background:var(--charcoal);color:#ddd;padding:40px 0}
.footer a{color:#ddd}
.footer .cols{display:grid;grid-template-columns:2fr 1fr 1fr;gap:20px}
.footer small{color:#aaa}

@media (max-width:600px) {
  .footer .cols, .grid-3 {grid-template-columns:unset}
}

/* Page headers (inner pages) */
.page-hero{padding:72px 0;background:
  linear-gradient(180deg,#fff, #f7f7f7);
  border-bottom:1px solid #eee;
}
.page-hero h1{margin:0}
.breadcrumbs{font-size:13px;color:#666;margin-top:8px}
.lead{font-size:18px;color:#444}

/* Forms */
form{display:grid;gap:14px}
input,textarea,select{padding:12px 14px;border:1px solid #ddd;border-radius:12px;font:inherit}
button{cursor:pointer}

/* Age-gate */
#agegate{position:fixed;inset:0;background:rgba(0,0,0,.65);display:none;align-items:center;justify-content:center;z-index:9999}
#agegate .panel{background:#fff;border-radius:18px;padding:24px;width:min(560px,92%);text-align:center;box-shadow:0 20px 70px rgba(0,0,0,.25)}
#agegate h2{margin-top:0}
