/* ==========================================================================
   MCOGL — Home (reconsidered composition)
   Credibility early → products → model → dual audience → one close.
   ========================================================================== */

.mc-home-kicker {
  display: block;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  font-size: 0.7rem;
  color: var(--mc-blue-600);
  margin-bottom: var(--space-3);
}
.mc-home-kicker--dark { color: var(--mc-blue-600); }
.mc-dark .mc-home-kicker,
.mc-counterflow .mc-home-kicker { color: var(--mc-blue-300); }

.mc-home-footlink {
  margin-top: var(--space-7);
  margin-bottom: 0;
}

/* ---- Hero ---------------------------------------------------------------- */
.mc-hero {
  min-height: min(94dvh, 880px);
}
.mc-hero__media img {
  object-position: 50% 36%;
  transform: scale(1.03);
}
.mc-hero .mc-eyebrow { color: var(--mc-blue-300); }
.mc-hero h1 {
  text-shadow: 0 16px 48px rgba(8, 12, 17, 0.5);
  max-width: 15ch;
}
.mc-hero__content {
  max-width: 52ch;
  padding-bottom: var(--space-5);
}
.mc-hero__lede {
  max-width: 42ch;
}

.mc-hero__proof {
  list-style: none;
  margin: var(--space-8) 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
}
.mc-hero__proof li {
  margin: 0;
  padding: 0.5rem 0.85rem;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: var(--radius);
  background: rgba(8, 12, 17, 0.45);
  backdrop-filter: blur(10px);
}
.mc-hero__proof .mc-mono {
  color: var(--mc-on-dark);
  font-size: 0.7rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.mc-hero__proof li::marker { content: none; }

/* ---- Strip --------------------------------------------------------------- */
.mc-strip {
  background: var(--mc-ink-950);
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}
.mc-strip__inner {
  gap: var(--space-4) var(--space-7);
}
.mc-strip__reg {
  color: var(--mc-blue-300);
  order: -1;
}
@media (min-width: 900px) {
  .mc-strip__reg { order: 0; }
}

/* ---- Specs early --------------------------------------------------------- */
.mc-home-specs .mc-section-head { margin-bottom: var(--space-7); }
.mc-home-specs .mc-section-head h2 { max-width: 22ch; }
.mc-specproof { display: grid; gap: var(--space-5); }
@media (min-width: 900px) {
  .mc-specproof { grid-template-columns: repeat(3, 1fr); }
}
.mc-home-specs .mc-spec {
  height: 100%;
  transition: transform var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease);
}
.mc-home-specs .mc-spec:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-1);
}

/* ---- Three pillars ------------------------------------------------------- */
.mc-home-pillars__grid {
  display: grid;
  gap: var(--space-5);
}
@media (min-width: 800px) {
  .mc-home-pillars__grid { grid-template-columns: repeat(3, 1fr); gap: var(--space-6); }
}
.mc-home-pillar {
  padding: var(--space-6);
  background: var(--mc-white);
  border: 1px solid var(--mc-rule);
  border-radius: var(--radius);
  border-top: 3px solid var(--mc-blue-600);
  min-height: 100%;
}
.mc-home-pillar:first-child { border-top-color: var(--mc-red-500); }
.mc-home-pillar__n {
  display: block;
  color: var(--mc-blue-600);
  letter-spacing: 0.12em;
  font-size: 0.7rem;
  margin-bottom: var(--space-4);
}
.mc-home-pillar:first-child .mc-home-pillar__n { color: var(--mc-red-500); }
.mc-home-pillar h3 {
  font-size: 1.25rem;
  margin-bottom: var(--space-3);
  letter-spacing: -0.02em;
}
.mc-home-pillar p {
  margin: 0;
  color: var(--mc-slate);
  font-size: 0.95rem;
  max-width: 32ch;
  line-height: 1.6;
}

/* ---- Products ------------------------------------------------------------ */
.mc-home-products__head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--space-5) var(--space-7);
  margin-bottom: var(--space-7);
}
.mc-home-products__head h2 {
  max-width: 16ch;
  margin-bottom: var(--space-3);
}
.mc-home-products__head .mc-lede { margin-bottom: 0; max-width: 42ch; }
.mc-home-products__grid {
  display: grid;
  gap: var(--space-5);
}
@media (min-width: 640px) {
  .mc-home-products__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1100px) {
  .mc-home-products__grid { grid-template-columns: repeat(3, 1fr); gap: var(--space-6); }
  .mc-home-products__grid > :last-child:nth-child(5) {
    grid-column: 2;
  }
}
.mc-home-products .mc-product__media {
  border-bottom-left-radius: var(--radius-arc);
}
@media (max-width: 640px) {
  .mc-home-products .mc-product__media { border-bottom-left-radius: 48px; }
}

