@font-face {
  font-family: "Aptos";
  src: local("Aptos"), local("Aptos Display"), local("Aptos Body");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

@font-face {
  font-family: "Cormorant Garamond";
  src: url("assets/Fonts/Cormorant_Garamond/CormorantGaramond-VariableFont_wght.ttf") format("truetype");
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
}

@font-face {
  font-family: "Cormorant Garamond";
  src: url("assets/Fonts/Cormorant_Garamond/CormorantGaramond-Italic-VariableFont_wght.ttf") format("truetype");
  font-style: italic;
  font-weight: 300 700;
  font-display: swap;
}

@font-face {
  font-family: "Montserrat";
  src: url("assets/Fonts/Montserrat/Montserrat-VariableFont_wght.ttf") format("truetype");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

@font-face {
  font-family: "Trajan Pro";
  src: url("assets/Fonts/trajan-pro/TrajanPro-Regular.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Trajan Pro";
  src: url("assets/Fonts/trajan-pro/TrajanPro-Bold.otf") format("opentype");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

:root {
  --black: #050505;
  --black-soft: #0a0a09;
  --panel: #10100f;
  --ivory: #f4efe6;
  --white: #fff;
  --muted: rgba(244, 239, 230, .63);
  --faint: rgba(244, 239, 230, .38);
  --line: rgba(255, 255, 255, .15);
  --coral: #ee7379;
  --amber: #ef9b4a;
  --gold: #e9bd68;
  --pink: #d856a2;
  --violet: #8763df;
  --blue: #4c9ce6;
  --teal: #3cc0ad;
  --green: #8ecb62;
  --spectrum: linear-gradient(90deg, #ef9b4a 0%, #ee7379 18%, #d856a2 35%, #8763df 52%, #4c9ce6 67%, #3cc0ad 83%, #8ecb62 100%);
  --shell: 1320px;
  --pad: max(26px, 5vw);
  --display: "Cormorant Garamond", Georgia, serif;
  --ui: "Montserrat", "Aptos", Arial, sans-serif;
  --body: "Aptos", "Montserrat", Arial, sans-serif;
  --ease-out: cubic-bezier(.22, 1, .36, 1);
  --ease-in-out: cubic-bezier(.65, 0, .35, 1);
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  background: var(--black);
}

body {
  margin: 0;
  overflow-x: hidden;
  background: var(--black);
  color: var(--ivory);
  font-family: var(--body);
  font-size: 16px;
  line-height: 1.6;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

body.is-loading,
body.menu-open {
  overflow: hidden;
}

::selection {
  background: var(--coral);
  color: var(--black);
}

img {
  display: block;
  max-width: 100%;
}

a {
  color: inherit;
  text-decoration: none;
}

button,
input,
textarea,
select {
  color: inherit;
  font: inherit;
}

button {
  border: 0;
}

h1,
h2,
h3,
h4,
p,
blockquote,
figure {
  margin-top: 0;
}

h1,
h2,
h3,
h4 {
  text-wrap: balance;
}

p {
  text-wrap: pretty;
}

.shell {
  position: relative;
  width: min(var(--shell), calc(100% - (var(--pad) * 2)));
  margin-inline: auto;
}

.skip-link {
  position: fixed;
  z-index: 200;
  top: 12px;
  left: 12px;
  padding: 10px 14px;
  background: var(--white);
  color: var(--black);
  font-family: var(--ui);
  font-size: 12px;
  transform: translateY(-150%);
  transition: transform .2s ease;
}

.skip-link:focus {
  transform: translateY(0);
}

.page-noise {
  position: fixed;
  z-index: 80;
  inset: 0;
  opacity: .19;
  background-image:
    repeating-radial-gradient(circle at 28% 32%, transparent 0, rgba(255, 255, 255, .12) .45px, transparent .8px, transparent 3px),
    repeating-radial-gradient(circle at 78% 68%, transparent 0, rgba(255, 255, 255, .08) .35px, transparent .7px, transparent 4px);
  background-size: 5px 5px, 7px 7px;
  mix-blend-mode: soft-light;
  pointer-events: none;
}

.scroll-progress {
  position: fixed;
  z-index: 120;
  top: 0;
  right: 0;
  left: 0;
  height: 2px;
  background: rgba(255, 255, 255, .07);
  pointer-events: none;
}

.scroll-progress span {
  display: block;
  width: var(--scroll, 0%);
  height: 100%;
  background: var(--spectrum);
  box-shadow: 0 0 16px rgba(213, 86, 162, .48);
}

.cursor-aura {
  position: fixed;
  z-index: 70;
  top: 0;
  left: 0;
  width: 360px;
  height: 360px;
  border-radius: 50%;
  opacity: 0;
  background: radial-gradient(circle, rgba(106, 102, 217, .105), rgba(60, 192, 173, .045) 38%, transparent 70%);
  transform: translate3d(calc(var(--cursor-x, -500px) - 50%), calc(var(--cursor-y, -500px) - 50%), 0);
  transition: opacity .35s ease;
  pointer-events: none;
}

body.has-cursor .cursor-aura {
  opacity: 1;
}

/* Preloader */
.preloader {
  position: fixed;
  z-index: 500;
  inset: 0;
  display: grid;
  place-items: center;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 58%, rgba(73, 75, 125, .16), transparent 34%),
    #030303;
  transition: opacity .8s var(--ease-out), visibility .8s;
}

.preloader::before {
  content: "";
  position: absolute;
  inset: 0;
  background: conic-gradient(from 220deg at 50% 115%, rgba(239, 155, 74, .17), rgba(216, 86, 162, .1), rgba(76, 156, 230, .12), transparent 44%);
  filter: blur(70px);
  animation: preloaderAura 3.5s ease-in-out infinite alternate;
}

.preloader-inner {
  position: relative;
  width: min(760px, 82vw);
  text-align: center;
}

.preloader-kicker,
.preloader-caption {
  margin: 0;
  color: rgba(255, 255, 255, .48);
  font-family: var(--ui);
  font-size: 9px;
  font-weight: 500;
  letter-spacing: .24em;
  text-transform: uppercase;
}

.preloader-word {
  display: flex;
  justify-content: center;
  margin: 16px 0 20px;
  font-family: "Trajan Pro", var(--display);
  font-size: clamp(42px, 8vw, 110px);
  line-height: 1;
  letter-spacing: -.035em;
}

.preloader-word span {
  display: inline-block;
  opacity: 0;
  transform: translateY(24px);
  animation: preLetter .65s var(--ease-out) forwards;
}

.preloader-word span:nth-child(2) { animation-delay: .07s; }
.preloader-word span:nth-child(3) { animation-delay: .14s; }
.preloader-word span:nth-child(4) { animation-delay: .21s; }
.preloader-word span:nth-child(5) { animation-delay: .28s; }
.preloader-word span:nth-child(6) { animation-delay: .35s; }
.preloader-word span:nth-child(7) { animation-delay: .42s; }
.preloader-word span:nth-child(8) { animation-delay: .49s; }

.preloader-line {
  height: 1px;
  overflow: hidden;
  background: rgba(255, 255, 255, .12);
}

.preloader-line i {
  display: block;
  width: 100%;
  height: 100%;
  background: var(--spectrum);
  transform-origin: left;
  animation: preLine 1.55s var(--ease-in-out) both .15s;
}

.preloader-caption {
  margin-top: 18px;
}

body.is-ready .preloader {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
}

/* Navigation */
.site-header {
  position: fixed;
  z-index: 130;
  top: 0;
  right: 0;
  left: 0;
  color: var(--white);
  pointer-events: none;
  transition: opacity .4s ease, transform .45s var(--ease-out);
}

.site-header.is-footer-visible {
  opacity: 0;
  transform: translateY(-18px);
  pointer-events: none;
}

.site-header::before {
  content: "";
  position: absolute;
  inset: 0;
  height: 150px;
  opacity: .48;
  background: linear-gradient(180deg, rgba(0, 0, 0, .76), rgba(0, 0, 0, .22) 56%, transparent);
  transition: opacity .4s ease;
  pointer-events: none;
}

.site-header.is-scrolled::before {
  opacity: .76;
}

.header-shell {
  position: relative;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: start;
  width: calc(100% - (var(--pad) * 2));
  margin-inline: auto;
  padding-top: 20px;
}

.primary-nav,
.brand,
.menu-toggle {
  pointer-events: auto;
}

.primary-nav {
  display: flex;
  align-items: center;
  gap: clamp(18px, 2.25vw, 42px);
  min-height: 68px;
}

.nav-link {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 0;
  color: rgba(255, 255, 255, .56);
  font-family: var(--ui);
  font-size: 9px;
  font-weight: 500;
  letter-spacing: .065em;
  text-transform: uppercase;
  text-shadow: 0 2px 15px rgba(0, 0, 0, .96);
  transition: color .3s ease, transform .3s var(--ease-out);
}

.nav-link span {
  color: rgba(255, 255, 255, .3);
  font-size: 7px;
}

.nav-link::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 4px;
  left: 0;
  height: 1px;
  background: rgba(255, 255, 255, .78);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform .35s var(--ease-out);
}

.nav-link:hover,
.nav-link:focus-visible,
.nav-link.is-active {
  color: var(--white);
}

.nav-link:hover {
  transform: translateY(-2px);
}

.nav-link:hover::after,
.nav-link:focus-visible::after,
.nav-link.is-active::after {
  transform: scaleX(1);
  transform-origin: left;
}

.brand {
  position: relative;
  display: grid;
  place-items: center;
  width: 146px;
  height: 88px;
  margin-right: -7px;
  isolation: isolate;
}

.brand-halo {
  position: absolute;
  z-index: -1;
  inset: 6px 0 8px;
  border: 1px solid rgba(255, 255, 255, .42);
  border-radius: 3px;
  background: linear-gradient(145deg, rgba(246, 243, 237, .94), rgba(194, 193, 189, .86));
  box-shadow: 0 12px 32px rgba(0, 0, 0, .42), inset 0 1px 0 rgba(255, 255, 255, .55);
}

.brand img {
  width: 136px;
  height: 84px;
  object-fit: contain;
  filter: saturate(1.1) contrast(1.1) drop-shadow(0 5px 18px rgba(0, 0, 0, .72));
  transition: transform .45s var(--ease-out);
}

.brand:hover img {
  transform: scale(1.04);
}

.menu-toggle {
  display: none;
  align-items: center;
  justify-self: start;
  gap: 7px;
  width: 82px;
  max-width: 82px;
  min-width: 82px;
  min-height: 48px;
  padding: 0;
  background: transparent;
  cursor: pointer;
}

.menu-toggle span {
  position: absolute;
  left: 0;
  width: 23px;
  height: 1px;
  background: var(--white);
  transition: transform .35s var(--ease-out), top .35s var(--ease-out);
}

.menu-toggle span:first-child { top: 18px; }
.menu-toggle span:nth-child(2) { top: 28px; }

.menu-toggle em {
  margin-left: 32px;
  color: rgba(255, 255, 255, .68);
  font-style: normal;
  font-family: var(--ui);
  font-size: 8px;
  letter-spacing: .1em;
  text-transform: uppercase;
}

/* Shared type and controls */
.eyebrow,
.section-label,
.act-kicker,
.platform-card-copy > span,
.pillar-number {
  font-family: var(--ui);
  font-size: 9px;
  font-weight: 550;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.eyebrow {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 24px;
  color: rgba(255, 255, 255, .7);
}

.eyebrow span {
  display: grid;
  place-items: center;
  width: 29px;
  height: 29px;
  border: 1px solid rgba(255, 255, 255, .25);
  border-radius: 50%;
  font-size: 8px;
}

.section-label {
  display: flex;
  align-items: center;
  gap: 13px;
  margin-bottom: 28px;
  color: var(--gold);
}

.section-label span {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border: 1px solid rgba(233, 189, 104, .42);
  border-radius: 50%;
  font-size: 8px;
}

.section-label p {
  margin: 0;
}

.section-label-light {
  color: rgba(255, 255, 255, .7);
}

.section-label-light span {
  border-color: rgba(255, 255, 255, .27);
}

h2 {
  margin-bottom: 28px;
  font-family: var(--display);
  font-size: clamp(54px, 6.2vw, 96px);
  font-weight: 430;
  line-height: .9;
  letter-spacing: -.035em;
}

h2 em,
.hero-manifesto em,
.closing-statement strong {
  color: var(--coral);
  font-weight: 430;
}

.lead {
  color: rgba(244, 239, 230, .74);
  font-size: clamp(17px, 1.45vw, 22px);
  line-height: 1.55;
}

.button {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  min-height: 56px;
  padding: 0 22px;
  overflow: hidden;
  border: 1px solid transparent;
  font-family: var(--ui);
  font-size: 9px;
  font-weight: 650;
  letter-spacing: .08em;
  text-transform: uppercase;
  transform: translate3d(var(--magnetic-x, 0), var(--magnetic-y, 0), 0);
  transition: color .35s ease, border-color .35s ease, transform .25s var(--ease-out);
  isolation: isolate;
}

.button::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background: var(--spectrum);
  transform: translateX(-104%);
  transition: transform .5s var(--ease-out);
}

.button:hover::before,
.button:focus-visible::before {
  transform: translateX(0);
}

.button b {
  font-size: 17px;
  font-weight: 400;
}

.button-primary {
  background: var(--ivory);
  color: #0a0a0a;
}

.button-primary:hover,
.button-primary:focus-visible {
  color: #050505;
}

.button-ghost {
  color: var(--white);
  border-color: rgba(255, 255, 255, .3);
  background: rgba(0, 0, 0, .12);
  backdrop-filter: blur(10px);
}

.round-control {
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: 50%;
  background: rgba(255, 255, 255, .03);
  color: var(--white);
  font-size: 18px;
  cursor: pointer;
  transform: translate3d(var(--magnetic-x, 0), var(--magnetic-y, 0), 0);
  transition: background .3s ease, border-color .3s ease, transform .25s var(--ease-out);
}

.round-control:hover,
.round-control:focus-visible {
  border-color: rgba(255, 255, 255, .7);
  background: rgba(255, 255, 255, .1);
}

a:focus-visible,
button:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 4px;
}

/* Hero */
.hero {
  position: relative;
  min-height: max(760px, 100svh);
  display: grid;
  align-items: center;
  overflow: hidden;
  background: #030304;
  isolation: isolate;
}

.hero-media,
.hero-veil,
.hero-orbit {
  position: absolute;
  inset: 0;
}

.hero-media {
  overflow: hidden;
}

.hero-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: saturate(1.12) contrast(1.08) brightness(.86);
  transform: translate3d(var(--parallax-x, 0), var(--parallax-y, 0), 0) scale(1.055);
  transition: transform .25s linear;
  will-change: transform;
}

.hero-veil {
  z-index: 1;
  background:
    linear-gradient(90deg, rgba(2, 2, 3, .9) 0%, rgba(2, 2, 3, .65) 39%, rgba(2, 2, 3, .18) 68%, rgba(2, 2, 3, .35) 100%),
    linear-gradient(180deg, rgba(2, 2, 3, .35), transparent 28%, transparent 67%, rgba(2, 2, 3, .86));
}

.hero-orbit {
  z-index: 1;
  left: auto;
  width: min(62vw, 970px);
  opacity: .35;
  background: repeating-radial-gradient(ellipse at 68% 50%, transparent 0, transparent 58px, rgba(255, 255, 255, .13) 59px, transparent 60px);
  mask-image: linear-gradient(90deg, transparent, black 34%, black);
  animation: orbitBreath 8s ease-in-out infinite alternate;
}

.hero-layout {
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 60px;
  padding: 150px 0 122px;
}

.hero-copy {
  max-width: 910px;
}

.hero h1 {
  margin: 0 0 24px;
  font-family: "Trajan Pro", var(--display);
  font-size: clamp(80px, 10.4vw, 180px);
  font-weight: 400;
  line-height: .78;
  letter-spacing: -.055em;
  text-shadow: 0 12px 50px rgba(0, 0, 0, .48);
  transform: translateY(60px);
  opacity: 0;
}

body.is-ready .hero h1 {
  animation: titleReveal 1.25s var(--ease-out) forwards .1s;
}

.hero-manifesto {
  margin: 0;
  font-family: var(--display);
  font-size: clamp(40px, 4.5vw, 72px);
  line-height: .95;
  letter-spacing: -.025em;
}

.hero-intro {
  max-width: 535px;
  margin: 26px 0 34px;
  color: rgba(255, 255, 255, .67);
  font-size: 17px;
  line-height: 1.58;
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.scroll-cue {
  position: absolute;
  z-index: 3;
  right: var(--pad);
  bottom: 30px;
  display: flex;
  align-items: center;
  gap: 13px;
  color: rgba(255, 255, 255, .52);
  font-family: var(--ui);
  font-size: 8px;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.scroll-cue i {
  position: relative;
  width: 42px;
  height: 1px;
  overflow: hidden;
  background: rgba(255, 255, 255, .22);
}

.scroll-cue i::after {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--spectrum);
  animation: scrollLine 1.9s ease-in-out infinite;
}

/* The idea */
.idea {
  position: relative;
  min-height: 1080px;
  padding: 160px 0 72px;
  overflow: hidden;
  background: #080807;
  isolation: isolate;
}

.idea-media,
.idea-veil {
  position: absolute;
  inset: 0;
}

.idea-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: saturate(.96) brightness(.83) contrast(1.06);
  transform: translate3d(var(--parallax-x, 0), var(--parallax-y, 0), 0) scale(1.04);
}

.idea-veil {
  z-index: 1;
  background:
    linear-gradient(90deg, rgba(4, 4, 4, .08) 0%, rgba(4, 4, 4, .2) 38%, rgba(4, 4, 4, .88) 68%, rgba(4, 4, 4, .97) 100%),
    linear-gradient(180deg, rgba(4, 4, 4, .78), transparent 22%, transparent 72%, rgba(4, 4, 4, .94));
}

.idea-layout {
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr minmax(460px, .9fr);
  gap: 8vw;
  align-items: end;
  min-height: 570px;
}

.idea-copy {
  grid-column: 2;
}

.idea-copy h2 {
  max-width: 760px;
}

.idea-copy .lead {
  max-width: 620px;
  margin-bottom: 18px;
}

.idea-copy > p:last-child {
  max-width: 590px;
  color: var(--muted);
}

.idea-quote {
  grid-column: 1;
  grid-row: 1;
  align-self: end;
  max-width: 450px;
  margin-bottom: 10px;
  padding: 0 0 0 28px;
  border-left: 1px solid rgba(255, 255, 255, .27);
}

.idea-quote > span {
  display: block;
  height: 25px;
  color: var(--coral);
  font-family: var(--display);
  font-size: 70px;
  line-height: .6;
}

.idea-quote p,
.idea-quote strong {
  display: block;
  margin: 0;
  font-family: var(--display);
  font-size: clamp(27px, 2.5vw, 39px);
  font-weight: 450;
  line-height: 1.04;
}

.idea-quote strong {
  margin-top: 7px;
  color: var(--coral);
}

.experience-code {
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin-top: 140px;
  border-top: 1px solid rgba(255, 255, 255, .24);
  border-bottom: 1px solid rgba(255, 255, 255, .24);
  background: linear-gradient(90deg, rgba(3, 3, 3, .58), rgba(3, 3, 3, .08));
  backdrop-filter: blur(7px);
}

.experience-code article {
  min-height: 176px;
  padding: 25px 25px 24px;
  border-right: 1px solid rgba(255, 255, 255, .2);
  transition: background .35s ease;
}

.experience-code article:first-child {
  padding-left: 0;
}

.experience-code article:last-child {
  border-right: 0;
}

.experience-code article:hover {
  background: rgba(255, 255, 255, .045);
}

.experience-code span {
  display: block;
  margin-bottom: 34px;
  color: var(--coral);
  font-family: var(--ui);
  font-size: 15px;
}

.experience-code h3 {
  margin: 0;
  font-family: var(--display);
  font-size: 32px;
  font-weight: 480;
}

.experience-code p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 12px;
}

/* Why now */
.why {
  position: relative;
  min-height: 1080px;
  padding: 155px 0 92px;
  overflow: hidden;
  background: #030404;
  isolation: isolate;
}

.why-media,
.why-veil {
  position: absolute;
  inset: 0;
}

.why-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: brightness(.8) saturate(1.08) contrast(1.08);
  transform: translate3d(var(--parallax-x, 0), var(--parallax-y, 0), 0) scale(1.045);
}

