:root{
  /* existing brand tokens */
  --brand-bg:#0a0a0f;
  --brand-primary:#2563eb;
  --brand-accent:#ff7a00;
  --ink:#e5e7eb;
  --muted:#94a3b8;

  /* new: global font */
  --font-sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto,
               "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji",
               "Segoe UI Emoji", "Segoe UI Symbol";
}

/* global font (these lines are fine) */
html, body{
  font-family: var(--font-sans);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
h1, h2, h3, h4, h5, h6{ font-family: inherit; letter-spacing:.01em; }


/* dark home */
body.home { background: var(--brand-bg); color: var(--ink); }
.header-dark{ background: rgba(10,10,15,.7); backdrop-filter: blur(6px); }
.header-dark .nav-link{ color:#cbd5e1; }
.header-dark .nav-link:hover, .header-dark .nav-link.active{ color:var(--brand-accent); }

/* keep light pages light */
.header-light .nav-link{ color:#0f172a; }
.header-light .nav-link:hover, .header-light .nav-link.active{ color:#2563eb; }

.brand-gradient.hero{
  background-image:
    radial-gradient(800px 400px at 80% -10%, rgba(37,99,235,.20), transparent 60%),
    radial-gradient(800px 400px at 20% -10%, rgba(255,122,0,.20), transparent 60%),
    linear-gradient(180deg, #0a0a0f 0%, #0a0a0f 100%),
    url('/images/hero.jpg');
  background-position: center;
  background-size: cover;
}

.card{ background:#0f1220; border-radius:14px; box-shadow:0 6px 24px rgba(0,0,0,.25); }
.card.light{ background:#fff; box-shadow:0 6px 24px rgba(2,6,23,.08); }

.btn{
  display:inline-block;
  padding:.75rem 1rem;
  border-radius:10px;
  font-weight:600;

  /* add these three lines */
  font-family: var(--font-sans);
  font-size: .95rem;
  letter-spacing: .01em;
}
.btn-primary{ background:var(--brand-primary); color:#fff; }
.btn-primary:hover{ background:#1d4ed8; }
.btn-light{ background:#1f2937; color:#e5e7eb; border:1px solid rgba(255,255,255,.10); }
.btn-light:hover{ background:#374151; }

.text-muted{ color:var(--muted); }

.hero-figure{ position:relative; display:flex; align-items:center; justify-content:center; }
.hero-figure img.host{ height:320px; width:auto; object-fit:contain; filter: drop-shadow(0 10px 30px rgba(0,0,0,.5)); }
.hero-figure img.robot{ position:absolute; bottom:-10px; right:18%; height:86px; width:86px; border-radius:50%; outline:4px solid #0a0a0f; }

.pill{ display:inline-flex; align-items:center; gap:.5rem; padding:.4rem .7rem; border-radius:999px; border:1px solid rgba(255,255,255,.12); color:#e2e8f0; background:rgba(255,255,255,.04); }
.pill-strip{ display:flex; flex-wrap:wrap; gap:.5rem; }
.logo-row{ display:flex; align-items:center; gap:18px; opacity:.95; }
/* Bigger, crisp logos in the hero */
.logo-row img{ height:60px; width:auto; filter:drop-shadow(0 2px 10px rgba(0,0,0,.35)); }

/* keep them reasonable on small screens */
@media (max-width: 640px){
  .logo-row img{ height:44px; }
}


/* Episode card */
.episode-card{ background:#0f1220; border-radius:16px; overflow:hidden; box-shadow:0 6px 24px rgba(0,0,0,.25); }
.episode-thumb{ aspect-ratio:16/9; width:100%; object-fit:cover; }

/* Interleaved quote cards */
.quote-card{
  position:relative; border-radius:16px; overflow:hidden;
  background:#0f1220; min-height:220px; display:flex; align-items:flex-end;
  box-shadow:0 6px 24px rgba(0,0,0,.25);
}
.quote-bg{
  position:absolute; inset:0; background-position:center; background-size:cover; filter:brightness(.6);
}
.quote-overlay{
  position:relative; width:100%;
  background: linear-gradient(180deg, transparent 30%, rgba(10,10,15,.92) 80%);
  padding:18px;
}
.quote-text{ color:#e5e7eb; font-style:italic; font-size:1.05rem; line-height:1.5; }
.quote-meta{ color:#94a3b8; font-size:.85rem; margin-top:.4rem; }

/* Platform modal buttons */
.btn-plat{
  display:flex; align-items:center; justify-content:center; gap:.6rem;
  width:100%; padding:.6rem .9rem; border-radius:.75rem; font-weight:700;
  box-shadow:0 6px 18px rgba(0,0,0,.12);
  transition:transform .06s ease, box-shadow .2s ease;
}
.btn-plat:hover{ transform:translateY(-1px); box-shadow:0 10px 26px rgba(0,0,0,.18); }
.btn-plat:focus{ outline:2px solid rgba(255,255,255,.0); box-shadow:0 0 0 3px rgba(37,99,235,.35); }
.btn-plat svg{ flex:0 0 auto; }

body.modal-open { overflow: hidden; }
.is-disabled { opacity: .5; pointer-events: none; }

/* BizNis page title + logo */
.page-title{ display:flex; align-items:center; gap:12px; margin:0; }
.bni-badge{ height:48px; width:auto; filter:drop-shadow(0 2px 8px rgba(0,0,0,.2)); }
@media (max-width:640px){ .bni-badge{ height:36px; } }