/* Front page design (loaded after style.css; every rule is scoped to body.home).
   Same principles as the goat pages (goat-v2.css): put content in containers so it stands apart from
   the background, use the sale sheet palette (forest green, muted gold, warm paper), gold rules under
   headings, one clear call to action, phone first. */
.home { --paper: #FFFDF8; --band: #F6F2E8; }

/* Section headings: title with a fading gold rule */
.home .slot-title { display: flex; align-items: center; gap: var(--space-4); margin: 0 0 var(--space-6); font-size: 1.5rem; color: var(--primary); }
.home .slot-title::after { content: ""; display: block; flex: 1; width: auto; height: 2px; margin: 0;
  background: linear-gradient(90deg, var(--accent), transparent); }

/* Hero: headline over a framed photo */
.home .hero-line { margin: 0 0 var(--space-6); font-size: 1.7rem; line-height: 1.2; text-align: center; color: var(--primary); letter-spacing: .02em; }
.home .hero-img { border: 6px solid #fff; border-radius: var(--radius-lg); box-shadow: 0 6px 24px rgba(46,42,36,.2); }
.home .hero { padding-bottom: var(--space-8); }

/* Story: two statement cards */
.story-text { max-width: 40rem; margin: 0 auto var(--space-8); text-align: center; font-size: 1.2rem; line-height: 1.7; }
.story-text p { margin: 0 0 var(--space-6); }
.story-text .story-close { font-family: var(--font-display); font-size: 1.5rem; color: var(--primary); font-weight: 700; }
.story-cards { display: grid; grid-template-columns: 1fr; gap: var(--space-4); }
.story-card { margin: 0; padding: var(--space-6); background: var(--paper); border: 1px solid var(--border);
  border-left: 6px solid var(--accent); border-radius: var(--radius); box-shadow: 0 1px 2px rgba(46,42,36,.06);
  font-size: 1.25rem; line-height: 1.5; color: var(--fg); }

/* Herd cards: paper cards with a gold top edge and a lift on hover */
.home .cards { margin-top: 0; }
.home .card { background: var(--paper); border-top: 5px solid var(--accent); padding: var(--space-4); transition: transform .15s ease, box-shadow .15s ease; }
.home .card:hover, .home .card:focus-within { transform: translateY(-3px); box-shadow: 0 10px 28px rgba(46,42,36,.16); }
.home .card-link img { border: 3px solid #fff; box-shadow: 0 2px 8px rgba(46,42,36,.18); margin-bottom: var(--space-4); }
.home .card-name { margin: 0 0 var(--space-2); font-size: 1.2rem; color: var(--primary); letter-spacing: .08em; }
.home .slot-line-text { border: 0; padding: 0; margin: 0; color: var(--fg-muted); line-height: 1.45; }

/* Starter guide: a single callout */
.guide-card { max-width: 40rem; margin: 0 auto; padding: var(--space-6); background: #EEF3EA; border: 1px solid #CBD9C3;
  border-radius: var(--radius-lg); text-align: center; font-size: 1.2rem; }
.guide-card p { margin: 0; }

/* Waitlist: green band, form in a white card */
.home .waitlist { background: var(--primary); border-top: 4px solid var(--accent); }
.home .waitlist .slot-title { color: var(--primary-contrast); }
.home .waitlist .slot-title::after { background: linear-gradient(90deg, var(--accent), transparent); }
.home .waitlist-form { max-width: 34rem; margin: 0 auto; padding: var(--space-6); background: var(--paper);
  border-radius: var(--radius-lg); box-shadow: 0 10px 30px rgba(0,0,0,.25); }
.home .waitlist .cta-row { margin-bottom: 0; }
.home .waitlist .btn-primary { width: 100%; background: var(--primary); }
.home .waitlist .secondary-link { margin-top: var(--space-6); }
.home .waitlist .secondary-link a { color: var(--primary-contrast); }

/* Alternate bands stay warm */
.home .slot-section:nth-of-type(even):not(.waitlist) { background: var(--band); }

@media (min-width: 40rem) {
  .home .hero-line { font-size: 2.3rem; }
  .story-cards { grid-template-columns: repeat(2, 1fr); }
}

/* Spam trap: invisible to people, filled in by bots */
.home .hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* Hero v2 (Matt 2026-10-22): a dark green stage so the headline and photo stand apart from the page */
.home .hero { background: linear-gradient(180deg, var(--primary) 0%, #2d3c25 100%); padding: var(--space-12) 0 var(--space-12); border-bottom: 5px solid var(--accent); }
.home .hero-line { color: #fff; margin: 0 0 var(--space-8); font-size: 1.9rem; letter-spacing: .03em; text-shadow: 0 2px 8px rgba(0,0,0,.35); }
/* plaque: the headline sits in its own framed panel instead of between two rules */
.home .hero-line { width: fit-content; max-width: 100%; margin: 0 auto var(--space-8); padding: var(--space-4) var(--space-6);
  background: rgba(255,253,248,.08); border: 2px solid var(--accent); border-radius: 4px; box-shadow: 0 0 0 5px rgba(176,141,62,.18); }
.home .hero-line::before, .home .hero-line::after { display: none; }
/* photo: white mat, gold outer frame, deep shadow */
.home .hero-img { border: 10px solid #fffdf8; outline: 3px solid var(--accent); outline-offset: 0; border-radius: 4px;
  box-shadow: 0 18px 50px rgba(0,0,0,.5); }
@media (min-width: 40rem) { .home .hero-line { font-size: 2.15rem; text-wrap: balance; } .home .hero-img { border-width: 14px; } }