/* ============================================================
   Dad-Scaped · Restyle Layer
   Visual refresh — cream masthead, cinematic photography,
   Cormorant Garamond display, Manrope utility labels, hairline
   rules, 0.5px outline buttons.
   Loads AFTER dadscaped-site.css. Overrides where conflicts arise.
   ============================================================ */

:root {
  --paper: #F4EFE6;
  --paper-warm: #EFE8DB;
  --ink: #171411;
  --ink-soft: #201D19;
  --muted: #72685F;
  --bronze: #9A7B4F;
  --hairline: rgba(23, 20, 17, 0.14);
  --hairline-strong: rgba(23, 20, 17, 0.32);
  --paper-line: rgba(245, 240, 232, 0.42);
  --paper-line-strong: rgba(245, 240, 232, 0.78);
}

/* ============== BASE ============== */
html, body {
  background: var(--paper);
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  font-family: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  font-size: 19px;
  line-height: 1.7;
  font-weight: 400;
}

.site {
  display: block;
  background: var(--paper);
}

/* Reset shell padding — masthead and sections set their own */
.shell { max-width: none; padding: 0; margin: 0; }

/* ============== CREAM MASTHEAD (replaces .header pattern) ============== */
.masthead {
  position: relative;
  z-index: 6;
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: clamp(16px, 4vw, 48px);
  padding: clamp(22px, 3vw, 36px) clamp(24px, 5vw, 64px);
  background: var(--paper);
  border-bottom: 1px solid var(--hairline);
  border-top: 0;
}

.masthead .wordmark,
header.header .wordmark {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 500;
  font-size: clamp(22px, 1.7vw, 26px);
  letter-spacing: 0.01em;
  color: var(--ink);
  text-decoration: none;
  line-height: 1;
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  font-style: normal;
  text-transform: none;
}

.masthead .wordmark .registered-mark,
header.header .wordmark .registered-mark {
  font-family: 'Manrope', sans-serif;
  font-size: 0.42em;
  font-weight: 400;
  transform: translateY(-0.55em);
  opacity: 0.7;
  margin-left: 2px;
}

.masthead .nav,
header.header .nav {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: clamp(18px, 2.6vw, 38px);
}

.masthead .nav a,
header.header .nav a {
  font-family: 'Manrope', sans-serif;
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.22em;
  color: var(--muted);
  text-decoration: none;
  transition: color 220ms ease;
  white-space: nowrap;
  border: 0;
  padding: 0;
  background: none;
}

.masthead .nav a:hover,
header.header .nav a:hover { color: var(--ink); }

/* Override original sticky-header behavior */
header.header.shell {
  position: relative;
  top: auto;
  background: var(--paper);
  border-bottom: 1px solid var(--hairline);
  padding: clamp(22px, 3vw, 36px) clamp(24px, 5vw, 64px);
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: clamp(16px, 4vw, 48px);
  max-width: none;
  z-index: 6;
}

/* ============== HERO (homepage marquee) ============== */
.home-main { background: var(--paper); padding: 0; margin: 0; }
.interior-main { background: var(--paper); padding: 0; margin: 0; }

.home-hero,
.page-hero {
  position: relative;
  width: 100%;
  min-height: 0;
  display: grid;
  align-items: end;
  overflow: hidden;
  background: #15120F;
  aspect-ratio: auto;
}

.home-hero {
  min-height: calc(100svh - 80px);
}

.page-hero {
  aspect-ratio: 16 / 8;
  min-height: 480px;
}

.home-hero .hero-image,
.page-hero .hero-image,
.page-hero > .hero-image {
  position: absolute;
  inset: 0;
  margin: 0;
  z-index: 0;
  min-height: 0;
}

.home-hero .hero-image img,
.page-hero .hero-image img,
.page-hero > .hero-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 50%;
  /* Cinematic treatment: replaces the bright-1.9 wash */
  filter: brightness(0.92) contrast(1.04) saturate(1.02) sepia(0.06);
  display: block;
  min-height: 0;
}