.why-veil {
  z-index: 1;
  background:
    linear-gradient(90deg, rgba(2, 3, 3, .92) 0%, rgba(2, 3, 3, .68) 40%, rgba(2, 3, 3, .12) 78%),
    linear-gradient(180deg, rgba(2, 3, 3, .82), transparent 23%, transparent 61%, rgba(2, 3, 3, .94));
}

.why-layout {
  z-index: 2;
}

.why-intro {
  max-width: 760px;
}

.why-intro h2 {
  max-width: 830px;
}

.why-intro .lead {
  max-width: 610px;
}

.reason-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin-top: 125px;
  border-top: 1px solid rgba(255, 255, 255, .22);
  border-bottom: 1px solid rgba(255, 255, 255, .22);
}

.glow-card {
  --mx: 50%;
  --my: 50%;
  position: relative;
  isolation: isolate;
}

.glow-card::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  opacity: 0;
  background: radial-gradient(340px circle at var(--mx) var(--my), rgba(232, 116, 122, .16), rgba(75, 150, 230, .06) 34%, transparent 66%);
  transition: opacity .35s ease;
}

.glow-card:hover::before,
.glow-card:focus-within::before {
  opacity: 1;
}

.reason-grid article {
  min-height: 255px;
  padding: 27px 26px 30px;
  border-right: 1px solid rgba(255, 255, 255, .2);
  background: rgba(2, 3, 3, .34);
  backdrop-filter: blur(6px);
}

