/* extracted from aliveness/index.html; fonts self-hosted */
@font-face { font-family: 'Outfit'; font-style: normal; font-weight: 300; font-display: swap; src: url('/assets/fonts/outfit-latin-300.woff2') format('woff2'); }
@font-face { font-family: 'Outfit'; font-style: normal; font-weight: 400; font-display: swap; src: url('/assets/fonts/outfit-latin-400.woff2') format('woff2'); }
@font-face { font-family: 'Outfit'; font-style: normal; font-weight: 500; font-display: swap; src: url('/assets/fonts/outfit-latin-500.woff2') format('woff2'); }
@font-face { font-family: 'Outfit'; font-style: normal; font-weight: 600; font-display: swap; src: url('/assets/fonts/outfit-latin-600.woff2') format('woff2'); }
@font-face { font-family: 'Outfit'; font-style: normal; font-weight: 700; font-display: swap; src: url('/assets/fonts/outfit-latin-700.woff2') format('woff2'); }
@font-face { font-family: 'Lora'; font-style: normal; font-weight: 400; font-display: swap; src: url('/assets/fonts/lora-latin-400.woff2') format('woff2'); }
@font-face { font-family: 'Lora'; font-style: normal; font-weight: 500; font-display: swap; src: url('/assets/fonts/lora-latin-500.woff2') format('woff2'); }
@font-face { font-family: 'Lora'; font-style: italic; font-weight: 400; font-display: swap; src: url('/assets/fonts/lora-latin-400-italic.woff2') format('woff2'); }


/* ── BLOCK PALETTE (clay classes → design.md) ── */
body { position: relative; }

/* Headings, titles, subtitles, labels — balanced line breaks */
:is(
  h1, h2, h3, h4, h5, h6,
  .hero-eyebrow,
  .hero-title,
  .hero-body,
  .launch-tag,
  .cards-heading,
  .scales-heading,
  .card-title,
  .quote blockquote,
  .quote cite,
  .cta-body,
  .notify-label,
  .join-band-heading,
  .join-band-body,
  .entry-title,
  .entry-excerpt,
  .journal-card h3,
  .journal-card .card-excerpt,
  .display,
  .body,
  .pillar > span:not(.pillar-icon)
) {
  text-wrap: balance;
}

#bg {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  z-index: 0;
  pointer-events: none;
}

body > header {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 30;
  display: flex;
  justify-content: stretch;
  align-items: flex-start;
  padding: 20px clamp(20px, 4vw, 56px);
  transform: translate3d(0, 0, 0);
  transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  pointer-events: none;
}
body > header > * {
  pointer-events: auto;
}
body > header.is-hidden {
  transform: translate3d(0, -100%, 0);
  pointer-events: none;
}
body > header.is-hidden > * {
  pointer-events: none;
}
body > header .header-inner {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
  max-width: var(--max-wide);
  margin: 0 auto;
  min-width: 0;
}
body > header .header-pill {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 26px;
  width: 100%;
  min-width: 0;
  transition:
    width 0.35s ease,
    padding 0.35s ease,
    background 0.35s ease,
    border-color 0.35s ease,
    box-shadow 0.35s ease,
    gap 0.35s ease;
}
body > header.is-compact .header-inner {
  justify-content: flex-end;
}
body > header.is-compact .header-pill {
  width: auto;
  max-width: calc(100vw - 2 * clamp(20px, 4vw, 56px));
  padding: 14px 18px;
  background: var(--frosted-white-focus);
  border: 1px solid var(--border-hairline);
  border-radius: 0;
  box-shadow: 0 12px 40px -24px rgba(50, 47, 43, 0.35);
  gap: 0;
}
body > header.is-compact.is-menu-open .header-pill {
  gap: 0;
  padding-left: 18px;
  padding-right: 18px;
}

body > header .header-trail {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 22px;
  margin-left: auto;
  min-width: 0;
}
body > header.is-compact .header-trail {
  gap: 0;
  margin-left: 0;
}
body > header.is-compact .brand {
  display: none;
}

body > header nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 22px;
  font-family: var(--font-sans);
  font-size: 10.5px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
body > header.is-compact nav {
  flex: 0 1 auto;
  flex-wrap: nowrap;
  min-width: 0;
  max-width: 0;
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  gap: 18px;
  margin-right: 0;
  transition:
    max-width 0.35s ease,
    opacity 0.28s ease,
    margin 0.35s ease,
    visibility 0s linear 0.35s;
}
body > header.is-compact.is-menu-open nav {
  max-width: min(40rem, calc(100vw - 12rem));
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  margin-right: 18px;
  transition:
    max-width 0.35s ease,
    opacity 0.28s ease,
    margin 0.35s ease,
    visibility 0s;
}
body > header nav a {
  color: var(--ink-mid);
  text-decoration: none;
  white-space: nowrap;
}
body > header nav a:hover,
body > header nav a[aria-current="page"] {
  color: var(--s-orange);
}
body > header nav .nav-home {
  display: none;
  line-height: 0;
  flex-shrink: 0;
}
body > header.is-compact nav .nav-home {
  display: inline-flex;
  align-items: center;
  color: var(--ink);
}
body > header.is-compact nav .nav-home[aria-current="page"],
html[nc\:path="index.html"] body > header.is-compact nav .nav-home {
  color: var(--s-orange);
}
body > header.is-compact nav .nav-home:hover {
  color: var(--s-orange);
}
body > header nav .nav-home-mark {
  display: block;
  width: 30px;
  height: 30px;
}

body > header .header-menu-toggle {
  display: none;
  position: relative;
  width: 28px;
  height: 18px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  flex-shrink: 0;
  color: var(--ink);
}
body > header.is-compact .header-menu-toggle {
  display: block;
}
body > header .header-menu-toggle span {
  position: absolute;
  right: 0;
  height: 2px;
  border-radius: 0;
  background: currentColor;
  transform-origin: right center;
  transition:
    transform 0.32s cubic-bezier(0.4, 0, 0.2, 1),
    opacity 0.22s ease,
    top 0.32s cubic-bezier(0.4, 0, 0.2, 1),
    width 0.26s cubic-bezier(0.4, 0, 0.2, 1);
}
body > header .header-menu-toggle span:nth-child(1) {
  top: 0;
  width: 58%;
}
body > header .header-menu-toggle span:nth-child(2) {
  top: 8px;
  width: 82%;
}
body > header .header-menu-toggle span:nth-child(3) {
  top: 16px;
  width: 100%;
}
body > header .header-menu-toggle[aria-expanded="true"] span:nth-child(1) {
  top: 8px;
  width: 100%;
  transform-origin: center;
  transform: rotate(45deg);
}
body > header .header-menu-toggle[aria-expanded="true"] span:nth-child(2) {
  opacity: 0;
  transform: scaleX(0);
}
body > header .header-menu-toggle[aria-expanded="true"] span:nth-child(3) {
  top: 8px;
  width: 100%;
  transform-origin: center;
  transform: rotate(-45deg);
}

.hero {
  position: relative;
  width: 100%;
  max-width: var(--max);
  margin: 0 auto;
  padding: clamp(1.25rem, 3vh, 2rem) var(--pad-x) clamp(3.25rem, 8vh, 5rem);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.hero[data-bg="cream"] { background: transparent; }
.hero[data-bg="lavender"] { background: rgba(239, 230, 244, 0.45); }
.hero[data-bg="vermillion"] { background: rgba(244, 214, 204, 0.5); }
.hero[data-layout="stacked"] {
  min-height: 100vh;
  min-height: 100dvh;
  padding-top: 7rem;
}
.hero[data-layout="stacked"] .hero-title { margin-top: auto; }
.hero[data-layout="stacked"] .hero-eyebrow:not(:empty) { margin-top: auto; }
.hero[data-layout="stacked"]:has(.hero-eyebrow:not(:empty)) .hero-title { margin-top: 0; }
.hero[data-layout="split"] {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(1.5rem, 4vw, 3rem);
  align-items: center;
  min-height: 0;
}
.hero[data-layout="centred"] {
  text-align: center;
  align-items: center;
  min-height: 0;
}
.hero[data-layout="viewport"] {
  min-height: 100vh;
  min-height: 100dvh;
  justify-content: flex-end;
  padding: clamp(60px, 10vh, 110px) var(--pad-x) clamp(50px, 8vh, 90px);
  max-width: 1200px;
}
.hero[data-layout="viewport"] .hero-title {
  margin-top: 0;
  max-width: 17ch;
  font-size: clamp(2.3rem, 5.6vw, 4.4rem);
}
.hero[data-layout="viewport"] .hero-body {
  margin-top: 0;
  max-width: 44ch;
  font-size: 1.15rem;
}
.hero[data-layout="viewport"] .rule-row {
  margin: clamp(1.25rem, 3vh, 1.75rem) 0;
}
.hero .rule-row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
.hero .rule {
  display: block;
  width: clamp(3.5rem, 8vw, 5.5rem);
  height: 2px;
  flex-shrink: 0;
  border: none;
  background-color: var(--s-orange, #ea7e00);
}
.hero-title.display.is-waiting,
.hero .rule-row.is-waiting,
.hero-body.is-waiting > p {
  opacity: 0;
  transform: translateY(14px);
}
.hero-title.display.is-visible,
.hero .rule-row.is-visible,
.hero-body.is-visible > p {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.85s cubic-bezier(0.23, 1, 0.32, 1),
              transform 0.85s cubic-bezier(0.23, 1, 0.32, 1);
}
html[nc\:editing="true"] .hero-title.display.is-waiting,
html[nc\:editing="true"] .hero .rule-row.is-waiting,
html[nc\:editing="true"] .hero-body.is-waiting > p {
  opacity: 1;
  transform: none;
}
.hero-img:not([src]),
.hero-img[src=""] { display: none; }

.hero-img[src]:not([src=""]) {
  display: block;
  width: 100%;
  max-width: min(100%, 42rem);
  height: auto;
  margin-top: clamp(2rem, 4vh, 3rem);
  object-fit: cover;
}
.hero[data-layout="split"] .hero-img[src]:not([src=""]) {
  max-width: none;
  margin-top: 0;
  grid-column: 2;
  grid-row: 1 / span 6;
  align-self: center;
}

html[nc\:editing="true"] .hero-img:not([src]),
html[nc\:editing="true"] .hero-img[src=""] {
  display: block;
  width: min(100%, 20rem);
  min-height: 7rem;
  background: rgba(255, 255, 255, 0.45);
  border: 1px dashed rgba(50, 47, 43, 0.35);
  cursor: pointer;
  object-fit: cover;
}

.hero-eyebrow {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin: 0 0 clamp(1.25rem, 3vh, 1.75rem);
  font-size: var(--fs-meta);
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--accent, var(--s-coral));
  transition: color 900ms ease;
}
.hero-eyebrow:empty { display: none; }
.hero:not([data-layout="viewport"]) .rule-row:has(.launch-tag:empty) { display: none; }
.hero .launch-tag:empty { display: none; }
.hero-eyebrow::before {
  content: '';
  display: block;
  width: clamp(3.5rem, 8vw, 5.5rem);
  height: 2px;
  flex-shrink: 0;
}

.hero-title {
  font-family: var(--font-head);
  font-size: var(--fs-display);
  font-weight: 600;
  line-height: 1.05;
  letter-spacing: 0.032em;
  color: var(--ink);
  max-width: 9em;
}

.hero-body {
  font-family: 'Lora', Georgia, serif;
  font-size: calc(var(--fs-body) * 1.05);
  font-weight: 400;
  line-height: 1.75;
  color: var(--ink-mid);
  max-width: 60ch;
  margin-top: 1rem;
}

.hero-cta,
.cta-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: clamp(2rem, 4.5vh, 2.75rem);
  font-family: var(--font-sans);
  font-size: var(--fs-meta);
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-decoration: none;
  color: #fff;
  background: linear-gradient(120deg, var(--s-orange-bright), var(--s-coral-bright));
  border: none;
  border-radius: 0;
  padding: 0.9rem 1.6rem;
  cursor: pointer;
  white-space: nowrap;
  transition: opacity 0.3s, transform 0.3s;
}
.hero-cta:hover,
.cta-btn:hover {
  opacity: 0.9;
  transform: translateY(-1px);
}

