/* Before They Have to Ask — shared page styles.
   One authoritative copy. Every channel page links this file; nothing else styles them. */

:root { --navy: #0d3b5c; --ink: #1f2933; --paper: #faf8f5; --quiet: #6b7a86; --rule: #e2ddd6; }

* { box-sizing: border-box; }

body {
  margin: 0; background: var(--paper); color: var(--ink);
  font: 18px/1.65 Georgia, "Times New Roman", serif;
  -webkit-font-smoothing: antialiased;
}

.wrap { max-width: 34rem; margin: 0 auto; padding: 4rem 1.5rem 5rem; }

h1 {
  font-size: 2.1rem; line-height: 1.2; color: var(--navy);
  margin: 0 0 .4rem; font-weight: normal;
}

.sub {
  text-transform: uppercase; letter-spacing: .18em; font-size: .72rem;
  color: var(--quiet); margin: 0 0 2.2rem;
}

p { margin: 0 0 1.2rem; }

a.btn {
  display: inline-block; margin: 1rem 0 2.4rem; padding: .85rem 1.9rem;
  background: var(--navy); color: #fff; text-decoration: none;
  border-radius: 3px; font-family: Helvetica, Arial, sans-serif;
  font-size: 1rem; letter-spacing: .02em;
}
a.btn:hover { background: #0a2f49; }

/* The slot MailerLite injects the form into. The rule above it separates the
   invitation from the asking, which is the one moment the page changes register. */
.form-slot {
  margin: 2.4rem 0 0; padding-top: 2rem; border-top: 1px solid var(--rule);
}

/* Shown only if the form never arrives — ad blockers, a dropped script, a bad
   network. A family should never hit a dead end, so give them a person to write to. */
.form-fallback {
  display: none; font-size: .95rem; color: var(--ink);
  background: #fff; border: 1px solid var(--rule); border-radius: 3px;
  padding: 1.1rem 1.2rem;
}
.form-fallback.is-visible { display: block; }
.form-fallback p:last-child { margin-bottom: 0; }

footer {
  margin-top: 3rem; padding-top: 1.5rem; border-top: 1px solid var(--rule);
  font-family: Helvetica, Arial, sans-serif; font-size: .8rem;
  line-height: 1.6; color: var(--quiet);
}
footer a { color: var(--quiet); }