:root{
  --bg:#0b1220; --bg2:#0d1424; --panel:#0f172a; --border:#1e293b;
  --text:#e5e7eb; --muted:#9aa4b2; --blue:#3b82f6; --blue2:#2563eb;
}

/* Base */
*{box-sizing:border-box}
html,body{
  margin:0; padding:0;
  background:linear-gradient(180deg,var(--bg),var(--bg2));
  color:var(--text);
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial,sans-serif;
}
.container{max-width:1100px;margin:0 auto;padding:0 20px}
a{color:#cfe0ff;text-decoration:none}
a:hover{text-decoration:underline}

/* Buttons */
.btn{border:0;border-radius:14px;padding:12px 18px;cursor:pointer;font-weight:600}
.btn-primary{
  background:linear-gradient(135deg,var(--blue),var(--blue2));color:#fff;
  box-shadow:0 6px 20px rgba(37,99,235,.35)
}
.btn-primary:hover{filter:brightness(1.05)}
.btn-secondary{background:#1f2937;color:#fff}
.btn-secondary:hover{background:#263041}

.wfull{width:100%}
.small{font-size:.85rem}
.tiny{font-size:.78rem}
.lead{font-size:1.1rem;color:#cbd5e1}
.h2{font-size:2rem;margin:0}
.h3{font-size:1.5rem;margin:0 0 6px}
.metal-text{
  background:linear-gradient(90deg,#e6edf7,#9fb7d1,#e9f0f7);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  text-shadow:0 1px 8px rgba(255,255,255,.06)
}

/* Layout */
.section{padding:60px 0}
.grid-2{display:grid;grid-template-columns:1fr;gap:20px}
.grid-3{display:grid;grid-template-columns:1fr;gap:20px}
@media(min-width:860px){
  .grid-2{grid-template-columns:1fr 1fr}
  .grid-3{grid-template-columns:1fr 1fr 1fr}
}

/* Cards */
.card{
  position:relative;border:1px solid var(--border);border-radius:18px;
  background:linear-gradient(145deg,rgba(15,23,42,.85),rgba(30,41,59,.85));
  box-shadow:0 10px 30px rgba(0,0,0,.35);padding:22px
}
.card-sm{
  border:1px solid var(--border);border-radius:14px;
  background:rgba(15,23,42,.7);padding:14px
}
.card-head{font-weight:700;font-size:1.2rem;margin-bottom:6px}
.muted{color:#9aa4b2}
.maxw{max-width:800px;margin:0 auto}
.center{text-align:center}

/* Inputs */
.row{display:flex;gap:10px}
.row input{flex:1;border-radius:12px;border:1px solid var(--border);background:#0b1220;color:#fff;padding:12px 14px}
.row input:focus{outline:2px solid var(--blue)}

/* Header */
.site-header{
  position:sticky;top:0;z-index:10;
  background:rgba(10,14,24,.8);backdrop-filter:blur(7px);
  border-bottom:1px solid var(--border)
}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:12px 0}
.brand{display:flex;align-items:center;gap:12px}
.logo{
  width:40px;height:40px;border-radius:12px;
  background:linear-gradient(135deg,#60a5fa,#93c5fd,#cbd5e1);
  box-shadow:0 8px 24px rgba(96,165,250,.35)
}
.logo.small{width:30px;height:30px}
.brand-title{font-weight:800}
.brand-sub{font-size:.85rem;color:#93a4bb}
.nav{display:none;gap:18px}
@media(min-width:880px){.nav{display:flex}}
.actions{display:flex;gap:10px}

/* Hero */
.hero{position:relative;overflow:hidden;padding:80px 0}
.hero-inner{display:grid;gap:30px;align-items:center}
@media(min-width:980px){.hero-inner{grid-template-columns:1.1fr .9fr}}
.hero-list{margin:18px 0;padding-left:18px;line-height:1.7}
.hero-cta{display:flex;align-items:center;gap:14px;margin-top:16px}
.secure{color:#a9b6c7;font-size:.9rem}

/* Grid sample */
.grid3{
  display:grid;grid-template-columns:repeat(3,64px);gap:0;
  border:1px solid var(--border);border-radius:14px;overflow:hidden;width:max-content
}
.grid3>div{
  width:64px;height:56px;display:flex;align-items:center;justify-content:center;
  border:1px solid var(--border);background:#0f1a30;font-weight:800;font-size:26px
}
.playlist{margin-top:12px;color:#cbd5e1;font-size:.95rem}
.hotwins{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}
.big{font-size:1.3rem;font-weight:800}

/* Pricing */
.price{font-size:2rem;font-weight:900;margin:6px 0}
.feature-list{margin:10px 0;padding-left:18px;line-height:1.8}

/* Email / CTA */
.email-capture{margin:28px auto 0;max-width:600px;text-align:center}

/* Footer */
.site-footer{border-top:1px solid var(--border);background:#060a14}
.footer-inner{display:grid;gap:24px;padding:28px 0}
@media(min-width:900px){.footer-inner{grid-template-columns:1.5fr 1fr 1fr 1fr}}
.foot-head{font-weight:700;margin-bottom:8px}
.foot-list{list-style:none;margin:0;padding:0}
.foot-list li{margin:6px 0}
.copy{text-align:center;color:#7a8797;padding:14px 0;border-top:1px solid var(--border)}

/* === Header size bump (only header) === */
.site-header .brand { gap:16px; }

.site-header .brand .logo{
  width:68px;      /* was 40px */
  height:68px;     /* was 40px */
  border-radius:16px;
}

.site-header .brand .brand-title{
  font-size:1.9rem;     /* was ~1.2–1.4 */
  line-height:1.12;
  font-weight:900;
  letter-spacing:.2px;
}

.site-header .brand .brand-sub{
  font-size:1.08rem;    /* was .85rem */
  line-height:1.25;
  color:#d9e6ff;        /* gentle contrast boost */
}

/* If your logo is an <img> inside the .logo box */
.site-header .brand .logo img{
  width:100%; height:100%; object-fit:cover; display:block;
}

/* Small-screen guardrails */
@media (max-width: 480px){
  .site-header .brand .logo{ width:56px; height:56px; }
  .site-header .brand .brand-title{ font-size:1.55rem; }
  .site-header .brand .brand-sub{ font-size:.96rem; }
}

