/* ========== OHBE base styles (minimal, bold, premium) ========== */
:root{
  --bg:#ffffff; --fg:#0a0a0a; --muted:#6b7280; --accent:#00c4b4; --border:#e5e7eb; --card:#fafafa;
  --radius:16px; --shadow:0 8px 24px rgba(0,0,0,.08);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
     color:var(--fg); background:var(--bg); line-height:1.6}
a{color:inherit; text-decoration:none}
img,video{max-width:100%;display:block}
.container{max-width:1120px; margin:0 auto; padding:0 20px}

/* Buttons */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:12px 18px; border-radius:999px; font-weight:700; border:2px solid var(--fg);
  background:var(--fg); color:#fff; transition:transform .08s ease, box-shadow .2s ease}
.btn:hover{transform:translateY(-1px); box-shadow:var(--shadow)}
.btn.outline{background:transparent; color:var(--fg)}
.btn.accent{background:var(--accent); border-color:var(--accent); color:#002a26}

/* Header / Nav */
header{position:sticky; top:0; z-index:40; backdrop-filter:blur(8px); background:rgba(255,255,255,.85);
  border-bottom:1px solid var(--border)}
.nav{display:flex; align-items:center; justify-content:space-between; height:68px}
.brand{display:flex; align-items:center; gap:10px; font-weight:800; letter-spacing:.4px}
.brand .logo{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:var(--fg);color:#fff;font-weight:800}
.nav-links{display:flex;align-items:center;gap:16px}
.nav-links a.active{color:var(--accent)}

/* Sections */
section{padding:64px 0}
.hero{padding:96px 0 48px}
.headline{font-size:clamp(28px,5vw,56px); line-height:1.04; font-weight:800; letter-spacing:-.02em}
.subhead{font-size:clamp(16px,2.4vw,20px); color:var(--muted); margin-top:8px}
.grid-3{display:grid;grid-template-columns:repeat(3, minmax(0,1fr)); gap:20px}
.grid-2{display:grid;grid-template-columns:repeat(2, minmax(0,1fr)); gap:20px}
.card{background:var(--card); border:1px solid var(--border); border-radius:var(--radius); padding:20px; box-shadow:var(--shadow)}
.kv{display:flex; align-items:center; gap:12px}
.kv b{font-size:28px}
.table{width:100%; border-collapse:collapse}
.table th,.table td{padding:14px 16px; border-bottom:1px solid var(--border); text-align:left}
.table thead th{background:#111;color:#fff}
.note{font-size:14px;color:var(--muted)}
footer{border-top:1px solid var(--border); padding:28px 0; font-size:14px; color:var(--muted)}

@media (max-width:900px){
  .grid-3,.grid-2{grid-template-columns:1fr}
  header .nav-links{display:none}
}
