/* /growth early-access page. Builds on growth-home.css tokens; only what that file does not already provide. */
.gp-hero .hero-grid { align-items: center; }
.gp-preview { padding: 22px; display: grid; gap: 16px; align-content: start; }
.gp-preview-head { display: flex; justify-content: space-between; gap: 10px; align-items: center; font: 700 .92rem var(--font-body); color: var(--ink); flex-wrap: wrap; }
.gp-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.gp-metrics > div, .gp-pipe > div { display: grid; gap: 2px; padding: 14px; border-radius: 14px; background: var(--surface-solid); border: 1px solid var(--line); }
.gp-metrics b, .gp-pipe b { font: 800 1.6rem/1.1 var(--font-head); color: var(--ink); }
.gp-metrics span, .gp-pipe span { font-size: .84rem; color: var(--ink-2); }
.gp-next { font-size: .92rem; color: var(--ink-2); }
.gp-next ul { margin: 6px 0 0; padding-left: 18px; display: grid; gap: 4px; }
.gp-caption { font-size: .82rem; color: var(--ink-3); margin: 0; }
.flow-grid { display: grid; gap: 16px; grid-template-columns: 1fr; }
@media (min-width: 720px) { .flow-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1080px) { .flow-grid { grid-template-columns: repeat(5, 1fr); } }
.gp-grid { display: grid; gap: 16px; grid-template-columns: 1fr; }
@media (min-width: 720px) { .gp-grid { grid-template-columns: repeat(2, 1fr); } }
.gp-grid .glass { padding: 24px; display: grid; gap: 8px; align-content: start; }
.gp-grid h3 { font-size: 1.15rem; font-weight: 800; }
.gp-grid p { color: var(--ink-2); font-size: .98rem; margin: 0; }
.gp-pipe { display: flex; gap: 10px; align-items: stretch; justify-content: center; padding: 20px; flex-wrap: wrap; max-width: 880px; margin: 0 auto; }
.gp-pipe > div { min-width: 96px; flex: 1 1 96px; text-align: center; }
.gp-pipe > span { align-self: center; color: var(--ink-3); font-size: 1.4rem; }
@media (max-width: 560px) { .gp-pipe > span { display: none; } }
.gp-form-card { padding: clamp(24px, 4vw, 48px); display: grid; gap: 18px; max-width: 860px; margin: 0 auto; }
.gp-form-card h2 { font-size: clamp(1.7rem, 3.6vw, 2.5rem); font-weight: 800; }
.gp-form-card > p { color: var(--ink-2); margin: 0; }
.gp-form-card form { display: grid; gap: 16px; }
.gp-cols { display: grid; gap: 16px; grid-template-columns: 1fr; }
@media (min-width: 720px) { .gp-cols { grid-template-columns: 1fr 1fr; } }
select.input { appearance: auto; }
.gp-area { min-height: 96px; padding: 12px 16px; resize: vertical; font: 500 1rem var(--font-body); }
.opt { font-weight: 500; color: var(--ink-3); }
.gp-check { display: flex; gap: 10px; align-items: flex-start; }
.gp-check input { width: 22px; height: 22px; margin-top: 2px; flex: none; accent-color: var(--accent); }
.gp-check label { font-size: .95rem; color: var(--ink); line-height: 1.45; }
.gp-hero-fallback { display: none; }

/* The hidden attribute must win over display rules (.mode-banner is display:flex): open shows only the form, closed shows only the notice. */
#eaForm[hidden], #eaClosed[hidden] { display: none !important; }