.reason-grid article:first-child {
  padding-left: 0;
}

.reason-grid article:last-child {
  border-right: 0;
}

.reason-grid span {
  color: var(--coral);
  font-family: var(--ui);
  font-size: 16px;
}

.reason-grid h3 {
  margin: 54px 0 13px;
  font-family: var(--display);
  font-size: clamp(28px, 2.15vw, 36px);
  font-weight: 450;
  line-height: .96;
}

.reason-grid p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.55;
}

/* Nine acts */
.journey {
  position: relative;
  min-height: 1180px;
  padding: 150px 0 170px;
  overflow: hidden;
  background:
    radial-gradient(circle at 78% 52%, rgba(65, 75, 141, .16), transparent 30%),
    radial-gradient(circle at 64% 70%, rgba(185, 64, 128, .1), transparent 32%),
    #070707;
  isolation: isolate;
}

.journey::before {
  content: "";
  position: absolute;
  top: 310px;
  right: -260px;
  width: 800px;
  height: 800px;
  border: 1px solid rgba(255, 255, 255, .07);
  border-radius: 50%;
  box-shadow:
    0 0 0 70px rgba(255, 255, 255, .025),
    0 0 0 150px rgba(255, 255, 255, .018),
    0 0 0 240px rgba(255, 255, 255, .012);
}

