/*
 * Base styles for marketing landing pages.
 *
 * Tailwind's preflight (loaded by the app) resets default HTML styles.
 * This file restores sensible defaults so you can write normal HTML
 * without having to class everything.
 *
 * Include in your landing page:
 *   <link rel="stylesheet" href="../_shared/base.css">
 */

/* ── Typography ─────────────────────────────────────── */

.landing-page h1,
.landing-page h2,
.landing-page h3,
.landing-page h4,
.landing-page h5,
.landing-page h6 {
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 0.5em;
}

.landing-page h1 { font-size: 2.5rem; }
.landing-page h2 { font-size: 2rem; }
.landing-page h3 { font-size: 1.5rem; }
.landing-page h4 { font-size: 1.25rem; }

.landing-page p {
  margin-bottom: 1em;
  line-height: 1.6;
}

.landing-page a {
  color: hsl(221.2, 83.2%, 53.3%);
  text-decoration: underline;
}
.landing-page a:hover {
  opacity: 0.8;
}

.landing-page ul,
.landing-page ol {
  margin-bottom: 1em;
  padding-left: 1.5em;
}
.landing-page ul { list-style-type: disc; }
.landing-page ol { list-style-type: decimal; }
.landing-page li { margin-bottom: 0.25em; }

.landing-page img {
  max-width: 100%;
}

/* ── Layout helpers ─────────────────────────────────── */

.landing-page .container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 1.5rem;
}

.landing-page .text-center { text-align: center; }
.landing-page .flex { display: flex; }
.landing-page .flex-col { flex-direction: column; }
.landing-page .items-center { align-items: center; }
.landing-page .justify-center { justify-content: center; }
.landing-page .gap-4 { gap: 1rem; }
.landing-page .gap-8 { gap: 2rem; }

/* ── Signup form container ──────────────────────────── */

#signup-form {
  max-width: 420px;
  margin: 0 auto;
}