/* ---- Custody rail -------------------------------------------------------- */
.mc-home-rail .mc-section-head h2 { max-width: 20ch; }
@media (min-width: 900px) {
  .mc-home .mc-rail--h {
    gap: var(--space-4);
    padding: var(--space-7) var(--space-5) var(--space-5);
    background: var(--mc-bone);
    border-radius: var(--radius);
    border: 1px solid var(--mc-rule);
  }
  .mc-home .mc-rail--h::before {
    left: var(--space-5);
    right: var(--space-5);
    top: calc(var(--space-7) + 4px);
    height: 1.5px;
    background: linear-gradient(90deg, var(--mc-blue-600), var(--mc-blue-500) 65%, var(--mc-red-500));
    opacity: 0.55;
  }
  .mc-home .mc-rail--h .mc-rail__step::before {
    width: 11px;
    height: 11px;
    box-shadow: 0 0 0 4px var(--mc-bone), 0 0 0 5.5px var(--mc-blue-600);
  }
}
.mc-home .mc-rail--h .mc-rail__step h3 { font-size: 1rem; margin-bottom: var(--space-2); }
.mc-home .mc-rail--h .mc-rail__step p {
  font-size: 0.875rem;
  line-height: 1.55;
  max-width: 22ch;
}
.mc-home .mc-rail__n {
  font-weight: 500;
  color: var(--mc-red-500);
  letter-spacing: 0.14em;
}

/* ---- Pull statement: dark, sparse, centered in the band ---------------- */
.mc-home-pull {
  padding-block: clamp(4.5rem, 9vw, 7rem);
}
.mc-home-pull__grid {
  display: grid;
  gap: var(--space-6);
  align-items: start;
  max-width: 48rem;
  margin-inline: auto;
  text-align: center;
  justify-items: center;
}
@media (min-width: 900px) {
  .mc-home-pull__grid {
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.95fr);
    gap: var(--space-8);
    align-items: center;
    text-align: left;
    justify-items: stretch;
    max-width: 52rem;
  }
}
.mc-home-pull__primary {
  position: relative;
  padding-left: clamp(1.15rem, 2.5vw, 1.75rem);
  text-align: left; /* rule sits left of quote even when grid is centered */
  max-width: 22rem;
}
@media (min-width: 900px) {
  .mc-home-pull__primary {
    max-width: none;
  }
}
.mc-home-pull__rule {
  position: absolute;
  left: 0;
  top: 0.15em;
  bottom: 0.15em;
  width: 3px;
  background: var(--mc-red-500);
  border-radius: 1px;
}
.mc-home-pull__quote {
  margin: 0;
  padding: 0;
  border: 0;
}
.mc-home-pull__quote p {
  margin: 0;
  font-family: var(--ff-serif);
  font-style: italic;
  font-size: clamp(1.7rem, 3.2vw, 2.45rem);
  line-height: 1.22;
  letter-spacing: -0.02em;
  color: #fff;
  max-width: 17ch;
}
.mc-home-pull__secondary {
  max-width: 26rem;
}
@media (max-width: 899px) {
  .mc-home-pull__secondary {
    text-align: center;
  }
  .mc-home-pull__body {
    margin-inline: auto;
  }
  .mc-home-pull__link {
    display: flex;
    justify-content: center;
  }
}
.mc-home-pull__body {
  margin: 0 0 var(--space-5);
  max-width: 34ch;
  font-size: 1.05rem;
  line-height: 1.65;
  color: var(--mc-on-dark);
}
.mc-home-pull__link {
  margin: 0;
}
.mc-home-pull__link .mc-link-arrow {
  color: var(--mc-blue-300);
  font-size: 0.95rem;
}
.mc-home-pull__link .mc-link-arrow:hover {
  color: #fff;
}