.home-hero::after,
.page-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(180deg, rgba(15,12,9,0.18) 0%, rgba(15,12,9,0) 30%, rgba(15,12,9,0) 55%, rgba(15,12,9,0.58) 100%);
  pointer-events: none;
}

.home-hero .hero-copy,
.page-hero .hero-copy,
.page-hero .watch-copy,
.page-hero .member-layout {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: none;
  padding: 0 clamp(24px, 5vw, 64px) clamp(64px, 10vh, 120px);
  margin: 0;
  color: var(--paper);
}

.home-hero h1,
.page-hero h1 {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 400;
  font-size: clamp(56px, 8vw, 132px);
  line-height: 1.0;
  letter-spacing: -0.012em;
  margin: 0 0 clamp(18px, 2.2vh, 28px);
  color: var(--paper);
  max-width: 18ch;
  text-transform: none;
}

.home-hero h1 { font-size: clamp(72px, 12vw, 184px); max-width: 14ch; }

.home-hero .lede,
.page-hero .lede {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 400;
  font-size: clamp(20px, 1.6vw, 26px);
  line-height: 1.5;
  margin: 0 0 clamp(28px, 4vh, 48px);
  color: var(--paper-line-strong);
  max-width: 40ch;
}

.home-hero .hero-eyebrow,
.page-hero .hero-eyebrow,
.page-hero .section-kicker {
  font-family: 'Manrope', sans-serif;
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.34em;
  color: var(--paper-line-strong);
  margin: 0 0 clamp(24px, 3vh, 36px);
  padding-bottom: clamp(16px, 2.5vh, 24px);
  border-bottom: 1px solid var(--paper-line);
  width: clamp(200px, 22vw, 280px);
  display: block;
}

.home-hero .hero-actions,
.page-hero .hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: clamp(20px, 3vh, 32px);
}

/* Hero buttons on dark photos use paper-line treatment */
.home-hero .quiet-button,
.page-hero .quiet-button {
  color: var(--paper);
  border: 0.5px solid var(--paper-line-strong);
  background: transparent;
  padding: 14px 26px;
  border-radius: 0;
  font-family: 'Manrope', sans-serif;
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.24em;
}

.home-hero .quiet-button:hover,
.page-hero .quiet-button:hover {
  background: var(--paper);
  color: var(--ink);
  border-color: var(--paper);
}

/* ============== QUIET BUTTONS (light surfaces) ============== */
.quiet-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 14px 26px;
  border: 0.5px solid var(--hairline-strong);
  background: transparent;
  color: var(--ink);
  text-decoration: none;
  font-family: 'Manrope', sans-serif;
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.24em;
  border-radius: 0;
  cursor: pointer;
  transition: background-color 240ms ease, color 240ms ease, border-color 240ms ease;
  width: fit-content;
}

.quiet-button:hover {
  background: var(--ink);
  color: var(--paper);
  border-color: var(--ink);
}

.text-link {
  font-family: 'Manrope', sans-serif;
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.24em;
  color: var(--bronze);
  text-decoration: none;
}

.text-link:hover { color: var(--ink); }

/* ============== EYEBROWS (light surface) ============== */
.eyebrow {
  font-family: 'Manrope', sans-serif;
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.32em;
  color: var(--bronze);
  margin: 0 0 clamp(18px, 2.4vh, 26px);
}

/* ============== EDITORIAL MODULES (used on home + member pages) ============== */
.home-modules {
  max-width: none;
  margin: 0;
  padding: clamp(48px, 6vw, 88px) clamp(24px, 5vw, 64px);
}

.editorial-module {
  max-width: 1240px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(40px, 6vw, 96px);
  align-items: center;
  padding: clamp(32px, 4vw, 64px) 0;
}

.editorial-module + .editorial-module {
  border-top: 1px solid var(--hairline);
}

.editorial-module.offset { direction: rtl; }
.editorial-module.offset > * { direction: ltr; }

