:root {
  color-scheme: light;
  background: #f7e4de;
  color: #3d3b3a;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; min-height: 100svh; }
.page { width: 100%; max-width: 2560px; margin: 0 auto; }
.slide { display: block; width: 100%; height: auto; max-height: max(400px, calc(100svh - 145px)); object-fit: contain; }
.copy, .visually-hidden {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
svg { fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.slide { stroke: none; }
a { color: inherit; }
a:focus-visible, button:focus-visible, input:focus-visible { outline: 3px solid #7550dc; outline-offset: 5px; }
.eyebrow { margin: 0 0 12px; color: #796d7d; font-size: 10px; line-height: 1.5; font-weight: 650; letter-spacing: .17em; }
.signup-invitation { max-width: 1060px; margin: 16px auto 0; padding: 24px 0 32px; display: flex; justify-content: space-between; align-items: center; gap: 32px; border-top: 1px solid #d8c8c6; }
.signup-invitation .eyebrow { margin-bottom: 7px; }
.signup-invitation h2 { margin: 0; color: #382d3d; font: 500 27px/1.2 Georgia, "Times New Roman", serif; letter-spacing: -.025em; }
.primary-button { display: inline-flex; justify-content: center; align-items: center; gap: 18px; min-height: 54px; padding: 16px 24px; background: #7048ce; color: #fff; border: 1px solid #7048ce; border-radius: 12px; font: 600 15px/1.3 -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif; text-decoration: none; cursor: pointer; transition: background .15s, box-shadow .15s; }
.primary-button svg { flex: 0 0 19px; width: 19px; height: 19px; }
.primary-button:hover { background: #603ab9; box-shadow: 0 5px 16px #7048ce20; }
.primary-button:disabled { opacity: .65; cursor: wait; box-shadow: none; }
.registration-page { color: #3b303f; background: #f7e4de; }
.registration-header { max-width: 1200px; padding: 38px 40px 0; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; }
.brand-link { display: block; width: 190px; }
.brand-link img { display: block; width: 100%; height: auto; }
.back-link { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-size: 13px; color: #665a69; text-decoration: none; }
.back-link:hover { color: #7048ce; }
.back-link svg { width: 17px; height: 17px; }
.registration-layout { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); align-items: center; gap: 76px; max-width: 1120px; min-height: calc(100svh - 124px); margin: 0 auto; padding: 52px 40px 64px; }
.registration-intro { padding-top: 16px; }
.registration-intro h1 { margin: 22px 0; color: #382d3d; font: 500 clamp(40px,4.3vw,59px)/1.08 Georgia, "Times New Roman", serif; letter-spacing: -.045em; }
.intro-description { margin: 0; color: #776672; font-size: 17px; line-height: 1.65; }
.registration-art { width: 100%; max-width: 390px; height: 165px; margin: 32px 0 0 -12px; background: url('/assets/pills.webp') center 48% / cover no-repeat; mask-image: linear-gradient(to bottom, transparent, #000 18%, #000 80%, transparent); }
.registration-card { padding: 40px; border: 1px solid #fff9f5; border-radius: 26px; background: #fffaf7; box-shadow: 0 16px 60px #5e39430a; }
.list-label { display: inline-flex; align-items: center; gap: 7px; color: #7956c7; font-size: 11px; font-weight: 600; }
.list-label > span { width: 6px; height: 6px; background: #7956c7; border-radius: 50%; }
.registration-card h2 { margin: 22px 0 14px; color: #382d3d; font: 500 39px/1.1 Georgia, "Times New Roman", serif; letter-spacing: -.035em; }
.card-description { margin: 0 0 28px; color: #7c707c; font-size: 14px; line-height: 1.7; max-width: 300px; }
.email-label { display: block; margin-bottom: 9px; color: #554a59; font-size: 12px; font-weight: 600; }
.email-field { display: flex; align-items: center; gap: 11px; min-height: 55px; padding: 0 15px; border: 1px solid #ded3d2; border-radius: 11px; background: #fff; }
.email-field:focus-within { border-color: #7956c7; box-shadow: 0 0 0 3px #7956c712; }
.email-field > svg { flex: 0 0 17px; width: 17px; height: 17px; color: #a99ba7; stroke-width: 1.5; }
.email-field input { width: 100%; min-width: 0; border: 0; padding: 16px 0; color: #3b303f; background: transparent; font: 400 16px/1.3 -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif; }
.email-field input::placeholder { color: #7b6e7d; }
.email-field input:focus-visible { outline: 0; }
.consent { display: flex; align-items: flex-start; gap: 10px; margin-top: 18px; color: #7b707a; font-size: 12px; line-height: 1.65; }
.consent input { flex: 0 0 16px; width: 16px; height: 16px; margin: 2px 0 0; accent-color: #7048ce; }
.submit-button { width: 100%; margin-top: 25px; }
.website-field, [hidden] { display: none !important; }
.waitlist-status { margin: 0; font-size: 13px; line-height: 1.6; }
.waitlist-status:not(:empty) { margin-top: 18px; padding: 13px 15px; border: 1px solid transparent; border-radius: 10px; }
.waitlist-status[data-state="error"] { color: #8d3544; background: #f9ecee; border-color: #f0dce0; }
.waitlist-status[data-state="success"] { color: #356149; background: #edf5ee; border-color: #dceade; }
@media (max-width: 1140px) { .signup-invitation { margin-left: 40px; margin-right: 40px; } }
@media (max-width: 960px) {
  .registration-layout { gap: 32px; padding-left: 28px; padding-right: 28px; }
  .registration-card { padding: 32px 28px; }
  .registration-intro h1 { font-size: 42px; }
}
@media (max-width: 800px) {
  body { display: block; }
  .slide { display: none; }
  .copy {
    position: relative; inset: auto; z-index: auto; display: flex; flex-direction: column;
    width: 100%; max-width: 660px; height: auto;
    margin: 0 auto; padding: 42px clamp(24px, 6vw, 44px) 0;
    overflow: visible; clip: auto; white-space: normal; border: 0; border-radius: 0;
  }
  .copy h1 { margin: 0 0 35px; }
  .wordmark { display: block; width: 100%; height: auto; }
  .copy h2 { margin: 0 0 26px; color: #7b56ec; font: 800 clamp(27px, 6.3vw, 39px)/1.18 Georgia, "Times New Roman", serif; letter-spacing: -0.025em; }
  .description { margin: 0 0 28px; font-size: clamp(18px, 4.3vw, 23px); line-height: 1.55; }
  .tagline { margin: 0; color: #d44f29; font: 800 clamp(25px, 5.8vw, 34px)/1.2 Georgia, "Times New Roman", serif; letter-spacing: -0.025em; }
  .pills { height: 150px; min-height: 150px; margin: 24px -24px 20px; background: url('/assets/pills.webp') center 46% / cover no-repeat; }
  .signup-invitation { margin: 12px 24px 0; padding: 24px 0 32px; }
  .signup-invitation h2 { font-size: 25px; }
  .registration-header { padding: 24px 24px 0; }
  .brand-link { width: 166px; }
  .registration-layout { display: block; max-width: 530px; min-height: 0; padding: 42px 24px; }
  .registration-intro { padding: 0 2px; }
  .registration-intro .eyebrow { font-size: 9px; }
  .registration-intro h1 { margin: 18px 0; font-size: clamp(38px, 8.5vw, 48px); }
  .intro-description { font-size: 16px; }
  .desktop-break, .registration-art { display: none; }
  .registration-card { margin-top: 32px; padding: 30px 28px; border-radius: 22px; }
  .registration-card h2 { font-size: 36px; }

}
@media (max-width: 560px) {
  .signup-invitation { display: block; }
  .signup-invitation .primary-button { margin-top: 22px; }
}
@media (max-width: 360px) {
  .registration-header { padding-left: 20px; padding-right: 20px; }
  .brand-link { width: 145px; }
  .registration-layout { padding-left: 16px; padding-right: 16px; }
  .registration-card { padding-left: 22px; padding-right: 22px; }
  .registration-card h2 { font-size: 34px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .primary-button { transition: none; } }

/* Compact signup integrated into the product introduction. */
.hero { position: relative; isolation: isolate; display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(0, .82fr); align-items: center; gap: 64px; min-height: 100svh; max-width: 1480px; margin: 0 auto; padding: 56px 64px; }
.hero-copy { position: relative; z-index: 1; min-width: 0; }
.hero-copy h1 { margin: 0 0 32px; }
.hero-wordmark { display: block; width: 100%; max-width: 560px; height: auto; }
.hero-title { margin: 0; color: #7b56ec; font: 800 clamp(27px, 2.25vw, 35px)/1.16 Georgia, "Times New Roman", serif; letter-spacing: -.025em; }
.hero-description { margin: 24px 0; color: #4c434b; font-size: 18px; line-height: 1.6; }
.compact-signup { max-width: 440px; padding: 16px; border: 1px solid #fff7f2; border-radius: 18px; background: #fffaf7; }
.compact-signup h2 { margin: 0 0 12px; color: #382d3d; font: 500 21px/1.2 Georgia, "Times New Roman", serif; letter-spacing: -.015em; }
.compact-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 9px; }
.compact-signup .email-field { min-height: 44px; padding-left: 12px; padding-right: 12px; gap: 9px; }
.compact-signup .email-field input { padding: 11px 0; font-size: 16px; }
.compact-signup .submit-button { width: auto; min-width: 120px; min-height: 44px; margin: 0; padding: 12px 16px; gap: 10px; border-radius: 10px; font-size: 14px; }
.compact-signup .primary-button svg { width: 17px; height: 17px; flex-basis: 17px; }
.compact-signup .consent { margin-top: 12px; font-size: 11px; line-height: 1.5; }
.compact-signup .consent input { margin-top: 0; }
.compact-signup .waitlist-status:not(:empty) { margin-top: 12px; }
.hero-tagline { margin: 27px 0 0; color: #d44f29; font: 800 clamp(23px, 1.85vw, 29px)/1.2 Georgia, "Times New Roman", serif; letter-spacing: -.025em; }
.hero-art { position: absolute; z-index: 0; pointer-events: none; top: 0; right: 0; bottom: 0; width: 42%; background: url('/assets/pills-background.svg') center right / contain no-repeat; }
@media (max-width: 1120px) and (min-width: 901px) { .hero { gap: 36px; padding: 40px; grid-template-columns: minmax(0, 1.3fr) minmax(0, .7fr); } .hero-title { font-size: 28px; } .compact-signup .email-field > svg { display: none; } }
@media (max-width: 900px) {
  .hero { display: block; max-width: 660px; padding: 32px 24px 0; }
  .hero-copy h1 { margin-bottom: 26px; }
  .hero-title { font-size: clamp(26px, 4.8vw, 34px); }
  .hero-description { margin: 20px 0 22px; font-size: 17px; line-height: 1.6; }
  .compact-signup { padding: 18px; }
  .compact-signup h2 { font-size: 21px; }
  .hero-tagline { margin-top: 25px; font-size: 25px; }
  .hero-art { position: relative; inset: auto; width: auto; height: 150px; margin: 22px -24px 0; background: url('/assets/pills-background-mobile.svg') center / contain no-repeat; }
}
@media (max-width: 480px) {
  .compact-signup { padding: 16px; }
  .compact-signup .email-field > svg { display: none; }
  .compact-signup .email-field { padding: 0 10px; }
  .compact-signup .email-field input::placeholder { font-size: 14px; }
  .compact-signup .submit-button { min-width: 115px; padding-left: 12px; padding-right: 12px; gap: 7px; }
}
@media (max-width: 360px) {
  .hero { padding-left: 20px; padding-right: 20px; }
  .hero-art { margin-left: -20px; margin-right: -20px; }
  .compact-row { grid-template-columns: minmax(0, 1fr); }
  .compact-signup .submit-button { width: 100%; }
}
