
:root{
  --brand:#0b3b6e;      /* dark blue */
  --brand-700:#072d53;  /* darker */
  --accent:#ffce45;     /* warm call-to-action */
  --text:#0e1116;
  --bg:#f7f9fc;
}
*{box-sizing:border-box}
body{margin:0;font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;color:var(--text);background:var(--bg);line-height:1.6}
.container{max-width:1120px;margin:0 auto;padding:0 20px}

/* Solid hero with SMALL logo */
.hero{background:linear-gradient(180deg,var(--brand),var(--brand-700));color:#fff}
.hero-inner{display:flex;align-items:center;justify-content:space-between;padding:56px 0;gap:24px}
.brand{display:flex;align-items:center;gap:12px;color:#fff;text-decoration:none}
.logo-img{width:56px;height:auto;border-radius:8px;background:#ffffff;box-shadow:0 2px 8px rgba(0,0,0,.15);padding:6px}
.brand h1{font-size:clamp(26px,3.6vw,36px);margin:0 0 4px}
.brand .tag{opacity:.95;margin:0}

/* Buttons */
.btn{display:inline-block;padding:12px 18px;border-radius:8px;text-decoration:none;font-weight:600}
.btn.primary{background:var(--accent);color:#2a1b00}
.btn.primary:hover{filter:brightness(.95)}
.btn.ghost{border:1px solid rgba(255,255,255,.65);color:#fff}
.btn.ghost:hover{background:rgba(255,255,255,.08)}

/* Sections */
section.container{padding:64px 0}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.card{background:#fff;border:1px solid #e6edf5;border-radius:12px;padding:16px;box-shadow:0 4px 12px rgba(7,45,83,.06)}
.price{font-size:28px;font-weight:700;color:var(--brand-700)}
.footer{background:#0a1220;color:#cbd5e1;padding:28px 0;margin-top:40px}

@media (max-width:840px){
  .hero-inner{flex-direction:column;align-items:flex-start}
  .logo-img{width:48px}
}
