.landing {
  max-width: 980px; margin: 0 auto;
  padding: calc(28px + var(--safe-t)) calc(var(--gutter) + var(--safe-r)) calc(32px + var(--safe-b)) calc(var(--gutter) + var(--safe-l));
}
.hero h1 { font-size: clamp(1.6rem, 4.5vw, 2.4rem); letter-spacing: -0.01em; margin-bottom: 10px; }
.lede { font-size: 1.0625rem; color: var(--text-2); max-width: 60ch; margin-bottom: 24px; }
.doors { display: grid; gap: 14px; }
@media (min-width: 860px) {
  .doors { grid-template-columns: 1.3fr 1fr; grid-template-rows: auto auto; }
  .doors > :first-child { grid-row: span 2; }
}
.door { padding: 20px; display: flex; flex-direction: column; gap: 6px; }
.door h2 { font-size: 1.25rem; margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.door p { margin: 0; }
.door-link { color: inherit; text-decoration: none; }
.door-link:hover { border-color: var(--accent); }
.soon { font-size: 0.75rem; font-weight: 600; color: var(--text-3); border: 1px solid var(--border); border-radius: 999px; padding: 1px 8px; }
.open-form { display: flex; gap: 8px; margin-top: 10px; }
.open-form input { flex: 1; min-width: 0; }
.samples { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; }
.samples .btn { justify-content: flex-start; text-align: left; }
.samples .btn[aria-disabled="true"] { opacity: 0.6; pointer-events: none; }
#sample-note { margin-top: 4px; }
@media (max-width: 420px) {
  .open-form { flex-direction: column; }
}