:root { --bg:#fff; --fg:#0b0b0b; --muted:#6b6b6b; --line:#eaeaea; --focus:#111; --radius:12px; }
* { box-sizing: border-box; }
html, body { height:100%; }
body {
  margin:0; background:var(--bg); color:var(--fg);
  font-family: "Noto Sans", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
.container { max-width: 1080px; margin: 0 auto; padding: 24px; }
header.container { padding-top: 72px; padding-bottom: 16px; }
.brand { display:flex; align-items:center; gap:14px; }
.logo-mark { width:36px; height:36px; border:2px solid var(--fg); border-radius:8px; position:relative; }
.logo-mark::after { content:""; position:absolute; inset:7px; border:2px solid var(--fg); border-radius:6px; }
.brand-name { font-weight:800; letter-spacing:-0.02em; font-size: clamp(28px, 4vw, 42px); margin:0; }
.tagline { margin:10px 0 24px; color:var(--muted); font-size: clamp(16px, 2.2vw, 18px); }

.cta-row { display:flex; gap:12px; flex-wrap:wrap; }
.btn {
  display:inline-flex; align-items:center; gap:10px; padding:12px 16px; border-radius:10px;
  text-decoration:none; font-weight:600; border:1px solid var(--line); transition: transform .12s ease, background .2s ease, border-color .2s ease;
  will-change: transform;
}
.btn .icon { display:inline-flex; }
.btn-dark { color:#fff; background:#111; border-color:#111; }
.btn-dark:hover { transform: translateY(-1px); background:#000; }
.btn-light { color:#0b0b0b; background:#fff; }
.btn-light:hover { transform: translateY(-1px); border-color:#cfcfcf; background:#f8f8f8; }

.embeds { display:grid; grid-template-columns: 1fr; gap:16px; margin-top:28px; opacity:0; transform: translateY(8px); transition: opacity .25s ease, transform .25s ease; }
.embeds.ready { opacity:1; transform:none; }
@media (min-width: 920px) { .embeds { grid-template-columns: 1fr 1fr; } }

.embed-col { background:#fff; border:1px solid var(--line); border-radius: var(--radius); overflow:hidden; }
.embed-col iframe { display:block; width:100%; aspect-ratio:16/9; border:0; }

.footer { border-top:1px solid var(--line); margin-top:56px; padding-top:20px; padding-bottom:56px; color:var(--muted); }