.editorial-module .section-copy h2,
.section-copy h2,
.copy-stack h2 {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 400;
  font-size: clamp(40px, 4.8vw, 68px);
  line-height: 1.04;
  letter-spacing: -0.01em;
  margin: 0 0 clamp(20px, 2.4vh, 28px);
  color: var(--ink);
  text-transform: none;
}

.editorial-module .section-copy p,
.section-copy p {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 400;
  font-size: clamp(20px, 1.4vw, 24px);
  line-height: 1.55;
  margin: 0 0 14px;
  color: var(--ink-soft);
  max-width: 36ch;
}

.editorial-module .module-actions,
.section-copy .module-actions,
.module-actions {
  margin-top: clamp(28px, 3vh, 38px);
}

.cinematic-image {
  margin: 0;
  overflow: hidden;
  min-height: 0;
  aspect-ratio: 4 / 3;
  position: relative;
}

.cinematic-image::after { display: none; }

.cinematic-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: brightness(0.92) contrast(1.04) saturate(1.02) sepia(0.05);
  display: block;
  min-height: 0;
}

.hero-image,
.module-media {
  aspect-ratio: 4 / 3;
}

/* ============== FIRST STORY MODULE (homepage) ============== */
.first-story {
  max-width: 1240px;
  margin: 0 auto;
  padding: clamp(56px, 7vw, 104px) clamp(24px, 5vw, 64px);
  display: grid;
  grid-template-columns: 1.35fr 1fr;
  gap: clamp(40px, 6vw, 88px);
  align-items: center;
  border-top: 1px solid var(--hairline);
  border-bottom: 1px solid var(--hairline);
}
.first-story-image {
  margin: 0;
  overflow: hidden;
  aspect-ratio: 4 / 3;
}
.first-story-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: brightness(0.92) contrast(1.04) saturate(1.02) sepia(0.05);
  display: block;
}
.first-story-copy { padding: 0; }
.first-story-eyebrow {
  font-family: 'Manrope', sans-serif;
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.32em;
  color: var(--bronze);
  margin: 0 0 clamp(22px, 2.8vh, 32px);
}
.first-story-quote {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 400;
  font-style: italic;
  font-size: clamp(28px, 3.2vw, 44px);
  line-height: 1.18;
  letter-spacing: -0.008em;
  color: var(--ink);
  margin: 0 0 clamp(24px, 3vh, 32px);
  max-width: 22ch;
}
.first-story-meta {
  font-family: 'Manrope', sans-serif;
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.28em;
  color: var(--muted);
  margin: 0 0 clamp(28px, 3.4vh, 40px);
}
.first-story-actions { margin-top: 0; }
@media (max-width: 900px) {
  .first-story {
    grid-template-columns: 1fr;
    gap: clamp(28px, 4vw, 48px);
  }
  .first-story-quote { max-width: none; }
}

.portrait-strip {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  width: 100%;
}

.portrait-strip img {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  filter: brightness(0.92) contrast(1.04) saturate(1.02) sepia(0.05);
  display: block;
}

/* ============== CASE STUDY (homepage · Modelo × Victor) ============== */
.case-study {
  background: var(--paper-warm);
  padding: clamp(56px, 7vw, 104px) clamp(24px, 5vw, 64px);
  border-top: 1px solid var(--hairline);
  border-bottom: 1px solid var(--hairline);
}

.case-study-heading {
  max-width: 1240px;
  margin: 0 auto clamp(32px, 4vw, 56px);
}

.case-study-heading .eyebrow {
  font-family: 'Manrope', sans-serif;
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.34em;
  color: var(--bronze);
  margin: 0 0 clamp(20px, 2.4vh, 28px);
}

.case-study-heading h2 {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 400;
  font-size: clamp(48px, 6vw, 92px);
  line-height: 1.02;
  letter-spacing: -0.01em;
  margin: 0 0 clamp(20px, 2.4vh, 28px);
  color: var(--ink);
  text-transform: none;
  max-width: 18ch;
}

.case-study-intro {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-weight: 400;
  font-size: clamp(20px, 1.5vw, 26px);
  line-height: 1.5;
  color: var(--muted);
  margin: 0;
  max-width: 48ch;
}

