/* ==========================================================================
   home.css — premium page layer for alyssaclarcq.com/ (home)
   Loads AFTER shared/premium.css. Every rule scoped to body.page-home.
   Mirrors the approved tiktok-premium system: cream-dominant, forest/sage/
   eucalyptus accents, serif display + sans body, one focal point per viewport.

   Decision flow this page drives:
   1. Orient — who Alyssa is + credibility (hero, cred band)
   2. Decide — one of three lanes: speaking / training / workflow (router)
   3. Believe — proof of work (forest section)
   4. Deepen — pathway detail, topics, bio for the chosen lane
   5. Forward — overview packet for internal evaluators
   6. Act — intake CTA band
   ========================================================================== */

/* Page wash: quiet eucalyptus corner on warm cream, no brass/blue tint */
body.page-home {
  background:
    radial-gradient(circle at 88% -6%, rgba(220, 230, 228, 0.85), transparent 42%),
    linear-gradient(180deg, var(--white), var(--paper));
}

/* Forest wayfinding for focus */
body.page-home a:focus-visible,
body.page-home button:focus-visible {
  outline-color: var(--dark);
}

/* Sage editorial eyebrows */
body.page-home .eyebrow {
  color: var(--sage);
  letter-spacing: 0.18em;
}

/* Forest primaries — the one saturated action color */
body.page-home .header-cta,
body.page-home .button.primary {
  background: var(--dark);
  color: var(--white);
}

body.page-home .path-number,
body.page-home .step-grid span {
  background: var(--dark);
}

/* Hero: eucalyptus wash, calmer panel, forest-shadowed portrait */
body.page-home .authority-hero {
  background:
    linear-gradient(90deg, rgba(220, 230, 228, 0.55), rgba(241, 243, 241, 0.35) 48%, rgba(255, 253, 250, 0)),
    var(--paper);
}

body.page-home .hero-portrait {
  border-radius: 16px;
  box-shadow: 0 16px 40px rgba(23, 56, 46, 0.14);
}

body.page-home .hero-evidence {
  border-radius: 14px;
  box-shadow: 0 22px 60px rgba(23, 56, 46, 0.1);
}

body.page-home .proof-line {
  border-left-color: var(--sage);
}

body.page-home .panel-label {
  color: var(--sage);
}

body.page-home .evidence-list span {
  color: var(--brass-text);
}

/* Status kickers: sage instead of blue */
body.page-home .status,
body.page-home .project-kicker {
  color: var(--sage);
}

/* Guard: on the dark proof section, eyebrow must stay light */
body.page-home .proof .eyebrow {
  color: var(--sage-light);
}

/* Router: the workflow card is the focal choice */
body.page-home .choice-grid article {
  border-radius: 14px;
  transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

body.page-home .choice-grid article:hover {
  border-color: var(--sage);
  box-shadow: 0 18px 44px rgba(23, 56, 46, 0.1);
  transform: translateY(-2px);
}

body.page-home .choice-grid article:last-child {
  border-color: var(--dark);
  background: var(--dark);
  color: var(--white);
  box-shadow: 0 22px 54px rgba(23, 56, 46, 0.22);
}

body.page-home .choice-grid article:last-child .status {
  color: var(--sage-light);
}

body.page-home .choice-grid article:last-child p {
  color: rgba(255, 254, 250, 0.84);
}

body.page-home .choice-grid article:last-child a {
  color: var(--white);
  text-decoration: underline;
  text-decoration-color: var(--sage-light);
  text-underline-offset: 3px;
}

/* Cards: soften radii, forest-tinted hover across grids */
body.page-home .audience-grid article,
body.page-home .lab-list article,
body.page-home .pathway-grid article,
body.page-home .step-grid article,
body.page-home .lab-feature {
  border-radius: 14px;
}

/* Proof section (forest): sage-light eyebrow + cream cards come from shared */
body.page-home .proof-grid article {
  border-radius: 14px;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  body.page-home .choice-grid article,
  body.page-home .choice-grid article:hover {
    transform: none;
    transition: none;
  }
}

/* Premium retune: links in forest/sage (shared default is steel blue --blue) */
body.page-home a {
  color: #17382e;
}
body.page-home a:hover {
  color: #5b7166;
}
body.page-home .text-link,
body.page-home .quiet-link,
body.page-home .button.text-link {
  color: #17382e;
  text-decoration-color: #bccdc2;
}
body.page-home .text-link:hover,
body.page-home .quiet-link:hover {
  color: #5b7166;
}
/* Guards: dark surfaces + buttons keep their own colors */
body.page-home .button.primary,
body.page-home .header-cta {
  color: #fffefa;
}
body.page-home .proof a,
body.page-home .workflow-path a,
body.page-home .support-model a {
  color: inherit;
}
body.page-home footer a {
  color: inherit;
}
