/* Shared brand styles for the dark, cinematic marketing pages
   (fast-on-broadcast, about, ibc-2026). Mirrors the Open Ground aesthetic.
   Palette + type from KEYNOTE_BIBLE §6. */

.b-page {
    background: radial-gradient(120% 80% at 50% -10%, #131A2B 0%, #0B1120 55%, #05070D 100%);
    color: #E7EAF2;
    font-family: 'Instrument Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    overflow-x: hidden;
}
.b-wrap { max-width: 1180px; margin: 0 auto; padding: 0 24px; }
.b-display { font-family: 'Sora', sans-serif; font-weight: 700; line-height: 1.05; letter-spacing: -0.01em; }
.b-mono { font-family: 'JetBrains Mono', 'SF Mono', monospace; }
.b-eyebrow { font-family: 'JetBrains Mono', monospace; font-size: 12px; letter-spacing: .28em; text-transform: uppercase; color: #8A93A6; }
.b-muted { color: #8A93A6; }
.b-red { color: #E5322B; }
.b-hairline { height: 1px; border: 0; background: linear-gradient(90deg, #3F83F8, #10B981); opacity: .8; }

.b-section { padding: 96px 0; }
@media (max-width: 768px) { .b-section { padding: 64px 0; } }

.b-hero { padding: 150px 0 56px; }
.b-hero h1 { font-size: clamp(36px, 6.4vw, 72px); margin: 18px 0 0; max-width: 16ch; }
.b-lead { margin: 26px 0 0; font-size: clamp(17px, 2.2vw, 21px); max-width: 58ch; color: #cdd3e0; line-height: 1.6; }

/* Asymmetric two-column row */
.b-split { display: grid; grid-template-columns: 0.85fr 1.15fr; gap: 48px; align-items: start; }
.b-split.rev { grid-template-columns: 1.15fr 0.85fr; }
@media (max-width: 820px) { .b-split, .b-split.rev { grid-template-columns: 1fr; gap: 20px; } }

/* Numbered beats */
.b-beat { padding: 36px 0; border-top: 1px solid rgba(231,234,242,.10); }
.b-beat .n { font-family: 'JetBrains Mono', monospace; color: #3F83F8; font-size: 13px; letter-spacing: .2em; }
.b-beat h3 { font-family: 'Sora', sans-serif; font-weight: 700; font-size: clamp(22px, 2.6vw, 30px); margin: .35em 0 .4em; }
.b-beat p { color: #aab2c2; line-height: 1.7; font-size: 16px; max-width: 58ch; }

/* Stat row */
.b-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 28px; }
.b-stats .v { font-family: 'Sora', sans-serif; font-weight: 700; font-size: clamp(24px, 3vw, 34px); }
.b-stats .k { color: #8A93A6; font-size: 13px; margin-top: 6px; line-height: 1.5; }
@media (max-width: 768px) { .b-stats { grid-template-columns: repeat(2, 1fr); gap: 22px; } }

/* Card */
.b-card { border: 1px solid rgba(231,234,242,.10); border-radius: 16px; background: rgba(19,26,43,.5); padding: 28px; }

/* CTA */
.b-cta { text-align: center; border-radius: 24px; padding: 72px 24px; background: linear-gradient(180deg, rgba(63,131,248,.12), rgba(16,185,129,.06)); border: 1px solid rgba(231,234,242,.10); }
.b-btn { display: inline-flex; align-items: center; gap: 10px; background: #3F83F8; color: #fff; text-decoration: none; font-weight: 600; padding: 15px 30px; border-radius: 999px; transition: transform .2s, background .2s; }
.b-btn:hover { background: #2563EB; transform: translateY(-1px); color: #fff; }
.b-btn.ghost { background: transparent; border: 1px solid rgba(231,234,242,.2); color: #E7EAF2; }
.b-btn.ghost:hover { border-color: #3F83F8; }

@media (prefers-reduced-motion: reduce) { .b-btn { transition: none; } }