.case-study-layout {
  max-width: 1240px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(40px, 6vw, 96px);
  align-items: start;
}

.case-profile img {
  width: 100%;
  max-width: 280px;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  filter: brightness(0.92) contrast(1.04) saturate(1.02) sepia(0.05);
  margin: 0 0 24px;
  display: block;
}

.case-profile h3 {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 500;
  font-size: clamp(28px, 2.2vw, 36px);
  line-height: 1.2;
  color: var(--ink);
  margin: 0 0 6px;
  text-transform: none;
}

.case-meta {
  font-family: 'Manrope', sans-serif;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.3em;
  color: var(--muted);
  margin: 0 0 24px;
}

.case-profile blockquote {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-weight: 400;
  font-size: clamp(19px, 1.4vw, 22px);
  line-height: 1.6;
  color: var(--ink-soft);
  margin: 0;
  padding-left: 22px;
  border-left: 1px solid var(--hairline-strong);
  max-width: 52ch;
}

.case-ad {
  margin: 0;
}

.case-ad img {
  width: 100%;
  height: auto;
  display: block;
  filter: brightness(0.94) contrast(1.04) saturate(1.02) sepia(0.04);
}

.case-ad figcaption {
  font-family: 'Manrope', sans-serif;
  font-size: 10px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.3em;
  color: var(--muted);
  text-align: right;
  margin-top: 14px;
}

.case-cta {
  max-width: 1240px;
  margin: clamp(32px, 4vw, 56px) auto 0;
  padding-top: clamp(40px, 5vw, 56px);
  border-top: 1px solid var(--hairline);
  display: flex;
  justify-content: center;
}

@media (max-width: 900px) {
  .case-study-layout { grid-template-columns: 1fr; }
}

/* ============== SPOT THE DIFFERENCE ============== */
.spot-section {
  padding: clamp(56px, 7vw, 104px) 0;
  border-top: 1px solid var(--hairline);
  border-bottom: 1px solid var(--hairline);
}

.spot-section .spot-copy {
  text-align: center;
  padding: 0 clamp(24px, 5vw, 64px);
  margin-bottom: clamp(32px, 4vw, 56px);
}

.spot-section .spot-line {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-weight: 400;
  font-size: clamp(28px, 4.4vw, 56px);
  line-height: 1.15;
  letter-spacing: -0.005em;
  color: var(--ink);
  margin: 0 auto;
  max-width: 22ch;
}

.spot-section .spot-link {
  display: block;
  line-height: 0;
  cursor: pointer;
  text-decoration: none;
  overflow: hidden;
}

.spot-section .spot-link img {
  width: 100%;
  height: auto;
  display: block;
  filter: brightness(0.93) contrast(1.04) saturate(1.02) sepia(0.05);
  transition: filter 600ms ease, transform 800ms ease;
  transform: scale(1.0);
}

.spot-section .spot-link:hover img,
.spot-section .spot-link:focus-visible img {
  filter: brightness(0.98) contrast(1.05) saturate(1.04) sepia(0.04);
  transform: scale(1.012);
}

.spot-section .spot-actions {
  text-align: center;
  padding: clamp(28px, 4vw, 52px) clamp(24px, 5vw, 64px) 0;
}

/* ============== INTERIOR PAGE LAYOUTS ============== */
.interior-main .shell {
  max-width: none;
  padding: 0;
  margin: 0;
}

/* Member signup band */
.member-layout {
  display: block;
  padding: clamp(48px, 6vw, 96px) clamp(24px, 5vw, 64px);
  max-width: none;
}

.signup-grid {
  max-width: 1240px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: clamp(40px, 6vw, 96px);
  align-items: start;
}

.signup-grid .copy-stack h2,
.signup-grid .copy-stack h1 {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 400;
  font-size: clamp(56px, 8vw, 116px);
  line-height: 0.98;
  letter-spacing: -0.012em;
  margin: 0 0 clamp(22px, 2.6vh, 32px);
  color: var(--ink);
}

