/* ============================================================
   LifeShaping METHOD™ — Sections CSS
   Homepage section styles and shared section utilities.
   Referenced by method.html for structural consistency
   with the full site stylesheet chain.
   ============================================================ */

/* --- Shared section utilities --- */

.section__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 40px;
}

.section__label {
  font-family: 'DM Sans', sans-serif;
  font-weight: 700;
  font-size: 0.6875rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #C9A227;
  margin: 0 0 16px;
}

.section__cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: 'DM Sans', sans-serif;
  font-weight: 600;
  font-size: 0.875rem;
  letter-spacing: 0.06em;
  color: #C9A227;
  text-decoration: none;
  margin-top: 40px;
  transition: gap 0.2s ease, color 0.2s ease;
}

.section__cta:hover {
  color: #FFFFFF;
  gap: 14px;
}

/* --- S2 The Problem --- */

.s2__opener {
  font-family: 'League Spartan', 'DM Sans', sans-serif;
  font-weight: 700;
  font-size: clamp(1.5rem, 3vw, 2.25rem);
  color: #FFFFFF;
  line-height: 1.25;
  margin: 0 0 48px;
  max-width: 720px;
}

.s2__statements {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin-bottom: 48px;
}

.s2__statement {
  font-family: 'DM Sans', sans-serif;
  font-weight: 400;
  font-size: 1rem;
  color: rgba(255, 255, 255, 0.65);
  line-height: 1.7;
  padding: 24px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.s2__statement:first-child {
  border-top: 1px solid rgba(64, 4, 93, 0.3);
}

.s2__pivot {
  font-family: 'DM Sans', sans-serif;
  font-weight: 700;
  font-size: 1rem;
  color: #FFFFFF;
  line-height: 1.6;
}

/* --- S3 Method Statement --- */

.method-statement {
  background-color: #1B0328;
  padding: 96px 0;
}

.method-statement__positioning {
  font-family: 'DM Sans', sans-serif;
  font-weight: 600;
  font-size: 1rem;
  color: rgba(255, 255, 255, 0.6);
  letter-spacing: 0.02em;
  margin: 0 0 56px;
}

.method-statement__doctrines {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 48px;
}

.method-statement__doctrine-title {
  font-family: 'League Spartan', 'DM Sans', sans-serif;
  font-weight: 700;
  font-size: 1.125rem;
  color: #FFFFFF;
  margin: 0 0 12px;
}

.method-statement__doctrine-body {
  font-family: 'DM Sans', sans-serif;
  font-weight: 400;
  font-size: 0.9375rem;
  color: rgba(255, 255, 255, 0.65);
  line-height: 1.7;
  margin: 0;
}

/* --- S4 Alignment Framework --- */

.alignment-framework {
  background-color: #0B0B0D;
  padding: 96px 0;
}

.alignment-framework__source {
  font-family: 'DM Sans', sans-serif;
  font-weight: 700;
  font-size: 0.6875rem;
  letter-spacing: 0.2em;
  color: rgba(255, 255, 255, 0.3);
  margin: 0 0 24px;
}

.alignment-framework__statement {
  font-family: 'DM Sans', sans-serif;
  font-weight: 400;
  font-size: 1rem;
  color: rgba(255, 255, 255, 0.6);
  line-height: 1.75;
  max-width: 640px;
  margin: 0 0 56px;
}

.alignment-framework__phases {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2px;
  margin-bottom: 48px;
}

.alignment-framework__phase {
  background-color: #1B0328;
  padding: 32px 28px 36px;
  border-top: 2px solid #40045D;
}

.alignment-framework__phase-num {
  display: block;
  font-family: 'DM Sans', sans-serif;
  font-weight: 700;
  font-size: 0.6875rem;
  color: #C9A227;
  letter-spacing: 0.1em;
  margin-bottom: 12px;
}

.alignment-framework__phase-name {
  font-family: 'DM Sans', sans-serif;
  font-weight: 700;
  font-size: 0.9375rem;
  color: #FFFFFF;
  letter-spacing: 0.06em;
  margin: 0 0 10px;
}

.alignment-framework__phase-function {
  font-family: 'DM Sans', sans-serif;
  font-weight: 400;
  font-size: 0.875rem;
  color: rgba(255, 255, 255, 0.6);
  line-height: 1.6;
  margin: 0;
}

/* --- S5 Proof Preview --- */

.proof-preview {
  background-color: #161418;
  padding: 96px 0;
}

.proof-preview__heading {
  font-family: 'League Spartan', 'DM Sans', sans-serif;
  font-weight: 700;
  font-size: clamp(1.5rem, 3vw, 2.25rem);
  color: #FFFFFF;
  line-height: 1.2;
  margin: 0 0 24px;
}

.proof-preview__context {
  font-family: 'DM Sans', sans-serif;
  font-weight: 400;
  font-size: 1rem;
  color: rgba(255, 255, 255, 0.65);
  line-height: 1.75;
  max-width: 680px;
  margin: 0 0 56px;
}

.proof-preview__metrics {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2px;
  margin-bottom: 48px;
}

.proof-preview__metric {
  background-color: #0B0B0D;
  padding: 32px 28px 36px;
}

.proof-preview__figure {
  display: block;
  font-family: 'League Spartan', 'DM Sans', sans-serif;
  font-weight: 700;
  font-size: 2.5rem;
  color: #C9A227;
  line-height: 1;
  margin-bottom: 12px;
}

.proof-preview__stat {
  font-family: 'DM Sans', sans-serif;
  font-weight: 700;
  font-size: 0.875rem;
  color: #FFFFFF;
  margin: 0 0 8px;
}

.proof-preview__narrative {
  font-family: 'DM Sans', sans-serif;
  font-weight: 400;
  font-size: 0.8125rem;
  color: rgba(255, 255, 255, 0.55);
  line-height: 1.55;
  margin: 0;
}

.proof-preview__voices {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-bottom: 32px;
}

.proof-preview__voice {
  font-family: 'DM Sans', sans-serif;
  font-weight: 400;
  font-size: 0.9375rem;
  color: rgba(255, 255, 255, 0.65);
  line-height: 1.6;
  font-style: italic;
  padding-left: 20px;
  border-left: 2px solid rgba(64, 4, 93, 0.6);
}

.proof-preview__footnote {
  font-family: 'DM Sans', sans-serif;
  font-weight: 400;
  font-size: 0.875rem;
  color: rgba(255, 255, 255, 0.45);
  line-height: 1.7;
  margin: 0 0 40px;
  max-width: 640px;
}

/* --- S6 Product Routing --- */

.product-routing {
  background-color: #0B0B0D;
  padding: 96px 0;
}

.product-routing__heading {
  font-family: 'League Spartan', 'DM Sans', sans-serif;
  font-weight: 700;
  font-size: clamp(1.5rem, 3vw, 2.25rem);
  color: #FFFFFF;
  line-height: 1.2;
  margin: 0 0 16px;
}

.product-routing__subhead {
  font-family: 'DM Sans', sans-serif;
  font-weight: 400;
  font-size: 1rem;
  color: rgba(255, 255, 255, 0.6);
  line-height: 1.7;
  margin: 0 0 56px;
}

.product-routing__cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2px;
  margin-bottom: 32px;
}

