/* ============================================================================
   Get Anchor (public) — the sunrise: waitlist or App Store, what you get,
   what you need, and the first five minutes.
   ========================================================================== */
.g-hero { padding-top: clamp(120px, 14vw, 170px); padding-bottom: clamp(40px, 6vw, 80px); overflow-x: clip; }
.g-hero__grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(24px, 5vw, 70px); align-items: center; }
@media (max-width: 900px) { .g-hero__grid { grid-template-columns: 1fr; } }
.g-hero .display { max-width: 11ch; }
.g-hero .lede { margin-top: 20px; }
.g-hero .wl { margin-top: 28px; }
.g-store { margin-top: 28px; display: inline-flex; }
.sunrise { position: relative; display: grid; place-items: center; min-height: min(560px, calc(100vh - 200px)); }
.sunrise__sun {
  position: absolute; width: min(460px, 90vw); aspect-ratio: 1; border-radius: 50%; bottom: 8%;
  background: radial-gradient(circle at 50% 60%, color-mix(in srgb, var(--m-bright) 60%, #fff 10%), color-mix(in srgb, var(--m-primary) 40%, transparent) 45%, transparent 70%);
  filter: blur(8px); opacity: .7; animation: rise 3.2s var(--ease-out) both;
}
@keyframes rise { from { transform: translateY(80px); opacity: 0; } }
.sunrise__line { position: absolute; left: -20%; right: -20%; bottom: 22%; height: 1px; background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--m-bright) 70%, transparent), transparent); }
.sunrise .phone { --w: min(290px, 70vw, calc((100vh - 260px) * .46)); --w: min(290px, 70vw, calc((100svh - 260px) * .46)); position: relative; animation: us-bob 5s ease-in-out infinite; }
@keyframes us-bob { 50% { transform: translateY(-8px); } }
.gets { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.gets .glass { padding: 24px; display: grid; gap: 10px; align-content: start; }
.gets h3 { margin: 0; font-family: var(--font-serif); font-size: 26px; font-weight: 500; }
.gets p { margin: 0; color: var(--ink-2); font-size: 14.5px; }
.gets ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.gets li { display: grid; grid-template-columns: 18px 1fr; gap: 10px; font-size: 14px; color: var(--ink-2); }
.gets li svg { width: 16px; height: 16px; color: var(--accent); margin-top: 2px; }
.gets .dash { border-style: dashed; }
@media (max-width: 960px) { .gets { grid-template-columns: 1fr; } }
.steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; counter-reset: st; }
.step { padding: 22px; display: grid; gap: 8px; align-content: start; position: relative; }
.step__n { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; font-family: var(--font-mono); font-size: 13px; color: var(--on-accent); background: var(--accent); }
.step h3 { margin: 0; font-size: 16px; }
.step p { margin: 0; font-size: 13.5px; color: var(--ink-2); }
@media (max-width: 900px) { .steps { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .steps { grid-template-columns: 1fr; } }