.signup-grid .copy-stack p {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 400;
  font-size: clamp(20px, 1.5vw, 24px);
  line-height: 1.55;
  color: var(--ink-soft);
  margin: 0 0 14px;
  max-width: 32ch;
}

.signup-box,
.signup-card {
  border-top: 1px solid var(--hairline-strong);
  padding-top: clamp(28px, 3.5vh, 40px);
}

.signup-intro,
.signup-meta {
  font-family: 'Manrope', sans-serif;
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.28em;
  color: var(--muted);
  margin: 0 0 clamp(28px, 3.5vh, 40px);
}

.signup-intro p { font-family: inherit; font-size: inherit; color: inherit; margin: 0; max-width: none; }

/* ============== FORMS ============== */
.member-email-form,
.nomination-form,
.story-form,
.waitlist-form {
  display: grid;
  gap: clamp(22px, 2.6vh, 30px);
}

.email-field,
.form-row {
  display: grid;
  gap: 8px;
}

.email-field span,
.form-row label {
  font-family: 'Manrope', sans-serif;
  font-size: 10px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.3em;
  color: var(--muted);
}

input[type="email"],
input[type="text"],
input[type="tel"],
textarea {
  width: 100%;
  padding: 14px 0;
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--hairline-strong);
  border-radius: 0;
  font-family: 'Cormorant Garamond', serif;
  font-size: 20px;
  font-weight: 400;
  color: var(--ink);
  outline: none;
  transition: border-color 240ms ease;
  resize: none;
}

textarea { min-height: 130px; line-height: 1.5; }

input[type="email"]::placeholder,
input[type="text"]::placeholder,
textarea::placeholder {
  color: var(--muted);
  font-style: italic;
}

input[type="email"]:focus,
input[type="text"]:focus,
input[type="tel"]:focus,
textarea:focus { border-bottom-color: var(--ink); }

input[type="file"] {
  font-family: 'Manrope', sans-serif;
  font-size: 12px;
  color: var(--muted);
  padding: 12px 0;
  background: transparent;
  border: 0;
}

.form-honeypot {
  position: absolute;
  left: -9999px;
  width: 1px; height: 1px;
  overflow: hidden;
}

.form-note,
.helper-text {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-weight: 400;
  font-size: clamp(17px, 1.2vw, 20px);
  line-height: 1.5;
  color: var(--ink-soft);
  margin: 0 0 8px;
  max-width: 32ch;
}

.form-status {
  font-family: 'Manrope', sans-serif;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.24em;
  color: var(--muted);
  margin: 8px 0 0;
}

button[type="submit"] {
  margin-top: 8px;
  justify-self: start;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 32px;
  border: 0.5px solid var(--hairline-strong);
  background: transparent;
  color: var(--ink);
  font-family: 'Manrope', sans-serif;
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.24em;
  border-radius: 0;
  cursor: pointer;
  transition: background-color 240ms ease, color 240ms ease, border-color 240ms ease;
  width: fit-content;
}

button[type="submit"]:hover {
  background: var(--ink);
  color: var(--paper);
  border-color: var(--ink);
}

/* ============== NOMINATE — WAITLIST + MEET THE DADS ============== */
.nominate-layout {
  max-width: 1240px;
  margin: 0 auto !important;
  padding: clamp(48px, 6vw, 96px) clamp(24px, 5vw, 64px);
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: clamp(28px, 4vw, 64px);
  align-items: start;
}

.meet-dads-section {
  padding: clamp(56px, 7vw, 104px) clamp(24px, 5vw, 64px);
  border-top: 1px solid var(--hairline);
}

.meet-intro {
  max-width: 1240px;
  margin: 0 auto clamp(32px, 4vw, 56px);
}

.meet-intro h2 {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 400;
  font-size: clamp(48px, 6vw, 92px);
  line-height: 1.02;
  letter-spacing: -0.01em;
  margin: 0 0 18px;
  color: var(--ink);
  text-transform: none;
}