.product-routing__card {
  background-color: #1B0328;
  border-top: 2px solid rgba(64, 4, 93, 0.5);
  padding: 36px 32px 40px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.product-routing__card-num {
  font-family: 'DM Sans', sans-serif;
  font-weight: 700;
  font-size: 0.6875rem;
  color: #C9A227;
  letter-spacing: 0.1em;
}

.product-routing__card-name {
  font-family: 'DM Sans', sans-serif;
  font-weight: 700;
  font-size: 1rem;
  color: #FFFFFF;
  line-height: 1.4;
}

.product-routing__card-note {
  font-family: 'DM Sans', sans-serif;
  font-weight: 400;
  font-size: 0.8125rem;
  color: rgba(255, 255, 255, 0.45);
}

.product-routing__card-price {
  font-family: 'DM Sans', sans-serif;
  font-weight: 700;
  font-size: 1.25rem;
  color: #FFFFFF;
  margin-top: auto;
}

.product-routing__card-cta {
  font-family: 'DM Sans', sans-serif;
  font-weight: 700;
  font-size: 0.8125rem;
  letter-spacing: 0.06em;
  color: #C9A227;
  text-decoration: none;
  transition: color 0.2s ease;
}

.product-routing__card-cta:hover {
  color: #FFFFFF;
}

.product-routing__pipeline {
  background-color: #161418;
  padding: 20px 32px;
  border-left: 2px solid rgba(201, 162, 39, 0.25);
}

.product-routing__pipeline-label {
  font-family: 'DM Sans', sans-serif;
  font-weight: 400;
  font-size: 0.875rem;
  color: rgba(255, 255, 255, 0.4);
  letter-spacing: 0.04em;
}

/* --- Mobile --- */

@media (max-width: 768px) {
  .section__inner {
    padding: 0 24px;
  }

  .method-statement__doctrines {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .alignment-framework__phases {
    grid-template-columns: 1fr;
  }

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

  .product-routing__cards {
    grid-template-columns: 1fr;
  }
}


/* ============================================================
   Homepage-only background distribution pass
   Scope: major homepage background surfaces only.
   Preserves copy, layout, typography, forms, routes, and behavior.
   ============================================================ */

body.home-page {
  background-color: #0E0115;
}

.home-page .hero {
  background: linear-gradient(155deg, #40045D 0%, #240436 42%, #0E0115 78%, #0B0B0D 100%);
}

.home-page #main-content > section:nth-of-type(2) {
  background-color: #14021F;
}

.home-page .method-statement {
  background-color: #240436;
}

.home-page .alignment-framework {
  background-color: #0E0115;
}

.home-page .alignment-framework__phase {
  background-color: #1B0328;
}

.home-page .proof-preview {
  background-color: #2C0442;
}

.home-page .proof-preview__metric {
  background-color: #14021F;
}

.home-page .product-routing {
  background-color: #14021F;
}

.home-page .product-routing__card {
  background-color: #240436;
}

.home-page .product-routing__pipeline {
  background-color: #0E0115;
}

.home-page .email-capture {
  background-color: #40045D;
}

.home-page .founder-strip {
  background-color: #0E0115;
}


/* Homepage progression visibility */
.homepage-progression {
  background: #0B0B0D;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.homepage-progression__steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  margin-top: 28px;
}

.homepage-progression__step {
  padding: 28px;
  background: rgba(255, 255, 255, 0.035);
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.homepage-progression__step-title {
  margin: 0 0 12px;
  font-family: 'DM Sans', sans-serif;
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #C9A227;
}

.homepage-progression__step-body {
  margin: 0;
  font-family: 'DM Sans', sans-serif;
  font-size: 1rem;
  line-height: 1.7;
  color: rgba(255, 255, 255, 0.76);
}

.homepage-progression__support {
  max-width: 760px;
  margin: 30px 0 0;
  font-family: 'DM Sans', sans-serif;
  font-size: 1.05rem;
  line-height: 1.7;
  color: rgba(255, 255, 255, 0.74);
}

@media (max-width: 900px) {
  .homepage-progression__steps {
    grid-template-columns: 1fr;
  }
}