/* Oneway Broadcasting Network brand, matched to onewaytv.com. Colors are here; the logo
   mark is /logo.svg (and /obn-mark.png), the full logo /obn-logo-white.png and /obn-logo.png.
   The --brand-gold names are kept for compatibility; they now hold the logo red. */
@font-face { font-family: "Playfair Display"; src: url(/fonts/playfair.woff2) format("woff2"); font-weight: 400 900; font-display: swap; }
@font-face { font-family: "Playfair Display"; src: url(/fonts/playfair-italic.woff2) format("woff2"); font-weight: 400 900; font-style: italic; font-display: swap; }
@font-face { font-family: "Inter"; src: url(/fonts/inter.woff2) format("woff2"); font-weight: 100 900; font-display: swap; }

:root {
  --brand-navy: #050508;
  --brand-ink: #050508;
  --brand-blue: #4361ee;
  --brand-blue-hover: #3651d4;
  --brand-sky: #7ba3ff;
  --brand-gold: #e8344a;
  --brand-gold-hover: #ff4d63;
  --brand-gold-soft: #f7941d;
  --brand-glow: 0 0 0 1px rgba(232, 52, 74, .35), 0 10px 40px -8px rgba(232, 52, 74, .45);
  --brand-gradient: linear-gradient(135deg, #f7941d 0%, #e8344a 45%, #a42fd1 100%);
  --brand-gradient-blue: linear-gradient(135deg, #7ba3ff 0%, #4361ee 50%, #2f45c8 100%);
  --font-display: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-serif: "Playfair Display", Georgia, "Times New Roman", serif;
  --brand-red: #e8344a;
  --brand-orange: #f7941d;
  --brand-purple: #a42fd1;
  --font-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --ease-out: cubic-bezier(.16, 1, .3, 1);

  /* Zoom-style pages: OBN orange for "New meeting", OBN blue for everything else */
  --orange: var(--brand-orange);
  --orange-hover: #e2820f;
  /* Shared */
  --blue: var(--brand-blue);
  --blue-hover: var(--brand-blue-hover);
}

.brand-logo { width: 32px; height: 32px; display: block; object-fit: contain; }
.brand-mark { display: flex; align-items: center; gap: 10px; font-family: var(--font-display); font-weight: 700; letter-spacing: -0.01em; white-space: nowrap; }
.brand-mark .brand-logo { width: 30px; height: 30px; filter: drop-shadow(0 8px 22px rgba(67, 97, 238, .45)); }
.brand-mark.large { justify-content: center; font-size: 20px; }
.brand-mark.large .brand-logo { width: 52px; height: 52px; }

/* Shared animated backdrop: add <div class="obn-aurora" aria-hidden="true"></div> as the first child of body. */
.obn-aurora { position: fixed; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; background: radial-gradient(1200px 700px at 15% -10%, #1b2250 0%, transparent 60%), radial-gradient(900px 600px at 100% 10%, #3a0d1c 0%, transparent 55%), var(--brand-ink); }
.obn-aurora::before, .obn-aurora::after { content: ""; position: absolute; width: 70vmax; height: 70vmax; border-radius: 50%; filter: blur(90px); opacity: .45; animation: obn-drift 24s var(--ease-out) infinite alternate; }
.obn-aurora::before { left: -20vmax; top: -25vmax; background: radial-gradient(circle, #4361ee 0%, transparent 65%); }
.obn-aurora::after { right: -25vmax; bottom: -35vmax; background: radial-gradient(circle, #e8344a 0%, transparent 60%); opacity: .22; animation-duration: 30s; animation-direction: alternate-reverse; }
@keyframes obn-drift { to { transform: translate(8vmax, 6vmax) scale(1.15); } }
@media (prefers-reduced-motion: reduce) { .obn-aurora::before, .obn-aurora::after { animation: none; } }

.obn-em { font-style: italic; background: var(--brand-gradient); -webkit-background-clip: text; background-clip: text; color: transparent; padding-right: .06em; }

/* Phones with a notch / Dynamic Island (and the OBN Meetings app): keep bars clear of the status bar. */
html body .w-nav { padding-top: max(14px, env(safe-area-inset-top)); }
html body .nav { height: auto; min-height: 66px; padding-top: env(safe-area-inset-top); }
html body .m-top { height: calc(52px + env(safe-area-inset-top)); padding-top: env(safe-area-inset-top); }
.prejoin, .waiting, .ended { padding-top: max(24px, env(safe-area-inset-top)); }