.journey-glow {
  position: absolute;
  top: 300px;
  right: -80px;
  width: 660px;
  height: 660px;
  opacity: .19;
  border-radius: 50%;
  background: conic-gradient(from 30deg, var(--amber), var(--coral), var(--pink), var(--violet), var(--blue), var(--teal), var(--green), var(--amber));
  filter: blur(110px);
  animation: spinGlow 22s linear infinite;
}

.journey-heading {
  display: grid;
  grid-template-columns: minmax(190px, .33fr) 1fr;
  gap: 6vw;
  align-items: start;
}

.journey-heading .section-label {
  margin-top: 8px;
}

.journey-heading h2 {
  margin-bottom: 20px;
}

.journey-heading .lead {
  max-width: 720px;
}

.journey-stage {
  display: grid;
  grid-template-columns: minmax(320px, .72fr) minmax(540px, 1.28fr);
  gap: 6vw;
  align-items: center;
  min-height: 650px;
  margin-top: 80px;
}

.act-detail {
  position: relative;
  z-index: 4;
  max-width: 445px;
  padding: 42px 0;
}

.act-kicker {
  display: flex;
  align-items: center;
  gap: 13px;
  margin-bottom: 28px;
  color: var(--coral);
}

.act-kicker i {
  width: 38px;
  height: 1px;
  background: rgba(255, 255, 255, .22);
}

.act-count {
  color: rgba(255, 255, 255, .4);
}

.act-detail h3 {
  margin: 0 0 14px;
  font-family: var(--display);
  font-size: clamp(52px, 5.1vw, 78px);
  font-weight: 440;
  line-height: .88;
  letter-spacing: -.035em;
}

.act-theme {
  margin-bottom: 22px;
  color: var(--gold);
  font-family: var(--display);
  font-size: 23px;
  line-height: 1.1;
}

.act-description {
  max-width: 410px;
  color: var(--muted);
  font-size: 14px;
}

.act-detail.is-changing .act-index,
.act-detail.is-changing .act-count,
.act-detail.is-changing h3,
.act-detail.is-changing .act-theme,
.act-detail.is-changing .act-description {
  animation: actText .58s var(--ease-out);
}

.carousel-controls {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 36px;
}

.carousel-progress {
  position: relative;
  width: min(180px, 30vw);
  height: 1px;
  overflow: hidden;
  background: rgba(255, 255, 255, .18);
}

.carousel-progress span {
  display: block;
  width: var(--act-progress, 11.11%);
  height: 100%;
  background: var(--spectrum);
  transition: width .6s var(--ease-out);
}

.drag-hint {
  margin: 16px 0 0;
  color: rgba(255, 255, 255, .35);
  font-family: var(--ui);
  font-size: 8px;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.act-deck {
  position: relative;
  height: 650px;
  perspective: 1400px;
  perspective-origin: 50% 52%;
  cursor: grab;
  touch-action: pan-y;
}

.act-deck.is-dragging {
  cursor: grabbing;
}

.act-card {
  --x: 0px;
  --y: 0px;
  --z: 0px;
  --rotate: 0deg;
  --scale: 1;
  position: absolute;
  top: 50%;
  left: 50%;
  width: min(360px, 40vw);
  height: 540px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .17);
  border-radius: 18px;
  opacity: var(--card-opacity, 0);
  background: #111;
  box-shadow: 0 32px 90px rgba(0, 0, 0, .55);
  transform: translate3d(calc(-50% + var(--x)), calc(-50% + var(--y)), var(--z)) rotateY(var(--rotate)) scale(var(--scale));
  transform-style: preserve-3d;
  backface-visibility: hidden;
  transition:
    transform .85s var(--ease-out),
    opacity .5s ease,
    filter .65s ease,
    border-color .4s ease;
  will-change: transform;
  user-select: none;
}

.act-card::before,
.act-card::after {
  content: "";
  position: absolute;
  inset: 0;
}

.act-card::before {
  z-index: 1;
  background: linear-gradient(180deg, rgba(0, 0, 0, .04) 25%, rgba(0, 0, 0, .92) 100%);
}

.act-card::after {
  z-index: 2;
  opacity: 0;
  border: 1px solid transparent;
  border-radius: inherit;
  background: linear-gradient(#101010, #101010) padding-box, var(--spectrum) border-box;
  transition: opacity .45s ease;
  pointer-events: none;
}

.act-card.is-active {
  border-color: rgba(255, 255, 255, .36);
}

.act-card.is-active::after {
  opacity: .56;
}

.act-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
  transition: transform 1.1s var(--ease-out), filter .6s ease;
}

.act-card.is-active img {
  transform: scale(1.025);
}

.act-card > div {
  position: absolute;
  z-index: 3;
  right: 26px;
  bottom: 25px;
  left: 26px;
  text-shadow: 0 4px 24px rgba(0, 0, 0, .8);
}

.act-card > div span {
  color: var(--coral);
  font-family: var(--ui);
  font-size: 10px;
}

.act-card h4 {
  margin: 8px 0 7px;
  font-family: var(--display);
  font-size: 35px;
  font-weight: 460;
  line-height: .93;
}

.act-card p {
  margin: 0;
  color: rgba(255, 255, 255, .65);
  font-size: 10px;
  text-transform: uppercase;
}

/* Pillars */
.pillars {
  position: relative;
  min-height: 920px;
  display: grid;
  align-items: center;
  overflow: hidden;
  background: #040504;
  isolation: isolate;
}

.pillars-media,
.pillars-veil {
  position: absolute;
  inset: 0;
}

.pillars-media {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: brightness(.7) saturate(1.12) contrast(1.1);
  transform: scale(1.045) translateX(var(--pillar-shift, 0%));
  transition: transform 1.1s var(--ease-out), filter .8s ease;
}

.pillars-veil {
  z-index: 1;
  background:
    linear-gradient(90deg, rgba(3, 4, 3, .94), rgba(3, 4, 3, .68) 42%, rgba(3, 4, 3, .18) 72%, rgba(3, 4, 3, .5)),
    linear-gradient(180deg, rgba(3, 4, 3, .72), transparent 35%, rgba(3, 4, 3, .72));
}

.pillar-rings {
  position: absolute;
  z-index: 2;
  top: 50%;
  right: 4vw;
  width: min(58vw, 820px);
  aspect-ratio: 1;
  transform: translateY(-50%);
  pointer-events: none;
}

