/* Unbroken homepage brand experiment — scoped to the homepage.
 * Source: Unbroken Email Brand System, supplied 17 September 2026.
 * This layer changes presentation only: content, routes and product claims
 * remain owned by index.html and the existing product-truth contracts. */

:root {
  --brand-protocol-yellow: #FFE500;
  --brand-spectrum-cyan: #00CFFF;
  --brand-electric-blue: #4533FF;
  --brand-spectrum-violet: #B13CFF;
  --brand-spectrum-pink: #FF2CA3;
  --brand-spectrum-amber: #FFBD59;
  --brand-spectrum-coral: #F06D63;
  --brand-spectrum-magenta: #DC145D;
  --brand-deep-violet: #2A075F;
  --brand-hero-midnight: #16093D;
  --brand-framework-midnight: #100A35;
  --brand-signals-navy: #071A3E;
  --brand-instrument-highlight: #201B3D;
  --brand-instrument-base: #10111E;
  --brand-soft-white: #F2EFFF;
  --brand-instrument-secondary: #C9C7D4;

  --brand-gradient-hero:
    radial-gradient(circle at 14% 14%, rgba(0, 207, 255, .62) 0%, rgba(0, 207, 255, 0) 38%),
    radial-gradient(circle at 88% 12%, rgba(255, 44, 163, .72) 0%, rgba(255, 44, 163, 0) 42%),
    radial-gradient(circle at 86% 88%, rgba(255, 189, 89, .70) 0%, rgba(255, 189, 89, 0) 38%),
    linear-gradient(135deg, #21085D 0%, #4533FF 36%, #B13CFF 64%, #F06D63 100%);
  --brand-gradient-framework:
    radial-gradient(circle at 12% 18%, rgba(0, 207, 255, .48) 0%, rgba(0, 207, 255, 0) 40%),
    radial-gradient(circle at 88% 76%, rgba(255, 44, 163, .68) 0%, rgba(255, 44, 163, 0) 40%),
    linear-gradient(140deg, #11143E 0%, #3B2DA8 42%, #8D35D7 70%, #DA2B83 100%);
  --brand-gradient-signals:
    radial-gradient(circle at 12% 22%, rgba(0, 207, 255, .78) 0%, rgba(0, 207, 255, 0) 38%),
    radial-gradient(circle at 82% 16%, rgba(111, 72, 255, .72) 0%, rgba(111, 72, 255, 0) 42%),
    radial-gradient(circle at 88% 82%, rgba(53, 232, 138, .52) 0%, rgba(53, 232, 138, 0) 38%),
    linear-gradient(135deg, #071A3E 0%, #164EA8 38%, #4C3ACB 68%, #0CA980 100%);
  --brand-gradient-spectrum:
    radial-gradient(circle at 70% 12%, #FF2CA3 0%, rgba(255, 44, 163, 0) 38%),
    radial-gradient(circle at 82% 72%, #FFBD59 0%, rgba(255, 189, 89, 0) 34%),
    radial-gradient(circle at 18% 58%, #00CFFF 0%, rgba(0, 207, 255, 0) 36%),
    linear-gradient(135deg, #2A075F 0%, #4533FF 34%, #B13CFF 62%, #DC145D 100%);
  --brand-gradient-abraham:
    radial-gradient(circle at 17% 24%, rgba(0, 207, 255, .72) 0%, rgba(0, 207, 255, 0) 38%),
    radial-gradient(circle at 78% 12%, rgba(255, 44, 163, .74) 0%, rgba(255, 44, 163, 0) 40%),
    radial-gradient(circle at 86% 80%, rgba(255, 189, 89, .78) 0%, rgba(255, 189, 89, 0) 38%),
    linear-gradient(135deg, #2A075F 0%, #4533FF 34%, #B13CFF 62%, #DC145D 100%);

  --panel-radius: 28px;
  --brand-image-radius: 22px;
  --brand-utility-radius: 16px;
  --brand-button-radius: 15px;

  --brand-font-display: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --brand-font-text: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --brand-font-label: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --brand-weight-display: 700;
  --brand-weight-title: 700;
  --brand-weight-action: 650;
  --brand-tracking-display: -.052em;
  --brand-tracking-title: -.042em;
  --brand-tracking-body: -.01em;
  --brand-tracking-label: .15em;
}

body {
  background:
    radial-gradient(circle at 8% 11%, rgba(0, 207, 255, .08), transparent 28rem),
    radial-gradient(circle at 94% 28%, rgba(177, 60, 255, .08), transparent 30rem),
    var(--brand-soft-white);
}

nav {
  background: rgba(12, 8, 31, .82);
  border-bottom-color: rgba(255, 255, 255, .08);
}

.event-banner,
.nav-cta,
.uc-btn--fill {
  background: var(--brand-protocol-yellow);
  color: #090909;
}

.nav-cta,
.uc-btn,
.release-a-home .up-route-link,
.closing .btn-primary,
.closing .btn-discovery {
  border-radius: var(--brand-button-radius);
}

/* Hero: one expressive story surface with the supplied transparent app render
 * presented as the product itself, without a second competing panel. */
.up-hero.release-a-home {
  background-color: var(--brand-hero-midnight);
  background-image:
    radial-gradient(circle at 14% 14%, rgba(0, 207, 255, .62) 0%, rgba(0, 207, 255, 0) 38%),
    radial-gradient(circle at 88% 12%, rgba(255, 44, 163, .72) 0%, rgba(255, 44, 163, 0) 42%),
    radial-gradient(circle at 86% 88%, rgba(255, 189, 89, .70) 0%, rgba(255, 189, 89, 0) 38%),
    linear-gradient(135deg, #21085D 0%, #4533FF 36%, #B13CFF 64%, #F06D63 100%);
  width: min(1440px, calc(100% - 32px));
  margin: 76px auto 20px;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 28px;
  box-shadow: 0 28px 70px rgba(22, 9, 61, .28);
}

.release-a-home .up-hero-kicker,
.release-a-home .up-hero-intro,
.release-a-home .up-hero-choice,
.release-a-home h1 {
  text-shadow: 0 2px 18px rgba(16, 10, 53, .26);
}

.release-a-home .up-hero-kicker { color: var(--brand-protocol-yellow); }
.release-a-home .up-hero-intro { color: #FFFFFF; }
.release-a-home .up-hero-choice { color: rgba(255, 255, 255, .78); }
.release-a-home .up-route-link {
  border-color: rgba(255, 255, 255, .32);
  background: rgba(16, 10, 53, .22);
  color: #FFFFFF;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}
.release-a-home .up-route-link--primary {
  border-color: var(--brand-protocol-yellow);
  background: var(--brand-protocol-yellow);
  color: #090909;
  box-shadow: 0 12px 26px rgba(6, 8, 24, .22);
}
.release-a-home .up-hero-visual {
  position: relative;
  isolation: isolate;
  padding: 0;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.release-a-home .up-hero-watch {
  display: block;
  object-fit: contain;
  filter: drop-shadow(0 24px 34px rgba(6, 8, 24, .38));
}
.release-a-home h1 {
  max-width: 11ch;
  font-size: clamp(52px, 6vw, 86px);
  line-height: .9;
  letter-spacing: -.058em;
}

/* A compact evidence band resets the eye after the expressive hero while
 * using only Unbroken's own four-score vocabulary. */
.up-signal-band {
  width: min(1360px, calc(100% - 32px));
  margin: 0 auto clamp(16px, 2vw, 28px);
  border-radius: 20px;
  background: #09090B;
  color: #FFFFFF;
  overflow: hidden;
}
.up-signal-band__inner {
  display: grid;
  grid-template-columns: minmax(150px, .8fr) minmax(500px, 2.7fr) auto;
  align-items: center;
  gap: clamp(20px, 3vw, 46px);
  min-height: 92px;
  padding: 16px clamp(22px, 3.6vw, 52px);
}
.up-signal-band__label {
  margin: 0;
  color: var(--brand-protocol-yellow);
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.up-signal-band__list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}
.up-signal-band__list li {
  display: flex;
  align-items: baseline;
  gap: 9px;
  min-width: 0;
  padding: 6px clamp(12px, 1.6vw, 24px);
  border-left: 1px solid rgba(255, 255, 255, .14);
}
.up-signal-band__list span {
  color: rgba(255, 255, 255, .42);
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 9px;
}
.up-signal-band__list strong {
  overflow: hidden;
  font-size: clamp(13px, 1.15vw, 16px);
  font-weight: 620;
  letter-spacing: -.02em;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.up-signal-band a {
  color: #FFFFFF;
  font-size: 13px;
  font-weight: 650;
  text-decoration: none;
  white-space: nowrap;
}
.up-signal-band a:hover { text-decoration: underline; text-underline-offset: 4px; }
.up-signal-band a:focus-visible,
.up-system-proof__header a:focus-visible {
  outline: 3px solid var(--brand-protocol-yellow);
  outline-offset: 5px;
  border-radius: 2px;
}

/* Editorial scale and asymmetry: the existing card vocabulary remains, while
 * each chapter opens with the confidence of a magazine spread. */
.uc-wrap { max-width: 1280px; }
.uc-head {
  align-items: flex-start;
  margin-bottom: clamp(38px, 5vw, 68px);
}
.uc-head h2 {
  max-width: 14ch;
  font-size: clamp(40px, 5.6vw, 74px);
  line-height: .92;
  letter-spacing: -.058em;
}
.uc-head p {
  max-width: 38ch;
  margin-top: 18px;
  font-size: clamp(15px, 1.25vw, 18px);
  line-height: 1.5;
}
.uc-head .uc-more { align-self: flex-end; }
.uc-eyebrow {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 10px;
  letter-spacing: .16em;
}
#app-intro .uc-duo {
  grid-template-columns: minmax(0, 1fr);
  max-width: 920px;
  margin-inline: auto;
}
#rail-distances .uc-card-media,
#rail-craft .uc-card-media {
  aspect-ratio: 4 / 5;
  object-position: center;
}

/* Proof by numbers, translated into verified Unbroken product facts and a
 * restrained black-on-white chapter. */
.up-system-proof {
  width: min(1360px, calc(100% - 32px));
  margin: clamp(16px, 2vw, 28px) auto;
  border: 1px solid rgba(9, 9, 11, .1);
  border-radius: 28px;
  background: #FFFFFF;
  color: #09090B;
}
.up-system-proof__inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: clamp(62px, 8vw, 112px) clamp(24px, 4vw, 56px);
}
.up-system-proof__header {
  display: grid;
  grid-template-columns: minmax(120px, .45fr) minmax(0, 1.9fr) auto;
  align-items: end;
  gap: clamp(20px, 4vw, 64px);
  padding-bottom: clamp(42px, 5vw, 68px);
  border-bottom: 1px solid rgba(9, 9, 11, .16);
}
.up-system-proof__header p {
  margin: 0 0 6px;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.up-system-proof__header h2 {
  max-width: 12ch;
  margin: 0;
  font-size: clamp(46px, 6.4vw, 88px);
  line-height: .88;
  letter-spacing: -.065em;
}
.up-system-proof__header a {
  margin-bottom: 6px;
  color: #09090B;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
}
.up-system-proof__header a:hover { text-decoration: underline; text-underline-offset: 4px; }
.up-system-proof__stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  margin: 0;
}
.up-system-proof__stats div {
  min-width: 0;
  padding: clamp(32px, 4vw, 58px) clamp(14px, 2.2vw, 30px) 0;
  border-left: 1px solid rgba(9, 9, 11, .14);
}
.up-system-proof__stats div:first-child { padding-left: 0; border-left: 0; }
.up-system-proof__stats dt {
  font-size: clamp(58px, 7.6vw, 108px);
  font-weight: 720;
  line-height: .8;
  letter-spacing: -.07em;
}
.up-system-proof__stats dd {
  max-width: 15ch;
  margin: 18px 0 0;
  color: rgba(9, 9, 11, .68);
  font-size: clamp(12px, 1.1vw, 15px);
  line-height: 1.35;
}

@media (min-width: 900px) {
  #inside-app .app-journey .uc-rail {
    grid-auto-flow: unset;
    grid-auto-columns: unset;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(14px, 1.7vw, 22px);
    margin: 0;
    padding: 0;
    overflow: visible;
  }
  #inside-app .uc-rail-nav { display: none; }
  #inside-app .uc-card-media { aspect-ratio: 4 / 3; }
}

/* Quiet product instrument directly after the hero decision. */
#app-intro .uc-tile {
  background: linear-gradient(145deg, var(--brand-instrument-highlight), var(--brand-instrument-base));
  border: 1px solid rgba(255, 255, 255, .18);
  box-shadow: 0 12px 26px rgba(6, 8, 24, .24);
}
#app-intro .uc-tile h2,
#app-intro .uc-tile .uc-tile-sub { color: #FFFFFF; }
#app-intro .uc-tile .uc-eyebrow,
#app-intro .uc-tile .uc-fine { color: var(--brand-instrument-secondary); }
#app-intro .uc-tile .uc-btn--ghost {
  border-color: rgba(255, 255, 255, .26);
  color: #FFFFFF;
}

.uc-tile-media,
.uc-card-media,
.uc-acc-media {
  border-radius: var(--brand-image-radius);
}
.uc-card,
.uc-acc-row { border-radius: var(--brand-utility-radius); }
.uc-card { box-shadow: 0 12px 30px rgba(28, 14, 58, .06); }

/* Premium rhythm: saturated colour marks chapters; black and white cards
 * reset the eye between those moments. Coaching Services remains untouched. */
:is(#rail-distances, #rail-included) > .uc-card:nth-child(odd),
.uc-pair > .uc-card:nth-child(1),
#rail-reviews > .uc-card:nth-child(3n + 1) {
  background-color: #090A0D;
  background-image: linear-gradient(145deg, #171922 0%, #090A0D 72%);
  border-color: rgba(255, 255, 255, .14);
  box-shadow: 0 16px 34px rgba(9, 10, 13, .16);
}

:is(#rail-distances, #rail-included) > .uc-card:nth-child(even),
.app-journey .uc-card,
.uc-pair > .uc-card:nth-child(2),
#rail-reviews > .uc-card:nth-child(3n + 2) {
  background-color: #FFFFFF;
  background-image: none;
  border-color: rgba(18, 23, 28, .1);
  box-shadow: 0 12px 30px rgba(28, 14, 58, .06);
}

/* Product screenshots supply the colour inside the app; the chapter itself
 * stays white and quiet. */
#inside-app {
  width: min(1360px, calc(100% - 32px));
  margin: clamp(12px, 2vw, 28px) auto;
  overflow: hidden;
  border: 1px solid rgba(18, 23, 28, .06);
  border-radius: var(--panel-radius);
  background: #FFFFFF;
  box-shadow: 0 18px 48px rgba(28, 14, 58, .06);
}

/* Journal keeps its expressive editorial pattern. */
#rail-journal .uc-card:nth-child(1) { --card-gradient: var(--brand-gradient-spectrum); }
#rail-journal .uc-card:nth-child(3) { --card-gradient: var(--brand-gradient-framework); }
#rail-journal .uc-card:nth-child(4) { --card-gradient: var(--brand-gradient-signals); }
#rail-journal .uc-card:nth-child(6) { --card-gradient: var(--brand-gradient-abraham); }
#rail-journal .uc-card:nth-child(7) { --card-gradient: var(--brand-gradient-hero); }
#rail-journal .uc-card:nth-child(9) { --card-gradient: var(--brand-gradient-framework); }

/* Athlete proof repeats black / white / one gradient. */
#rail-reviews > .uc-card:nth-child(3) { --card-gradient: var(--brand-gradient-spectrum); }
#rail-reviews > .uc-card:nth-child(6) { --card-gradient: var(--brand-gradient-framework); }

#rail-journal .uc-card:nth-child(1),
#rail-journal .uc-card:nth-child(3),
#rail-journal .uc-card:nth-child(4),
#rail-journal .uc-card:nth-child(6),
#rail-journal .uc-card:nth-child(7),
#rail-journal .uc-card:nth-child(9),
#rail-reviews > .uc-card:nth-child(3),
#rail-reviews > .uc-card:nth-child(6) {
  background-color: var(--brand-deep-violet);
  background-image: var(--card-gradient, var(--brand-gradient-spectrum));
  border-color: rgba(255, 255, 255, .18);
  box-shadow: 0 18px 38px rgba(29, 10, 74, .18);
}

:is(
  :is(#rail-distances, #rail-included) > .uc-card:nth-child(odd),
  .uc-pair > .uc-card:nth-child(1),
  #rail-journal .uc-card:nth-child(1),
  #rail-journal .uc-card:nth-child(3),
  #rail-journal .uc-card:nth-child(4),
  #rail-journal .uc-card:nth-child(6),
  #rail-journal .uc-card:nth-child(7),
  #rail-journal .uc-card:nth-child(9),
  #rail-reviews > .uc-card:nth-child(3n + 1),
  #rail-reviews > .uc-card:nth-child(3),
  #rail-reviews > .uc-card:nth-child(6)
) :is(h3, p, .uc-eyebrow, .uc-attrib strong, .uc-attrib span) {
  color: #FFFFFF;
}
:is(
  :is(#rail-distances, #rail-included) > .uc-card:nth-child(odd),
  .uc-pair > .uc-card:nth-child(1),
  #rail-journal .uc-card:nth-child(1),
  #rail-journal .uc-card:nth-child(3),
  #rail-journal .uc-card:nth-child(4),
  #rail-journal .uc-card:nth-child(6),
  #rail-journal .uc-card:nth-child(7),
  #rail-journal .uc-card:nth-child(9),
  #rail-reviews > .uc-card:nth-child(3n + 1),
  #rail-reviews > .uc-card:nth-child(3),
  #rail-reviews > .uc-card:nth-child(6)
) :is(.uc-eyebrow, .uc-attrib span) { color: rgba(255, 255, 255, .78); }
:is(
  :is(#rail-distances, #rail-included) > .uc-card:nth-child(odd),
  .uc-pair > .uc-card:nth-child(1),
  #rail-journal .uc-card:nth-child(1),
  #rail-journal .uc-card:nth-child(3),
  #rail-journal .uc-card:nth-child(4),
  #rail-journal .uc-card:nth-child(6),
  #rail-journal .uc-card:nth-child(7),
  #rail-journal .uc-card:nth-child(9),
  #rail-reviews > .uc-card:nth-child(3n + 1),
  #rail-reviews > .uc-card:nth-child(3),
  #rail-reviews > .uc-card:nth-child(6)
) .uc-link { color: var(--brand-protocol-yellow) !important; }
#rail-reviews > .uc-card:nth-child(3n + 1) .uc-attrib,
#rail-reviews > .uc-card:nth-child(3) .uc-attrib,
#rail-reviews > .uc-card:nth-child(6) .uc-attrib { border-top-color: rgba(255, 255, 255, .22); }

:is(
  :is(#rail-distances, #rail-included) > .uc-card:nth-child(even),
  .app-journey .uc-card,
  .uc-pair > .uc-card:nth-child(2),
  #rail-reviews > .uc-card:nth-child(3n + 2)
) :is(h3, .uc-attrib strong) { color: #111218; }
:is(
  :is(#rail-distances, #rail-included) > .uc-card:nth-child(even),
  .app-journey .uc-card,
  .uc-pair > .uc-card:nth-child(2),
  #rail-reviews > .uc-card:nth-child(3n + 2)
) :is(p, .uc-eyebrow, .uc-attrib span) { color: #565763; }
:is(
  :is(#rail-distances, #rail-included) > .uc-card:nth-child(even),
  .app-journey .uc-card,
  .uc-pair > .uc-card:nth-child(2),
  #rail-reviews > .uc-card:nth-child(3n + 2)
) .uc-link { color: #4A32B8 !important; }

/* The quiz and long-form chapters carry colour; utility cards stay quiet. */
#phase-quiz .uc-tile {
  background-color: var(--brand-framework-midnight);
  background-image:
    radial-gradient(circle at 12% 18%, rgba(0, 207, 255, .48) 0%, rgba(0, 207, 255, 0) 40%),
    radial-gradient(circle at 88% 76%, rgba(255, 44, 163, .68) 0%, rgba(255, 44, 163, 0) 40%),
    linear-gradient(140deg, #11143E 0%, #3B2DA8 42%, #8D35D7 70%, #DA2B83 100%);
  border-color: rgba(255, 255, 255, .18);
  box-shadow: 0 24px 54px rgba(16, 10, 53, .22);
  min-height: 0;
  padding-bottom: clamp(38px, 5vw, 64px);
}
#phase-quiz .uc-eyebrow,
#phase-quiz h2,
#phase-quiz .uc-tile-sub { color: #FFFFFF; }
#phase-quiz .uc-eyebrow { opacity: .76; }
#phase-quiz .uc-btn--fill {
  background: var(--brand-protocol-yellow);
  color: #090909;
}
#phase-quiz .uc-btn--ghost {
  border-color: rgba(255, 255, 255, .38);
  background: rgba(16, 10, 53, .18);
  color: #FFFFFF;
}

#method {
  background-color: var(--brand-framework-midnight);
  background-image:
    radial-gradient(circle at 12% 18%, rgba(0, 207, 255, .48) 0%, rgba(0, 207, 255, 0) 40%),
    radial-gradient(circle at 88% 76%, rgba(255, 44, 163, .68) 0%, rgba(255, 44, 163, 0) 40%),
    linear-gradient(140deg, #11143E 0%, #3B2DA8 42%, #8D35D7 70%, #DA2B83 100%);
  border: 1px solid rgba(255, 255, 255, .14);
}
#method .uc-acc-rows {
  padding: 10px 22px;
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: var(--brand-utility-radius);
  background: linear-gradient(145deg, rgba(32, 27, 61, .94), rgba(16, 17, 30, .94));
  box-shadow: 0 12px 26px rgba(6, 8, 24, .24);
}
#method .uc-acc-row { border-radius: 0; }
#method .uc-acc-row:nth-child(1) { border-top: 3px solid #FFE500; }
#method .uc-acc-row:nth-child(2) { border-top: 3px solid #B13CFF; }
#method .uc-acc-row:nth-child(3) { border-top: 3px solid #00CFFF; }
#method .uc-acc-row:nth-child(4) { border-top: 3px solid #FF2CA3; }
#method .uc-acc-btn h3,
#method .uc-acc-panel p { color: #FFFFFF; }
#method .uc-acc-badge { color: var(--brand-protocol-yellow); }
#method .uc-acc-media {
  border-color: rgba(255, 255, 255, .18);
  box-shadow: 0 12px 26px rgba(6, 8, 24, .24);
}
#method .uc-head p,
#craft .uc-head p { color: rgba(255, 255, 255, .82); }
#method .uc-more,
#craft .uc-more { color: var(--brand-protocol-yellow); }

#craft {
  background-color: #081D46;
  background-image:
    radial-gradient(circle at 12% 22%, rgba(0, 207, 255, .78) 0%, rgba(0, 207, 255, 0) 38%),
    radial-gradient(circle at 82% 16%, rgba(111, 72, 255, .72) 0%, rgba(111, 72, 255, 0) 42%),
    radial-gradient(circle at 88% 82%, rgba(53, 232, 138, .52) 0%, rgba(53, 232, 138, 0) 38%),
    linear-gradient(135deg, #071A3E 0%, #164EA8 38%, #4C3ACB 68%, #0CA980 100%);
  border: 1px solid rgba(255, 255, 255, .14);
}
#craft .uc-card {
  background: linear-gradient(145deg, rgba(32, 27, 61, .96), rgba(16, 17, 30, .96));
  border-color: rgba(255, 255, 255, .18);
}

#newsletter .uc-tile {
  background-color: #1B0750;
  background-image:
    radial-gradient(circle at 17% 24%, rgba(0, 207, 255, .72) 0%, rgba(0, 207, 255, 0) 38%),
    radial-gradient(circle at 78% 12%, rgba(255, 44, 163, .74) 0%, rgba(255, 44, 163, 0) 40%),
    radial-gradient(circle at 86% 80%, rgba(255, 189, 89, .78) 0%, rgba(255, 189, 89, 0) 38%),
    linear-gradient(135deg, #2A075F 0%, #4533FF 34%, #B13CFF 62%, #DC145D 100%);
  border-color: rgba(255, 255, 255, .18);
  box-shadow: 0 24px 54px rgba(42, 7, 95, .22);
}
#newsletter .uc-eyebrow,
#newsletter h2,
#newsletter .uc-tile-sub,
#newsletter .uc-fine { color: #FFFFFF; }
#newsletter .uc-eyebrow,
#newsletter .uc-fine { opacity: .8; }
#newsletter .uc-email-row input {
  border-color: rgba(255, 255, 255, .32);
  background: rgba(16, 10, 53, .32);
  color: #FFFFFF;
}
#newsletter .uc-email-row input::placeholder { color: rgba(255, 255, 255, .72); }
#newsletter .uc-btn--fill {
  background: var(--brand-protocol-yellow);
  color: #090909;
}

section.closing[data-chapter] {
  background-color: var(--brand-deep-violet);
  background-image:
    radial-gradient(circle at 70% 12%, rgba(255, 44, 163, .82), rgba(255, 44, 163, 0) 38%),
    radial-gradient(circle at 84% 84%, rgba(255, 189, 89, .64), rgba(255, 189, 89, 0) 34%),
    radial-gradient(circle at 18% 58%, rgba(0, 207, 255, .72), rgba(0, 207, 255, 0) 36%),
    linear-gradient(135deg, #2A075F 0%, #4533FF 34%, #B13CFF 62%, #DC145D 100%);
}
section.closing[data-chapter] .closing-eyebrow,
section.closing[data-chapter] .closing-h,
section.closing[data-chapter] .closing-sub,
section.closing[data-chapter] .uc-fine { color: #FFFFFF; }
section.closing[data-chapter] .closing-eyebrow,
section.closing[data-chapter] .uc-fine { opacity: .78; }
section.closing[data-chapter] .closing-sub { opacity: .9; }
section.closing[data-chapter] .btn-discovery {
  border-color: rgba(255, 255, 255, .58);
  color: #FFFFFF;
}

/* One type system, with scale—not typeface changes—creating hierarchy. */
body,
button,
input,
textarea,
select { font-family: var(--brand-font-text); }

.release-a-home h1,
.up-system-proof__header h2,
.closing-h {
  font-family: var(--brand-font-display);
  font-optical-sizing: auto;
  font-weight: var(--brand-weight-display);
  line-height: .92;
  letter-spacing: var(--brand-tracking-display);
  text-wrap: balance;
}

.uc-head h2,
.uc-tile h1,
.uc-tile h2,
#newsletter h2 {
  font-family: var(--brand-font-display);
  font-optical-sizing: auto;
  font-weight: var(--brand-weight-title);
  line-height: .96;
  letter-spacing: var(--brand-tracking-title);
  text-wrap: balance;
}

.uc-card h3,
.uc-acc-btn h3 {
  font-family: var(--brand-font-display);
  font-weight: var(--brand-weight-title);
  line-height: 1.08;
  letter-spacing: -.026em;
  text-wrap: balance;
}

.up-hero-intro,
.up-hero-choice,
.uc-head p,
.uc-tile-sub,
.uc-card p,
.uc-acc-panel p,
.up-system-proof__stats dd,
.closing-sub {
  font-family: var(--brand-font-text);
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: var(--brand-tracking-body);
}

.up-hero-kicker,
.up-signal-band__label,
.up-signal-band__list span,
.uc-eyebrow,
.up-system-proof__header p,
.closing-eyebrow {
  font-family: var(--brand-font-label);
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: var(--brand-tracking-label);
  text-transform: uppercase;
}

.up-route-link,
.up-signal-band a,
.up-system-proof__header a,
.uc-btn,
.uc-link,
.uc-more,
.btn-primary,
.btn-discovery {
  font-family: var(--brand-font-text);
  font-weight: var(--brand-weight-action);
  letter-spacing: -.012em;
}

.up-system-proof__stats dt {
  font-family: var(--brand-font-display);
  font-variant-numeric: tabular-nums;
  font-weight: var(--brand-weight-display);
  line-height: .84;
  letter-spacing: -.055em;
}

@media (max-width: 768px) {
  .up-hero.release-a-home {
    width: calc(100% - 20px);
    margin-top: 72px;
    padding-top: 70px;
    border-radius: 24px;
  }
  .release-a-home h1 { max-width: 10ch; font-size: clamp(40px, 11.6vw, 50px); }
  .up-signal-band { width: calc(100% - 20px); border-radius: 18px; }
  .up-signal-band__inner {
    grid-template-columns: 1fr;
    gap: 14px;
    padding: 22px 20px;
  }
  .up-signal-band__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .up-signal-band__list li {
    padding: 8px 10px 8px 0;
    border-top: 1px solid rgba(255, 255, 255, .14);
    border-left: 0;
  }
  .up-signal-band a { padding-top: 2px; }
  .uc-head h2 { font-size: clamp(38px, 12.4vw, 52px); }
  .uc-head .uc-more { align-self: flex-start; }
  #app-intro .uc-duo { grid-template-columns: 1fr; }
  .up-system-proof { width: calc(100% - 20px); border-radius: 24px; }
  .up-system-proof__header {
    grid-template-columns: 1fr;
    align-items: start;
    gap: 18px;
  }
  .up-system-proof__header h2 { font-size: clamp(42px, 12.2vw, 58px); }
  .up-system-proof__header a { margin: 0; }
  .up-system-proof__stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .up-system-proof__stats div {
    padding: 28px 16px 0 0;
    border-top: 1px solid rgba(9, 9, 11, .14);
    border-left: 0;
  }
  .up-system-proof__stats div:nth-child(even) {
    padding-left: 16px;
    border-left: 1px solid rgba(9, 9, 11, .14);
  }
  .up-system-proof__stats dt { font-size: clamp(62px, 20vw, 82px); }
  #method .uc-acc-rows { padding-inline: 16px; }
  .uc-tile-media,
  .uc-card-media,
  .uc-acc-media { border-radius: 18px; }
}