.meet-intro .lede {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-weight: 400;
  font-size: clamp(20px, 1.5vw, 26px);
  line-height: 1.5;
  color: var(--muted);
  margin: 0;
  max-width: 40ch;
}

.stories-grid {
  max-width: 1240px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(36px, 4vw, 56px) clamp(28px, 3vw, 40px);
}

.dad-story {
  display: grid;
  gap: 18px;
  grid-template-rows: auto auto 1fr;
}

.dad-story img {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  filter: brightness(0.92) contrast(1.04) saturate(1.02) sepia(0.05);
  display: block;
}

.dad-story .story-name {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 500;
  font-size: clamp(22px, 1.7vw, 26px);
  line-height: 1.2;
  color: var(--ink);
  margin: 0;
}

.dad-story .story-place {
  font-family: 'Manrope', sans-serif;
  font-size: 10px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.3em;
  color: var(--muted);
  margin: 4px 0 0;
  text-transform: uppercase;
}

.dad-story .story-body {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 1.55;
  color: var(--ink-soft);
  margin: 6px 0 0;
}

.meet-closing {
  max-width: 1240px;
  margin: clamp(80px, 10vw, 132px) auto 0;
  padding-top: clamp(32px, 4vw, 56px);
  border-top: 1px solid var(--hairline);
  text-align: center;
}

.meet-closing h2 {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 400;
  font-size: clamp(40px, 5.6vw, 76px);
  line-height: 1.04;
  letter-spacing: -0.01em;
  margin: 0 0 clamp(28px, 3vh, 36px);
  color: var(--ink);
  text-transform: none;
}

.meet-closing .quiet-button { margin: 0 auto; }

/* ============== COPY STACKS (interior pages) ============== */
.copy-stack p {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 400;
  font-size: clamp(22px, 1.7vw, 28px);
  line-height: 1.55;
  margin: 0 0 28px;
  color: var(--ink-soft);
  max-width: 28ch;
}

/* ============== CARDS FEATURE — sits flush under hero ============== */
.cards-feature {
  padding-top: 0;
}
.cards-feature .editorial-module {
  padding-top: clamp(32px, 4vw, 56px);
}

/* ============== HOMEPAGE EMAIL CAPTURE BAND ============== */
.homepage-email-band {
  padding: clamp(56px, 7vw, 104px) clamp(24px, 5vw, 64px);
  border-top: 1px solid var(--hairline);
  background: var(--paper);
}

.homepage-email-inner {
  max-width: 640px;
  margin: 0 auto;
  text-align: center;
}

.homepage-email-band .eyebrow {
  text-align: center;
  margin: 0 0 clamp(20px, 2.4vh, 28px);
}

.homepage-email-band h2 {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 400;
  font-size: clamp(36px, 4.6vw, 64px);
  line-height: 1.06;
  letter-spacing: -0.01em;
  margin: 0 0 clamp(40px, 5vh, 56px);
  color: var(--ink);
  text-transform: none;
  max-width: 20ch;
  margin-left: auto;
  margin-right: auto;
}

.homepage-email-form {
  display: grid;
  gap: 18px;
  justify-items: center;
}

.homepage-email-form .email-field {
  width: 100%;
  max-width: 420px;
  display: grid;
  gap: 8px;
  text-align: left;
}

.homepage-email-form .email-field span {
  font-family: 'Manrope', sans-serif;
  font-size: 10px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.3em;
  color: var(--muted);
}

.homepage-email-form button[type="submit"] {
  margin-top: 8px;
}

/* ============== FOOTER (centered editorial) ============== */
.footer,
footer.footer.shell {
  padding: clamp(48px, 6vw, 80px) clamp(24px, 5vw, 64px) clamp(40px, 5vw, 56px);
  border-top: 1px solid var(--hairline);
  text-align: center;
  background: var(--paper);
  display: block;
  width: 100%;
  max-width: none;
  margin: 0;
  justify-content: center;
}

