/* Beta invitation and public contacts. The existing site layout and styles are unchanged. */
.button-outline { border: 1px solid var(--cyan-light); color: var(--cyan-light); background: transparent; }
.button-outline:hover { background: rgba(165, 235, 250, .1); }
.hero-beta-note { margin: 12px 0 0; color: #b7ced9; font-size: .85rem; max-width: 550px; }
.hero-beta-note a { color: var(--cyan-light); text-underline-offset: 3px; }

.beta { background: var(--deep); border-top: 1px solid var(--line); }
.beta .eyebrow { color: var(--cyan-light); }
.beta-layout { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .8fr); gap: 64px; align-items: center; }
.beta h2 { margin-bottom: 25px; }
.beta h2 span { color: var(--cyan); }
.beta-lede { color: #c7dee9; font-size: 1.13rem; line-height: 1.7; max-width: 640px; margin-bottom: 27px; }
.beta-email-note { margin: 18px 0 0; font-size: .85rem; line-height: 1.65; color: #b7ced9; max-width: 600px; }
.contact-card { min-width: 0; border: 1px solid rgba(165, 235, 250, .32); border-radius: 10px; padding: 34px; background: rgba(2, 25, 41, .45); }
.contact-card h3 { margin-bottom: 15px; font-size: 1.7rem; font-weight: 650; }
.contact-card > p { color: #bdd3df; font-size: .95rem; margin-bottom: 25px; }
.contact-details { display: grid; gap: 23px; font-style: normal; }
.contact-details > div { display: grid; gap: 5px; }
.contact-details span { font-size: .95rem; font-weight: 650; }
.contact-details a { color: var(--cyan-light); font-size: 1rem; text-underline-offset: 4px; overflow-wrap: anywhere; }
.contact-details a:hover { color: white; }
.footer-links { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 25px; }

@media (max-width: 1100px) {
  .beta-layout { gap: 35px; }
  .contact-card { padding: 28px; }
}
@media (max-width: 900px) {
  .beta-layout { grid-template-columns: 1fr; gap: 35px; }
  .beta-copy, .contact-card { max-width: 680px; width: 100%; }
}
@media (max-width: 600px) {
  .beta-lede { font-size: 1.04rem; }
  .beta-email-note, .hero-beta-note { font-size: .8rem; }
  .contact-card { padding: 25px 23px; }
  .contact-card h3 { font-size: 1.5rem; }
}
