
:root{
  --bg:#f1f4f9; --panel:#e8eef8; --card:#ffffff; --border:#d6deeb;
  --text:#0b1325; --muted:#4b5563; --brand:#3b82f6; --accent:#0ea5e9; --focus:#f59e0b;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--text);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif}
.container{max-width:1200px;margin:0 auto;padding:0 24px}
a{color:var(--brand);text-decoration:none}
a:hover{opacity:.9}
a:focus-visible,.btn:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:3px solid var(--focus); outline-offset:2px; border-radius:8px;
}

/* Header / Nav */
.site-header{position:sticky;top:0;background:#f8fbffcc;backdrop-filter:blur(8px);
  border-bottom:1px solid var(--border);z-index:40}
.nav{display:flex;align-items:center;justify-content:space-between;height:72px}
.brand{display:flex;align-items:center;gap:12px;color:var(--text);font-weight:800;font-size:18px}
.brand img{height:40px;width:auto;filter:none}
.menu{display:flex;gap:20px;align-items:center}
.menu a{color:#111827}
.menu a.cta{background:linear-gradient(135deg,var(--brand),#2563eb);color:#ffffff;
  padding:10px 16px;border-radius:12px;font-weight:700}

/* Hero */
.hero{padding:84px 0 48px;background:linear-gradient(180deg,#eaf2ff 0%,#f6f9ff 60%,#f1f4f9 100%)}
.hero .grid{display:grid;grid-template-columns:1.2fr 1fr;gap:36px;align-items:center}
.kicker{display:inline-block;background:#e8f0ff;border:1px solid #dbeafe;padding:6px 12px;border-radius:999px;
  font-weight:700;letter-spacing:.3px;color:#1e40af}
.hero h1{font-size:44px;margin:12px 0 10px;color:#0b1325}
.hero p{color:#475569;font-size:18px;max-width:720px}
.hero .thumb{border-radius:16px;border:1px solid var(--border);box-shadow:0 14px 32px rgba(2,6,23,.12); background:#fff}

/* Sections / Cards */
.section{padding:64px 0}
.section h2{font-size:32px;margin:0 0 8px;color:#0b1325}
.section p.lead{color:#475569}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:20px;
  box-shadow:0 10px 24px rgba(2,6,23,.08)}
.card h3{margin:10px 0;color:#0b1325}
.thumb{width:100%;height:200px;object-fit:cover;border-radius:12px;border:1px solid var(--border);margin-bottom:12px;background:#fff}

.btn{display:inline-block;padding:12px 16px;border-radius:12px;text-decoration:none;border:2px solid transparent;
  font-weight:700;cursor:pointer}
.btn.primary{background:linear-gradient(135deg,var(--brand),#2563eb);color:#ffffff}
.btn.outline{border-color:#3b82f6;color:#1d4ed8;background:#eef2ff}

/* Lists */
ul.checks{padding-left:18px;margin:0}
ul.checks li{margin:8px 0;color:#334155}

/* Feature row */
.feature-row{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:center}
.feature-row img{max-width:100%;border-radius:16px;border:1px solid var(--border)}

/* Footer */
.site-footer{background:#ecf1f9;color:#475569;margin-top:40px;border-top:1px solid var(--border)}
.site-footer .container{padding:28px 24px}
.site-footer h4,.site-footer h5{color:#0b1325;margin:0 0 10px}
.site-footer .links{list-style:none;padding:0;margin:0;display:grid;gap:6px}
.subfoot{border-top:1px solid #d6deeb;text-align:center;padding:14px 0;color:#6b7280}
.small{font-size:14px;color:#6b7280}

/* Forms */
input,textarea,select{width:100%;padding:12px 14px;border-radius:12px;border:1px solid var(--border);
  background:#ffffff;color:#0b1325}
