/* Co Labs — Moss theme
   Futuristic + ancient-wisdom: warm charcoal darks, almond-cream lights,
   antique-gold / gilded-olive accent, plus warm grain, ambient blooms,
   and gold section numbers + gold "co" typography.
   Everything is scoped to .theme-moss. */

/* ---- 1 & 2 · Palette: warm the darks, warm the lights ---- */
.co-page.theme-moss {
  --night: #171b12;        /* dark MOSS charcoal — green-based, not brown/dirt */
  --panel: #1e2318;        /* raised mossy panel */
  --ink:   #1a1e15;        /* deep moss-ink for text on milk */
  --bone:  #edebe3;        /* milk text on dark */
  --paper: #f2f1ec;        /* soft MILK — clean, modern, no yellow cast */
  --muted: #64695a;        /* muted sage */
  --accent:     #9a821a;   /* antique gold — accent ON dark (gilded-moss pairing) */
  --accent-ink: #5f5a10;   /* deep olive-gold — accent ON milk */
  --pulse:      #a34a35;   /* human warmth — used sparingly */
  --pulse-light:#d4775d;   /* visible counterpart on dark */
  --rule:       #55530a;   /* olive-gold — structural rules */
  --line-dark:  rgba(26, 30, 21, .18);
  --line-light: rgba(237, 235, 227, .18);
}

/* Grain dialed to a whisper: felt, not seen — never "a look". Set to 0 to remove. */
.co-page.theme-moss::after { opacity: .03; mix-blend-mode: soft-light; }

/* ---- 4 · Texture & light: ambient blooms ---- */
/* Hero: cold particle wash -> slow warm gold + moss bloom (ancient-future lamp light) */
.theme-moss .resonance-stage::after {
  background:
    radial-gradient(85% 62% at 50% 22%, rgba(96, 112, 60, .16), transparent 74%),   /* rich moss glow (replaces the pink) */
    radial-gradient(65% 58% at 80% 90%, rgba(154, 130, 26, .10), transparent 74%),  /* whisper of gold */
    radial-gradient(55% 55% at 14% 82%, rgba(62, 83, 71, .13), transparent 72%),    /* deep forest moss */
    rgba(20, 23, 15, .05);
}
/* Dark section 02: a single soft glow so the headline feels lit, not flat */
.theme-moss .shape-section {
  background:
    radial-gradient(58% 42% at 22% 22%, rgba(96, 112, 60, .12), transparent 68%),
    #1d2316;
}
/* Ensemble bridge: lift the street scene and localize contrast behind the copy.
   Kept darker than Technology above it so the two dark cards read as separate. */
.theme-moss .ensemble-bridge { background: #10140d; }
.theme-moss .ensemble-bridge__veil {
  width: 100%;
  background:
    linear-gradient(90deg, rgba(9, 12, 8, .94) 0%, rgba(12, 15, 10, .88) 36%, rgba(15, 18, 12, .7) 60%, rgba(15, 18, 12, .48) 100%),
    linear-gradient(180deg, rgba(9, 12, 8, .22), rgba(9, 12, 8, .38));
}
.theme-moss .ensemble-bridge__media img { filter: saturate(.8) contrast(1.03) brightness(.92) sepia(.03); }

/* ---- 5 · Typographic warmth ---- */
/* Section numbers -> warm editorial markers (gold on dark, brass on cream) */
.theme-moss .light-section .section-index,
.theme-moss .closing-kicker { color: var(--accent-ink); }
.theme-moss .shape-section .section-index,
.theme-moss .ensemble-bridge__content .section-index { color: var(--accent); }

.theme-moss .stage-tag i { background: var(--accent); box-shadow: 0 0 0 8px rgba(154, 130, 26, .18); }

/* ---- Type & spacing refinements ---- */
/* CO LABS is the logo — it should read the same wherever it appears: header and footer
   share the same open, deliberate tracking. */
.theme-moss .co-wordmark,
.theme-moss .site-footer > :first-child { letter-spacing: .42em; font-weight: 800; }

/* Hero subheader */
.theme-moss .hero-dek {
  color: rgba(237, 235, 227, .86);
  font-size: clamp(18px, 1.15vw, 19px);
  line-height: 1.5;
  max-width: 620px;
}

.theme-moss .principle-row p { color: #40473e; }

.theme-moss.co-page .arrow-link--dark {
  min-width: 132px;
  justify-content: space-between;
  padding: 8px 0 6px;
  border: 0;
  border-bottom: 1px solid rgba(26,30,21,.54);
  border-radius: 0;
  background: transparent;
  color: var(--ink);
}

/* Chapter labels (01 / OUR WORLDVIEW): a smidge bigger, easier tracking */
.theme-moss .section-index,
.theme-moss .closing-kicker { font-size: 11px; letter-spacing: .14em; }
.theme-moss .section-index { line-height: 1.4; }

/* Closing headline remains a bounded, left-aligned two-line statement. */
.theme-moss .closing-section h2 { max-width: 16ch; }

/* Ensemble bridge: bounded type and rhythm around the supplied media. */
.theme-moss .ensemble-name { margin-bottom: 30px; }
.theme-moss .ensemble-bridge__content h2 { font-size: clamp(33px, 2.55vw, 42px); line-height: 1.08; margin-bottom: .42em; }

/* Footer in our display face (Syne); CO LABS matches the header logo exactly */
.theme-moss .site-footer {
  font-family: var(--display);
  font-weight: 700;
  font-size: 13px;
  letter-spacing: .14em;
}
.theme-moss .site-footer > :first-child { font-size: 15px; }

@media (max-width: 900px) {
  .theme-moss .hero-thesis {
    bottom: 80px;
    width: calc(100vw - (var(--gutter) * 2));
  }
  .theme-moss .hero-thesis h1 { font-size: clamp(34px, 9vw, 48px); line-height: 1.06; text-wrap: balance; }
  .theme-moss .hero-dek { max-width: 40ch; font-size: 17px; line-height: 1.5; }
  .theme-moss .ensemble-bridge__veil { width: 100%; background: linear-gradient(90deg, rgba(9,12,8,.92) 0%, rgba(12,15,10,.84) 68%, rgba(15,18,12,.62) 100%); }
  .theme-moss .ensemble-bridge__content h2 { font-size: clamp(32px, 8vw, 40px); }
}

@media (max-width: 560px) {
  .theme-moss .hero-thesis { bottom: 72px; }
  .theme-moss .hero-thesis h1 { font-size: clamp(34px, 9.2vw, 42px); }
}