/* ---- Dual audience ------------------------------------------------------- */
.mc-home-dual .mc-section-head h2 { max-width: 18ch; color: #fff; }
.mc-home-dual__grid {
  display: grid;
  gap: var(--space-7);
}
@media (min-width: 900px) {
  .mc-home-dual__grid {
    grid-template-columns: 1fr 1fr;
    gap: var(--space-8);
  }
}
.mc-home-dual__side {
  padding: var(--space-6) var(--space-6) var(--space-7);
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid var(--mc-ink-700);
  border-radius: var(--radius);
  border-top: 3px solid var(--mc-red-500);
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  min-height: 100%;
}
.mc-home-dual__side--buyers {
  border-top-color: var(--mc-blue-300);
}
.mc-home-dual__label {
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-size: 0.68rem;
  color: var(--mc-on-dark-2);
}
.mc-home-dual__side--producers .mc-home-dual__label {
  color: #ffb4b8; /* light red for dark field */
}
.mc-home-dual__side--buyers .mc-home-dual__label {
  color: var(--mc-blue-300);
}
.mc-home-dual__side .mc-qlist {
  flex: 1;
  margin: 0;
}
.mc-home-dual__side .mc-qlist li {
  border-color: var(--mc-ink-700);
  color: var(--mc-on-dark);
}
.mc-home-dual__side .mc-qlist li::before { background: var(--mc-red-500); }
.mc-home-dual__side--buyers .mc-qlist li::before { background: var(--mc-blue-300); }

/*
 * Buttons on dark dual cards: ghost was too weak.
 * Producers = solid brand red (primary).
 * Buyers = solid light fill (max contrast on graphite).
 */
.mc-home-dual__btn {
  align-self: stretch;
  justify-content: center;
  margin-top: auto;
  min-height: 52px;
  width: 100%;
  letter-spacing: 0.02em;
  font-variation-settings: 'wdth' var(--wd-normal), 'wght' 600;
  box-shadow: none;
}
.mc-home-dual__side--producers .mc-home-dual__btn.mc-btn--primary {
  background: var(--mc-red-500);
  border-color: var(--mc-red-500);
  color: #fff;
}
.mc-home-dual__side--producers .mc-home-dual__btn.mc-btn--primary:hover {
  background: #ff2a33;
  border-color: #ff2a33;
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(237, 27, 36, 0.35);
}
.mc-home-dual__btn--light {
  background: #fff;
  border-color: #fff;
  color: var(--mc-ink-900);
}
.mc-home-dual__btn--light:hover {
  background: var(--mc-blue-300);
  border-color: var(--mc-blue-300);
  color: var(--mc-ink-950);
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(143, 184, 236, 0.25);
}
.mc-home-dual__btn .mc-btn__chev,
.mc-home-dual__btn svg {
  flex: none;
  width: 16px;
  height: 16px;
  transition: transform var(--dur-fast) var(--ease);
}
.mc-home-dual__btn:hover .mc-btn__chev,
.mc-home-dual__btn:hover svg {
  transform: translateX(3px);
}
@media (min-width: 640px) {
  .mc-home-dual__btn {
    width: auto;
    align-self: flex-start;
    min-width: 13.5rem;
    padding-inline: 1.5rem;
  }
}

/* ---- Signals + markets cue ----------------------------------------------- */
.mc-home-signals .mc-signals {
  display: grid;
  gap: var(--space-6);
  margin-bottom: var(--space-8);
}
@media (min-width: 900px) {
  .mc-home-signals .mc-signals {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-8);
  }
}
.mc-home-signals .mc-signal {
  padding: var(--space-4) 0 var(--space-4) var(--space-5);
  border-left: 1px solid var(--mc-rule);
  position: relative;
}
.mc-home-signals .mc-signal::before {
  content: '';
  position: absolute;
  left: -1px;
  top: var(--space-4);
  width: 1px;
  height: 24px;
  background: var(--mc-red-500);
}
.mc-home-signals .mc-signal .mc-mono {
  color: var(--mc-blue-600);
  display: block;
  margin-bottom: var(--space-3);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-size: 0.72rem;
}
.mc-home-signals .mc-signal p {
  margin: 0;
  font-size: 0.9rem;
  color: var(--mc-slate);
  max-width: 34ch;
}

.mc-home-markets-cue {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3) var(--space-5);
  margin: 0;
  padding-top: var(--space-6);
  border-top: 1px solid var(--mc-rule);
  font-size: 0.95rem;
  color: var(--mc-slate);
  max-width: none;
}
.mc-home-markets-cue .mc-mono {
  color: var(--mc-blue-600);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-size: 0.68rem;
}

/* ---- Rhythm -------------------------------------------------------------- */
.mc-home .mc-section-head h2 { max-width: 22ch; }

@media (max-width: 640px) {
  .mc-hero__actions { width: 100%; }
  .mc-hero__actions .mc-btn {
    flex: 1 1 auto;
    justify-content: center;
  }
  .mc-home-products__head .mc-btn { width: 100%; justify-content: center; }
}