.cards {
  background: rgba(255, 255, 255, 0.4);
  border-top: 1px solid rgba(20, 28, 58, 0.1);
  padding: clamp(1.75rem, 4vh, 2.5rem) var(--pad-x) clamp(2.5rem, 6vh, 4rem);
  position: relative;
  z-index: 2;
  max-width: none;
  width: 100%;
}
.cards .cards-heading {
  font-family: var(--font-head);
  font-size: var(--fs-meta);
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-align: center;
  color: var(--ink-mid);
  margin: 0 auto clamp(1.25rem, 3vh, 1.75rem);
  max-width: var(--max);
}
.cards [nc\:blocks="cards"] {
  width: 100%;
  max-width: var(--max);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: clamp(1.25rem, 2.5vw, 2rem);
  align-items: stretch;
}

.cards [nc\:blocks="cards"] > .card {
  height: 100%;
}

.card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: clamp(0.75rem, 1.5vh, 1rem);
  width: 100%;
  position: relative;
}

.cards [nc\:blocks="cards"] > .card .card-body {
  flex: 1;
}
.card::before {
  content: '';
  width: 72px;
  height: 72px;
  flex-shrink: 0;
  border-radius: 50%;
  border: 2px solid var(--s-orange);
  box-shadow:
    inset 0 0 0 10px transparent,
    inset 0 0 0 12px var(--s-orange),
    inset 0 0 0 20px transparent,
    inset 0 0 0 22px var(--s-orange);
  opacity: 0.9;
}
.card:has(.icon)::before { display: none; }
.cards-heading[hidden] { display: none !important; }
.icon { display: flex; align-items: center; justify-content: center; }
.icon svg { display: none; width: 100%; height: 100%; color: var(--accent, var(--s-coral)); transition: color 900ms ease; }
.icon[data-icon="rings-breath"] svg[data-glyph="rings-breath"],
.icon[data-icon="beam-rays"] svg[data-glyph="beam-rays"],
.icon[data-icon="resonance"] svg[data-glyph="resonance"],
.icon[data-icon="disperse"] svg[data-glyph="disperse"] { display: block; }
.card-title {
  font-family: var(--font-head);
  font-size: var(--fs-meta);
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink);
  line-height: 1.4;
  min-height: 0;
  max-width: none;
}
.card-body:empty,
.card-body p:empty { display: none; }

.quote {
  max-width: var(--max);
  margin: 0 auto;
  padding: clamp(2rem, 5vh, 4rem) var(--pad-x);
}
.quote blockquote {
  font-family: 'Lora', Georgia, serif;
  font-size: var(--fs-head);
  font-weight: 400;
  line-height: 1.4;
  color: var(--ink);
}
.quote cite {
  display: block;
  margin-top: 1rem;
  font-family: var(--font-sans);
  font-size: var(--fs-meta);
  font-style: normal;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-mid);
}

.cta-block {
  max-width: var(--max);
  margin: 0 auto;
  padding: clamp(2rem, 5vh, 4rem) var(--pad-x);
}
.cta-block h2 {
  font-family: var(--font-head);
  font-size: var(--fs-head);
  font-weight: 600;
  color: var(--ink);
}
.cta-body {
  font-family: 'Lora', Georgia, serif;
  color: var(--ink-mid);
  line-height: 1.75;
  max-width: 40ch;
  margin-top: 0.75rem;
}

.journal-card {
  max-width: var(--max);
  margin: 0 auto;
  padding: 1.25rem var(--pad-x);
}
main > h1 {
  max-width: var(--max);
  margin: 0 auto;
  padding: clamp(40px, 8vh, 80px) var(--pad-x) 0;
  font-weight: 200;
  font-size: clamp(1.7rem, 3.4vw, 2.8rem);
}
.alive-lede {
  max-width: var(--max);
  margin: 0 auto;
  padding: 16px var(--pad-x) 28px;
  font-family: var(--font-serif);
  font-size: 1.06rem;
  line-height: 1.82;
  color: var(--ink-mid);
}
.journal-card h3 {
  font-family: var(--font-head);
  font-size: var(--fs-head);
  font-weight: 600;
}
.journal-card a { color: var(--ink); text-decoration: none; }
.journal-card a:hover { color: var(--s-orange); }
.journal-card time {
  display: block;
  margin: 0.35rem 0;
  font-size: var(--fs-meta);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-light);
}
.journal-card .card-excerpt {
  font-family: 'Lora', Georgia, serif;
  color: var(--ink-mid);
  line-height: 1.75;
}

.entry-hero:not([src]),
.entry-hero[src=""] { display: none; }
.entry-hero[src]:not([src=""]) {
  display: block;
  width: 100%;
  max-width: var(--max);
  height: auto;
  margin: 1.5rem auto;
  object-fit: cover;
}
html[nc\:editing="true"] .entry-hero:not([src]),
html[nc\:editing="true"] .entry-hero[src=""] {
  display: block;
  width: min(100%, 20rem);
  min-height: 7rem;
  background: rgba(255, 255, 255, 0.45);
  border: 1px dashed rgba(50, 47, 43, 0.35);
  cursor: pointer;
}

body > footer {
  position: relative;
  z-index: 2;
  padding: clamp(2.5rem, 5vw, 3.75rem) var(--pad-x) clamp(1.75rem, 3vw, 2.25rem);
  font-size: 0.8125rem;
  color: var(--ink-mid);
}

.site-footer-inner {
  display: grid;
  grid-template-columns: minmax(10rem, 1fr) minmax(0, 2.4fr) minmax(9rem, 0.85fr);
  align-items: stretch;
  gap: clamp(1.5rem, 4vw, 3rem);
  max-width: var(--max-wide);
  margin: 0 auto;
}

.footer-brand-block {
  display: flex;
  flex-direction: column;
  max-width: 16rem;
}

.footer-brand {
  display: inline-flex;
  align-items: center;
  gap: 0.7rem;
  color: var(--ink);
  text-decoration: none;
}
.footer-brand:hover { color: var(--ink); }

.footer-brand-tagline {
  margin: 0.85rem 0 0;
  max-width: 28ch;
  font-family: var(--font-serif, 'Lora', Georgia, serif);
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--ink-mid);
}

.footer-brand-mark {
  flex-shrink: 0;
  width: 1.75rem;
  height: 1.75rem;
  color: var(--s-orange);
}

.footer-brand-text {
  display: block;
  font-size: 0.625rem;
  font-weight: 500;
  line-height: 1.28;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.footer-brand-text b {
  display: block;
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.06em;
}

.footer-nav {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1rem, 3vw, 2.5rem);
}

.footer-col-heading {
  margin: 0 0 0.875rem;
  font-size: 0.625rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink-light);
}

.footer-col-links {
  display: grid;
  gap: 0.55rem;
}

.footer-col-links a,
.footer-social-link {
  color: inherit;
  text-decoration: none;
}
.footer-col-links a:hover {
  color: var(--ink);
}

.footer-aside {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: space-between;
  justify-self: end;
  align-self: stretch;
  min-height: 100%;
}

.footer-social {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.85rem;
}

.footer-social-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 1.35rem;
  height: 1.35rem;
  color: var(--ink-light);
  transition: color 0.15s ease;
}
.footer-social-link:hover {
  color: var(--ink-mid);
}
.footer-social-link svg,
.footer-social-link .footer-social-icon {
  display: none;
  width: 100%;
  height: 100%;
}
.footer-social-link[data-platform="linkedin"] svg[data-icon="linkedin"] {
  width: 84%;
  height: 84%;
}
.footer-social-link[data-platform="instagram"] svg[data-icon="instagram"],
.footer-social-link[data-platform="linkedin"] svg[data-icon="linkedin"],
.footer-social-link[data-platform="youtube"] svg[data-icon="youtube"],
.footer-social-link[data-platform="email"] svg[data-icon="email"] {
  display: block;
}

.footer-copy {
  margin: 0;
  margin-top: auto;
  font-size: 0.75rem;
  color: var(--ink-light);
  text-align: right;
}

@media (max-width: 900px) {
  .site-footer-inner {
    grid-template-columns: 1fr 1fr;
  }
  .footer-brand-block {
    grid-column: 1 / -1;
    max-width: none;
  }
  .footer-aside {
    grid-column: 1 / -1;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    justify-self: stretch;
    min-height: auto;
  }
  .footer-social {
    justify-content: flex-start;
  }
  .footer-copy {
    text-align: left;
  }
}