.pillar-rings span {
  position: absolute;
  inset: 12%;
  border: 1px solid rgba(255, 255, 255, .17);
  border-radius: 50%;
  animation: ringPulse 7s ease-in-out infinite;
}

.pillar-rings span:nth-child(2) {
  inset: 24%;
  animation-delay: -2s;
}

.pillar-rings span:nth-child(3) {
  inset: 36%;
  animation-delay: -4s;
}

.pillars-layout {
  z-index: 3;
  display: grid;
  grid-template-columns: .75fr 1.25fr;
  gap: 7vw;
  align-items: center;
  padding: 130px 0;
}

.pillar-nav {
  max-width: 420px;
}

.pillar-nav .eyebrow {
  margin-bottom: 34px;
  color: var(--gold);
}

.pillar-tab {
  position: relative;
  display: grid;
  grid-template-columns: 42px 1fr;
  align-items: center;
  width: 100%;
  padding: 14px 0 17px;
  overflow: hidden;
  border-bottom: 1px solid rgba(255, 255, 255, .18);
  background: transparent;
  color: rgba(255, 255, 255, .5);
  font-family: var(--display);
  font-size: clamp(33px, 3.3vw, 51px);
  line-height: 1;
  text-align: left;
  cursor: pointer;
  transition: color .35s ease, padding-left .4s var(--ease-out);
}

.pillar-tab::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: -1px;
  left: 0;
  height: 2px;
  background: var(--spectrum);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform .55s var(--ease-out);
}

.pillar-tab span {
  color: rgba(255, 255, 255, .3);
  font-family: var(--ui);
  font-size: 9px;
}

.pillar-tab:hover,
.pillar-tab:focus-visible,
.pillar-tab.is-active {
  padding-left: 8px;
  color: var(--white);
}

.pillar-tab.is-active::after {
  transform: scaleX(1);
  transform-origin: left;
}

.pillar-copy {
  justify-self: end;
  width: min(620px, 100%);
  padding: 52px;
  border: 1px solid rgba(255, 255, 255, .17);
  background: rgba(4, 5, 4, .28);
  backdrop-filter: blur(13px);
}

.pillar-number {
  margin-bottom: 90px;
  color: var(--coral);
}

.pillar-copy h2 {
  margin-bottom: 24px;
  font-size: clamp(74px, 8.5vw, 130px);
}

.pillar-copy > p:not(.pillar-number) {
  max-width: 500px;
  margin-bottom: 38px;
  color: rgba(255, 255, 255, .74);
  font-size: 17px;
}

.pillar-line {
  height: 2px;
  overflow: hidden;
  background: rgba(255, 255, 255, .16);
}

.pillar-line i {
  display: block;
  width: 25%;
  height: 100%;
  background: var(--spectrum);
  transform: translateX(var(--pillar-line, 0%));
  transition: transform .8s var(--ease-out);
}

.pillar-copy.is-changing h2,
.pillar-copy.is-changing > p {
  animation: pillarText .55s var(--ease-out);
}

/* Cultural platform */
.platform {
  position: relative;
  min-height: 1600px;
  padding: 160px 0 0;
  overflow: hidden;
  background: #050605;
  isolation: isolate;
}

.platform-media,
.platform-veil {
  position: absolute;
  inset: 0;
}

.platform-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  filter: brightness(.58) saturate(1.04) contrast(1.08);
}

.platform-veil {
  z-index: 1;
  background:
    linear-gradient(180deg, rgba(3, 4, 3, .9) 0%, rgba(3, 4, 3, .28) 28%, rgba(3, 4, 3, .6) 65%, rgba(3, 4, 3, .96) 100%),
    linear-gradient(90deg, rgba(3, 4, 3, .78), rgba(3, 4, 3, .22) 58%, rgba(3, 4, 3, .63));
}

.platform-heading {
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(190px, .33fr) 1fr;
  gap: 6vw;
  align-items: start;
}

.platform-heading .section-label {
  margin-top: 7px;
}

.platform-heading h2 {
  max-width: 940px;
  margin-bottom: 20px;
}

.platform-heading .lead {
  max-width: 710px;
}

.platform-grid {
  z-index: 2;
  display: grid;
  grid-template-columns: 1.08fr .92fr;
  grid-template-rows: 300px 300px 340px;
  gap: 18px;
  margin-top: 95px;
}

.platform-card {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 2px;
  background: #0b0b0a;
  box-shadow: 0 24px 70px rgba(0, 0, 0, .28);
}

.platform-card-large {
  grid-row: 1 / 3;
}

.platform-card-wide {
  grid-column: 1 / 3;
}

.platform-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: brightness(.68) saturate(.9);
  transition: transform 1s var(--ease-out), filter .6s ease;
}

.platform-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, transparent 23%, rgba(4, 4, 4, .3) 48%, rgba(4, 4, 4, .95) 100%);
  pointer-events: none;
}

.platform-card-wide::after {
  background: linear-gradient(90deg, rgba(4, 4, 4, .9), rgba(4, 4, 4, .26) 55%, rgba(4, 4, 4, .65));
}

.platform-card:hover img {
  transform: scale(1.045);
  filter: brightness(.86) saturate(1.04);
}

.platform-card-copy {
  position: absolute;
  z-index: 3;
  right: 32px;
  bottom: 30px;
  left: 32px;
}

.platform-card-wide .platform-card-copy {
  top: 50%;
  right: auto;
  bottom: auto;
  width: min(520px, 45%);
  transform: translateY(-50%);
}

.platform-card-copy > span {
  color: var(--coral);
}

.platform-card-copy h3 {
  margin: 8px 0 8px;
  font-family: var(--display);
  font-size: clamp(32px, 3vw, 48px);
  font-weight: 460;
  line-height: .94;
}

.platform-card-copy p {
  max-width: 520px;
  margin: 0;
  color: rgba(255, 255, 255, .67);
  font-size: 12px;
}

.archive-marquee {
  position: relative;
  z-index: 2;
  margin-top: 110px;
  padding: 25px 0 31px;
  overflow: hidden;
  border-top: 1px solid rgba(255, 255, 255, .17);
  border-bottom: 1px solid rgba(255, 255, 255, .17);
  white-space: nowrap;
}

.archive-marquee > div {
  display: flex;
  align-items: center;
  width: max-content;
  animation: marquee 28s linear infinite;
}

.archive-marquee span {
  padding: 0 38px;
  font-family: var(--display);
  font-size: clamp(42px, 5vw, 78px);
  line-height: 1;
}

.archive-marquee i {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--coral);
  box-shadow: 0 0 22px rgba(238, 115, 121, .8);
}

/* Partner finale */
.partners {
  position: relative;
  min-height: 1260px;
  padding: 175px 0 105px;
  overflow: hidden;
  background: #040404;
  isolation: isolate;
}

.partners-media,
.partners-veil {
  position: absolute;
  inset: 0;
}

.partners-media {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: brightness(.78) saturate(1.12) contrast(1.08);
}

.partners-veil {
  z-index: 1;
  background:
    linear-gradient(90deg, rgba(2, 2, 2, .94) 0%, rgba(2, 2, 2, .75) 40%, rgba(2, 2, 2, .17) 70%, rgba(2, 2, 2, .32)),
    linear-gradient(180deg, rgba(2, 2, 2, .75), transparent 27%, transparent 64%, rgba(2, 2, 2, .96));
}

.partners-layout {
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr .9fr;
  gap: 8vw;
  align-items: start;
}

.partner-copy {
  max-width: 680px;
}