.footer strong,
footer.footer.shell strong {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 500;
  font-size: clamp(22px, 1.7vw, 28px);
  line-height: 1;
  color: var(--ink);
  display: inline-block;
}

.footer strong::after {
  content: "";
  display: block;
  width: 32px;
  height: 1px;
  background: var(--hairline-strong);
  margin: clamp(20px, 2.4vh, 28px) auto;
}

.footer span,
footer.footer.shell span {
  font-family: 'Manrope', sans-serif;
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.34em;
  color: var(--muted);
  display: block;
  margin: 0;
}

.footer-meta {
  margin: clamp(40px, 5vw, 56px) auto 0;
  padding-top: clamp(20px, 2.5vw, 28px);
  border-top: 1px solid var(--hairline);
  max-width: 720px;
  font-family: 'Manrope', sans-serif;
  font-size: 10px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.28em;
  color: var(--muted);
}

.footer-inquiries,
.footer a.footer-inquiries,
footer.footer.shell a.footer-inquiries {
  display: inline-block;
  margin: clamp(28px, 3vh, 40px) auto 0;
  padding: 0;
  font-family: 'Manrope', sans-serif;
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.34em;
  color: var(--muted);
  text-decoration: none;
  background: transparent;
  border: 0;
  transition: color 220ms ease;
}

.footer-inquiries:hover,
.footer a.footer-inquiries:hover,
footer.footer.shell a.footer-inquiries:hover { color: var(--ink); }

.footer-production,
.footer a.footer-production,
footer.footer.shell a.footer-production {
  display: inline-block;
  margin: clamp(18px, 2vh, 26px) auto 0;
  padding: 0;
  font-family: 'Manrope', sans-serif;
  font-size: 10px;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.34em;
  color: var(--muted);
  opacity: 0.7;
  text-decoration: none;
  background: transparent;
  border: 0;
  transition: color 220ms ease, opacity 220ms ease;
}

.footer-production:hover,
.footer a.footer-production:hover,
footer.footer.shell a.footer-production:hover {
  color: var(--ink);
  opacity: 1;
}

/* ============== UTILITY CLEANUP ============== */
.dark-panel {
  background: var(--ink);
  color: var(--paper);
}

.dark-panel h2 {
  color: var(--paper);
}

.dark-panel .lede,
.dark-panel .story-body,
.dark-panel p {
  color: var(--paper-line-strong);
}

/* Remove animations beyond simple hover */
* {
  animation: none !important;
}

a, button, input, textarea, img {
  transition-duration: 240ms;
}

/* ============== RESPONSIVE ============== */
@media (max-width: 900px) {
  .signup-grid,
  .nominate-layout,
  .editorial-module {
    grid-template-columns: 1fr;
    gap: clamp(32px, 6vw, 56px);
  }

  .editorial-module.offset { direction: ltr; }

  .home-hero h1 { font-size: clamp(56px, 14vw, 96px); }
  .page-hero h1 { font-size: clamp(44px, 11vw, 76px); }

  .home-hero .hero-eyebrow,
  .page-hero .hero-eyebrow { width: 60vw; letter-spacing: 0.28em; }

  .stories-grid { grid-template-columns: repeat(2, 1fr); }

  /* Mobile nav: wrap to multiple lines instead of hiding overflow items.
     The original rule hid items 5+ which truncated Archive, Why, and
     For Partners on mobile. With seven nav items now, wrapping is the
     honest fix. */
  .masthead .nav,
  header.header .nav {
    flex-wrap: wrap;
    justify-content: flex-end;
    row-gap: 10px;
    column-gap: 18px;
  }
  .masthead .nav a,
  header.header .nav a { font-size: 12px; letter-spacing: 0.18em; }
}

@media (max-width: 560px) {
  .stories-grid { grid-template-columns: 1fr; }
  .masthead,
  header.header.shell {
    grid-template-columns: 1fr;
    gap: 16px;
    text-align: center;
  }
  .masthead .nav,
  header.header .nav { justify-content: center; flex-wrap: wrap; gap: 16px; }
}