@media (max-width: 640px) {
  .site-footer-inner {
    grid-template-columns: 1fr;
  }
  .footer-nav {
    grid-template-columns: 1fr 1fr;
  }
  .footer-nav .footer-col:last-child {
    grid-column: 1 / -1;
  }
}

@media (max-width: 900px) {
  .cards:not([data-band="veil"]) [nc\:blocks="cards"] { grid-template-columns: repeat(2, 1fr); row-gap: 2rem; }
  .cards[data-band="veil"] [nc\:blocks="cards"] { grid-template-columns: repeat(2, 1fr); }
  .hero[data-layout="split"] { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .hero[data-layout="stacked"] { padding-top: 9.5rem; }
  body > header:not(.is-compact) .header-pill { flex-direction: column; align-items: flex-start; }
  body > header.is-compact .header-pill { padding: 12px 14px; }
  body > header.is-compact.is-menu-open nav { max-width: min(28rem, calc(100vw - 9rem)); }
  .cards:not([data-band="veil"]) [nc\:blocks="cards"] { grid-template-columns: 1fr; row-gap: 2.5rem; }
  .cards[data-band="veil"] [nc\:blocks="cards"] { grid-template-columns: 1fr; }
  .cards[data-band="veil"] .card:not(:has(.icon)):has(.card-media) {
    grid-template-columns: 1fr;
  }
  .cards[data-band="veil"] .card:not(:has(.icon)) .card-media {
    border-right: 0;
    border-bottom: 1px solid var(--border-hairline);
    aspect-ratio: 16 / 10;
    min-height: auto;
  }
}

.nc-derived { }


  :root {
    --font-sans: 'Outfit', sans-serif;
    --font-head: var(--font-sans);
    --cream: #f4e3d6;
    --cream-deep: #efd9c8;
    --ink: #322f2b;
    --ink-mid: #55534f;
    --ink-light: #96908a;
    /* Palette: brand orange, coral, dusty pink, charcoal */
    --s-peach: #f4e3d6;
    --s-orange: #ea7e00;
    --s-orange-bright: #ff9a2e;
    --s-coral: #e2694c;
    --s-coral-bright: #f77e63;
    --s-pink: #c15789;
    --s-pink-bright: #d478a2;
    --s-charcoal: #55534f;
    --spectrum: linear-gradient(90deg,
      var(--s-orange) 0%,
      var(--s-coral) 32%,
      var(--s-pink) 68%,
      var(--s-charcoal) 100%);
    --cta-gradient: linear-gradient(120deg, var(--s-orange-bright), var(--s-coral-bright));
    --frosted-white: rgba(255, 255, 255, 0.69);
    --frosted-white-focus: rgba(255, 255, 255, 0.85);
    --pillars-veil: rgba(255, 255, 255, 0.4);
    --band-min-height: clamp(640px, 78vh, 820px);
    --border-hairline: rgba(20, 28, 58, 0.1);
    --accent: var(--s-coral);
    --accent-mark: var(--s-orange);
    --accent-on: var(--cream);
    --e-freeze: #afc8d0;
    --e-freeze-rgb: 175, 200, 208;
    --e-freeze-wash: color-mix(in srgb, var(--e-freeze) 18%, transparent);
    --e-freeze-wash-soft: color-mix(in srgb, var(--e-freeze) 6%, transparent);
    --e-freeze-on: var(--ink);
    --e-freeze-dot: color-mix(in srgb, var(--e-freeze) 78%, black);
    --e-freeze-word: color-mix(in srgb, var(--e-freeze) 72%, black);
    --e-fear: #4b285f;
    --e-fear-rgb: 75, 40, 95;
    --e-fear-wash: color-mix(in srgb, var(--e-fear) 18%, transparent);
    --e-fear-wash-soft: color-mix(in srgb, var(--e-fear) 6%, transparent);
    --e-fear-on: var(--cream);
    --e-fear-dot: color-mix(in srgb, var(--e-fear) 78%, black);
    --e-fear-word: color-mix(in srgb, var(--e-fear) 72%, black);
    --e-anger: #c94b2e;
    --e-anger-rgb: 201, 75, 46;
    --e-anger-wash: color-mix(in srgb, var(--e-anger) 18%, transparent);
    --e-anger-wash-soft: color-mix(in srgb, var(--e-anger) 6%, transparent);
    --e-anger-on: var(--cream);
    --e-anger-dot: color-mix(in srgb, var(--e-anger) 78%, black);
    --e-anger-word: color-mix(in srgb, var(--e-anger) 72%, black);
    --e-shame: #b98291;
    --e-shame-rgb: 185, 130, 145;
    --e-shame-wash: color-mix(in srgb, var(--e-shame) 18%, transparent);
    --e-shame-wash-soft: color-mix(in srgb, var(--e-shame) 6%, transparent);
    --e-shame-on: var(--ink);
    --e-shame-dot: color-mix(in srgb, var(--e-shame) 78%, black);
    --e-shame-word: color-mix(in srgb, var(--e-shame) 72%, black);
    --e-guilt: #b5c43a;
    --e-guilt-rgb: 181, 196, 58;
    --e-guilt-wash: color-mix(in srgb, var(--e-guilt) 18%, transparent);
    --e-guilt-wash-soft: color-mix(in srgb, var(--e-guilt) 6%, transparent);
    --e-guilt-on: var(--ink);
    --e-guilt-dot: color-mix(in srgb, var(--e-guilt) 78%, black);
    --e-guilt-word: color-mix(in srgb, var(--e-guilt) 72%, black);
    --e-grief: #286a7a;
    --e-grief-rgb: 40, 106, 122;
    --e-grief-wash: color-mix(in srgb, var(--e-grief) 18%, transparent);
    --e-grief-wash-soft: color-mix(in srgb, var(--e-grief) 6%, transparent);
    --e-grief-on: var(--cream);
    --e-grief-dot: color-mix(in srgb, var(--e-grief) 78%, black);
    --e-grief-word: color-mix(in srgb, var(--e-grief) 72%, black);
    --e-joy: var(--s-orange);
    --e-joy-rgb: 234, 126, 0;
    --e-joy-wash: color-mix(in srgb, var(--e-joy) 18%, transparent);
    --e-joy-wash-soft: color-mix(in srgb, var(--e-joy) 6%, transparent);
    --e-joy-on: var(--ink);
    --e-joy-dot: color-mix(in srgb, var(--e-joy) 78%, black);
    --e-joy-word: color-mix(in srgb, var(--e-joy) 72%, black);
    --fs-display: clamp(2.3rem, 5.6vw, 4.4rem);
    --fs-head: clamp(1.5rem, 2.2vw + 0.85rem, 2.5rem);
    --fs-body: clamp(1rem, 0.4vw + 0.9rem, 1.15rem);
    --fs-meta: clamp(0.7rem, 0.2vw + 0.65rem, 0.8125rem);
    --font-serif: 'Lora', Georgia, serif;
    --pad-x: clamp(20px, 5vw, 64px);
    --pad-band-x: clamp(20px, 4vw, 56px);
    --max: 1200px;
    --max-wide: 1400px;
  }

  * { margin: 0; padding: 0; box-sizing: border-box; }

  input { border-radius: 0; }

  html {
    font-size: clamp(14px, 0.35vw + 12.5px, 17px);
    background: var(--cream);
  }

html[data-emotion="freeze"] { --accent: var(--e-freeze); --accent-mark: var(--e-freeze); --accent-on: var(--e-freeze-on); }
html[data-emotion="fear"] { --accent: var(--e-fear); --accent-mark: var(--e-fear); --accent-on: var(--e-fear-on); }
html[data-emotion="anger"] { --accent: var(--e-anger); --accent-mark: var(--e-anger); --accent-on: var(--e-anger-on); }
html[data-emotion="shame"] { --accent: var(--e-shame); --accent-mark: var(--e-shame); --accent-on: var(--e-shame-on); }
html[data-emotion="guilt"] { --accent: var(--e-guilt); --accent-mark: var(--e-guilt); --accent-on: var(--e-guilt-on); }
html[data-emotion="grief"] { --accent: var(--e-grief); --accent-mark: var(--e-grief); --accent-on: var(--e-grief-on); }
html[data-emotion="joy"] { --accent: var(--e-joy); --accent-mark: var(--e-joy); --accent-on: var(--e-joy-on); }
html[data-emotion="freeze"] body { background: linear-gradient(180deg, var(--e-freeze-wash) 0%, var(--e-freeze-wash-soft) 26%, var(--cream) 62%); }
html[data-emotion="fear"] body { background: linear-gradient(180deg, var(--e-fear-wash) 0%, var(--e-fear-wash-soft) 26%, var(--cream) 62%); }
html[data-emotion="anger"] body { background: linear-gradient(180deg, var(--e-anger-wash) 0%, var(--e-anger-wash-soft) 26%, var(--cream) 62%); }
html[data-emotion="shame"] body { background: linear-gradient(180deg, var(--e-shame-wash) 0%, var(--e-shame-wash-soft) 26%, var(--cream) 62%); }
html[data-emotion="guilt"] body { background: linear-gradient(180deg, var(--e-guilt-wash) 0%, var(--e-guilt-wash-soft) 26%, var(--cream) 62%); }
html[data-emotion="grief"] body { background: linear-gradient(180deg, var(--e-grief-wash) 0%, var(--e-grief-wash-soft) 26%, var(--cream) 62%); }

  body {
    font-family: var(--font-sans);
    font-size: var(--fs-body);
    font-weight: 300;
    color: var(--ink);
    background: var(--cream);
    transition: background 1100ms ease;
    overflow-x: hidden;
    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    -webkit-font-smoothing: antialiased;
  }

  main a:not(.card-cta):not(.teaser-tile):not(.hero-cta) {
    color: var(--s-coral);
    text-decoration: none;
  }
  main a:not(.card-cta):not(.teaser-tile):not(.hero-cta):hover {
    color: var(--s-orange);
  }

  .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }

  /* ── ANIMATED BACKGROUND ── */
  .page {
    position: relative;
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    min-height: 100dvh;
  }

  #bg {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
    z-index: 0;
    pointer-events: none;
  }

  /* ── PAGE FOLD ── */
  .page-fold {
    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
  }

  /* ── HERO ── */
  main {
    flex: 1;
    display: flex;
    flex-direction: column;
    position: relative;
    z-index: 2;
    min-height: 0;
    width: 100%;
    max-width: none;
    padding: 0;
  }

  .inner {
    flex: 1;
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: var(--max);
    margin: 0 auto;
    position: relative;
    z-index: 2;
    min-height: 0;
  }

  .hero-copy {
    flex: 1;
    display: flex;
    flex-direction: column;
    max-width: clamp(34rem, 48vw, 42rem);
    min-height: 0;
  }

  .brand {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    color: var(--ink);
    line-height: 0;
    flex-shrink: 0;
  }

  .brand-logo {
    display: block;
    height: clamp(40px, 5.5vw, 54px);
    width: auto;
    color: var(--ink);
  }
  body > header.is-compact .brand-logo--full {
    display: none;
  }

  .brand-logo .MARK,
  .brand-logo #MARK {
    color: var(--accent-mark, var(--s-orange));
    transition: color 900ms ease;
  }

  /* Animated word gradient — mirrors canvas edgeHueSpeed (~45s breath cycle) */
  @property --sw-a {
    syntax: '<color>';
    inherits: false;
    initial-value: #ea7e00;
  }
  @property --sw-b {
    syntax: '<color>';
    inherits: false;
    initial-value: #ea7e00;
  }
  @property --sw-c {
    syntax: '<color>';
    inherits: false;
    initial-value: #ea7e00;
  }
  @property --sw-d {
    syntax: '<color>';
    inherits: false;
    initial-value: #ea7e00;
  }
  @property --sw-e {
    syntax: '<color>';
    inherits: false;
    initial-value: #ea7e00;
  }

  .spectrum-word,
  .hero-title em,
  .emotion-prompt-title em,
  .join-band-heading em,
  .rule,
  .hero-eyebrow::before {
    --sw-a: #ea7e00;
    --sw-b: #ea7e00;
    --sw-c: #ea7e00;
    --sw-d: #ea7e00;
    --sw-e: #ea7e00;
    background: linear-gradient(90deg,
      var(--sw-a) 0%,
      var(--sw-b) 28%,
      var(--sw-c) 48%,
      var(--sw-d) 72%,
      var(--sw-e) 100%);
    animation: spectrumWord 45s ease-in-out infinite;
  }

  .spectrum-word,
  .hero-title em,
  .emotion-prompt-title em,
  .join-band-heading em {
    font-style: normal;
    font-weight: 600;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
  }

  @keyframes spectrumWord {
    0%, 100% {
      --sw-a: #ea7e00;
      --sw-b: #ea7e00;
      --sw-c: #ea7e00;
      --sw-d: #ea7e00;
      --sw-e: #ea7e00;
    }
    50% {
      --sw-a: #ffc878;
      --sw-b: #ff9a2e;
      --sw-c: #ea7e00;
      --sw-d: #c15789;
      --sw-e: #4a6bb5;
    }
  }

  .rule-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin: clamp(1.25rem, 3vh, 1.75rem) 0;
  }

  .rule {
    display: block;
    width: clamp(3.5rem, 8vw, 5.5rem);
    height: 2px;
    border: none;
    margin: 0;
    flex-shrink: 0;
  }

  .display {
    font-family: var(--font-head);
    font-size: var(--fs-display);
    font-weight: 600;
    line-height: 1.05;
    letter-spacing: 0.032em;
    color: var(--ink);
    margin-top: auto;
  }

  .body {
    font-family: 'Lora', Georgia, serif;
    font-size: calc(var(--fs-body) * 1.05);
    font-weight: 400;
    line-height: 1.75;
    color: var(--ink-mid);
    max-width: 40ch;
  }

  .launch-tag {
    margin: 0;
    font-size: var(--fs-meta);
    font-weight: 500;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--s-orange);
  }

  /* ── NOTIFY FORM ── */
  .notify {
    margin-top: clamp(2rem, 4.5vh, 2.75rem);
  }

  .notify-label {
    font-size: var(--fs-meta);
    font-weight: 500;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--ink);
    margin-bottom: 0.85rem;
  }

  .notify-form {
    display: flex;
    gap: 0;
    max-width: 30rem;
  }

  .notify-input {
    flex: 1;
    min-width: 0;
    font-family: var(--font-sans);
    font-size: var(--fs-body);
    color: var(--ink);
    background: rgba(255, 255, 255, 0.69);
    border: none;
    border-radius: 0;
    padding: 0.9rem 1.1rem;
    outline: none;
    transition: border-color 0.3s, background 0.3s;
  }

  .notify-input::placeholder {
    color: var(--ink-light);
  }

  .notify-input:focus {
    border-color: var(--ink);
    background: rgba(255, 255, 255, 0.85);
  }

  .notify-submit {
    font-family: var(--font-sans);
    font-size: var(--fs-meta);
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #fff;
    background: linear-gradient(120deg, var(--s-orange-bright), var(--s-coral-bright));
    border: none;
    border-radius: 0;
    padding: 0 1.6rem;
    cursor: pointer;
    white-space: nowrap;
    transition: opacity 0.3s, transform 0.3s;
  }

  .notify-submit:hover {
    opacity: 0.9;
    transform: translateY(-1px);
  }

  .notify-hint {
    margin-top: 0.85rem;
    font-family: 'Lora', Georgia, serif;
    font-style: italic;
    font-size: calc(var(--fs-body) * 0.9);
    color: var(--ink-mid);
  }

  .notify-success {
    display: none;
    margin-top: 0.85rem;
    font-family: 'Lora', Georgia, serif;
    font-style: italic;
    font-size: calc(var(--fs-body) * 0.95);
    color: var(--s-coral);
  }

  .notify-success:not([hidden]) { display: block; }

  /* ── PILLARS ── */
  .pillars {
    background: rgba(255, 255, 255, 0.4);
    border-top: 1px solid rgba(20, 28, 58, 0.1);
    padding: clamp(1.75rem, 4vh, 2.5rem) var(--pad-x) clamp(2.5rem, 6vh, 4rem);
    position: relative;
    z-index: 2;
  }

  .pillars-inner {
    width: 100%;
    max-width: var(--max);
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: clamp(1.25rem, 2.5vw, 2rem);
    align-items: start;
  }

  .pillar {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: clamp(0.75rem, 1.5vh, 1rem);
    width: 100%;
  }

  .pillar-icon {
    width: clamp(72px, 7vw, 100px);
    height: clamp(72px, 7vw, 100px);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
  }

  .pillar-icon svg {
    width: 100%;
    height: 100%;
    color: var(--accent, var(--s-coral));
    transition: color 900ms ease;
  }

  /* Icon 03 — Creating conditions for more alive humans */
  .ic03-ripple {
    fill: none;
    stroke: currentColor;
    stroke-width: 1.25;
    vector-effect: non-scaling-stroke;
  }

  /* Icon 04 — Advancing real-world impact */
  .ic04-p {
    transform-origin: 50px 50px;
    animation-name: ic04Disperse;
    animation-duration: 5.0s;
    animation-timing-function: cubic-bezier(.4, 0, .8, 1);
    animation-iteration-count: infinite;
    animation-delay: var(--delay);
  }
  .ic04-p0  { --dx: 0px;     --dy: -45px;   --delay: 0s;     --r0: 5.15; --r1: 2.16; }
  .ic04-p1  { --dx: 22.5px;  --dy: -38.97px; --delay: 3.09s; --r0: 3.75; --r1: 1.8; }
  .ic04-p2  { --dx: 38.97px; --dy: -22.5px;  --delay: 1.18s; --r0: 4.6;  --r1: 1.93; }
  .ic04-p3  { --dx: 45px;    --dy: 0px;     --delay: 4.271s; --r0: 2.9;  --r1: 1.8; }
  .ic04-p4  { --dx: 38.97px; --dy: 22.5px;   --delay: 2.361s; --r0: 5;    --r1: 2.1; }
  .ic04-p5  { --dx: 22.5px;  --dy: 38.97px;  --delay: 0.451s; --r0: 3.5;  --r1: 1.8; }
  .ic04-p6  { --dx: 0px;     --dy: 45px;    --delay: 3.541s; --r0: 4.2;  --r1: 1.8; }
  .ic04-p7  { --dx: -22.5px; --dy: 38.97px;  --delay: 1.631s; --r0: 3.2;  --r1: 1.8; }
  .ic04-p8  { --dx: -38.97px;--dy: 22.5px;   --delay: 4.721s; --r0: 4.8;  --r1: 2.02; }
  .ic04-p9  { --dx: -45px;   --dy: 0px;     --delay: 2.812s; --r0: 3.75; --r1: 1.8; }
  .ic04-p10 { --dx: -38.97px;--dy: -22.5px;  --delay: 0.902s; --r0: 5.15; --r1: 2.16; }
  .ic04-p11 { --dx: -22.5px; --dy: -38.97px; --delay: 3.992s; --r0: 3;    --r1: 1.8; }
  @keyframes ic04Disperse {
    0% { opacity: 0; transform: translate(0, 0) scale(1); }
    6% { opacity: .9; }
    78% { opacity: .9; transform: translate(calc(var(--dx) * 0.78), calc(var(--dy) * 0.78)) scale(0.9); }
    90% { opacity: .7; transform: translate(calc(var(--dx) * 0.90), calc(var(--dy) * 0.90)) scale(0.68); }
    100% { opacity: 0; transform: translate(var(--dx), var(--dy)) scale(calc(var(--r1) / var(--r0))); }
  }

  /* Icon 01 — Mapping the inner world */
  .pillar-icon .rr { transform-origin: 50px 50px; }
  @keyframes ic01a {
    0%   { transform: scale(1); animation-timing-function: cubic-bezier(.45,.05,.4,1); }
    36%  { transform: scale(.38); animation-timing-function: cubic-bezier(.4,0,.6,1); }
    50%  { transform: scale(.43); animation-timing-function: cubic-bezier(.2,0,.35,1); }
    100% { transform: scale(1); }
  }
  @keyframes ic01b {
    0%   { transform: scale(1); animation-timing-function: cubic-bezier(.45,.05,.4,1); }
    36%  { transform: scale(.58); animation-timing-function: cubic-bezier(.4,0,.6,1); }
    50%  { transform: scale(.62); animation-timing-function: cubic-bezier(.2,0,.35,1); }
    100% { transform: scale(1); }
  }
  @keyframes ic01c {
    0%   { transform: scale(1); animation-timing-function: cubic-bezier(.45,.05,.4,1); }
    36%  { transform: scale(.80); animation-timing-function: cubic-bezier(.4,0,.6,1); }
    50%  { transform: scale(.82); animation-timing-function: cubic-bezier(.2,0,.35,1); }
    100% { transform: scale(1); }
  }
  .ic01-a { animation: ic01a 7s infinite; animation-delay: -1.40s; }
  .ic01-b { animation: ic01b 7s infinite; animation-delay: -0.84s; }
  .ic01-c { animation: ic01c 7s infinite; animation-delay: -0.28s; }

  /* Icon 02 — Translating knowledge into practice */
  .beam {
    stroke-dasharray: 100;
    stroke-dashoffset: 100;
    animation: beamIn 5.3s cubic-bezier(.3,0,.35,1) infinite;
  }
  @keyframes beamIn {
    0% { stroke-dashoffset: 100; }
    11.89% { stroke-dashoffset: 0; }
    88.11% { stroke-dashoffset: 0; }
    100% { stroke-dashoffset: 100; }
  }
  .ringOuter { opacity: 0; animation: ringOuterSeq 5.3s cubic-bezier(.3,0,.2,1) infinite; }
  @keyframes ringOuterSeq {
    0% { opacity: 0; }
    22.83% { opacity: 0; }
    25.47% { opacity: 1; }
    74.53% { opacity: 1; }
    77.17% { opacity: 0; }
    100% { opacity: 0; }
  }
  .ringM1 { opacity: 0; animation: ringM1seq 5.3s cubic-bezier(.3,0,.2,1) infinite; }
  @keyframes ringM1seq {
    0% { opacity: 0; }
    11.89% { opacity: 0; }
    14.53% { opacity: 1; }
    85.47% { opacity: 1; }
    88.11% { opacity: 0; }
    100% { opacity: 0; }
  }
  .ringM2 { opacity: 0; animation: ringM2seq 5.3s cubic-bezier(.3,0,.2,1) infinite; }
  @keyframes ringM2seq {
    0% { opacity: 0; }
    17.36% { opacity: 0; }
    20.00% { opacity: 1; }
    80.00% { opacity: 1; }
    82.64% { opacity: 0; }
    100% { opacity: 0; }
  }
  .ray { stroke-dasharray: 100; stroke-dashoffset: 100; }
  @keyframes rayTop1 {
    0% { stroke-dashoffset: 100; }
    25.47% { stroke-dashoffset: 100; }
    38.68% { stroke-dashoffset: 0; }
    74.53% { stroke-dashoffset: 0; }
    87.74% { stroke-dashoffset: -100; }
    100% { stroke-dashoffset: -100; }
  }
  @keyframes rayTop2 {
    0% { stroke-dashoffset: 100; }
    27.36% { stroke-dashoffset: 100; }
    40.57% { stroke-dashoffset: 0; }
    76.42% { stroke-dashoffset: 0; }
    89.62% { stroke-dashoffset: -100; }
    100% { stroke-dashoffset: -100; }
  }
  @keyframes rayMid {
    0% { stroke-dashoffset: 100; }
    29.25% { stroke-dashoffset: 100; }
    42.45% { stroke-dashoffset: 0; }
    78.30% { stroke-dashoffset: 0; }
    91.51% { stroke-dashoffset: -100; }
    100% { stroke-dashoffset: -100; }
  }
  @keyframes rayBot1 {
    0% { stroke-dashoffset: 100; }
    31.13% { stroke-dashoffset: 100; }
    44.34% { stroke-dashoffset: 0; }
    80.19% { stroke-dashoffset: 0; }
    93.40% { stroke-dashoffset: -100; }
    100% { stroke-dashoffset: -100; }
  }
  @keyframes rayBot2 {
    0% { stroke-dashoffset: 100; }
    33.02% { stroke-dashoffset: 100; }
    46.23% { stroke-dashoffset: 0; }
    82.08% { stroke-dashoffset: 0; }
    95.28% { stroke-dashoffset: -100; }
    100% { stroke-dashoffset: -100; }
  }
  .ray1 { animation: rayTop1 5.3s cubic-bezier(.32,0,.2,1) infinite; }
  .ray2 { animation: rayTop2 5.3s cubic-bezier(.32,0,.2,1) infinite; }
  .ray3 { animation: rayMid  5.3s cubic-bezier(.32,0,.2,1) infinite; }
  .ray4 { animation: rayBot1 5.3s cubic-bezier(.32,0,.2,1) infinite; }
  .ray5 { animation: rayBot2 5.3s cubic-bezier(.32,0,.2,1) infinite; }

  .pillar > span:not(.pillar-icon) {
    font-family: var(--font-head);
    font-size: var(--fs-meta);
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--ink);
    line-height: 1.4;
    min-height: 4.2em;
    max-width: 180px;
  }

  /* ── HOME FIELD ── */
  .emotion-prompt {
    padding: clamp(3rem, 8vh, 5rem) var(--pad-x) 0;
    max-width: 1200px;
    margin: 0 auto;
    position: relative;
    z-index: 2;
  }
  .emotion-prompt-eyebrow {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--accent, var(--s-coral));
    margin: 0 0 20px;
    transition: color 900ms ease;
  }
  .emotion-prompt-title {
    font-family: var(--font-head);
    font-size: clamp(1.6rem, 3.4vw, 2.6rem);
    font-weight: 600;
    line-height: 1.28;
    color: var(--ink);
    margin: 0;
    max-width: 28ch;
  }
  .emotion-picker {
    position: relative;
    z-index: 18;
    --emotion-reading-slot: clamp(280px, 34vh, 360px);
    padding-top: clamp(2rem, 5vh, 3.5rem);
    padding-bottom: clamp(0.5rem, 2vh, 1.25rem);
  }
  .emotion-picker:not(:has(.emotion-reading:not([hidden])))::after {
    content: '';
    display: block;
    min-height: var(--emotion-reading-slot);
  }
  .emotion-picker-intro {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 var(--pad-x);
  }
  .emotion-picker-intro .emotion-prompt-title {
    margin-bottom: 12px;
  }
  .emotion-picker-bar {
    position: sticky;
    top: 0;
    z-index: 18;
    transition: background 320ms ease;
  }
  .emotion-picker:has(.emotion-reading:not([hidden])) .emotion-picker-bar {
    background: var(--frosted-white);
  }
  .emotion-picker.is-unpinned .emotion-picker-bar {
    position: static;
  }
  .emotion-chips {
    max-width: 1200px;
    width: 100%;
    margin: 0 auto;
    padding: 12px var(--pad-x) 16px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: clamp(8px, calc(4px + 2vw), 48px);
    overflow-x: auto;
    background: transparent;
  }
  .emotion-picker:has(.emotion-reading:not([hidden])) .emotion-chips {
    background: transparent;
  }
  .emotion-picker:has(.emotion-reading:not([hidden])) .emotion-chip-name {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }
  .emotion-picker:has(.emotion-reading:not([hidden])) .emotion-chip {
    gap: 0;
    padding: 0;
    justify-content: center;
  }
  .emotion-chip {
    position: relative;
    border: 0;
    border-radius: 0;
    cursor: pointer;
    padding: 4px 0 8px;
    flex: 0 0 auto;
    min-width: 0;
    max-width: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    font-family: inherit;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    background: transparent;
    color: var(--e-chip-word, var(--ink-mid));
    transition: color 320ms ease;
  }
  .emotion-chip[aria-pressed="true"] {
    background: transparent;
    color: var(--e-chip-word, var(--ink-mid));
  }
  .emotion-chip-name {
    text-align: center;
  }
  .emotion-chip-icon {
    width: clamp(48px, 6.4vw, 72px);
    height: clamp(48px, 6.4vw, 72px);
    display: none;
    overflow: visible;
    flex: 0 0 auto;
    align-self: center;
  }
  .emotion-chip-icon svg {
    display: block;
    width: 100%;
    height: 100%;
  }
  .emotion-chip[data-emotion="freeze"] > .emotion-chip-icon[data-glyph="freeze"],
  .emotion-chip[data-emotion="fear"] > .emotion-chip-icon[data-glyph="fear"],
  .emotion-chip[data-emotion="anger"] > .emotion-chip-icon[data-glyph="anger"],
  .emotion-chip[data-emotion="shame"] > .emotion-chip-icon[data-glyph="shame"],
  .emotion-chip[data-emotion="guilt"] > .emotion-chip-icon[data-glyph="guilt"],
  .emotion-chip[data-emotion="grief"] > .emotion-chip-icon[data-glyph="grief"],
  .emotion-chip[data-emotion="joy"] > .emotion-chip-icon[data-glyph="joy"] {
    display: block;
  }
  .emotion-chip-icon .ringStatic {
    fill: none;
    stroke: #fff;
    stroke-width: 1;
    stroke-dasharray: 1.6 4;
    opacity: 0.55;
  }
  .emotion-chip-icon .ringActive {
    fill: none;
    stroke-width: 1.6;
    opacity: 0;
    transition: opacity 0.35s ease;
  }
  .emotion-chip-icon .orbit {
    transform-box: view-box;
    transform-origin: 80px 80px;
    opacity: 0;
    transition: opacity 0.35s ease;
  }
  .emotion-chip-icon .core {
    transform-box: view-box;
    transform-origin: 80px 80px;
    transition: transform 0.35s cubic-bezier(0.3, 0, 0.2, 1.4);
  }
  .emotion-chip:not([aria-pressed="true"]) .core > circle:first-of-type {
    fill: var(--frosted-white);
    stroke: var(--border-hairline);
    stroke-width: 1.5;
    transition: fill 320ms ease, stroke 320ms ease;
  }
  .emotion-picker:has(.emotion-reading:not([hidden])) .emotion-chip:not([aria-pressed="true"]) .core > circle:first-of-type {
    stroke: var(--e-chip-icon, var(--e-chip));
    stroke-width: 2.4;
  }
  .emotion-chip:not([aria-pressed="true"]) .ringStatic {
    opacity: 0;
  }
  .emotion-chip:not([aria-pressed="true"]) .core [stroke="#fff"] {
    stroke: var(--e-chip-icon, var(--e-chip));
  }
  .emotion-chip:not([aria-pressed="true"]) .core [fill="#fff"] {
    fill: var(--e-chip-icon, var(--e-chip));
  }
  .emotion-chip[aria-pressed="true"] .ringActive { opacity: 1; }
  .emotion-chip[aria-pressed="true"] .orbit {
    opacity: 1;
    animation: emotionChipOrbit 6s linear infinite;
  }
  .emotion-chip[aria-pressed="true"] .core { transform: scale(1.045); }
  @keyframes emotionChipOrbit { to { transform: rotate(360deg); } }
  @media (prefers-reduced-motion: reduce) {
    .emotion-chip[aria-pressed="true"] .orbit { animation: none; }
  }
  .emotion-chip[data-emotion="freeze"] { --e-chip: var(--e-freeze); --e-chip-on: var(--e-freeze-on); --e-chip-word: var(--e-freeze-word); --e-chip-icon: color-mix(in srgb, var(--e-freeze) 82%, black); }
  .emotion-chip[data-emotion="fear"] { --e-chip: var(--e-fear); --e-chip-on: var(--e-fear-on); --e-chip-word: var(--e-fear-word); --e-chip-icon: color-mix(in srgb, var(--e-fear) 82%, black); }
  .emotion-chip[data-emotion="anger"] { --e-chip: var(--e-anger); --e-chip-on: var(--e-anger-on); --e-chip-word: var(--e-anger-word); --e-chip-icon: color-mix(in srgb, var(--e-anger) 82%, black); }
  .emotion-chip[data-emotion="shame"] { --e-chip: var(--e-shame); --e-chip-on: var(--e-shame-on); --e-chip-word: var(--e-shame-word); --e-chip-icon: color-mix(in srgb, var(--e-shame) 82%, black); }
  .emotion-chip[data-emotion="guilt"] { --e-chip: var(--e-guilt); --e-chip-on: var(--e-guilt-on); --e-chip-word: var(--e-guilt-word); --e-chip-icon: color-mix(in srgb, var(--e-guilt) 82%, black); }
  .emotion-chip[data-emotion="grief"] { --e-chip: var(--e-grief); --e-chip-on: var(--e-grief-on); --e-chip-word: var(--e-grief-word); --e-chip-icon: color-mix(in srgb, var(--e-grief) 82%, black); }
  .emotion-chip[data-emotion="joy"] { --e-chip: var(--e-joy); --e-chip-on: var(--e-joy-on); --e-chip-word: var(--e-joy-word); --e-chip-icon: color-mix(in srgb, var(--e-joy) 82%, black); }
  .emotion-reading {
    min-height: var(--emotion-reading-slot, clamp(280px, 34vh, 360px));
    background: var(--frosted-white-focus);
    border-top: 1px solid var(--border-hairline);
    border-bottom: 1px solid var(--border-hairline);
    animation: emotionFade 0.55s ease both;
  }
  @keyframes emotionFade {
    from { opacity: 0; }
    to { opacity: 1; }
  }
  .emotion-reading[hidden] { display: none !important; animation: none; }
  .emotion-reading-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: clamp(38px, 6vh, 72px) var(--pad-x);
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: clamp(26px, 4vw, 56px);
    align-items: start;
  }
  .emotion-reading-inner > div:nth-child(2),
  .emotion-reading-inner > div:nth-child(3) {
    display: grid;
    gap: 24px;
    align-content: start;
  }
  .emotion-reading-name {
    font-size: clamp(1.6rem, 3.4vw, 2.6rem);
    font-weight: 300;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    margin: 0;
    color: var(--accent);
  }
  .emotion-reading-essence {
    font-family: var(--font-serif, 'Lora', Georgia, serif);
    font-style: italic;
    font-size: clamp(1.2rem, 2.2vw, 1.7rem);
    line-height: 1.4;
    margin: 14px 0 0;
    max-width: 22ch;
    color: var(--ink);
  }
  .emotion-reading-rule {
    height: 3px;
    width: 110px;
    margin-top: 24px;
    background: var(--accent-mark);
  }
  .emotion-reading-label {
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--ink-light);
    margin: 0 0 8px;
  }
  .emotion-reading-copy {
    font-family: 'Lora', Georgia, serif;
    font-size: 1.04rem;
    line-height: 1.72;
    color: var(--ink-mid);
    margin: 0;
  }
  .emotion-reading-question {
    font-style: italic;
    color: var(--ink);
  }
  .statement {
    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: clamp(70px, 12vh, 150px) var(--pad-x);
    position: relative;
    z-index: 2;
  }
  .statement-inner { max-width: 1200px; margin: 0 auto; }
  .statement-lead {
    font-family: var(--font-sans);
    font-weight: 300;
    font-size: clamp(1.6rem, 3.4vw, 2.6rem);
    line-height: 1.28;
    margin: 0;
    max-width: 28ch;
  }
  .statement-body {
    font-family: 'Lora', Georgia, serif;
    font-size: 1.05rem;
    line-height: 1.85;
    color: var(--ink-mid);
    margin: 26px 0 0;
    max-width: 52ch;
  }
  .cards[data-band="cream"] {
    background: transparent;
    border-top: 0;
  }
  .cards[data-band="veil"] {
    background: var(--pillars-veil);
    border-top: 1px solid var(--border-hairline);
    padding: clamp(70px, 10vh, 120px) var(--pad-band-x);
    min-height: var(--band-min-height);
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .cards[data-band="veil"]:has(.cards-heading:not([hidden])) {
    border-bottom: 1px solid var(--border-hairline);
  }
  .cards[data-band="veil"] [nc\:blocks="cards"] {
    max-width: var(--max-wide);
    margin: 0 auto;
    gap: 1px;
    background: var(--border-hairline);
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
    align-items: stretch;
  }
  .cards[data-band="veil"] .card {
    background: var(--frosted-white);
    align-items: flex-start;
    text-align: left;
    gap: 12px;
    padding: clamp(24px, 3vw, 34px);
  }
  .cards[data-band="veil"] .card:not(:has(.icon))::before {
    display: none;
  }
  .cards[data-band="veil"] .card:not(:has(.icon)) [nc\:blocks="icons"] {
    display: none;
  }
  .cards[data-band="veil"] .card:not(:has(.icon)):has(.card-media) {
    display: grid;
    grid-template-columns: clamp(140px, 32%, 240px) 1fr;
    gap: 0;
    padding: 0;
    align-items: stretch;
  }
  .cards[data-band="veil"] .card:not(:has(.icon)) .card-content {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: clamp(26px, 3.4vw, 40px);
    min-width: 0;
  }
  .card-media {
    background: linear-gradient(168deg, var(--cream-deep), var(--cream));
    border-right: 1px solid var(--border-hairline);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 16px;
    min-height: 100%;
    font-size: 10px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.88);
  }
  .card-media[data-wash="rose"],
  .teaser-tile[data-wash="rose"] { background: linear-gradient(168deg, #c15789, #8f3f62); }
  .card-media[data-wash="parchment"],
  .teaser-tile[data-wash="parchment"] { background: linear-gradient(168deg, #c9b59c, #8a7762); }
  .card-media[data-wash="peach"],
  .teaser-tile[data-wash="peach"] { background: linear-gradient(168deg, #e8a878, #b87444); }
  .card-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .card-media img:not([src]),
  .card-media img[src=""] { display: none; }
  .card-media:has(img[src]:not([src=""])) {
    background: #2a211c;
  }
  .card-media:has(img[src]:not([src=""])) .card-media-fallback {
    display: none;
  }
  .cards[data-band="veil"]:has(.cards-heading:not([hidden])) .card:not(:has(.card-media)) {
    padding: clamp(26px, 3.4vw, 40px);
  }
  .cards[data-band="veil"] .card:has(.icon) .card-cta {
    display: none;
  }
  .cards[data-band="veil"] .card:has(.icon) .card-title {
    font-size: 1.15rem;
    font-weight: 500;
    text-transform: none;
    letter-spacing: 0;
  }
  .cards[data-band="veil"] .card:not(:has(.icon)) .card-title {
    font-size: 1.4rem;
    font-weight: 500;
    margin: 0 0 14px;
    text-transform: none;
    letter-spacing: 0;
  }
  .cards[data-band="veil"] .card-body {
    font-family: var(--font-serif);
    font-size: 0.96rem;
    line-height: 1.62;
    color: var(--ink-mid);
  }
  .cards[data-band="veil"] .card:not(:has(.icon)) .card-body {
    font-size: 1rem;
    line-height: 1.72;
    margin: 0 0 22px;
  }
  .cards[data-band="veil"] .card-kicker {
    margin: 0 0 14px;
  }
  .cards[data-band="veil"] .card:not(:has(.icon)) .card-kicker {
    color: var(--accent, var(--s-coral));
    font-weight: 500;
    letter-spacing: 0.22em;
  }
  .cards[data-band="veil"] > .cards-eyebrow {
    max-width: var(--max-wide);
    margin-left: auto;
    margin-right: auto;
  }
  .cards[data-band="veil"]:has(.cards-heading[hidden]) .cards-eyebrow {
    margin-bottom: 34px;
  }
  .cards[data-band="veil"]:has(.cards-heading:not([hidden])) .cards-eyebrow {
    margin-bottom: 16px;
  }
  .cards .cards-eyebrow,
  .section-eyebrow {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--accent, var(--s-coral));
    margin: 0 0 16px;
    transition: color 900ms ease;
  }
  a.card {
    text-decoration: none;
    color: inherit;
    background: var(--frosted-white);
    padding: clamp(24px, 3vw, 34px);
    align-items: flex-start;
    text-align: left;
    gap: 12px;
  }
  a.card .card-title {
    text-transform: none;
    letter-spacing: 0;
    font-size: 1.15rem;
    font-weight: 500;
  }
  .card-kicker {
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--ink-light);
    margin: 0;
  }
  .card-kicker:empty { display: none; }
  .card-cta {
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    border-bottom: 1px solid currentColor;
    padding-bottom: 3px;
    margin-top: auto;
    color: var(--ink);
    text-decoration: none;
  }
  .card-cta:empty { display: none; }
  .cards-eyebrow:empty { display: none; }
  .card .card-cta::after {
    content: '';
    position: absolute;
    inset: 0;
  }
  .split-capture-inner {
    max-width: var(--max-wide);
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
    gap: clamp(30px, 4vw, 70px);
    align-items: center;
  }
  .split-capture {
    padding: clamp(70px, 10vh, 120px) var(--pad-band-x);
    min-height: var(--band-min-height);
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    z-index: 2;
  }
  .split-capture > .split-capture-inner {
    width: 100%;
  }
  .split-capture-media {
    aspect-ratio: 1.12;
    background: var(--frosted-white);
    border: 1px solid var(--border-hairline);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 24px;
    font-size: 10px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--ink-light);
  }
  .split-capture-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .split-capture-eyebrow {
    margin: 0 0 20px;
  }
  .split-capture-title {
    font-weight: 200;
    font-size: clamp(1.7rem, 3.4vw, 2.8rem);
    line-height: 1.12;
    margin: 0 0 24px;
    max-width: 22ch;
  }
  .split-capture-body {
    font-family: var(--font-serif);
    font-size: 1.06rem;
    line-height: 1.82;
    color: var(--ink-mid);
    max-width: 46ch;
  }
  .split-capture-body p {
    margin: 0 0 18px;
  }
  .split-capture-body p:last-child {
    margin-bottom: 28px;
  }
  .split-capture .notify-form,
  .newsletter.join-band .notify-form {
    margin-top: 0;
    gap: 0;
  }
  .split-capture .notify-form {
    max-width: 46ch;
  }
  .split-capture-media img:not([src]),
  .split-capture-media img[src=""] { display: none; }
  .split-capture-media:has(img[src]:not([src=""])) .split-capture-fallback {
    display: none;
  }
  .teaser-row {
    padding: clamp(70px, 10vh, 120px) var(--pad-band-x);
    min-height: var(--band-min-height);
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    z-index: 2;
  }
  .teaser-row > .teaser-row-inner {
    width: 100%;
  }
  .teaser-row-inner {
    max-width: var(--max-wide);
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr;
    gap: clamp(28px, 4vw, 60px);
    align-items: start;
  }
  @media (min-width: 900px) {
    .teaser-row-inner {
      grid-template-columns: minmax(240px, 0.72fr) minmax(0, 1.28fr);
    }
  }
  .teaser-row .section-eyebrow {
    margin: 0 0 18px;
  }
  .teaser-intro-title {
    font-weight: 200;
    font-size: clamp(1.4rem, 2.6vw, 2.1rem);
    line-height: 1.22;
    margin: 0 0 16px;
    max-width: 22ch;
  }
  .teaser-intro-body {
    font-family: var(--font-serif);
    font-size: 1rem;
    line-height: 1.72;
    color: var(--ink-mid);
    max-width: 36ch;
    margin: 0 0 20px;
  }
  .teaser-slider {
    position: relative;
    min-width: 0;
  }
  .teaser-tiles {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    padding-bottom: 6px;
    padding-right: 52px;
    margin-inline: calc(var(--pad-band-x) * -1);
    padding-inline: var(--pad-band-x);
    scrollbar-width: none;
  }
  .teaser-tiles::-webkit-scrollbar {
    display: none;
  }
  @media (min-width: 900px) {
    .teaser-tiles {
      margin-inline: 0;
      padding-inline: 0;
    }
  }
  .teaser-slider-next {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 44px;
    height: 44px;
    border: 0;
    border-radius: 50%;
    background: #fff;
    color: var(--ink);
    box-shadow: 0 2px 14px rgba(30, 24, 20, 0.14);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 2;
  }
  .teaser-slider-next svg {
    width: 20px;
    height: 20px;
  }
  .teaser-slider-next:disabled {
    opacity: 0.35;
    cursor: default;
  }
  .teaser-tile {
    position: relative;
    flex: 0 0 clamp(200px, 58vw, 232px);
    scroll-snap-align: start;
    aspect-ratio: 0.85;
    padding: 22px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: 10px;
    text-decoration: none;
    overflow: hidden;
    border-radius: 4px;
    background: linear-gradient(168deg, var(--cream-deep), var(--cream));
    color: #fff;
  }
  .teaser-tile::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(24, 18, 14, 0.78) 0%, rgba(24, 18, 14, 0.2) 52%, rgba(24, 18, 14, 0.05) 100%);
    pointer-events: none;
  }
  .teaser-tile-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .teaser-tile:has(.teaser-tile-img[src]:not([src=""])) {
    background: #2a211c;
  }
  .teaser-kind,
  .teaser-title,
  .teaser-play {
    position: relative;
    z-index: 1;
  }
  .teaser-kind {
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.88);
  }
  .teaser-tile[data-kind="essay"] .teaser-kind::before { content: 'Essay'; }
  .teaser-tile[data-kind="podcast"] .teaser-kind::before { content: 'Podcast'; }
  .teaser-title {
    font-family: 'Lora', Georgia, serif;
    font-size: 1.14rem;
    line-height: 1.32;
    color: #fff;
  }
  .teaser-play {
    position: absolute;
    left: 18px;
    bottom: 18px;
    width: 34px;
    height: 34px;
    display: none;
    color: #fff;
  }
  .teaser-play svg {
    width: 100%;
    height: 100%;
  }
  .teaser-tile[data-kind="podcast"] .teaser-play {
    display: block;
  }
  .teaser-tile[data-kind="podcast"] {
    padding-bottom: 64px;
  }
  .teaser-intro-cta::after {
    content: ' →';
  }
  .beliefs {
    padding: clamp(50px, 7vh, 90px) var(--pad-band-x);
    background: var(--pillars-veil);
    border-top: 1px solid var(--border-hairline);
    position: relative;
    z-index: 2;
  }
  .beliefs > .section-eyebrow {
    max-width: var(--max-wide);
    margin: 0 auto 16px;
  }
  .beliefs-heading {
    max-width: var(--max-wide);
    margin: 0 auto 34px;
    font-weight: 200;
    font-size: clamp(1.4rem, 2.6vw, 2.1rem);
    line-height: 1.22;
  }
  .beliefs-heading[hidden] { display: none !important; }
  .beliefs:has(.beliefs-heading[hidden]) > .section-eyebrow {
    margin-bottom: 34px;
  }
  .beliefs-grid {
    max-width: var(--max-wide);
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: clamp(22px, 3vw, 46px);
  }
  .belief-item {
    font-family: var(--font-serif);
    font-size: 1.1rem;
    line-height: 1.6;
    color: var(--ink);
    margin: 0;
    padding-top: 16px;
    border-top: 1px solid var(--border-hairline);
  }
  .scales {
    padding: clamp(70px, 10vh, 130px) 0;
    position: relative;
    z-index: 2;
  }
  .emotion-picker + .scales {
    padding-top: clamp(2.5rem, 6vh, 4.5rem);
  }
  .scales[data-band="cream"] {
    background: transparent;
  }
  .scales[data-band="veil"] {
    background: var(--pillars-veil);
    border-top: 1px solid var(--border-hairline);
  }
  .scales-inner {
    max-width: var(--max);
    margin: 0 auto;
    padding: 0 var(--pad-x);
  }
  .scales-heading {
    font-weight: 200;
    font-size: clamp(1.4rem, 2.6vw, 2.1rem);
    line-height: 1.22;
    margin: 0 0 34px;
    max-width: 22ch;
  }
  .scales-ladder {
    display: flex;
    flex-direction: column;
  }
  .scale-item {
    display: grid;
    grid-template-columns: 34px minmax(7rem, 14ch) 1fr;
    gap: clamp(16px, 3vw, 48px);
    align-items: baseline;
    padding: clamp(18px, 2.4vh, 30px) 0;
    border-top: 1px solid var(--border-hairline);
  }
  .scale-ring {
    display: block;
    width: 10px;
    height: 10px;
    margin: 0 auto;
    border: 2.4px solid var(--border-hairline);
    border-radius: 50%;
    box-sizing: border-box;
    transition: border-color 900ms ease;
    justify-self: center;
    align-self: center;
  }
  .scale-item:nth-child(2) .scale-ring { width: 13px; height: 13px; border-width: 2.15px; }
  .scale-item:nth-child(3) .scale-ring { width: 16px; height: 16px; border-width: 1.9px; }
  .scale-item:nth-child(4) .scale-ring { width: 19px; height: 19px; border-width: 1.65px; }
  .scale-item:nth-child(5) .scale-ring { width: 22px; height: 22px; border-width: 1.4px; }
  .scale-item:nth-child(6) .scale-ring { width: 25px; height: 25px; border-width: 1.2px; }
  .scale-item:nth-child(7) .scale-ring { width: 28px; height: 28px; border-width: 1px; }
  .scale-level {
    font-family: var(--font-sans);
    font-weight: 500;
    font-size: 0.8rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--ink);
    margin: 0;
  }
  .scale-question {
    font-family: var(--font-serif);
    font-size: 1.05rem;
    line-height: 1.7;
    color: var(--ink-mid);
    margin: 0;
    max-width: 46ch;
  }
  @supports (animation-timeline: view()) {
    @keyframes scale-ring-lit {
      0% { border-color: var(--border-hairline); }
      35% { border-color: var(--accent-mark); }
      70% { border-color: var(--accent-mark); }
      100% { border-color: var(--border-hairline); }
    }
    .scale-item .scale-ring {
      animation: scale-ring-lit linear both;
      animation-timeline: view();
      animation-range: entry 10% exit 10%;
    }
  }
  .founder {
    padding: clamp(60px, 9vh, 120px) var(--pad-band-x);
    position: relative;
    z-index: 2;
  }
  .founder-inner {
    max-width: var(--max-wide);
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(280px, 0.95fr);
    gap: clamp(32px, 5vw, 80px);
    align-items: center;
  }
  .founder-eyebrow {
    margin: 0 0 16px;
  }
  .founder-title {
    font-weight: 200;
    font-size: clamp(1.7rem, 3.4vw, 2.8rem);
    line-height: 1.12;
    margin: 0 0 16px;
    max-width: 18ch;
  }
  .founder-kicker {
    font-size: 1.02rem;
    font-weight: 400;
    color: var(--accent, var(--s-coral));
    margin: 0 0 22px;
    max-width: 36ch;
  }
  .founder-kicker:empty { display: none; }
  .founder-body {
    font-family: var(--font-serif);
    font-size: 1.06rem;
    line-height: 1.82;
    color: var(--ink-mid);
    max-width: 46ch;
  }
  .founder-body p {
    margin: 0 0 18px;
  }
  .founder-body p:last-child {
    margin-bottom: 28px;
  }
  .founder-cta {
    display: inline-block;
    margin-top: 0;
  }
  .founder-visual {
    position: relative;
  }
  .founder-media {
    aspect-ratio: 0.82;
    background: var(--frosted-white);
    border: 1px solid var(--border-hairline);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 24px;
    font-size: 10px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--ink-light);
  }
  .founder-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .founder-media img:not([src]),
  .founder-media img[src=""] { display: none; }
  .founder-media:has(img[src]:not([src=""])) .founder-fallback {
    display: none;
  }
  .founder-approach {
    position: absolute;
    right: -6%;
    bottom: 8%;
    width: min(100%, 280px);
    background: var(--frosted-white);
    border: 1px solid var(--border-hairline);
    padding: 22px 24px 18px;
  }
  .founder-approach-heading {
    font-family: var(--font-serif);
    font-size: 1.12rem;
    margin: 0 0 14px;
    color: var(--ink);
  }
  .founder-point {
    margin: 0;
    padding: 8px 0 8px 14px;
    position: relative;
    font-size: 0.92rem;
    line-height: 1.5;
    color: var(--ink-mid);
  }
  .founder-point::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0.85em;
    width: 5px;
    height: 5px;
    background: var(--accent, var(--s-coral));
  }
  .teaser-tiles:empty {
    display: none;
  }
  @media (max-width: 860px) {
    .founder-inner {
      grid-template-columns: 1fr;
    }
    .founder-approach {
      position: relative;
      right: auto;
      bottom: auto;
      width: 100%;
      margin-top: -1px;
    }
  }
  .logo-row {
    padding: clamp(44px, 6vh, 80px) var(--pad-band-x);
    position: relative;
    z-index: 2;
  }
  .logo-row-label {
    font-size: 10px;
    font-weight: 500;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--ink-light);
    text-align: center;
    margin: 0 0 28px;
  }
  .logo-row-items {
    display: flex;
    flex-wrap: wrap;
    gap: clamp(26px, 5vw, 60px);
    align-items: center;
    justify-content: center;
  }
  .logo-item {
    font-size: 16px;
    font-weight: 600;
    color: var(--ink-light);
    margin: 0;
  }
  .newsletter.join-band {
    position: relative;
    z-index: 2;
    margin-top: 0;
    padding: clamp(46px, 6vh, 80px) max(var(--pad-x), calc((100% - 1200px) / 2));
    max-width: none;
    display: flex;
    flex-wrap: wrap;
    gap: clamp(24px, 4vw, 48px);
    align-items: center;
    justify-content: space-between;
    width: 100%;
    box-sizing: border-box;
  }
  .newsletter.join-band::before {
    content: '';
    position: absolute;
    inset: 0;
    background: var(--pillars-veil);
    z-index: -1;
  }
  .join-band-copy {
    flex: 1 1 220px;
  }
  .join-band-heading {
    font-family: var(--font-head);
    font-weight: 600;
    font-size: clamp(1.4rem, 2.6vw, 2.1rem);
    line-height: 1.22;
    color: var(--ink);
    margin: 0 0 16px;
    max-width: 22ch;
  }
  .join-band-body {
    font-family: var(--font-serif);
    font-size: 1rem;
    line-height: 1.72;
    color: var(--ink-mid);
    max-width: 36ch;
    margin: 0;
    letter-spacing: 0;
    text-transform: none;
  }
  .newsletter.join-band .notify-form {
    flex: 1 1 300px;
    max-width: 480px;
  }
  .split-capture .notify-input,
  .newsletter.join-band .notify-input {
    border: none;
    border-radius: 0;
    padding: 15px 16px;
    font-size: 0.98rem;
    font-weight: 300;
    background: color-mix(in srgb, var(--accent-mark, var(--s-orange)) 6%, #fff);
    color: var(--ink);
    transition: background 900ms ease;
  }
  .split-capture .notify-input::placeholder,
  .newsletter.join-band .notify-input::placeholder {
    color: var(--ink-light);
  }
  .split-capture .notify-input:focus,
  .newsletter.join-band .notify-input:focus {
    background: color-mix(in srgb, var(--accent-mark, var(--s-orange)) 10%, #fff);
  }
  .split-capture .notify-submit,
  .newsletter.join-band .notify-submit {
    padding: 15px 24px;
    font-size: 10.5px;
    letter-spacing: 0.16em;
    color: var(--accent-on);
    background: linear-gradient(
      120deg,
      color-mix(in srgb, var(--accent-mark, var(--s-orange)) 72%, white),
      var(--accent-mark, var(--s-orange))
    );
    border-radius: 0;
    transition: background 900ms ease, color 900ms ease, opacity 0.3s, transform 0.3s;
  }
  .split-capture .notify-submit:hover,
  .newsletter.join-band .notify-submit:hover {
    opacity: 0.9;
    transform: translateY(-1px);
  }
  @media (max-width: 640px) {
    .newsletter.join-band .notify-form {
      flex-direction: row;
    }
    .split-capture .notify-submit,
    .newsletter.join-band .notify-submit {
      padding: 14px 20px;
    }
  }
  .cards .cards-heading {
    font-weight: 200;
    font-size: clamp(1.5rem, 3vw, 2.3rem);
    line-height: 1.2;
    letter-spacing: 0;
    text-transform: none;
    text-align: left;
    color: var(--ink);
  }
  .cards[data-band="veil"] .cards-heading {
    max-width: var(--max-wide);
    margin: 0 auto 34px;
    font-size: clamp(1.4rem, 2.6vw, 2.1rem);
    line-height: 1.22;
  }

  /* ── FOOTER ── (layout in global chrome rules above) ── */

  /* ── REVEAL ──
     Hero load-in stays time-based (.reveal / hero-intro).
     Scroll-in uses view timelines (same as scale rings): no duration in the
     animation shorthand. Markup may add .reveal-in; the selectors below
     cover existing block instances without a class. */
  .reveal {
    opacity: 0;
    transform: translateY(18px);
    animation: reveal 0.9s cubic-bezier(0.23, 1, 0.32, 1) forwards;
  }

  .reveal-d1 { animation-delay: 0.12s; }
  .reveal-d2 { animation-delay: 0.24s; }
  .reveal-d3 { animation-delay: 0.36s; }
  .reveal-d4 { animation-delay: 0.48s; }

  @keyframes reveal {
    to { opacity: 1; transform: translateY(0); }
  }

  .reveal-in.is-waiting,
  .reveal-in.is-in {
    transition: opacity 0.9s cubic-bezier(0.23, 1, 0.32, 1),
                transform 0.9s cubic-bezier(0.23, 1, 0.32, 1);
  }
  .reveal-in.is-waiting {
    opacity: 0;
    transform: translateY(18px);
  }
  .reveal-in.is-in {
    opacity: 1;
    transform: translateY(0);
  }
  .reveal-in-late.is-in { transition-delay: 0.18s; }
  .scale-item.reveal-in.is-in:nth-child(2) { transition-delay: 0.06s; }
  .scale-item.reveal-in.is-in:nth-child(3) { transition-delay: 0.12s; }
  .scale-item.reveal-in.is-in:nth-child(4) { transition-delay: 0.18s; }
  .scale-item.reveal-in.is-in:nth-child(5) { transition-delay: 0.24s; }
  .scale-item.reveal-in.is-in:nth-child(6) { transition-delay: 0.3s; }
  .scale-item.reveal-in.is-in:nth-child(7) { transition-delay: 0.36s; }
  .belief-item.reveal-in.is-in:nth-child(2) { transition-delay: 0.06s; }
  .belief-item.reveal-in.is-in:nth-child(3) { transition-delay: 0.12s; }
  .belief-item.reveal-in.is-in:nth-child(4) { transition-delay: 0.18s; }
  .belief-item.reveal-in.is-in:nth-child(5) { transition-delay: 0.24s; }
  .belief-item.reveal-in.is-in:nth-child(6) { transition-delay: 0.3s; }

  @media (prefers-reduced-motion: reduce) {
    body > header { transition: none; }
    body > header .header-pill { transition: none; }
    body > header.is-compact nav { transition: none; }
    .reveal,
    .reveal-in,
    .reveal-in.is-waiting,
    .reveal-in.is-in { opacity: 1; transform: none; animation: none; transition: none; }
    .hero-title.display.is-waiting,
    .hero .rule-row.is-waiting,
    .hero-body.is-waiting > p { opacity: 1; transform: none; transition: none; }
    .spectrum-word,
    .hero-title em,
    .emotion-prompt-title em,
    .join-band-heading em,
    .rule,
    .hero-eyebrow::before { animation: none; }
    .ic01-a, .ic01-b, .ic01-c { animation: none; }
    .beam, .ringOuter, .ringM1, .ringM2, .ray1, .ray2, .ray3, .ray4, .ray5 {
      animation: none;
      opacity: 1;
      stroke-dashoffset: 0;
    }
    .ic04-p { animation: none; opacity: .55; }
    .scale-ring { transition: none; animation: none; }
    .reveal-in.is-waiting,
    .reveal-in.is-in { opacity: 1; transform: none; transition: none; }
  }

  html[nc\:editing="true"] .reveal-in.is-waiting {
    opacity: 1;
    transform: none;
    transition: none;
  }

  /* ── RESPONSIVE ── */
  @media (max-width: 1023px) {
    #bg {
      top: -8%;
    }
  }

  @media (max-width: 900px) {
    .pillars-inner { grid-template-columns: repeat(2, 1fr); row-gap: 2rem; }
    .display {
      font-size: clamp(2.55rem, 6.25vw + 0.55rem, 3.75rem);
    }
  }

  @media (max-width: 640px) {
    main { padding-top: 0; }
    .brand-logo {
      height: clamp(50px, 14vw, 58px);
    }
    .display {
      font-size: clamp(2.85rem, 7.5vw + 0.7rem, 3.75rem);
    }
    .notify-form { flex-direction: column; }
    .notify-submit { padding: 0.9rem 1.6rem; }
    .pillars-inner { grid-template-columns: 1fr; row-gap: 2.5rem; }
    .scale-item {
      grid-template-columns: 20px 1fr;
      grid-template-rows: auto auto;
    }
    .scale-ring {
      grid-row: 1 / span 2;
      align-self: start;
      margin-top: 6px;
    }
  }