.partner-copy h2 {
  font-size: clamp(58px, 6.7vw, 105px);
}

.partner-copy .lead {
  max-width: 610px;
}

.partner-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 24px;
  margin-top: 34px;
}

.contact-link {
  position: relative;
  padding: 10px 0 6px;
  color: rgba(255, 255, 255, .72);
  border-bottom: 1px solid rgba(255, 255, 255, .35);
  font-family: var(--ui);
  font-size: 11px;
}

.partner-types {
  border-top: 1px solid rgba(255, 255, 255, .22);
  background: linear-gradient(180deg, rgba(0, 0, 0, .22), rgba(0, 0, 0, .05));
  backdrop-filter: blur(5px);
}

.partner-types article {
  display: grid;
  grid-template-columns: 50px 1fr;
  gap: 16px;
  align-items: center;
  min-height: 99px;
  padding: 17px 4px;
  border-bottom: 1px solid rgba(255, 255, 255, .19);
  transition: padding-left .4s var(--ease-out), background .35s ease;
}

.partner-types article:hover {
  padding-left: 12px;
  background: rgba(255, 255, 255, .035);
}

.partner-types article > span {
  color: var(--coral);
  font-family: var(--ui);
  font-size: 10px;
}

.partner-types h3 {
  margin: 0 0 4px;
  font-family: var(--display);
  font-size: 25px;
  font-weight: 460;
  line-height: 1;
}

.partner-types p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
}

.closing-statement {
  z-index: 2;
  margin-top: 160px;
  padding-top: 62px;
  border-top: 1px solid rgba(255, 255, 255, .22);
  text-align: center;
}

.closing-statement p,
.closing-statement strong {
  display: block;
  margin: 0;
  font-family: var(--display);
  font-size: clamp(41px, 5vw, 74px);
  font-weight: 430;
  line-height: 1;
}

.closing-statement strong {
  margin-top: 4px;
}

/* Footer */
.site-footer {
  position: relative;
  padding: 85px 0 28px;
  overflow: hidden;
  background: #050505;
}

.footer-spectrum {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 3px;
  background: var(--spectrum);
}

.footer-main {
  display: grid;
  grid-template-columns: 1.25fr .65fr .95fr;
  gap: 8vw;
  align-items: start;
}

.footer-identity {
  max-width: 470px;
}

.footer-brand {
  position: relative;
  display: grid;
  place-items: center;
  width: 190px;
  height: 115px;
  isolation: isolate;
}

.footer-brand > span {
  position: absolute;
  z-index: -1;
  inset: 7px 0 10px;
  border: 1px solid rgba(255, 255, 255, .42);
  border-radius: 3px;
  background: linear-gradient(145deg, rgba(246, 243, 237, .94), rgba(194, 193, 189, .86));
  box-shadow: 0 12px 32px rgba(0, 0, 0, .42), inset 0 1px 0 rgba(255, 255, 255, .55);
}

.footer-brand img {
  width: 180px;
  height: 108px;
  object-fit: contain;
  filter: saturate(1.08) contrast(1.1) drop-shadow(0 7px 16px rgba(0, 0, 0, .75));
}

.footer-identity > p {
  max-width: 400px;
  margin: 24px 0 0;
  color: rgba(255, 255, 255, .75);
  font-family: var(--display);
  font-size: 25px;
  line-height: 1.18;
}

.footer-nav,
.footer-contact {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.footer-nav > p,
.footer-contact > p {
  margin-bottom: 20px;
  color: rgba(255, 255, 255, .38);
  font-family: var(--ui);
  font-size: 8px;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.footer-nav a {
  padding: 3px 0;
  color: rgba(255, 255, 255, .68);
  font-family: var(--display);
  font-size: 21px;
  transition: color .25s ease, transform .3s var(--ease-out);
}

.footer-nav a:hover {
  color: var(--coral);
  transform: translateX(5px);
}

.footer-contact a {
  display: flex;
  gap: 12px;
  margin-bottom: 13px;
  padding-bottom: 5px;
  color: rgba(255, 255, 255, .72);
  border-bottom: 1px solid rgba(255, 255, 255, .24);
  font-family: var(--ui);
  font-size: 11px;
}

.footer-contact a span {
  color: var(--teal);
}

.footer-bottom {
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  gap: 24px;
  margin-top: 70px;
  padding-top: 24px;
  border-top: 1px solid rgba(255, 255, 255, .14);
}

.footer-bottom p {
  margin: 0;
  color: rgba(255, 255, 255, .35);
  font-family: var(--ui);
  font-size: 8px;
}

.spectrum-text {
  background: var(--spectrum);
  background-clip: text;
  color: transparent !important;
  font-weight: 650;
}

/* Reveal and motion */
.reveal {
  opacity: 0;
  transform: translateY(36px);
  transition: opacity .9s ease, transform 1s var(--ease-out);
}

.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

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

@keyframes preLine {
  0% { transform: scaleX(0); }
  68% { transform: scaleX(.72); }
  100% { transform: scaleX(1); }
}

@keyframes preloaderAura {
  to { transform: translateY(-5%) scale(1.15); opacity: .72; }
}

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

@keyframes orbitBreath {
  to { opacity: .5; transform: scale(1.04); }
}

@keyframes scrollLine {
  0% { transform: translateX(-110%); }
  60%, 100% { transform: translateX(110%); }
}

@keyframes spinGlow {
  to { transform: rotate(360deg); }
}

@keyframes ringPulse {
  0%, 100% { opacity: .35; transform: scale(.96); }
  50% { opacity: .8; transform: scale(1.03); }
}

@keyframes pillarText {
  0% { opacity: 0; transform: translateY(18px); }
  100% { opacity: 1; transform: translateY(0); }
}

@keyframes actText {
  0% { opacity: 0; transform: translateY(14px); }
  100% { opacity: 1; transform: translateY(0); }
}

@keyframes marquee {
  to { transform: translateX(-50%); }
}

/* Laptop and tablet */
@media (max-width: 1180px) {
  :root {
    --pad: max(24px, 4vw);
  }

  .primary-nav {
    gap: 18px;
  }

  .nav-link {
    font-size: 8px;
  }

  .brand {
    width: 130px;
  }

  .journey-stage {
    grid-template-columns: minmax(300px, .78fr) minmax(450px, 1.22fr);
    gap: 3vw;
  }

  .act-card {
    width: min(330px, 38vw);
    height: 510px;
  }

  .pillar-copy {
    padding: 42px;
  }
}

@media (max-width: 1024px) {
  .header-shell {
    grid-template-columns: 1fr auto;
    padding-top: 12px;
  }

  .menu-toggle {
    display: flex;
    position: relative;
    z-index: 3;
  }

  .primary-nav {
    position: fixed;
    z-index: 2;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 0;
    padding: 110px var(--pad) 70px;
    visibility: hidden;
    opacity: 0;
    background:
      radial-gradient(circle at 78% 18%, rgba(82, 79, 168, .22), transparent 32%),
      linear-gradient(145deg, rgba(2, 2, 2, .98), rgba(8, 8, 8, .96));
    backdrop-filter: blur(22px);
    transform: translateY(-18px);
    transition: opacity .4s ease, visibility .4s, transform .45s var(--ease-out);
  }

  .primary-nav::after {
    content: "Before we had names, we were simply human.";
    position: absolute;
    right: var(--pad);
    bottom: 40px;
    max-width: 310px;
    color: rgba(255, 255, 255, .46);
    font-family: var(--display);
    font-size: 24px;
    text-align: right;
  }

  .menu-open .primary-nav {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
  }

  .menu-open .menu-toggle span:first-child {
    top: 23px;
    transform: rotate(45deg);
  }

  .menu-open .menu-toggle span:nth-child(2) {
    top: 23px;
    transform: rotate(-45deg);
  }

  .menu-open .menu-toggle em {
    opacity: 0;
  }

  .nav-link {
    width: min(590px, 78vw);
    gap: 22px;
    padding: 10px 0 13px;
    border-bottom: 1px solid rgba(255, 255, 255, .13);
    color: rgba(255, 255, 255, .55);
    font-family: var(--display);
    font-size: clamp(34px, 5vw, 58px);
    font-weight: 430;
    letter-spacing: -.02em;
    text-transform: none;
  }

  .nav-link span {
    width: 26px;
    font-family: var(--ui);
    font-size: 9px;
  }

  .nav-link::after {
    display: none;
  }

  .brand {
    z-index: 3;
  }

  .hero-layout {
    padding-bottom: 145px;
  }

  .idea-layout {
    grid-template-columns: .85fr 1.15fr;
    gap: 5vw;
  }

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

  .reason-grid article:nth-child(2) {
    border-right: 0;
  }

  .reason-grid article:nth-child(-n+2) {
    border-bottom: 1px solid rgba(255, 255, 255, .2);
  }

  .reason-grid article:nth-child(3) {
    padding-left: 0;
  }

  .journey-stage {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .act-detail {
    display: grid;
    grid-template-columns: 1fr .8fr;
    gap: 12px 45px;
    max-width: none;
    padding-bottom: 0;
  }

  .act-kicker,
  .act-detail h3,
  .act-theme {
    grid-column: 1;
  }

  .act-description,
  .carousel-controls,
  .drag-hint {
    grid-column: 2;
  }

  .act-description {
    grid-row: 1 / span 2;
    align-self: end;
  }

  .carousel-controls {
    grid-row: 3;
    align-self: end;
    margin-top: 0;
  }

  .drag-hint {
    grid-row: 4;
  }

  .act-deck {
    height: 590px;
  }

  .act-card {
    width: min(350px, 48vw);
    height: 510px;
  }

  .pillars-layout {
    grid-template-columns: .9fr 1.1fr;
    gap: 4vw;
  }

  .pillar-copy {
    padding: 35px;
  }

  .platform {
    min-height: 1580px;
  }

  .partners-layout {
    grid-template-columns: 1fr;
  }

  .partner-types {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    margin-top: 90px;
    border-bottom: 1px solid rgba(255, 255, 255, .18);
  }

  .partner-types article {
    padding-right: 20px;
    border-right: 1px solid rgba(255, 255, 255, .18);
  }

  .partner-types article:nth-child(even) {
    padding-left: 20px;
    border-right: 0;
  }
}

@media (max-width: 820px) {
  .hero-layout {
    grid-template-columns: 1fr;
  }

  .idea {
    min-height: 1180px;
  }

  .idea-layout {
    grid-template-columns: 1fr;
    align-content: end;
  }

  .idea-copy {
    grid-column: 1;
    max-width: 620px;
    padding: 35px;
    background: rgba(3, 3, 3, .62);
    backdrop-filter: blur(12px);
  }

  .idea-quote {
    grid-row: 2;
    margin-top: 34px;
  }

  .experience-code {
    grid-template-columns: repeat(2, 1fr);
    margin-top: 95px;
  }

  .experience-code article:nth-child(2) {
    border-right: 0;
  }

  .experience-code article:nth-child(-n+2) {
    border-bottom: 1px solid rgba(255, 255, 255, .2);
  }

  .experience-code article:nth-child(3) {
    padding-left: 0;
  }

  .journey-heading,
  .platform-heading {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .journey-heading .section-label,
  .platform-heading .section-label {
    margin-top: 0;
  }

  .pillars {
    min-height: 1060px;
  }

  .pillars-layout {
    grid-template-columns: 1fr;
    align-content: center;
  }

  .pillar-nav {
    max-width: none;
  }

  .pillar-nav .eyebrow {
    margin-bottom: 20px;
  }

  .pillar-tab {
    display: inline-grid;
    width: 49%;
    padding-right: 20px;
    font-size: 34px;
  }

  .pillar-copy {
    justify-self: start;
    width: min(590px, 100%);
    margin-top: 45px;
  }

  .pillar-number {
    margin-bottom: 40px;
  }

  .pillar-rings {
    right: -24vw;
    width: 100vw;
  }

  .platform-grid {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 540px 330px 330px;
  }

  .platform-card-large {
    grid-column: 1 / 3;
    grid-row: 1;
  }

  .platform-card-wide {
    grid-column: 1 / 3;
    grid-row: 3;
  }

  .site-footer {
    padding-top: 75px;
  }

  .footer-main {
    grid-template-columns: 1.1fr .9fr;
    gap: 60px;
  }

  .footer-contact {
    grid-column: 1 / 3;
  }
}

/* Mobile */
@media (max-width: 620px) {
  :root {
    --pad: 20px;
  }

  body {
    font-size: 15px;
  }

  .page-noise {
    opacity: .12;
  }

  .header-shell {
    width: calc(100% - 32px);
    padding-top: 8px;
  }

  .brand {
    width: 112px;
    height: 72px;
  }

  .brand-halo {
    inset: 5px 0 7px;
  }

  .brand img {
    width: 107px;
    height: 69px;
  }

  .menu-toggle {
    min-height: 46px;
  }

  .primary-nav {
    padding-top: 92px;
  }

  .primary-nav::after {
    right: var(--pad);
    left: var(--pad);
    max-width: none;
    font-size: 20px;
  }

  .nav-link {
    width: 100%;
    padding: 9px 0 11px;
    font-size: clamp(31px, 10vw, 44px);
  }

  h2 {
    font-size: clamp(49px, 15.5vw, 68px);
  }

  .lead {
    font-size: 17px;
  }

  .button {
    min-height: 53px;
  }

  .hero {
    min-height: 760px;
  }

  .hero-media img {
    object-position: center;
    filter: saturate(1.1) contrast(1.08) brightness(.76);
  }

  .hero-veil {
    background:
      linear-gradient(180deg, rgba(2, 2, 3, .62), rgba(2, 2, 3, .18) 31%, rgba(2, 2, 3, .68) 67%, rgba(2, 2, 3, .96)),
      linear-gradient(90deg, rgba(2, 2, 3, .75), transparent 72%);
  }

  .hero-orbit {
    width: 100%;
    opacity: .2;
  }

  .hero-layout {
    align-items: end;
    min-height: 760px;
    padding: 140px 0 48px;
  }

  .hero h1 {
    margin-bottom: 18px;
    font-size: clamp(55px, 17.5vw, 76px);
    line-height: .88;
    letter-spacing: -.06em;
  }

  .hero-manifesto {
    font-size: clamp(37px, 12vw, 51px);
  }

  .hero-intro {
    max-width: 360px;
    margin: 20px 0 27px;
    font-size: 14px;
  }

  .hero-actions {
    align-items: stretch;
  }

  .hero-actions .button:first-child {
    flex: 1 1 100%;
  }

  .hero-actions .button-ghost {
    flex: 1 1 auto;
  }

  .scroll-cue {
    display: none;
  }

  .idea {
    min-height: 0;
    padding: 20px 0 44px;
  }

  .idea-media img {
    object-position: center top;
    filter: brightness(.72) saturate(.98);
  }

  .idea-veil {
    background:
      linear-gradient(180deg, rgba(3, 3, 3, .34), rgba(3, 3, 3, .17) 30%, rgba(3, 3, 3, .91) 60%, rgba(3, 3, 3, .98)),
      linear-gradient(90deg, rgba(3, 3, 3, .16), rgba(3, 3, 3, .38));
  }

  .idea-layout {
    min-height: 700px;
    align-content: end;
  }

  .idea-copy {
    padding: 24px 0 0;
    background: transparent;
    backdrop-filter: none;
  }

  .idea-copy h2 {
    margin-bottom: 20px;
  }

  .idea-copy .lead {
    font-size: 16px;
  }

  .idea-quote {
    max-width: 330px;
    margin-top: 26px;
    padding-left: 18px;
  }

  .idea-quote p,
  .idea-quote strong {
    font-size: 27px;
  }

  .experience-code {
    margin-top: 40px;
  }

  .experience-code article,
  .experience-code article:first-child,
  .experience-code article:nth-child(3) {
    min-height: 155px;
    padding: 20px 14px;
  }

  .experience-code article:nth-child(odd) {
    padding-left: 0;
  }

  .experience-code span {
    margin-bottom: 27px;
    font-size: 13px;
  }

  .experience-code h3 {
    font-size: 28px;
  }

  .why {
    min-height: 0;
    padding: 48px 0 64px;
  }

  .why-media img {
    object-position: center top;
    filter: brightness(.7) saturate(1.06);
  }

  .why-veil {
    background:
      linear-gradient(180deg, rgba(2, 3, 3, .45), rgba(2, 3, 3, .18) 27%, rgba(2, 3, 3, .8) 53%, rgba(2, 3, 3, .98) 79%),
      linear-gradient(90deg, rgba(2, 3, 3, .63), transparent 75%);
  }

  .why-intro {
    padding-top: 210px;
  }

  .reason-grid {
    grid-template-columns: 1fr;
    margin-top: 65px;
  }

  .reason-grid article,
  .reason-grid article:first-child,
  .reason-grid article:nth-child(3) {
    min-height: 205px;
    padding: 23px 4px 25px;
    border-right: 0;
    border-bottom: 1px solid rgba(255, 255, 255, .2);
    background: transparent;
  }

  .reason-grid article:last-child {
    border-bottom: 0;
  }

  .reason-grid h3 {
    margin-top: 33px;
    font-size: 33px;
  }

  .journey {
    min-height: 0;
    padding: 110px 0 115px;
  }

  .journey::before {
    top: 450px;
    right: -490px;
  }

  .journey-heading .lead {
    font-size: 16px;
  }

  .journey-stage {
    margin-top: 45px;
  }

  .act-detail {
    display: block;
    order: 2;
    padding-top: 12px;
  }

  .act-detail h3 {
    font-size: 54px;
  }

  .act-description {
    font-size: 13px;
  }

  .carousel-controls {
    margin-top: 27px;
  }

  .carousel-progress {
    flex: 1;
    width: auto;
  }

  .act-deck {
    order: 1;
    height: 500px;
  }

  .act-card {
    width: min(76vw, 310px);
    height: 440px;
    border-radius: 14px;
  }

  .act-card > div {
    right: 20px;
    bottom: 20px;
    left: 20px;
  }

  .act-card h4 {
    font-size: 30px;
  }

  .pillars {
    min-height: 1050px;
  }

  .pillars-media {
    object-position: 66% center;
    filter: brightness(.55) saturate(1.1);
  }

  .pillars-veil {
    background: linear-gradient(180deg, rgba(3, 4, 3, .95), rgba(3, 4, 3, .52) 43%, rgba(3, 4, 3, .88));
  }

  .pillars-layout {
    padding: 105px 0 85px;
  }

  .pillar-tab {
    display: grid;
    width: 100%;
    font-size: 35px;
  }

  .pillar-copy {
    margin-top: 50px;
    padding: 28px 24px;
    background: rgba(3, 4, 3, .45);
  }

  .pillar-copy h2 {
    font-size: 72px;
  }

  .pillar-copy > p:not(.pillar-number) {
    font-size: 15px;
  }

  .pillar-rings {
    top: 67%;
    right: -46vw;
    width: 150vw;
  }

  .platform {
    min-height: 0;
    padding-top: 110px;
  }

  .platform-media img {
    object-position: 44% top;
  }

  .platform-heading h2 {
    font-size: 49px;
  }

  .platform-heading .lead {
    font-size: 16px;
  }

  .platform-grid {
    grid-template-columns: 1fr;
    grid-template-rows: repeat(4, 430px);
    margin-top: 55px;
  }

  .platform-card-large,
  .platform-card-wide {
    grid-column: 1;
    grid-row: auto;
  }

  .platform-card-wide .platform-card-copy {
    top: auto;
    right: 24px;
    bottom: 24px;
    left: 24px;
    width: auto;
    transform: none;
  }

  .platform-card-copy {
    right: 24px;
    bottom: 24px;
    left: 24px;
  }

  .platform-card-copy h3 {
    font-size: 39px;
  }

  .archive-marquee {
    margin-top: 80px;
  }

  .partners {
    min-height: 0;
    padding: 115px 0 85px;
  }

  .partners-media {
    object-position: 66% center;
  }

  .partners-veil {
    background:
      linear-gradient(180deg, rgba(2, 2, 2, .89), rgba(2, 2, 2, .42) 42%, rgba(2, 2, 2, .88) 73%, rgba(2, 2, 2, .98)),
      linear-gradient(90deg, rgba(2, 2, 2, .76), transparent);
  }

  .partner-copy h2 {
    font-size: 57px;
  }

  .partner-copy .lead {
    font-size: 16px;
  }

  .partner-actions {
    align-items: flex-start;
    flex-direction: column;
  }

  .partner-types {
    grid-template-columns: 1fr;
    margin-top: 80px;
    background: rgba(0, 0, 0, .28);
  }

  .partner-types article,
  .partner-types article:nth-child(even) {
    min-height: 93px;
    padding: 15px 3px;
    border-right: 0;
  }

  .closing-statement {
    margin-top: 110px;
    padding-top: 45px;
    text-align: left;
  }

  .closing-statement p,
  .closing-statement strong {
    font-size: 42px;
  }

  .site-footer {
    padding-top: 65px;
  }

  .footer-main {
    grid-template-columns: 1fr;
    gap: 45px;
  }

  .footer-contact {
    grid-column: 1;
  }

  .footer-bottom {
    grid-template-columns: 1fr;
    gap: 8px;
    margin-top: 50px;
  }
}

@media (max-width: 390px) {
  .hero h1 {
    font-size: 53px;
  }

  .hero-manifesto {
    font-size: 36px;
  }

  .button {
    gap: 18px;
    padding-inline: 17px;
  }

  .idea-layout {
    min-height: 735px;
  }

  .experience-code h3 {
    font-size: 25px;
  }

  .act-card {
    width: 75vw;
    height: 420px;
  }

  .pillar-copy h2 {
    font-size: 64px;
  }
}

@media (max-height: 700px) and (min-width: 621px) {
  .hero {
    min-height: 760px;
  }
}

@media (hover: none), (pointer: coarse) {
  .cursor-aura {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }

  .preloader {
    display: none;
  }

  body.is-loading {
    overflow: auto;
  }

  .reveal,
  .hero h1 {
    opacity: 1;
    transform: none;
  }
}