#inc-header, #inc-footer { display: none }

:root {
  --red: #c43b3f;
  --red-lt: #d9484c;
  --red-dk: #8e2225;
  --ink: #1f1e1d;
  --ink-deep: #141416;
  --black: #0c0d0e;
  --paper: #faf8f5;
  --paper-2: #f1eee8;
  --line: #e4dfd7;
  --line-dk: rgba(255, 255, 255, .13);
  --mut: #6a6662;
  --mut-d: #9b9793;
  --pad: 4vw;
  --max: 1220px;
  --ease: cubic-bezier(.16, 1, .3, 1);
}

* {
  box-sizing: border-box
}

html {
  scroll-behavior: smooth
}

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  font-size: 17px;
  line-height: 1.62;
  -webkit-font-smoothing: antialiased;
}

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

a {
  color: inherit
}

button {
  font-family: inherit
}

.wrap {
  max-width: var(--max);
  margin: 0 auto;
  padding: 0 var(--pad)
}

section {
  padding: clamp(68px, 9vw, 60px) 0
}

.dark {
  background: var(--black);
  color: #eceae7
}

.deep {
  background: var(--ink-deep);
  color: #eceae7
}

.renna-plexus-sec {
  position: relative;
  overflow: hidden;
  background: #000
}

.renna-plexus {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 0
}

.renna-plexus-sec .wrap {
  position: relative;
  z-index: 1
}

.renna-plexus-sec .scale {
  text-shadow: 0 2px 22px rgba(0, 0, 0, .7)
}

.paper2 {
  background: var(--paper-2)
}

.lab {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11.5px;
  letter-spacing: .19em;
  text-transform: uppercase;
  color: var(--red);
  font-weight: 500
}

.dark .lab,
.deep .lab {
  color: var(--red-lt)
}

h1,
h2,
h3,
h4 {
  font-weight: 700;
  letter-spacing: -.024em;
  line-height: 1.08;
  margin: 0
}

h2 {
  font-size: clamp(30px, 4.3vw, 54px)
}

h3 {
  font-size: clamp(21px, 2.2vw, 27px);
  letter-spacing: -.018em;
  line-height: 1.2
}

.sub {
  font-size: clamp(17px, 1.35vw, 20px);
  color: var(--mut);
  /* max-width: 64ch; */
  line-height: 1.6
}

.dark .sub,
.deep .sub {
  color: var(--mut-d)
}

.hr {
  height: 1px;
  background: var(--line);
  border: 0;
  margin: 0
}

.dark .hr {
  background: var(--line-dk)
}

.tm {
  display: inline;
  font-family: Outfit, Inter, "Segoe UI", system-ui, sans-serif;
  font-size: .5em;
  font-weight: 700;
  font-style: normal;
  vertical-align: super;
  letter-spacing: .08em;
  padding: 0;
  margin: 0 0 0 .08em;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  color: inherit;
  line-height: 1
}

/* ---------- NAV ---------- */
header {
  position: sticky;
  top: 0;
  z-index: 80;
  background: rgba(12, 13, 14, .92);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--line-dk)
}

.tick {
  overflow: hidden;
  background: var(--black);
  color: #d8d4d0;
  border-bottom: 1px solid rgba(255, 255, 255, .1);
  font-family: 'IBM Plex Mono', monospace;
  font-size: 12px;
  letter-spacing: .06em;
  text-transform: uppercase;
  line-height: 1
}

.tick > div {
  display: flex;
  width: max-content;
  animation: tickScroll 42s linear infinite
}

.tick span {
  display: inline-flex;
  align-items: center;
  gap: .55em;
  padding: 13px 32px;
  white-space: nowrap;
  border-right: 1px solid rgba(255, 255, 255, .12)
}

.tick u {
  text-decoration: none;
  color: var(--red-lt);
  font-weight: 600;
  letter-spacing: .02em
}

.tick:hover > div {
  animation-play-state: paused
}

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

.nav {
  display: flex;
  align-items: center;
  gap: 28px;
  height: 72px
}

.brand {
  display: flex;
  align-items: flex-start;
  margin-right: auto;
  text-decoration: none;
  line-height: 0;
  position: relative
}

.brand img {
  height: 72px;
  width: auto;
  display: block
}

.brand-tm {
  position: static;
  flex: none;
  margin: 10px 0 0 3px;
  font-size: 10px;
  color: #2a2a2a;
  vertical-align: unset;
  line-height: 1;
  font-weight: 600;
  letter-spacing: normal;
}

.orb {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  flex: none;
  background: radial-gradient(circle at 32% 26%, #f2848a 0%, #d94a4e 32%, var(--red) 58%, #7d1c20 100%);
  box-shadow: inset 0 -2px 6px rgba(0, 0, 0, .45), 0 2px 10px rgba(183, 49, 53, .4);
  display: grid;
  place-items: center;
  font-size: 15px;
  font-weight: 800;
  color: #fff;
  letter-spacing: -.04em
}

.navlinks {
  display: flex;
  align-items: center;
  gap: 26px
}

.navlinks a,
.navlinks a.nl,
.dd-menu a {
  text-decoration: none
}

.navlinks .btn {
  display: none
}

.nav a.nl,
.navlinks a.nl {
  color: #b9b5b1;
  text-decoration: none;
  font-size: 14.5px;
  font-weight: 500;
  position: relative;
  transition: color .22s var(--ease)
}

.nav a.nl:after,
.navlinks a.nl:after {
  content: none
}

.nav a.nl.active,
.navlinks a.nl.active {
  color: #fff
}

.dd {
  position: relative;
  align-self: stretch;
  display: flex;
  align-items: center
}

.dd-menu {
  position: absolute;
  top: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%);
  min-width: 240px;
  background: #161718;
  border: 1px solid var(--line-dk);
  border-radius: 16px;
  padding: 10px;
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s var(--ease);
  box-shadow: 0 18px 40px rgba(0, 0, 0, .4);
  z-index: 70
}

.dd-menu:before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 100%;
  height: 16px
}

.dd:hover .dd-menu,
.dd:focus-within .dd-menu {
  opacity: 1;
  pointer-events: auto
}

.dd-menu a {
  display: block;
  padding: 10px 12px;
  color: #c8c4c0;
  text-decoration: none;
  font-size: 15px;
  border-radius: 10px;
  border-bottom: 1px solid rgba(255, 255, 255, .07);
  transition: background .2s var(--ease), color .2s var(--ease), transform .2s var(--ease)
}

.dd-menu a:last-child { border-bottom: 0 }

.dd-menu a:hover {
  background: rgba(255, 255, 255, .06);
  color: #fff;
  transform: translateX(4px)
}

.dd-menu small {
  display: block;
  color: #6e6964;
  font-size: 12px;
  margin-top: 2px
}

.btn {
  display: inline-block;
  background: var(--red);
  color: #fff;
  text-decoration: none;
  padding: 12px 22px;
  border-radius: 2px;
  font-size: 14.5px;
  font-weight: 600;
  letter-spacing: -.01em;
  border: 1px solid var(--red);
  transition: .18s;
  cursor: pointer
}

.btn:hover {
  background: var(--red-dk);
  border-color: var(--red-dk)
}

.btn.ghost {
  background: transparent;
  color: #eceae7;
  border-color: rgba(255, 255, 255, .3)
}

.btn.ghost:hover {
  background: rgba(255, 255, 255, .07);
  border-color: #fff
}

.btn.dark {
  background: var(--ink);
  border-color: var(--ink);
  color: #fff
}

.btn.dark:hover {
  background: #000;
  border-color: #000
}

.btn.full {
  width: 100%;
  text-align: center
}

.btn.btnInk {
  color: #000;
}

.navtoggle {
  display: none;
  width: 42px;
  height: 42px;
  background: transparent;
  border: 1px solid rgba(255, 255, 255, .2);
  color: #fff;
  cursor: pointer;
  border-radius: 2px
}

.navtoggle span,
.navtoggle span:before,
.navtoggle span:after {
  display: block;
  width: 16px;
  height: 1.5px;
  background: #fff;
  position: relative;
  margin: 0 auto
}

.navtoggle span:before,
.navtoggle span:after {
  content: "";
  position: absolute;
  left: 0
}

.navtoggle span:before {
  top: -5px
}

.navtoggle span:after {
  top: 5px
}

/* ---------- HERO ---------- */
.hero {
  position: relative;
  overflow: hidden;
  padding: clamp(80px, 11vw, 150px) 0 clamp(60px, 7vw, 96px)
}

.hero:before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(52% 58% at 50% 18%, rgba(183, 49, 53, .32), transparent 68%),
    radial-gradient(40% 48% at 50% 88%, rgba(183, 49, 53, .12), transparent 70%)
}

.hero:after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .5;
  background-image: linear-gradient(rgba(255, 255, 255, .045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .045) 1px, transparent 1px);
  background-size: 78px 78px;
  mask-image: radial-gradient(70% 60% at 50% 30%, #000, transparent)
}

.hero .wrap {
  position: relative;
  z-index: 2
}

.hero-split {
  display: grid;
  grid-template-columns: 1.3fr .7fr;
  gap: 48px;
  align-items: center
}

.hero-fill {
  min-height: calc(100svh - 72px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 48px 0
}

.hero-fill .hero-center {
  width: 100%
}

.hero-center {
  text-align: center;
  max-width: var(--max);
  margin: 0 auto
}

.hero-center .lab {
  margin-bottom: 18px
}

.hero-center .h1,
.hero-center .sub {
  margin-left: auto;
  margin-right: auto
}

.hero-center .cta,
.hero-center .trust {
  justify-content: center
}

.h1 {
  font-size: clamp(40px, 6.6vw, 84px);
  font-weight: 800;
  letter-spacing: -.042em;
  line-height: 1.02;
  margin: 20px 0 0;
  max-width: 19ch
}

.h1.mid {
  font-size: clamp(36px, 5.4vw, 68px);
  max-width: 22ch
}

.h1.wide {
  max-width: 32ch
}

.renna-hero .h1.wide {
  max-width: min(100%, 22em);
  font-size: clamp(28px, 4vw, 48px)
}

.renna-hero .sub {
  max-width: 72ch
}

.h1 em {
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  font-weight: 400;
  letter-spacing: -.01em;
  color: var(--red-lt)
}

.h1.stack {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: none;
  width: 100%;
  margin: 0;
  font-size: clamp(26px, 5.8vw, 80px)
}

.h1.stack .line {
  display: block;
  white-space: nowrap
}

.h1.stack em.line {
  display: block;
  font-size: .92em;
  margin-top: .12em;
  color: #e55b5b
}

.load-line {
  opacity: 0;
  transform: translateY(36px);
  filter: blur(10px);
  animation: lineIn 1s var(--ease) forwards
}

.load-line.delay {
  animation-delay: .28s
}

@keyframes lineIn {
  to {
    opacity: 1;
    transform: none;
    filter: none
  }
}

.deck-tag {
  margin: 36px auto 0;
  font-size: clamp(16px, 1.55vw, 18px);
  line-height: 1.4;
  color: #c8c4c0;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: .35em;
  white-space: nowrap;
  max-width: none
}

.load-line.late {
  animation-delay: .62s
}

.load-line.later {
  animation-delay: .82s
}

.hero-center .cta {
  margin-top: 32px
}

.hero-copy {
  margin-top: 22px;
  max-width: 62ch;
  color: #d8d4d0
}

.i-word {
  font-style: normal;
  font-size: 1em;
  font-weight: 500;
  font-family: inherit;
  letter-spacing: 0;
  line-height: 1.2;
  color: #f4efee;
  white-space: nowrap;
  padding: .12em .55em;
  border: 1px solid rgba(217, 72, 76, .32);
  background: rgba(183, 49, 53, .14);
  border-radius: 2px;
  position: relative;
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  flex: none;
  vertical-align: middle;
  transform: none;
  transition: background .4s var(--ease), border-color .4s var(--ease), box-shadow .4s var(--ease)
}

.i-word.is-on {
  font-size: 1em;
  font-weight: 500;
  background: rgba(183, 49, 53, .36);
  border-color: rgba(229, 91, 91, .75);
  box-shadow: 0 0 22px rgba(183, 49, 53, .28)
}

.i-word.is-on:after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .2), transparent);
  animation: iSweep 2.2s ease-in-out infinite
}

@keyframes iSweep {
  from {
    transform: translateX(-120%)
  }

  to {
    transform: translateX(120%)
  }
}

.hero .sub {
  margin-top: 26px;
  font-size: clamp(17px, 1.5vw, 18px);
  max-width: 60ch;
  color: #b9b5b1
}

.cta {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 38px
}

.trust {
  margin-top: 52px;
  padding-top: 26px;
  border-top: 1px solid var(--line-dk);
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  gap: clamp(18px, 2.6vw, 36px);
  font-family: 'IBM Plex Mono', monospace;
  font-size: clamp(10px, 1.1vw, 12px);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #8b8783;
  overflow: visible;
  width: 100%
}

.trust span {
  display: flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
  flex: none
}

.trust i {
  width: 5px;
  height: 5px;
  background: var(--red-lt);
  border-radius: 50%;
  flex: none
}

.crumb {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #8b8783;
  margin-bottom: 8px;
  display: none !important;
}

.crumb a {
  color: #b9b5b1;
  text-decoration: none
}

.crumb a:hover {
  color: #fff
}

.pagehero {
  padding: clamp(72px, 9vw, 90px) 0 clamp(48px, 6vw, 80px)
}

/* ---------- VISUALS ---------- */
.viz {
  position: relative;
  min-height: 420px;
  display: grid;
  place-items: center
}

.planet {
  width: min(380px, 86%);
  aspect-ratio: 1;
  position: relative;
  container-type: inline-size
}

.planet-core {
  position: absolute;
  inset: 18%;
  border-radius: 50%;
  overflow: hidden;
  display: grid;
  place-items: center;
  background: radial-gradient(circle at 32% 28%, #f2848a 0%, #d94a4e 28%, var(--red) 58%, #4a1012 100%);
  box-shadow: inset -22px -16px 40px rgba(0, 0, 0, .42), inset 10px 8px 18px rgba(255, 255, 255, .16),
    0 0 80px rgba(183, 49, 53, .35);
  animation: pulse 5s ease-in-out infinite
}

.planet-core:before,
.planet-core:after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  pointer-events: none;
  z-index: 2
}

.planet-core:before {
  background: radial-gradient(circle at 32% 26%, rgba(255, 255, 255, .3), transparent 42%)
}

.planet-core:after {
  box-shadow: inset -28px -20px 36px rgba(0, 0, 0, .38)
}

.planet-globe {
  position: absolute;
  inset: 0;
  z-index: 0;
  background:
    repeating-linear-gradient(90deg, transparent 0 54px, rgba(255, 255, 255, .16) 54px 56px),
    repeating-linear-gradient(0deg, transparent 0 42px, rgba(0, 0, 0, .1) 42px 43px),
    repeating-radial-gradient(ellipse 70px 40px at 20% 45%, rgba(70, 14, 16, .5) 0 28%, transparent 42% 100%),
    radial-gradient(circle at 32% 28%, #f2848a 0%, #d94a4e 28%, var(--red) 58%, #4a1012 100%);
  background-size: 280px 100%, 100% 84px, 280px 100%, 100% 100%;
  animation: globeSpin 16s linear infinite
}

.planet-ai {
  position: relative;
  z-index: 3;
  color: #fff;
  font-weight: 800;
  letter-spacing: -.06em;
  font-size: 18cqi;
  line-height: 1;
  text-shadow: 0 6px 22px rgba(0, 0, 0, .35)
}

.hero-orbs {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none
}

.hero-orb {
  position: absolute;
  width: clamp(72px, 9vw, 128px)
}

.hero-orb.o1 {
  left: clamp(8px, 4vw, 56px);
  top: 20%;
  opacity: .6;
  animation: orbFloat 7s ease-in-out infinite
}

.hero-orb.o2 {
  right: clamp(12px, 4vw, 52px);
  bottom: 18%;
  width: clamp(88px, 11vw, 148px);
  opacity: .6;
  animation: orbFloat 9s ease-in-out infinite reverse
}

.hero-orb.o3 {
  left: 22%;
  bottom: 10%;
  width: clamp(48px, 6vw, 72px);
  opacity: .55;
  animation: orbFloat 6s ease-in-out infinite
}

@keyframes orbFloat {
  50% {
    transform: translateY(-12px)
  }
}

.planet-ring {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 1px dashed rgba(255, 255, 255, .18);
  animation: spin 28s linear infinite
}

.planet-ring.r2 {
  inset: 8%;
  animation-duration: 18s;
  animation-direction: reverse;
  border-style: solid;
  border-color: rgba(183, 49, 53, .28)
}

.planet-ring.r3 {
  inset: -8%;
  animation-duration: 40s;
  border-color: rgba(255, 255, 255, .1)
}

.node {
  position: absolute;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--red-lt);
  box-shadow: 0 0 12px rgba(217, 72, 76, .8)
}

.node:nth-child(1) {
  top: 8%;
  left: 48%
}

.node:nth-child(2) {
  top: 28%;
  right: 4%
}

.node:nth-child(3) {
  bottom: 18%;
  right: 14%
}

.node:nth-child(4) {
  bottom: 8%;
  left: 30%
}

.node:nth-child(5) {
  top: 40%;
  left: 0
}

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

@keyframes pulse {
  50% {
    transform: scale(1.04);
    filter: brightness(1.08)
  }
}

@keyframes globeSpin {
  to {
    background-position: -280px 0, 0 0, -280px 0, 0 0
  }
}

.canvas-net {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  opacity: .7
}

.ico {
  width: 44px;
  height: 44px
}

.ico.lg {
  width: 56px;
  height: 56px
}

.iconbox {
  width: 56px;
  height: 56px;
  display: grid;
  place-items: center;
  background: rgba(183, 49, 53, .08);
  border: 1px solid rgba(183, 49, 53, .18)
}

.dark .iconbox,
.deep .iconbox {
  background: rgba(183, 49, 53, .14);
  border-color: rgba(217, 72, 76, .22)
}

/* ---------- STAT BAND ---------- */
.band {
  background: var(--red);
  color: #fff;
  padding: 0
}

.bandgrid {
  display: grid;
  grid-template-columns: repeat(4, 1fr)
}

.bandgrid div {
  padding: 38px 30px;
  border-left: 1px solid rgba(255, 255, 255, .22)
}

.bandgrid div:first-child {
  border-left: 0
}

.bnum,
[data-count] {
  font-variant-numeric: tabular-nums
}

.bnum {
  font-size: clamp(34px, 4.4vw, 50px);
  font-weight: 800;
  letter-spacing: -.045em;
  line-height: 1
}

.blab {
  font-size: 13.5px;
  line-height: 1.45;
  margin-top: 11px;
  color: rgba(255, 255, 255, .86)
}

/* ---------- WHAT WE DO ---------- */
.wwd {
  padding: clamp(56px, 8vw, 100px) 0;
  background:
    radial-gradient(80% 70% at 100% 0%, rgba(183, 49, 53, .08), transparent 55%),
    var(--paper)
}

.wwd-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px
}

.wwd-aside {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 15px;
  text-transform: uppercase;
  color: var(--mut)
}

.wwd-intro h2 {
  margin: 0;
  max-width: 16ch;
  font-size: clamp(32px, 4.6vw, 56px);
  font-weight: 800;
  letter-spacing: -.038em;
  line-height: 1.06
}

.wwd-intro h2 em {
  /* font-family: 'Fraunces', serif; */
  font-style: italic;
  font-weight: 500;
  color: var(--red)
}

.wwd-intro > p {
  margin: 22px 0 0;
  max-width: 62ch;
  color: var(--mut);
  font-size: clamp(16px, 1.5vw, 18px);
  line-height: 1.7
}

.wwd-grid {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: clamp(36px, 5vw, 56px)
}

.wwd-card {
  display: grid;
  grid-template-columns: 72px 1fr;
  grid-template-rows: auto auto auto 1fr;
  column-gap: 22px;
  background: #fff;
  border: 1px solid rgba(31, 30, 29, .08);
  border-radius: 24px;
  padding: 28px 28px 26px;
  box-shadow: 0 16px 40px rgba(31, 30, 29, .08);
  transition: transform .35s var(--ease), box-shadow .35s
}

.wwd-card:nth-child(even) { margin-left: min(8%, 72px) }
.wwd-card:nth-child(odd) { margin-right: min(8%, 72px) }

.wwd-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 24px 52px rgba(31, 30, 29, .14), 0 0 0 1px rgba(183, 49, 53, .12)
}

.wwd-num {
  grid-row: 1 / span 4;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: linear-gradient(160deg, #e55b5b, var(--red) 55%, #7d1c20);
  color: #fff;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 18px;
  font-weight: 500;
  box-shadow: 0 10px 22px rgba(183, 49, 53, .28)
}

.wwd-card h3 {
  margin: 2px 0 8px;
  font-size: clamp(24px, 2.4vw, 32px);
  letter-spacing: -.03em
}

.wwd-tagline {
  margin: 0 0 12px;
  color: var(--red);
  font-size: 16px;
  line-height: 1.4
}

.wwd-card > p:not(.wwd-tagline) {
  margin: 0 0 16px;
  color: var(--mut);
  font-size: 15.5px;
  line-height: 1.65
}

.wwd-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px
}

.wwd-tags > span {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  padding: 6px 12px;
  border-radius: 999px;
  background: rgba(183, 49, 53, .08);
  color: var(--ink);
  border: 1px solid rgba(183, 49, 53, .16)
}

.wwd-tags .tm {
  font-family: Outfit, Inter, "Segoe UI", system-ui, sans-serif;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .1em;
  color: inherit
}

@media (max-width: 860px) {
  .wwd-card,
  .wwd-card:nth-child(even),
  .wwd-card:nth-child(odd) {
    margin: 0;
    grid-template-columns: 1fr
  }
  .wwd-num { grid-row: auto; margin-bottom: 12px }
  .wwd-meta { flex-wrap: wrap }
}

/* ---------- GRIDS ---------- */
.head {
  max-width: 78ch
}

.headCustom {
  max-width: 120ch;
  margin-bottom: 15px;
}

.head h2 {
  margin: 14px 0 0
}

.head .sub {
  margin-top: 20px
}

.g2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(30px, 4.5vw, 74px);
  align-items: start
}

.g3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: var(--line);
  margin-top: 56px
}

.dark .g3,
.deep .g3 {
  background: var(--line-dk)
}

.g3>div,
.g3>a {
  background: var(--paper);
  padding: 34px 30px 38px;
  color: inherit;
  text-decoration: none;
  display: block
}

.dark .g3>div,
.deep .g3>div,
.dark .g3>a,
.deep .g3>a {
  background: var(--black)
}

.deep .g3>div,
.deep .g3>a {
  background: var(--ink-deep)
}

.g3 h3 {
  margin: 16px 0 10px
}

.g3 p {
  margin: 0;
  color: var(--mut);
  font-size: 15.5px;
  line-height: 1.6
}

.dark .g3 p,
.deep .g3 p {
  color: var(--mut-d)
}

.g3>a:hover {
  background: #fff
}

.dark .g3>a:hover,
.deep .g3>a:hover {
  background: #1a1b1d
}

.g4 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: var(--line);
  margin-top: 56px
}

.g4>div,
.g4>a {
  background: var(--paper);
  padding: 30px 26px 34px;
  color: inherit;
  text-decoration: none;
  display: block
}

.dark .g4>div {
  background: var(--black)
}

.g4 h3 {
  font-size: 19px;
  margin: 14px 0 9px
}

.g4 p {
  margin: 0;
  color: var(--mut);
  font-size: 15px;
  line-height: 1.58
}

.dark .g4 p {
  color: var(--mut-d)
}

.g4>a:hover {
  background: #fff
}

.n {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 12px;
  color: var(--red);
  letter-spacing: .12em
}

.dark .n,
.deep .n {
  color: var(--red-lt)
}

.cards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 22px;
  margin-top: 52px
}

.card {
  background: #fff;
  border: 1px solid var(--line);
  padding: 34px 30px 36px;
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
  transition: .22s var(--ease);
  position: relative;
  overflow: hidden
}

.card:before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: var(--red);
  transform: scaleY(0);
  transform-origin: top;
  transition: .28s var(--ease)
}

.card:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 40px rgba(20, 20, 22, .08)
}

.card:hover:before {
  transform: scaleY(1)
}

.card .more {
  margin-top: 22px;
  font-size: 14px;
  font-weight: 600;
  border-bottom: 2px solid var(--red);
  padding-bottom: 2px;
  align-self: flex-start
}

.card p {
  color: var(--mut);
  font-size: 15.5px;
  margin: 12px 0 0
}

.dark-card {
  background: rgba(255, 255, 255, .035);
  border-color: var(--line-dk)
}

.dark-card p {
  color: var(--mut-d)
}

.dark-card:hover {
  box-shadow: 0 18px 40px rgba(0, 0, 0, .35)
}

/* ---------- RENNA SCALE ---------- */
.scale {
  text-align: center;
  max-width: 900px;
  margin: 0 auto
}

.bignum {
  font-family: 'IBM Plex Mono', monospace;
  font-weight: 500;
  font-size: clamp(19px, 3.4vw, 40px);
  letter-spacing: -.02em;
  line-height: 1.15;
  color: #fff;
  word-break: break-all;
  margin: 26px 0 0
}

.bignum span {
  color: var(--red-lt)
}

.scalecap {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 12px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: #8b8783;
  margin-top: 20px
}

.mathrow {
  display: flex;
  justify-content: center;
  gap: 0;
  flex-wrap: wrap;
  margin-top: 54px;
  border-top: 1px solid var(--line-dk);
  border-bottom: 1px solid var(--line-dk)
}

.mathrow div {
  padding: 26px 34px;
  border-left: 1px solid var(--line-dk);
  min-width: 190px
}

.mathrow div:first-child {
  border-left: 0
}

.mathrow b {
  display: block;
  font-size: 40px;
  font-weight: 800;
  letter-spacing: -.03em
}

.mathrow small {
  font-size: 13px;
  color: var(--mut-d)
}

.renna-quote {
  max-width: 820px;
  margin: 52px auto 0;
  padding: 36px 44px 36px 48px;
  text-align: left;
  background: rgba(255, 255, 255, .04);
  border: 1px solid rgba(255, 255, 255, .1);
  border-left: 3px solid var(--red-lt);
  position: relative
}

.renna-quote:before {
  content: "“";
  position: absolute;
  top: 8px;
  left: 16px;
  font-family: 'Instrument Serif', Georgia, serif;
  font-size: 64px;
  line-height: 1;
  color: var(--red-lt);
  opacity: .45
}

.renna-quote p {
  font-family: 'Instrument Serif', Georgia, serif;
  font-style: italic;
  font-weight: 400;
  font-size: clamp(22px, 2.4vw, 30px);
  line-height: 1.4;
  color: #fff;
  margin: 0
}

.renna-quote p em {
  font-style: italic;
  color: #fff;
  /* background: rgba(183, 49, 53, .28);
  padding: 0 6px; */
  box-decoration-break: clone
}

.renna-quote cite {
  display: block;
  font-family: 'Instrument Serif', Georgia, serif;
  font-style: italic;
  font-size: clamp(22px, 2.4vw, 30px);
  color: #fff;
  margin-top: 18px;
  font-weight: 400
}

.renna-quote cite {
  /* background: linear-gradient(180deg, transparent 62%, rgba(183, 49, 53, .38) 62%) */
}

.renna-quote.light {
  max-width: none;
  margin: 22px 0 0;
  padding: 28px 28px 28px 36px;
  background: rgba(183, 49, 53, .05);
  border: 1px solid var(--line);
  border-left: 3px solid var(--red)
}

.renna-quote.light p,
.renna-quote.light cite {
  color: var(--ink);
  font-size: clamp(18px, 1.7vw, 22px)
}

.renna-quote.light cite {
  display: inline;
  padding: 0 8px 2px 0;
  /* background: linear-gradient(180deg, transparent 58%, rgba(183, 49, 53, .28) 58%) */
}

.sov-callout {
  color: var(--red) !important;
  font-style: italic
}

.sov-stack {
  display: grid;
  grid-template-columns: 1fr;
  gap: 40px;
  max-width: 860px
}

.sov-stack .sov-panel {
  margin-top: 0
}

.sov-panel .renna-quote {
  margin-top: 28px;
  background: transparent;
  border: 0;
  box-shadow: none;
  padding: 4px 0 0 52px
}

.sov-panel .renna-quote:before {
  content: "\201C";
  top: -8px;
  left: 0;
  opacity: .55;
  color: var(--red)
}

.sov-panel .renna-quote.light {
  max-width: none;
  margin: 28px 0 0;
  padding: 4px 0 0 52px;
  background: transparent;
  border: 0
}

.sov-panel .renna-quote.light p,
.sov-panel .renna-quote.light cite {
  font-style: italic
}

.sov-mark {
  margin: 0 0 22px;
  padding: 22px 24px 22px 28px;
  background: #f4ece6;
  border: 1px solid rgba(183, 49, 53, .28);
  border-left: 6px solid var(--red);
  box-shadow: 0 16px 40px rgba(183, 49, 53, .14);
  color: var(--red-dk);
  font-family: 'Instrument Serif', Georgia, serif;
  font-size: clamp(26px, 2.8vw, 38px);
  font-weight: 700;
  font-style: italic;
  letter-spacing: -.02em;
  line-height: 1.22;
  animation: sovBlink 2.2s ease-in-out infinite
}

@keyframes sovBlink {
  0%, 100% {
    background: #f4ece6;
    box-shadow: 0 16px 40px rgba(183, 49, 53, .14);
    border-left-color: var(--red)
  }
  50% {
    background: #fbe3e3;
    box-shadow: 0 18px 46px rgba(183, 49, 53, .28);
    border-left-color: var(--red-lt)
  }
}

@media (prefers-reduced-motion: reduce) {
  .sov-mark { animation: none }
}

.faq-list {
  margin-top: 52px;
  max-width: 860px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  counter-reset: faq
}

.faq-item {
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 8px 22px rgba(20, 20, 22, .05);
  overflow: hidden;
  counter-increment: faq;
  transition: box-shadow .3s var(--ease), transform .3s var(--ease), border-color .3s var(--ease), background .3s
}

.faq-item:hover {
  border-color: rgba(183, 49, 53, .28);
  transform: translateY(-2px);
  box-shadow: 0 14px 30px rgba(20, 20, 22, .08)
}

.faq-item[open] {
  border-color: rgba(183, 49, 53, .38);
  background: linear-gradient(180deg, #fff, #fbf6f6);
  box-shadow: inset 3px 0 0 var(--red), 0 16px 36px rgba(183, 49, 53, .12)
}

.faq-item summary {
  list-style: none;
  cursor: pointer;
  padding: 20px 64px 20px 72px;
  font-weight: 700;
  font-size: 18px;
  letter-spacing: -.018em;
  position: relative;
  line-height: 1.3
}

.faq-item summary::-webkit-details-marker {
  display: none
}

.faq-item summary:before {
  content: counter(faq, decimal-leading-zero);
  position: absolute;
  left: 16px;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11.5px;
  font-weight: 500;
  letter-spacing: .04em;
  color: var(--red);
  background: rgba(183, 49, 53, .08);
  border: 1px solid rgba(183, 49, 53, .16);
  transition: background .25s, color .25s, border-color .25s
}

.faq-item summary:after {
  content: "+";
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: var(--red);
  font-weight: 500;
  font-size: 20px;
  line-height: 1;
  border: 1px solid rgba(183, 49, 53, .22);
  background: rgba(183, 49, 53, .06);
  transition: transform .3s var(--ease), background .25s, color .25s, border-color .25s
}

.faq-item[open] summary {
  color: var(--red-dk)
}

.faq-item[open] summary:before {
  background: var(--red);
  color: #fff;
  border-color: var(--red)
}

.faq-item[open] summary:after {
  content: "–";
  background: var(--red);
  color: #fff;
  border-color: var(--red);
  transform: translateY(-50%) rotate(180deg)
}

.faq-item p {
  margin: 0;
  padding: 0 64px 22px 72px;
  color: var(--mut);
  font-size: 15.5px;
  line-height: 1.65
}

.faq-item[open] p {
  animation: faqIn .35s var(--ease)
}

@keyframes faqIn {
  from {
    opacity: 0;
    transform: translateY(-6px)
  }

  to {
    opacity: 1;
    transform: none
  }
}

.phase-time {
  font-style: italic;
  color: var(--mut);
  font-size: 14px;
  margin: 0 0 16px !important
}

.g3 .ck,
.g4 .ck {
  margin-top: 14px
}

.ops-list {
  color: #eceae7
}

.ops-list li {
  color: #eceae7
}

.v2-dc-stack {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-top: 12px
}

.v2-dc-stack article {
  display: grid;
  grid-template-columns: 5.5rem 1fr;
  gap: 8px 28px;
  align-items: start;
  padding: 22px 26px;
  background: #fff;
  border: 1px solid rgba(31, 30, 29, .08);
  border-radius: 22px;
  box-shadow: 0 18px 40px rgba(31, 30, 29, .06);
  opacity: 0;
  transform: translateY(32px);
  transition: opacity .7s cubic-bezier(.16, 1, .3, 1), transform .7s cubic-bezier(.16, 1, .3, 1);
  transition-delay: 0ms
}

.v2-dc-stack article:nth-child(1) { transition-delay: 0ms }
.v2-dc-stack article:nth-child(2) { transition-delay: 120ms }
.v2-dc-stack article:nth-child(3) { transition-delay: 240ms }
.v2-dc-stack article:nth-child(4) { transition-delay: 360ms }

.v2-dc-stack article.is-in,
.v2-dc-stack article.aos-animate {
  opacity: 1;
  transform: none
}

@media (prefers-reduced-motion: reduce) {
  .v2-dc-stack article {
    opacity: 1;
    transform: none;
    transition: none
  }
}

.v2-dc-stack article:nth-child(even) { margin-left: min(7%, 64px) }
.v2-dc-stack article:nth-child(odd) { margin-right: min(7%, 64px) }

.v2-dc-stack b {
  /* font-family: 'Fraunces', serif; */
  font-size: clamp(36px, 4vw, 48px);
  font-weight: 500;
  color: var(--red);
  line-height: 1
}

.v2-dc-stack h3 {
  margin: 0 0 6px;
  font-size: clamp(20px, 2vw, 24px)
}

.v2-dc-stack p {
  margin: 0;
  color: var(--mut);
  font-size: 15.5px
}

.v2-dc-facility {
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 28px 40px;
  padding: 36px 36px 28px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 28px;
  box-shadow: 0 22px 50px rgba(31, 30, 29, .07);
  margin-top: 20px;
}

.v2-dc-mark {
  display: grid;
  place-content: center;
  text-align: center;
  aspect-ratio: 1;
  border-radius: 50%;
  background:
    radial-gradient(circle at 30% 28%, #fff 0%, #f4eeea 42%, #eadfd8 100%);
  border: 1px solid rgba(183, 49, 53, .18)
}

.v2-dc-mark strong {
  display: block;
  /* font-family: 'Fraunces', serif; */
  font-size: 42px;
  font-weight: 500;
  letter-spacing: -.04em;
  line-height: .9
}

.v2-dc-mark span {
  display: block;
  margin-top: 8px;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--red)
}

.v2-dc-spec-list {
  list-style: none;
  margin: 8px 0 0;
  padding: 0
}

.v2-dc-spec-list li {
  display: grid;
  grid-template-columns: minmax(9rem, 32%) 1fr;
  gap: 8px 18px;
  padding: 14px 0;
  border-bottom: 1px solid var(--line);
  align-items: baseline
}

.v2-dc-spec-list li:last-child { border-bottom: 0 }

.v2-dc-spec-list b {
  /* font-family: 'Fraunces', serif; */
  font-size: 26px;
  font-weight: 500;
  letter-spacing: -.03em
}

.v2-dc-spec-list small {
  display: block;
  grid-column: 2;
  color: var(--mut);
  font-size: 14px
}

.v2-dc-track {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  margin-top: 8px;
  position: relative
}

.v2-dc-track:before {
  content: "";
  position: absolute;
  left: 8%;
  right: 8%;
  top: 18px;
  height: 1px;
  background: var(--line)
}

.v2-dc-track li {
  list-style: none;
  padding: 0 18px
}

.v2-dc-track {
  list-style: none;
  padding: 0
}

.v2-dc-track .dc-when {
  display: inline-block;
  margin-bottom: 18px;
  padding: 4px 10px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--red);
  position: relative;
  z-index: 1
}

.v2-dc-track h3 {
  margin: 0 0 8px;
  font-size: 20px
}

.v2-dc-track p {
  margin: 0;
  color: var(--mut);
  font-size: 15px
}

.v2-dc-my {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-top: 20px;
}

.v2-dc-my article {
  padding: 28px 26px 24px;
  background: #fff;
  border-radius: 22px;
  border-left: 4px solid var(--red);
  box-shadow: 0 16px 36px rgba(31, 30, 29, .06)
}

.v2-dc-my .bnum {
  /* font-family: 'Fraunces', serif; */
  font-size: clamp(36px, 4vw, 48px);
  font-weight: 500;
  color: var(--ink);
  letter-spacing: -.04em;
  line-height: 1
}

.v2-dc-my .blab {
  margin-top: 10px;
  color: var(--mut);
  font-size: 14.5px
}

.v2-sv-phases {
  list-style: none;
  margin: 8px 0 0;
  padding: 0 0 0 8px
}

.v2-sv-phases > li {
  position: relative;
  padding: 0 0 36px 28px;
  border-left: 1px solid var(--line)
}

.v2-sv-phases > li:last-child {
  padding-bottom: 0
}

.v2-sv-phases > li:before {
  content: "";
  position: absolute;
  left: -5px;
  top: 8px;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--red);
  box-shadow: 0 0 0 4px var(--paper-2)
}

.v2-sv-phases .phase-time {
  margin: 0 0 6px !important;
  color: var(--red)
}

.v2-sv-phases h3 {
  margin: 0 0 10px;
  font-size: clamp(22px, 2.2vw, 28px)
}

.v2-sv-phases .ck {
  max-width: 62ch;
  margin-top: 4px
}

.v2-sv-phases .ck li {
  margin-bottom: 6px;
  padding-left: 22px
}

.v2-sv-pillars {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 14px
}

.v2-sv-pillars article {
  grid-column: span 2;
  padding: 24px 22px 22px;
  background: #fff;
  border-radius: 20px;
  border: 1px solid rgba(31, 30, 29, .08);
  box-shadow: 0 14px 32px rgba(31, 30, 29, .05)
}

.v2-sv-pillars article:nth-child(-n+2) { grid-column: span 3 }

.v2-sv-pillars .dc-no {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 12px;
  letter-spacing: .16em;
  color: var(--red)
}

.v2-sv-pillars h3 {
  margin: 10px 0 0;
  font-size: 22px
}

.v2-sv-pillars .sv-tag {
  display: block;
  margin: 6px 0 10px;
  font-style: italic;
  color: var(--red);
  font-size: 14.5px
}

.v2-sv-pillars p {
  margin: 0;
  color: var(--mut);
  font-size: 15px
}

.v2-sv-risks {
  display: flex;
  flex-wrap: wrap;
  gap: 12px
}

.v2-sv-risks article {
  flex: 1 1 220px;
  padding: 18px 20px;
  background: #fff;
  border-radius: 16px;
  border-left: 4px solid var(--red);
  box-shadow: 0 12px 28px rgba(31, 30, 29, .05)
}

.v2-sv-risks .dc-no {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  letter-spacing: .14em;
  color: var(--mut)
}

.v2-sv-risks h3 {
  margin: 8px 0 6px;
  font-size: 17px
}

.v2-sv-risks .sv-sev {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10.5px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--red)
}

.v2-sv-note {
  margin: 18px 0 0;
  font-size: 14.5px;
  font-style: italic;
  color: var(--mut);
}

.dark .ck li:before {
  background: var(--red-lt)
}

.lead-section {
  position: relative;
  overflow: hidden;
  /* background: #0c0d0e url("../assets/leadership-bg.jpg") center / cover no-repeat fixed */
}

.lead-section:before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: linear-gradient(180deg, rgba(12, 13, 14, .28), rgba(12, 13, 14, .42) 55%, rgba(12, 13, 14, .55));
  pointer-events: none
}

.lead-section .wrap {
  position: relative;
  z-index: 1
}

.lead-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px
}

.lead-card {
  background: rgba(20, 20, 22, .72);
  backdrop-filter: blur(8px);
  border: 1px solid var(--line-dk);
  border-radius: 14px;
  padding: 32px 26px 28px;
  text-align: center;
  position: relative;
  overflow: hidden;
  transition: transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease), background .35s
}

.lead-card:before {
  content: "";
  position: absolute;
  inset: -40% auto auto -40%;
  width: 180px;
  height: 180px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(183, 49, 53, .22), transparent 68%);
  pointer-events: none;
  transition: transform .45s var(--ease), opacity .45s
}

.lead-card:nth-child(1) { animation: leadGlow 4.4s ease-in-out infinite }
.lead-card:nth-child(2) { animation: leadGlow 4.8s ease-in-out infinite .4s }
.lead-card:nth-child(3) { animation: leadGlow 5.2s ease-in-out infinite .8s }
.lead-card:nth-child(4) { animation: leadGlow 4.6s ease-in-out infinite 1.1s }
.lead-card:nth-child(5) { animation: leadGlow 5s ease-in-out infinite .2s }
.lead-card:nth-child(6) { animation: leadGlow 4.2s ease-in-out infinite 1.4s }

.lead-card:hover {
  animation-play-state: paused;
  transform: translateY(-8px);
  border-color: rgba(217, 72, 76, .5);
  background: rgba(20, 20, 22, .86);
  box-shadow: 0 22px 44px rgba(0, 0, 0, .35), 0 0 0 1px rgba(183, 49, 53, .28), 0 12px 32px rgba(183, 49, 53, .2)
}

.lead-card:hover:before {
  transform: scale(1.8) translate(20px, 16px);
  opacity: .9
}

.lead-card:hover .lead-photo {
  transform: scale(1.06);
  box-shadow: 0 0 0 6px rgba(183, 49, 53, .18), 0 14px 28px rgba(183, 49, 53, .3)
}

.lead-card:hover .lead-photo:after {
  transform: translateX(130%)
}

.lead-photo {
  width: 188px;
  height: 188px;
  border-radius: 50%;
  margin: 0 auto 22px;
  overflow: hidden;
  position: relative;
  display: grid;
  place-items: center;
  background: radial-gradient(circle at 32% 28%, #d94a4e, var(--red) 58%, #6d1a1d);
  border: 3px solid rgba(255, 255, 255, .12);
  box-shadow: 0 10px 24px rgba(183, 49, 53, .22);
  transition: transform .4s var(--ease), box-shadow .4s var(--ease)
}

.lead-photo:after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  background: linear-gradient(105deg, transparent 36%, rgba(255, 255, 255, .32) 50%, transparent 64%);
  transform: translateX(-130%);
  transition: transform .7s var(--ease);
  pointer-events: none
}

.lead-photo span {
  font-weight: 800;
  color: #fff;
  font-size: 40px;
  letter-spacing: .02em;
  z-index: 0
}

.lead-photo img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 16%;
  z-index: 1
}

.lead-photo img[src=""] {
  display: none
}

.lead-card h3 {
  font-family: 'Instrument Serif', serif;
  font-weight: 400;
  font-size: clamp(22px, 2vw, 28px);
  color: #fff;
  letter-spacing: -.01em
}

.lead-card .role {
  margin: 8px 0 16px;
  color: var(--red-lt);
  font-style: italic;
  font-size: 14.5px
}

.lead-card ul {
  list-style: none;
  margin: 0;
  padding: 0;
  text-align: left
}

.lead-card li {
  position: relative;
  padding-left: 16px;
  margin-bottom: 8px;
  color: var(--mut-d);
  font-size: 14.5px;
  line-height: 1.5
}

.lead-card li:before {
  content: "";
  position: absolute;
  left: 0;
  top: 8px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgba(217, 72, 76, .7)
}

.lead-note {
  margin: 32px 0 0;
  font-style: italic;
  color: var(--mut-d);
  font-size: clamp(18px, 1.7vw, 22px);
  line-height: 1.55
}

.lead-stat {
  display: inline-block;
  margin-right: .18em;
  /* font-family: 'Fraunces', serif; */
  font-style: italic;
  font-size: clamp(42px, 4.6vw, 64px);
  font-weight: 500;
  letter-spacing: -.04em;
  line-height: .8;
  color: var(--red);
  vertical-align: -4px
}

.lead-stack {
  display: grid;
  gap: 28px
}

.lead-block {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(240px, .72fr);
  gap: clamp(28px, 5vw, 72px);
  align-items: center;
  position: relative;
  overflow: hidden;
  padding: clamp(20px, 4vw, 25px) clamp(20px, 3vw, 25px) 72px;
  /* background: linear-gradient(180deg, #f2f2f2, #f6f3ef); */
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 28px
}

.lead-block:after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 0;
  height: 52px;
  background:
    linear-gradient(115deg, transparent 0 42%, var(--red-dk) 42% 62%, transparent 62%),
    linear-gradient(100deg, transparent 0 58%, var(--red) 58% 78%, transparent 78%);
  opacity: .9;
  pointer-events: none
}

.lead-copy,
.lead-round {
  position: relative;
  z-index: 1
}

.lead-block.reverse {
  grid-template-columns: minmax(240px, .72fr) minmax(0, 1.05fr)
}

.lead-block.reverse .lead-copy { order: 2 }
.lead-block.reverse .lead-round { order: 1 }

.lead-copy h2 {
  font-size: clamp(26px, 3.2vw, 40px);
  text-transform: uppercase;
  margin: 0
}

.lead-copy .role {
  margin: 8px 0 16px;
  color: var(--red);
  font-weight: 700;
  text-transform: uppercase;
  font-size: 13px;
  font-style: italic;
}

.lead-copy > p:not(.role) {
  margin: 0;
  /* max-width: 46ch; */
  color: var(--ink);
  font-size: 16px;
  line-height: 1.6
}

.lead-round {
  position: relative;
  width: min(340px, 100%);
  aspect-ratio: 1;
  margin: 0 auto;
  padding: 0px;
  border-radius: 50%;
  background: #fff;
  border: 6px solid var(--red);
  box-shadow: 0 18px 40px rgba(183, 49, 53, .16);
  overflow: hidden;
  transition: transform .4s var(--ease), box-shadow .4s var(--ease), border-color .4s
}

.lead-round:before {
  content: "";
  position: absolute;
  inset: 8px;
  border-radius: 50%;
  background: transparent;
  z-index: 1;
  pointer-events: none;
  transition: background .35s
}

.lead-round:hover {
  transform: translateY(-8px);
  border-color: var(--red-dk);
  box-shadow: 0 28px 56px rgba(183, 49, 53, .28)
}

.lead-round:hover:before {
  background: rgba(183, 49, 53, .14)
}

.lead-round img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
  display: block;
  transition: transform .55s var(--ease), filter .4s
}

.lead-round:hover img {
  transform: scale(1.1);
  filter: saturate(1.08) contrast(1.04)
}

.lead-in {
  position: absolute;
  right: 35px;
  bottom: 44px;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #0a66c2;
  color: #fff;
  text-decoration: none;
  box-shadow: 0 8px 18px rgba(10, 102, 194, .35);
  z-index: 2;
  transition: transform .35s var(--ease), background .25s
}

.lead-round:hover .lead-in {
  transform: scale(1.12)
}

.lead-in:hover {
  background: #084e96;
  color: #fff
}

.lead-in i { font-size: 18px }

.lead-more-btn {
  margin-top: 16px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 0;
  background: none;
  padding: 0;
  cursor: pointer;
  color: var(--red);
  font-family: inherit;
  font-size: 14.5px;
  font-weight: 700;
  letter-spacing: .02em
}

.lead-more-btn i {
  font-size: 12px;
  transition: transform .25s var(--ease)
}

.lead-more-btn:hover i { transform: translateY(2px) }

.lead-copy.is-open .lead-more-btn i { transform: rotate(180deg) }

.lead-more {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows .45s var(--ease)
}

.lead-copy.is-open .lead-more { grid-template-rows: 1fr }

.lead-more-inner {
  overflow: hidden;
  min-height: 0
}

.lead-more-inner ul,
.lead-bio ul {
  list-style: none;
  margin: 16px 0 0;
  padding: 0;
  color: var(--ink)
}

.lead-bio ul { margin: 0 0 4px }

.lead-more-inner li,
.lead-bio li {
  position: relative;
  margin: 0 0 8px;
  padding: 0 0 0 26px
}

.lead-more-inner li::before,
.lead-bio li::before {
  content: "\f00c";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  position: absolute;
  left: 0;
  top: 0.45em;
  color: var(--red);
  font-size: 0.9em;
  line-height: 1
}

.lead-bio {
  margin-top: 16px;
  color: var(--ink);
  font-size: 16px;
  line-height: 1.65
}

.lead-bio p { margin: 0 0 14px }
.lead-bio p:last-child { margin-bottom: 0 }

.lead-motto {
  margin: 8px 0 0;
  padding: 0;
  border: 0;
  color: var(--ink);
  font-style: italic
}

.lead-motto p { margin: 0 }

@media (max-width: 860px) {
  .lead-block,
  .lead-block.reverse {
    grid-template-columns: 1fr
  }

  .lead-block.reverse .lead-copy,
  .lead-block.reverse .lead-round {
    order: unset
  }

  .lead-round { width: min(280px, 78vw) }
}

@keyframes leadGlow {
  0%,
  100% {
    box-shadow: 0 8px 22px rgba(0, 0, 0, .12)
  }

  50% {
    box-shadow: 0 14px 32px rgba(183, 49, 53, .16), 0 0 0 1px rgba(183, 49, 53, .12)
  }
}

/* ---------- PRECEPTS / STEPS ---------- */
.precept {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 22px;
  align-items: start;
  padding: 30px 0;
  border-top: 1px solid var(--line-dk)
}

.precept:last-child {
  border-bottom: 1px solid var(--line-dk)
}

.pnum {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 13px;
  color: var(--red-lt);
  padding-top: 6px
}

.precept h3 {
  margin: 0 0 8px
}

.precept p {
  margin: 0;
  color: var(--mut-d);
  font-size: 15.5px;
  max-width: 72ch
}

.steps {
  counter-reset: s;
  margin-top: 52px;
  border-top: 1px solid var(--line)
}

.dark .steps {
  border-color: var(--line-dk)
}

.step {
  display: grid;
  grid-template-columns: 64px 1fr;
  gap: 20px;
  padding: 26px 0;
  border-bottom: 1px solid var(--line)
}

.dark .step {
  border-color: var(--line-dk)
}

.step:before {
  counter-increment: s;
  content: "0" counter(s);
  font-family: 'IBM Plex Mono', monospace;
  font-size: 13px;
  color: var(--red);
  padding-top: 5px
}

.dark .step:before {
  color: var(--red-lt)
}

.step h3 {
  font-size: 20px;
  margin: 0 0 6px
}

.step p {
  margin: 0;
  color: var(--mut);
  font-size: 15.5px;
  max-width: 80ch
}

.dark .step p {
  color: var(--mut-d)
}

.steps.pictured .step {
  grid-template-columns: 64px minmax(0, 1fr) minmax(280px, 46%);
  gap: 32px 40px;
  align-items: center;
  padding: 40px 0
}

/* Soften AOS slide distance so fade-left/right is not clipped by overflow-x */
.steps.pictured [data-aos="fade-right"] {
  transform: translate3d(-40px, 0, 0)
}

.steps.pictured [data-aos="fade-left"] {
  transform: translate3d(40px, 0, 0)
}

.steps.pictured [data-aos="fade-right"].aos-animate,
.steps.pictured [data-aos="fade-left"].aos-animate {
  transform: none
}

.step-media {
  margin: 0;
  overflow: hidden;
  background: var(--paper-2);
  aspect-ratio: 16/10;
  border: 1px solid var(--line);
  border-radius: 16px;
  position: relative;
  box-shadow: 0 10px 28px rgba(20, 20, 22, .08), 0 2px 8px rgba(183, 49, 53, .08);
  animation: stepGlow 3.6s ease-in-out infinite
}

.step-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  transform: scale(1.04);
  animation: stepKen 14s ease-in-out infinite alternate
}

.step-media:after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(105deg, transparent 36%, rgba(255, 255, 255, .38) 50%, transparent 64%);
  transform: translateX(-130%);
  animation: stepBlink 4.8s ease-in-out infinite;
  pointer-events: none
}

.steps.pictured .step:nth-child(2) .step-media {
  animation-delay: .4s
}

.steps.pictured .step:nth-child(2) .step-media:after,
.steps.pictured .step:nth-child(2) .step-media img {
  animation-delay: .6s
}

.steps.pictured .step:nth-child(3) .step-media {
  animation-delay: .8s
}

.steps.pictured .step:nth-child(3) .step-media:after,
.steps.pictured .step:nth-child(3) .step-media img {
  animation-delay: 1.2s
}

.steps.pictured .step:nth-child(4) .step-media {
  animation-delay: 1.2s
}

.steps.pictured .step:nth-child(4) .step-media:after,
.steps.pictured .step:nth-child(4) .step-media img {
  animation-delay: 1.8s
}

.steps.pictured .step:nth-child(5) .step-media {
  animation-delay: 1.6s
}

.steps.pictured .step:nth-child(5) .step-media:after,
.steps.pictured .step:nth-child(5) .step-media img {
  animation-delay: 2.4s
}

.steps.pictured .step:nth-child(6) .step-media {
  animation-delay: 2s
}

.steps.pictured .step:nth-child(6) .step-media:after,
.steps.pictured .step:nth-child(6) .step-media img {
  animation-delay: 3s
}

.step-media:hover {
  box-shadow: 0 18px 40px rgba(20, 20, 22, .14), 0 0 0 1px rgba(183, 49, 53, .22), 0 8px 24px rgba(183, 49, 53, .16);
  transform: translateY(-3px);
  transition: box-shadow .35s var(--ease), transform .35s var(--ease)
}

.step-journey {
  margin-top: 40px;
  padding-top: 28px;
  border-top: 1px solid var(--line)
}

.step-journey h3 {
  margin: 10px 0 18px;
  font-size: clamp(24px, 3vw, 40px)
}

.step-all {
  aspect-ratio: auto;
  display: flex;
  flex-direction: column
}

.step-all img {
  height: auto;
  transform: none;
  animation: none;
  object-fit: contain
}

.step-all-labels {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  margin: 0;
  background: #141416;
  color: #eceae7;
  padding: 12px 4px 14px
}

.step-all-labels span {
  text-align: center;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: -.015em;
  padding: 0 6px;
  border-right: 1px solid rgba(255, 255, 255, .1)
}

.step-all-labels span:last-child {
  border-right: 0
}

.step-all-labels b {
  display: block;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10.5px;
  font-weight: 500;
  color: #f3b4b6;
  letter-spacing: .14em;
  margin-bottom: 3px
}

@keyframes stepGlow {

  0%,
  100% {
    box-shadow: 0 10px 28px rgba(20, 20, 22, .08), 0 2px 8px rgba(183, 49, 53, .08)
  }

  50% {
    box-shadow: 0 16px 36px rgba(20, 20, 22, .12), 0 0 0 1px rgba(183, 49, 53, .18), 0 8px 22px rgba(183, 49, 53, .2)
  }
}

@keyframes stepBlink {

  0%,
  62%,
  100% {
    transform: translateX(-130%)
  }

  78% {
    transform: translateX(130%)
  }
}

@keyframes stepKen {
  from {
    transform: scale(1.02)
  }

  to {
    transform: scale(1.08)
  }
}

/* ---------- DIAGRAM ---------- */
.diag {
  background: var(--paper-2);
  border: 1px solid var(--line);
  padding: 30px
}

.dark .diag,
.deep .diag {
  background: rgba(255, 255, 255, .035);
  border-color: var(--line-dk)
}

.islands {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px
}

.islands span {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11.5px;
  letter-spacing: .07em;
  padding: 12px 8px;
  text-align: center;
  background: rgba(255, 255, 255, .06);
  border: 1px dashed rgba(255, 255, 255, .2);
  color: #b9b5b1
}

.arrowdown {
  display: grid;
  place-items: center;
  padding: 20px 0;
  color: var(--red-lt);
  font-size: 22px
}

.unified {
  background: var(--red);
  color: #fff;
  text-align: center;
  padding: 22px;
  border-radius: 2px
}

.unified b {
  font-size: 20px;
  letter-spacing: -.02em
}

.unified small {
  display: block;
  font-size: 13px;
  color: rgba(255, 255, 255, .85);
  margin-top: 5px
}

.bar {
  height: 12px;
  background: var(--paper-2);
  border: 1px solid var(--line);
  display: flex;
  margin-top: 10px
}

.bar i {
  display: block;
  height: 100%;
  background: var(--red)
}

.barrow {
  margin-bottom: 26px
}

.barrow .t {
  display: flex;
  justify-content: space-between;
  font-size: 14px;
  font-weight: 600
}

.barrow .t em {
  font-style: normal;
  font-family: 'IBM Plex Mono', monospace;
  color: var(--red)
}

.barrow p {
  margin: 8px 0 0;
  font-size: 14.5px;
  color: var(--mut);
  line-height: 1.55
}

/* ---------- SOLUTIONS ---------- */
.sol {
  border: 1px solid var(--line);
  background: #fff;
  margin-top: 26px;
  display: grid;
  grid-template-columns: 1fr 1fr
}

.sol .l {
  padding: clamp(28px, 3.4vw, 46px)
}

.sol .r {
  padding: clamp(28px, 3.4vw, 46px);
  background: var(--paper-2);
  border-left: 1px solid var(--line)
}

.sol h3 {
  font-size: clamp(23px, 2.5vw, 31px);
  /* margin: 14px 0 14px */
}

.sol p {
  color: var(--ink);
  font-size: 16px;
  margin: 0 0 18px
}

.chips {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 6px
}

.chips span {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11.5px;
  letter-spacing: .06em;
  padding: 6px 10px;
  border: 1px solid var(--line);
  background: #fff;
  color: var(--ink)
}

.ck {
  list-style: none;
  padding: 0;
  margin: 0;
  margin-top: 14px;
}

.ck li {
  position: relative;
  padding-left: 26px;
  margin-bottom: 11px;
  font-size: 15.5px;
  line-height: 1.5
}

.ck li:before {
  content: "";
  position: absolute;
  left: 0;
  top: 8px;
  width: 9px;
  height: 9px;
  background: var(--red);
  border-radius: 1px
}

.ck.warn li:before {
  background: var(--ink);
  opacity: .55
}

.rl {
  /* font-family: 'IBM Plex Mono', monospace;
  font-size: 11.5px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--mut);
  margin: 0 0 16px */
   font-family: 'IBM Plex Mono', monospace;
  font-size: 11.5px;
  letter-spacing: .19em;
  text-transform: uppercase;
  color: var(--red);
  font-weight: 500
}

.gcal { margin-top: 56px }
.gcal h3 { margin: 12px 0 28px; font-size: clamp(24px, 3vw, 36px) }
.gcal-list {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px
}
.gcal-list li {
  background: #fff; border: 1px solid var(--line); border-radius: 20px;
  padding: 22px 20px 24px; position: relative; overflow: hidden;
  box-shadow: 0 10px 26px rgba(31,30,29,.05)
}
.gcal-list li:after {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--red)
}
.gcal-n {
  font-family: 'IBM Plex Mono', monospace; font-size: 12px; color: var(--red);
  letter-spacing: .12em; display: block; margin-bottom: 10px
}
.gcal-list b { display: block; font-size: 17px; margin-bottom: 6px }
.gcal-list small { display: block; color: var(--mut); font-size: 13.5px; line-height: 1.45 }
@media(max-width:900px){ .gcal-list { grid-template-columns: 1fr 1fr } }
@media(max-width:560px){ .gcal-list { grid-template-columns: 1fr } }

.gcal-path { margin-top: 64px }
.gcal-head { max-width: 46em }
.gcal-path h3 {
  margin: 10px 0 12px;
  /* font-family: 'Fraunces', serif; */
  font-weight: 500;
  font-size: clamp(28px, 3.4vw, 42px)
}
.gcal-track {
  list-style: none;
  margin: 48px 0 0;
  padding: 0;
  position: relative;
  max-width: 880px
}
.gcal-track:before {
  content: "";
  position: absolute;
  left: 50%;
  top: 24px;
  bottom: 24px;
  width: 3px;
  margin-left: -1.5px;
  background: linear-gradient(180deg, var(--red), rgba(196, 59, 63, .15));
  border-radius: 3px
}
.gcal-track li {
  display: grid;
  grid-template-columns: 1fr 56px 1fr;
  gap: 22px;
  align-items: center;
  margin-bottom: 18px;
  background: none;
  border: 0;
  box-shadow: none;
  padding: 0
}
.gcal-track li:after { display: none }
.gcal-track li:nth-child(odd) .gcal-card { grid-column: 1; text-align: right }
.gcal-track li:nth-child(even) .gcal-card { grid-column: 3 }
.gcal-orb {
  grid-column: 2;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--red);
  color: #fff;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 13px;
  font-weight: 500;
  box-shadow: 0 0 0 8px rgba(196, 59, 63, .12), 0 10px 22px rgba(196, 59, 63, .28);
  animation: gcalPulse 2.8s ease-in-out infinite;
  z-index: 1
}
.gcal-track li:nth-child(2) .gcal-orb { animation-delay: .3s }
.gcal-track li:nth-child(3) .gcal-orb { animation-delay: .6s }
.gcal-track li:nth-child(4) .gcal-orb { animation-delay: .9s }
.gcal-track li:nth-child(5) .gcal-orb { animation-delay: 1.2s }
.gcal-track li:nth-child(6) .gcal-orb { animation-delay: 1.5s }
.gcal-track li:nth-child(7) .gcal-orb { animation-delay: 1.8s }
.gcal-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 18px 20px 20px;
  box-shadow: 0 12px 28px rgba(31, 30, 29, .06);
  transition: transform .35s var(--ease), box-shadow .35s
}
.gcal-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 36px rgba(196, 59, 63, .12)
}
.gcal-card em {
  display: block;
  font-family: 'IBM Plex Mono', monospace;
  font-style: normal;
  font-size: 12px;
  color: var(--red);
  letter-spacing: .08em;
  text-transform: uppercase;
  margin-bottom: 6px
}
.gcal-card b { display: block; font-size: 18px; margin-bottom: 4px }
.gcal-card small { color: var(--mut); font-size: 14px }
@keyframes gcalPulse {
  0%, 100% { box-shadow: 0 0 0 8px rgba(196, 59, 63, .12), 0 10px 22px rgba(196, 59, 63, .28) }
  50% { box-shadow: 0 0 0 14px rgba(196, 59, 63, .08), 0 12px 26px rgba(196, 59, 63, .35) }
}
@media(max-width:720px) {
  .gcal-track:before { left: 28px }
  .gcal-track li {
    grid-template-columns: 56px 1fr;
    gap: 16px
  }
  .gcal-orb { grid-column: 1 }
  .gcal-track li:nth-child(odd) .gcal-card,
  .gcal-track li:nth-child(even) .gcal-card {
    grid-column: 2;
    text-align: left
  }
}

/* ---------- TIMELINE ---------- */
.tl {
  margin-top: 44px;
  overflow-x: auto;
  padding-bottom: 8px
}

.tlin {
  display: flex;
  min-width: 840px;
  border-top: 3px solid var(--red);
  position: relative
}

.tlin div {
  flex: 1;
  padding: 18px 14px 0;
  border-left: 1px solid var(--line);
  position: relative
}

.tlin div:first-child {
  border-left: 0
}

.tlin div:before {
  content: "";
  position: absolute;
  top: -3px;
  left: -1px;
  width: 1px;
  height: 14px;
  background: var(--red)
}

.tlin b {
  display: block;
  font-size: 13.5px;
  letter-spacing: -.01em;
  margin-bottom: 6px
}

.tlin small {
  font-size: 12.5px;
  color: var(--mut);
  line-height: 1.45;
  display: block
}

/* ---------- QUOTE / INSIGHTS ---------- */
.quote {
  max-width: 940px;
  margin: 0 auto;
  text-align: center
}

.quote p {
  font-family: 'Instrument Serif', serif;
  font-size: clamp(24px, 3.4vw, 42px);
  line-height: 1.24;
  letter-spacing: -.02em;
  margin: 0;
  color: #fff
}

.quote cite {
  display: block;
  font-family: 'IBM Plex Mono', monospace;
  font-style: normal;
  font-size: 12px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: #8b8783;
  margin-top: 30px
}

.posts {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: var(--line);
  margin-top: 52px
}

.posts article {
  background: #fff;
  padding: 32px 28px 36px;
  display: flex;
  flex-direction: column
}

.posts .k {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--red)
}

.posts h3 {
  font-size: 21px;
  margin: 14px 0 12px
}

.posts p {
  color: var(--mut);
  font-size: 15px;
  margin: 0 0 20px;
  flex: 1
}

.posts a {
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  border-bottom: 2px solid var(--red);
  padding-bottom: 2px;
  align-self: flex-start
}

/* ---------- ARTICLE ---------- */
.article {
  max-width: 760px;
  margin: 0 auto
}

.article .k {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11.5px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--red)
}

.article h1 {
  font-size: clamp(32px, 4.6vw, 56px);
  margin: 16px 0 20px;
  letter-spacing: -.035em
}

.article .lede {
  font-size: 20px;
  color: var(--mut);
  line-height: 1.55;
  margin: 0 0 36px
}

.article p {
  color: var(--ink);
  margin: 0 0 20px
}

.article h2 {
  font-size: clamp(24px, 2.6vw, 32px);
  margin: 42px 0 16px
}

.article h3 {
  font-size: 22px;
  margin: 32px 0 12px
}

.article ul {
  margin: 0 0 22px;
  padding-left: 20px;
  color: var(--ink)
}

.article li {
  margin-bottom: 8px
}

.article figure {
  margin: 36px 0
}

.article .press-hero {
  margin: 0 0 32px
}

.article .press-hero img {
  display: block;
  width: 100%;
  max-width: 560px;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  margin: 0 auto;
  border-radius: 16px
}

body.press-page .pagehero .press-head {
  max-width: min(1100px, 100%);
}

body.press-page .pagehero .press-head .h1 {
  max-width: 28ch
}

body.press-page .pagehero .press-head .lede {
  max-width: 100ch;
  margin-bottom: 0
}

body.press-page .article {
  max-width: 900px
}

.article .cta {
  margin-top: 40px
}

.pull {
  border-left: 3px solid var(--red);
  padding: 8px 0 8px 22px;
  margin: 32px 0;
  font-family: 'Instrument Serif', serif;
  font-size: clamp(22px, 2.4vw, 30px);
  line-height: 1.3;
  color: var(--ink)
}

/* ---------- FORMS ---------- */
.form {
  display: grid;
  gap: 16px
}

.fg {
  display: grid;
  gap: 6px
}

.fg label {
  font-size: 13.5px;
  font-weight: 600
}

.fg input,
.fg select,
.fg textarea {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--line);
  background: #fff;
  font: inherit;
  font-size: 15px;
  color: var(--ink);
  border-radius: 2px;
  line-height: 1.35
}

.fg input:focus,
.fg select:focus,
.fg textarea:focus {
  outline: 2px solid rgba(183, 49, 53, .35);
  border-color: var(--red)
}

.fg textarea {
  min-height: 96px;
  resize: vertical
}

.briefing-form .fg input,
.briefing-form .fg select,
.briefing-form .fg textarea {
  border-radius: 10px;
  padding: 9px 12px;
  font-size: 14.5px;
  line-height: 1.3;
  background: #fff;
  transition: border-color .2s var(--ease), box-shadow .2s var(--ease), background .2s var(--ease)
}

.briefing-form .fg select {
  padding-top: 8px;
  padding-bottom: 8px;
  min-height: 0;
  height: 38px
}

.briefing-form .fg textarea {
  min-height: 88px;
  padding-top: 10px
}

.form-note {
  font-size: 15px;
  color: var(--mut);
  margin: 0
}

.form-ok {
  display: none;
  padding: 18px 20px;
  background: #eef6ee;
  border: 1px solid #c9e0c9;
  color: #245c28
}

.form-ok.show {
  display: block
}

.briefing-sec {
  background: var(--paper);
  padding: clamp(48px, 7vw, 88px) 0;
  border-bottom: 1px solid var(--line)
}

.briefing-layout {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
  gap: clamp(24px, 4vw, 40px);
  align-items: start;
  margin-bottom: 0
}

.briefing-copy {
  padding: 0;
  max-width: none
}

.briefing-copy .lab {
  margin-bottom: 14px
}

.briefing-copy h2 {
  margin: 0 0 14px;
  font-size: clamp(28px, 3.4vw, 40px);
  letter-spacing: -.02em;
  line-height: 1.15;
  color: var(--ink)
}

.briefing-copy .sub {
  margin: 0;
  max-width: 36ch;
  line-height: 1.6;
  color: var(--mut)
}

.briefing-email {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin-top: 32px;
  padding: 28px 26px 24px;
  max-width: 320px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  color: inherit;
  text-decoration: none;
  box-shadow: 0 12px 32px rgba(31, 30, 29, .06);
  transition: transform .28s var(--ease), box-shadow .28s var(--ease), border-color .28s var(--ease)
}

.briefing-email:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 40px rgba(31, 30, 29, .1);
  border-color: transparent
}

.briefing-email .c-ico {
  margin-bottom: 18px
}

.briefing-email .rl {
  margin: 0
}

.briefing-email p {
  margin: 10px 0 0;
  font-size: 18px;
  line-height: 1.4;
  color: var(--ink)
}

.briefing-email .c-go {
  margin-top: 18px
}

/* ---------- Callbolt floating assistant ---------- */
.callbolt-fab {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 120;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px 12px 12px;
  border: 0;
  border-radius: 999px;
  background: linear-gradient(135deg, #d9484c, #b73135 55%, #8e2225);
  color: #fff;
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .01em;
  cursor: pointer;
  box-shadow: 0 16px 36px rgba(183, 49, 53, .38), 0 4px 12px rgba(20, 20, 22, .18);
  transition: transform .25s var(--ease), box-shadow .25s var(--ease), padding .25s var(--ease)
}

.callbolt-fab:hover {
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 20px 42px rgba(183, 49, 53, .45), 0 6px 14px rgba(20, 20, 22, .2)
}

.callbolt-fab-ico {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: rgba(255, 255, 255, .16);
  flex: 0 0 auto
}

.callbolt-fab-ico i { font-size: 16px }

.callbolt-fab.is-open {
  padding: 12px;
  border-radius: 50%
}

.callbolt-fab.is-open .callbolt-fab-txt { display: none }

.callbolt-panel {
  position: fixed;
  right: 22px;
  bottom: 84px;
  z-index: 119;
  width: min(360px, calc(100vw - 32px));
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 20px;
  box-shadow: 0 24px 56px rgba(20, 20, 22, .18);
  overflow: hidden
}

.callbolt-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 16px 16px 14px;
  background: #111214;
  color: #fff
}

.callbolt-kicker {
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #f0a3a5;
  margin-bottom: 4px
}

.callbolt-panel-head strong {
  font-size: 16px;
  font-weight: 600
}

.callbolt-close {
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, .1);
  color: #fff;
  cursor: pointer
}

.callbolt-panel-body { padding: 18px 16px 16px }

.callbolt-lead {
  margin: 0 0 16px;
  color: var(--mut);
  font-size: 14.5px;
  line-height: 1.55
}

.callbolt-actions {
  display: grid;
  gap: 10px
}

.callbolt-actions .btn {
  width: 100%;
  justify-content: center;
  text-align: center
}

.callbolt-note {
  margin: 14px 0 0;
  font-size: 12.5px;
  line-height: 1.45;
  color: var(--mut)
}

@media (max-width: 560px) {
  .callbolt-fab {
    right: 14px;
    bottom: 14px
  }

  .callbolt-fab-txt {
    max-width: 12ch;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
  }

  .callbolt-panel {
    right: 14px;
    bottom: 76px;
    width: calc(100vw - 28px)
  }
}

.briefing-form {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: clamp(22px, 3vw, 22px);
  margin-left: 0;
  box-shadow: 0 12px 32px rgba(31, 30, 29, .06)
}

.briefing-form .fg label {
  color: var(--ink)
}

.briefing-form .fg label span {
  color: var(--red)
}

.briefing-form .btn {
  justify-self: stretch;
  width: 100%;
  text-align: center;
  border-radius: 12px;
  margin-top: 4px;
  padding-top: 14px;
  padding-bottom: 14px
}

.fg.is-invalid input,
.fg.is-invalid select,
.fg.is-invalid textarea {
  border-color: var(--red);
  outline: none;
  box-shadow: 0 0 0 3px rgba(196, 59, 63, .12)
}

.field-error {
  font-size: 12.5px;
  color: var(--red);
  line-height: 1.35
}

.field-error[hidden] {
  display: none
}

.briefing-form .form-note-top {
  margin: 0 0 8px;
  text-align: right
}

.briefing-form .form-note-top span {
  color: var(--red);
  font-weight: 600
}

.briefing-form .form-ok {
  border-radius: 12px
}

.briefing-form .form-ok a {
  color: inherit;
  font-weight: 600
}

@media (max-width: 900px) {
  .briefing-layout {
    grid-template-columns: 1fr;
    gap: 24px
  }
}

.contact-sec {
  background: var(--paper-2);
  padding: clamp(48px, 7vw, 88px) 0
}

.contact-head {
  margin-bottom: 28px
}

.contact-head h2 {
  margin: 10px 0 0;
  font-size: clamp(26px, 3vw, 36px);
  letter-spacing: -.02em;
  line-height: 1.2
}

.contact-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px
}

.contact-grid-4 {
  grid-template-columns: repeat(4, 1fr)
}

.contact-grid-3 {
  grid-template-columns: repeat(3, 1fr)
}

.contact-card {
  background: #fff;
  padding: 40px 34px 36px;
  color: inherit;
  text-decoration: none;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--line);
  position: relative;
  overflow: hidden;
  transition: transform .28s var(--ease), box-shadow .28s var(--ease), border-color .28s var(--ease)
}

.contact-card:before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 3px;
  background: var(--red);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .35s var(--ease)
}

.contact-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 22px 48px rgba(20, 20, 22, .1);
  border-color: transparent
}

.contact-card:hover:before {
  transform: scaleX(1)
}

.contact-card p {
  margin: 12px 0 0;
  font-size: 16px;
  line-height: 1.5;
  color: var(--ink);
  flex: 1
}

.c-ico {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  margin-bottom: 24px;
  color: #fff;
  background: radial-gradient(circle at 32% 28%, #e55b5b, #b73135 62%, #8e2225);
  box-shadow: 0 10px 24px rgba(183, 49, 53, .28);
  position: relative
}

.c-flag {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  margin-bottom: 24px;
  background: #f3f1ee;
  border: 1px solid var(--line);
  box-shadow: 0 8px 18px rgba(20, 20, 22, .08);
  overflow: hidden
}

.c-flag img {
  width: 40px;
  height: auto;
  display: block;
  border-radius: 2px
}

.c-ico i {
  font-size: 22px
}

.c-ico.sm {
  width: 48px;
  height: 48px;
  margin-bottom: 0
}

.c-ico.sm i {
  font-size: 18px
}

.c-ico:after {
  content: "";
  position: absolute;
  inset: -8px;
  border-radius: 50%;
  border: 1px solid rgba(183, 49, 53, .25);
  opacity: 0;
  transform: scale(.8);
  transition: .35s var(--ease)
}

.contact-card:hover .c-ico {
  animation: icoPulse .7s var(--ease)
}

.contact-card:hover .c-ico:after {
  opacity: 1;
  transform: scale(1)
}

.contact-card.reveal.in .c-ico,
.contact-card.reveal.in .c-flag {
  animation: icoDraw .85s var(--ease) both
}

.contact-card.reveal.in:nth-child(2) .c-ico,
.contact-card.reveal.in:nth-child(2) .c-flag {
  animation-delay: .12s
}

.contact-card.reveal.in:nth-child(3) .c-ico,
.contact-card.reveal.in:nth-child(3) .c-flag {
  animation-delay: .24s
}

.contact-card.reveal.in:nth-child(4) .c-ico,
.contact-card.reveal.in:nth-child(4) .c-flag {
  animation-delay: .36s
}

.c-go {
  margin-top: 22px;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--red);
  letter-spacing: -.01em
}

.c-go i {
  margin-left: 6px;
  transition: transform .25s var(--ease);
  font-size: 12px
}

.contact-card:hover .c-go i {
  transform: translateX(4px)
}

.btn i {
  margin-left: 8px;
  font-size: .8em
}

.btn.ghost i {
  margin-left: 0;
  margin-right: 8px
}

.f-meta {
  font-size: 14px;
  margin: 0 0 8px;
  display: flex;
  align-items: center;
  gap: 10px
}

.f-meta i {
  color: var(--red-lt);
  width: 14px;
  text-align: center
}

@keyframes icoDraw {
  from {
    opacity: 0;
    transform: translateY(10px) scale(.86)
  }

  to {
    opacity: 1;
    transform: none
  }
}

@keyframes icoPulse {
  50% {
    transform: translateY(-3px)
  }
}

@media(max-width:1100px) {
  .contact-grid-4,
  .contact-grid-3 {
    grid-template-columns: repeat(2, 1fr)
  }
}

@media(max-width:800px) {
  .contact-grid,
  .contact-grid-4,
  .contact-grid-3 {
    grid-template-columns: 1fr
  }
}

@media(prefers-reduced-motion:reduce) {

  .c-ico,
  .contact-card.reveal.in .c-ico {
    animation: none
  }
}

/* ---------- CTA / FOOTER ---------- */
.endcta {
  text-align: center
}

.endcta h2 {
  max-width: 24ch;
  margin: 16px auto 0
}

.endcta .sub {
  margin: 22px auto 0;
  text-align: center
}

.endcta .cta {
  justify-content: center
}

footer {
  background: var(--black);
  color: #8b8783;
  padding: 60px 0 40px;
  border-top: 1px solid var(--line-dk);
  text-align: center
}

.fgrid {
  display: grid;
  grid-template-columns: 1.2fr 1.2fr 1.2fr 1.2fr;
  gap: 34px;
  justify-items: center
}

footer .brand {
  margin: 0 auto 16px;
  justify-content: center
}

footer .brand img {
  height: 48px
}

footer p {
  margin-left: auto;
  margin-right: auto
}

footer h4 {
  color: #eceae7;
  font-size: 13px;
  font-family: 'IBM Plex Mono', monospace;
  letter-spacing: .14em;
  text-transform: uppercase;
  font-weight: 500;
  margin: 0 0 16px
}

footer ul {
  list-style: none;
  padding: 0;
  margin: 0
}

footer li {
  margin-bottom: 10px;
  font-size: 14.5px
}

footer a {
  text-decoration: none
}

footer a:hover {
  color: #fff
}

.f-meta {
  justify-content: center
}

.fbot {
  margin-top: 48px;
  padding-top: 24px;
  border-top: 1px solid var(--line-dk);
  display: flex;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  font-size: 15px;
  text-align: center
}

/* ---------- REVEAL / LOAD ---------- */
.reveal {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity .7s var(--ease), transform .7s var(--ease)
}

.reveal.in {
  opacity: 1;
  transform: none
}

.load {
  opacity: 0;
  transform: translateY(26px);
  animation: loadIn .9s var(--ease) forwards
}

.load-1 {
  animation-delay: .08s
}

.load-2 {
  animation-delay: .22s
}

.load-3 {
  animation-delay: .38s
}

.load-4 {
  animation-delay: .54s
}

.load-5 {
  animation-delay: .7s
}

@keyframes loadIn {
  to {
    opacity: 1;
    transform: none
  }
}

.canvas-net {
  animation: fadeNet 1.4s var(--ease) .2s both
}

@keyframes fadeNet {
  from {
    opacity: 0
  }

  to {
    opacity: .7
  }
}

header {
  animation: dropNav .7s var(--ease) both
}

@keyframes dropNav {
  from {
    opacity: 0;
    transform: translateY(-10px)
  }

  to {
    opacity: 1;
    transform: none
  }
}

/* ---------- RESPONSIVE ---------- */
@media(max-width:1080px) {
  .hero-split {
    grid-template-columns: 1fr
  }

  .viz {
    min-height: 320px;
    order: -1
  }

  .hero-orb.o1,
  .hero-orb.o2 {
    opacity: .42
  }

  .hero-orb.o3 {
    display: none
  }

  .lead-grid {
    grid-template-columns: 1fr 1fr
  }

  .g3,
  .g4 {
    grid-template-columns: 1fr 1fr
  }
}

@media(max-width:920px) {
  .navtoggle {
    display: grid;
    place-items: center
  }

  .nav .btn.desk {
    display: none
  }

  .navlinks {
    display: none;
    position: absolute;
    left: 0;
    right: 0;
    top: 72px;
    background: #0c0d0e;
    flex-direction: column;
    align-items: stretch;
    padding: 18px var(--pad) 28px;
    gap: 4px;
    border-bottom: 1px solid var(--line-dk)
  }

  .navlinks.open {
    display: flex
  }

  .nav a.nl,
  .navlinks a.nl {
    padding: 6px 0;
    font-size: 17px;
    text-decoration: none
  }

  .nav a.nl:after,
  .navlinks a.nl:after,
  .nav a.nl.active:after,
  .navlinks a.nl.active:after {
    display: none;
    content: none
  }

  .dd-menu {
    position: static;
    transform: none;
    opacity: 1;
    pointer-events: auto;
    box-shadow: none;
    border: 0;
    background: transparent;
    padding: 0 0 8px 12px;
    min-width: 0
  }

  .dd-menu:before {
    display: none
  }

  .navlinks .btn {
    display: block;
    margin-top: 12px;
    text-align: center
  }
}

@media(max-width:900px) {
  .lead-section {
    background-attachment: scroll
  }

  .g2,
  .sol,
  .cards {
    grid-template-columns: 1fr
  }

  .g3,
  .g4,
  .posts,
  .lead-grid {
    grid-template-columns: 1fr
  }

  .sol .r {
    border-left: 0;
    border-top: 1px solid var(--line)
  }

  .step {
    grid-template-columns: 1fr
  }

  .step:before {
    padding: 0
  }

  .steps.pictured .step {
    grid-template-columns: 1fr;
    gap: 18px
  }

  body.v2 .steps.pictured .step:nth-child(even) {
    direction: ltr
  }

  body.v2 .steps.pictured .step:nth-child(even) .step-copy {
    text-align: left
  }

  .step-media {
    max-width: none;
    width: 100%
  }
}

@media(max-width:860px) {
  .bandgrid {
    grid-template-columns: 1fr 1fr
  }

  .bandgrid div:nth-child(3) {
    border-left: 0
  }

  .bandgrid div:nth-child(n+3) {
    border-top: 1px solid rgba(255, 255, 255, .22)
  }
}

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

@media(max-width:560px) {
  .bandgrid {
    grid-template-columns: 1fr
  }

  .bandgrid div {
    border-left: 0;
    border-top: 1px solid rgba(255, 255, 255, .22)
  }

  .bandgrid div:first-child {
    border-top: 0
  }

  .fgrid {
    grid-template-columns: 1fr
  }

  .step-all-labels {
    padding: 10px 2px 12px
  }

  .step-all-labels span {
    font-size: 11px;
    padding: 0 3px
  }

  .faq-item summary {
    padding: 16px 54px 16px 60px;
    font-size: 16.5px
  }

  .faq-item p {
    padding: 0 20px 18px 60px
  }

  .faq-item summary:before {
    left: 12px;
    width: 32px;
    height: 32px;
    font-size: 10.5px
  }

  .faq-item summary:after {
    right: 12px;
    width: 28px;
    height: 28px;
    font-size: 18px
  }

  .hero-orb.o1 {
    left: 4px;
    top: 10%;
    width: 64px
  }

  .hero-orb.o2 {
    right: 4px;
    bottom: 12%;
    width: 72px
  }
}

.to-top {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 70;
  width: 46px;
  height: 46px;
  border: 0;
  border-radius: 50%;
  background: var(--red);
  color: #fff;
  cursor: pointer;
  display: grid;
  place-items: center;
  box-shadow: 0 10px 24px rgba(183, 49, 53, .35);
  opacity: 0;
  pointer-events: none;
  transform: translateY(10px);
  transition: opacity .25s var(--ease), transform .25s var(--ease), background .2s, box-shadow .2s
}

.to-top.show {
  opacity: 1;
  pointer-events: auto;
  transform: none
}

.to-top:hover {
  background: var(--red-dk);
  box-shadow: 0 14px 30px rgba(183, 49, 53, .45);
  transform: translateY(-3px)
}

.to-top i {
  font-size: 16px
}

@media(prefers-reduced-motion:reduce) {

  .reveal,
  .load,
  .load-line,
  .hw,
  .hero .lab,
  .hero .lab:after,
  .faq-item[open] p {
    opacity: 1;
    transform: none;
    filter: none;
    letter-spacing: inherit;
    clip-path: none;
    animation: none
  }

  .planet-core,
  .planet-ring,
  .planet-globe,
  .hero-orb,
  .canvas-net,
  header,
  .tick > div,
  .i-word.is-on:after,
  .step-media,
  .step-media img,
  .step-media:after,
  .lead-card,
  .gcal-orb {
    animation: none
  }

  .load-line {
    clip-path: none
  }
}

/* ---------- V2 LIGHT THEME ---------- */
body.v2,
body.v2 header {
  overflow-x: hidden
}

body.v2 header {
  background: rgba(250, 248, 245, .94);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(16px);
  animation: fadeNav .7s ease both;
  padding: 0;
  z-index: 80
}

body.v2 header .nav.wrap {
  max-width: none;
  width: 100%;
  margin: 0;
  padding: 0 16px;
  justify-content: flex-start;
  gap: 12px
}

body.v2 .brand {
  margin-right: auto
}

body.v2 .nav .btn.desk,
body.v2 .navtoggle {
  margin-left: 0
}

@keyframes fadeNav {
  from { opacity: 0 }
  to { opacity: 1 }
}

body.v2 .nav {
  height: 102px;
  background: none;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  padding: 0
}

body.v2 .brand { color: var(--ink) }

body.v2 .navtoggle {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  color: var(--ink);
  z-index: 96;
  position: relative
}

body.v2 .navtoggle span,
body.v2 .navtoggle span:before,
body.v2 .navtoggle span:after {
  background: var(--ink);
  transition: transform .28s ease, top .28s ease, background .2s ease
}

body.v2 .navtoggle.is-open span { background: transparent }
body.v2 .navtoggle.is-open span:before {
  top: 0;
  transform: rotate(45deg)
}
body.v2 .navtoggle.is-open span:after {
  top: 0;
  transform: rotate(-45deg)
}

body.v2 .navlinks {
  display: flex;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: auto;
  width: min(400px, 88vw);
  height: 100vh;
  max-height: none;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  padding: 120px 22px 28px;
  margin: 0;
  background: #fff;
  border: 0;
  border-left: 1px solid var(--line);
  border-radius: 0;
  box-shadow: -24px 0 50px rgba(20, 20, 22, .12);
  transform: translateX(104%);
  transition: transform .35s ease, visibility .35s ease;
  z-index: 94;
  overflow: auto;
  pointer-events: none;
  visibility: hidden
}

body.v2 .navlinks.open {
  display: flex;
  transform: translateX(0);
  pointer-events: auto;
  visibility: visible
}

body.v2 .nav a.nl,
body.v2 .navlinks a.nl {
  color: var(--ink);
  padding: 6px 8px;
  border-radius: 8px;
  font-size: 17px;
  line-height: 1.25;
  text-decoration: none;
  transition: color .22s var(--ease), background .22s var(--ease)
}

body.v2 .nav a.nl:after,
body.v2 .navlinks a.nl:after {
  display: none;
  content: none
}

body.v2 .nav a.nl.active,
body.v2 .navlinks a.nl.active {
  color: #b73135
}

body.v2 .dd {
  display: block;
  align-self: stretch
}

body.v2 .dd-menu {
  position: static;
  transform: none;
  opacity: 1;
  pointer-events: auto;
  min-width: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
  border-radius: 0;
  padding: 0 0 4px 12px
}

body.v2 .dd-menu:before { display: none }

body.v2 .dd-menu a {
  color: #000;
  border-radius: 10px;
  padding: 3px 12px;
  text-decoration: none;
}

body.v2 .dd-menu small {
  color: #5f5a55
}

body.v2 .dd-menu a:last-child { border-bottom: 0 }

body.v2 .dd-menu a:hover {
  background: #f6eaea;
  color: #b73135;
  transform: translateX(4px)
}

body.v2 .navlinks .btn {
  display: block;
  margin-top: 16px;
  text-align: center
}

body.v2 .nav-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(12, 13, 14, .38);
  opacity: 0;
  pointer-events: none;
  transition: opacity .3s ease;
  z-index: 90
}

body.v2.nav-open { overflow: hidden }
body.v2.nav-open header { z-index: 100 }
body.v2.nav-open .nav-backdrop {
  opacity: 1;
  pointer-events: auto
}
.btn { border-radius: 999px }
.btn.ghost {
  border-radius: 999px
}

.hero:not(.dark) {
  background: var(--paper);
  color: var(--ink)
}
.hero:not(.dark):before {
  background:
    radial-gradient(56% 60% at 50% 0%, rgba(196, 59, 63, .14), transparent 70%),
    radial-gradient(40% 40% at 80% 90%, rgba(196, 59, 63, .06), transparent 70%)
}
.hero:not(.dark):after {
  opacity: .7;
  background-image: linear-gradient(rgba(196, 59, 63, .07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(196, 59, 63, .07) 1px, transparent 1px)
}
.hero:not(.dark) .deck-tag,
.hero:not(.dark) .hero-copy,
.hero:not(.dark) .sub { color: var(--ink) }
.hero:not(.dark) .h1.stack em.line { color: var(--red) }
.hero:not(.dark) .i-word {
  color: var(--ink);
  background: rgba(196, 59, 63, .08);
  border-color: rgba(196, 59, 63, .22);
  border-radius: 999px
}
.hero:not(.dark) .i-word.is-on {
  background: rgba(196, 59, 63, .16);
  border-color: var(--red);
  box-shadow: 0 0 0 4px rgba(196, 59, 63, .1)
}
.hero:not(.dark) .trust {
  border-top-color: var(--line);
  color: #000
}
.hero:not(.dark) .crumb { color: #8a8580 }
.hero:not(.dark) .crumb a { color: #6d6a66 }
.hero:not(.dark) .crumb a:hover { color: var(--ink) }
.hero:not(.dark) .btn.ghost {
  color: var(--ink);
  border-color: #c9c3ba
}
.hero:not(.dark) .btn.ghost:hover {
  background: #fff;
  border-color: var(--ink)
}

.load-line {
  opacity: 0;
  transform: none;
  filter: none;
  clip-path: inset(0 100% 0 0);
  animation: wipeIn .85s var(--ease) forwards
}

@keyframes wipeIn {
  to {
    opacity: 1;
    clip-path: inset(0 0 0 0)
  }
}

.reveal {
  opacity: 0;
  transform: scale(.94);
  filter: blur(8px);
  transition: opacity .8s var(--ease), transform .8s var(--ease), filter .8s var(--ease)
}

.reveal.in {
  opacity: 1;
  transform: none;
  filter: none
}

.g3>div,
.g3>a,
.faq-item,
.lead-card,
.step-media,
.sol,
.contact-card {
  border-radius: 18px
}

.faq-item:hover {
  transform: translateY(-4px) scale(1.01)
}

@keyframes orbFloat {
  50% { transform: translateY(-8px) rotate(8deg) }
}

.to-top {
  transform: scale(.7);
  border-radius: 14px
}

.to-top.show { transform: none }
.to-top:hover { transform: translateY(-4px) scale(1.06) }

@media(max-width:920px) {
  .navlinks {
    background: #fff;
    border-bottom: 1px solid var(--line)
  }
  .nav a.nl,
  .navlinks a.nl { color: var(--ink); text-decoration: none }

  body.v2 .nav .btn.desk { display: none }

  .deck-tag {
    flex-wrap: wrap;
    white-space: normal;
    row-gap: 8px
  }
}

html.aos-on .reveal:not([data-aos]) {
  opacity: 1;
  transform: none;
  filter: none
}

html.aos-on .reveal[data-aos] {
  filter: none;
  transition-property: transform, opacity
}

html.aos-on .reveal[data-aos="card-up"]:not(.aos-animate),
html.aos-on [data-aos="card-up"]:not(.aos-animate) {
  opacity: 0;
  transform: translateY(36px) scale(.98);
  filter: none
}

html.aos-on .reveal[data-aos].aos-animate,
html.aos-on [data-aos="card-up"].aos-animate {
  opacity: 1;
  transform: none;
  filter: none
}

body.v2 {
  /* font-family: 'Outfit', system-ui, sans-serif */
}

body.v2 h1,
body.v2 h2,
body.v2 h3,
body.v2 .h1,
body.v2 .lead-card h3 {
  /* font-family: 'Instrument Serif', serif; */
  font-weight: 500
}

.v2-hero {
  padding: clamp(40px, 6vw, 72px) 0 28px;
  min-height: 0;
  overflow: visible
}

.v2-hero > .wrap {
  max-width: 1480px
}

.v2-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
  gap: clamp(20px, 3vw, 36px);
  align-items: center
}

.v2-hero-copy .h1 {
  max-width: none;
  white-space: nowrap;
  font-size: clamp(26px, 2.4vw, 46px);
  margin-top: 12px
}

.v2-hero-copy .h1 em {
  display: inline;
  color: var(--red);
  font-style: italic;
  font-weight: 700;
  background: none;
  padding: 0;
  font-size: 1em;
  line-height: inherit;
  vertical-align: baseline
}

.hero.hero-stage .lab.load-line,
.hero.hero-stage .h1.load-line,
.hero.hero-stage .h1 .load-line {
  opacity: 1;
  transform: none;
  filter: none;
  clip-path: none;
  animation: none
}

.hero.hero-stage .lab {
  opacity: 0;
  display: none;
}

.hero.hero-stage.is-ready .lab {
  animation: heroLab 1.05s cubic-bezier(.16, 1, .3, 1) both
}

.hero .lab:after {
  content: "";
  display: block;
  width: 44px;
  height: 1px;
  margin-top: 12px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: left;
  opacity: .9
}

.hero-center .lab:after,
.v2-hero-copy .lab:after {
  margin-left: 0;
  transform-origin: left
}

.hero-center .lab:after {
  margin-left: auto;
  margin-right: auto;
  transform-origin: center
}

.hero.hero-stage.is-ready .lab:after {
  animation: heroRule .8s cubic-bezier(.16, 1, .3, 1) .18s forwards
}

.hclip {
  display: inline-block;
  /* overflow: hidden;
  vertical-align: bottom;
  padding-bottom: .1em;
  margin-bottom: -.1em;
  perspective: 520px */
}

.hw {
  display: inline-block;
  transform: translate3d(0, 112%, 0) rotateX(16deg);
  transform-origin: 50% 100%;
  will-change: transform, filter, opacity
}

.hero.hero-stage.is-ready .hw {
  animation: heroWord 1.15s cubic-bezier(.16, 1, .3, 1) both;
  animation-delay: var(--d, 0ms)
}

.h1 em .hw {
  animation-duration: 1.28s
}

@keyframes heroLab {
  from {
    opacity: 0;
    letter-spacing: .62em;
    filter: blur(8px)
  }
  to {
    opacity: 1;
    letter-spacing: .19em;
    filter: none
  }
}

@keyframes heroRule {
  to { transform: scaleX(1) }
}

@keyframes heroWord {
  from {
    transform: translate3d(0, 112%, 0) rotateX(16deg);
    filter: blur(10px);
    opacity: .25
  }
  to {
    transform: translate3d(0, 0, 0) rotateX(0deg);
    filter: none;
    opacity: 1
  }
}

.v2-hero-copy .deck-tag {
  display: block;
  margin: 22px 0 0;
  color: #5c5854;
  font-size: clamp(15px, 1.35vw, 17px);
  line-height: 1.55;
  justify-content: flex-start;
  flex-wrap: wrap;
  white-space: normal;
  max-width: none
}

body.v2 .hero:not(.dark) .i-word,
body.v2 .hero:not(.dark) .i-word.is-on {
  color: #6d6965;
  background: none;
  border: none;
  border-radius: 0;
  padding: 0 0 3px;
  box-shadow: none;
  font-weight: 600;
  overflow: visible;
  animation: v2IPulse 4.8s ease-in-out infinite
}

body.v2 .hero:not(.dark) .i-word:nth-of-type(2),
body.v2 .hero:not(.dark) .i-word:nth-of-type(2):after { animation-delay: 1.6s }
body.v2 .hero:not(.dark) .i-word:nth-of-type(3),
body.v2 .hero:not(.dark) .i-word:nth-of-type(3):after { animation-delay: 3.2s }

body.v2 .hero:not(.dark) .i-word:after,
body.v2 .hero:not(.dark) .i-word.is-on:after {
  display: block;
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  background: #b73135;
  border-radius: 2px;
  transform: scaleX(0);
  transform-origin: center;
  box-shadow: 0 0 8px rgba(183, 49, 53, .55);
  animation: v2ILine 4.8s ease-in-out infinite
}

@keyframes v2IPulse {
  0%, 28%, 100% {
    color: #6d6965;
    text-shadow: none
  }
  5% {
    color: #b73135;
    text-shadow: 0 0 14px rgba(183, 49, 53, .55)
  }
  9% {
    color: #6d6965;
    text-shadow: none
  }
  13%, 22% {
    color: #b73135;
    text-shadow: 0 0 16px rgba(183, 49, 53, .7), 0 0 28px rgba(183, 49, 53, .28)
  }
}

@keyframes v2ILine {
  0%, 28%, 100% { transform: scaleX(0); opacity: 0 }
  13%, 22% { transform: scaleX(1); opacity: 1 }
}

@media (prefers-reduced-motion: reduce) {
  body.v2 .hero:not(.dark) .i-word,
  body.v2 .hero:not(.dark) .i-word:after {
    animation: none
  }
  body.v2 .hero:not(.dark) .i-word {
    color: #b73135
  }
}

.v2-hero-visual.v2-industries {
  min-height: 0;
  overflow: visible;
  box-shadow: none;
  background: none;
  border-radius: 0
}

.ind-stage {
  position: relative;
  perspective: 1600px;
  padding: 22px 16px 20px;
  border-radius: 24px;
  background:
    radial-gradient(80% 70% at 78% 8%, rgba(183, 49, 53, .1), transparent 58%),
    repeating-linear-gradient(rgba(31, 30, 29, .045) 0 1px, transparent 1px 22px),
    repeating-linear-gradient(90deg, rgba(31, 30, 29, .045) 0 1px, transparent 1px 22px),
    #eceae6
}

.ind-board {
  position: relative;
  z-index: 1;
  display: block;
  min-height: clamp(360px, 46vw, 500px);
  height: clamp(360px, 46vw, 500px);
  padding: 0;
  transform: rotateX(6deg) rotateY(-10deg);
  transform-style: preserve-3d
}

.ind-card {
  --in: 0s;
  --bob: 7s;
  --x1: 0px;
  --y1: 0px;
  --r1: 0deg;
  --x2: 0px;
  --y2: 0px;
  --r2: 0deg;
  --x3: 0px;
  --y3: 0px;
  --r3: 0deg;
  --scene: none;
  --tint: linear-gradient(180deg, rgba(12, 14, 20, .35), rgba(12, 14, 20, .7));
  --tilt: 0deg;
  position: absolute;
  overflow: hidden;
  opacity: 0;
  border-radius: 8px;
  aspect-ratio: 1;
  background: #12141a;
  box-shadow: 0 18px 32px rgba(20, 24, 32, .28);
  animation:
    indDrop .9s cubic-bezier(.16, 1, .3, 1) var(--in) both,
    indDrift var(--bob) ease-in-out calc(var(--in) + .9s) infinite
}

.ind-card:before,
.ind-card:after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none
}

.ind-card:before {
  z-index: 0;
  background-image: var(--scene);
  background-size: cover;
  background-position: center;
  transform: scale(1.12);
  filter: saturate(1.15)
}

.ind-card:after {
  z-index: 1;
  background: var(--tint)
}

.ind-card.c1 { --in: 0s; --bob: 6.4s; --x1: 4px; --y1: -10px; --r1: -1.4deg; --x2: -6px; --y2: 8px; --r2: 1.6deg; --x3: 5px; --y3: -4px; --r3: -.8deg;  --tint: linear-gradient(165deg, rgba(78, 12, 92, .45), rgba(12, 8, 40, .72)); }
.ind-card.c2 { --in: .28s; --bob: 8.1s; --x1: -7px; --y1: 6px; --r1: 1.8deg; --x2: 8px; --y2: -12px; --r2: -1.2deg; --x3: -3px; --y3: 9px; --r3: 1deg;  --tint: linear-gradient(165deg, rgba(12, 72, 42, .42), rgba(8, 28, 18, .74)); }
.ind-card.c3 { --in: .56s; --bob: 7.2s; --x1: 6px; --y1: 9px; --r1: .9deg; --x2: -9px; --y2: -6px; --r2: -1.8deg; --x3: 2px; --y3: 11px; --r3: 1.4deg;  --tint: linear-gradient(165deg, rgba(12, 92, 88, .4), rgba(8, 28, 36, .72)); }
.ind-card.c4 { --in: .84s; --bob: 9s; --x1: -5px; --y1: -14px; --r1: -2deg; --x2: 7px; --y2: 5px; --r2: 1.1deg; --x3: -8px; --y3: -7px; --r3: -.6deg;  --tint: linear-gradient(165deg, rgba(12, 52, 92, .42), rgba(8, 16, 28, .74)); }
.ind-card.c5 { --in: 1.12s; --bob: 6.8s; --x1: 8px; --y1: 4px; --r1: 1.5deg; --x2: -4px; --y2: -11px; --r2: -.9deg; --x3: 6px; --y3: 7px; --r3: 1.8deg;  --tint: linear-gradient(165deg, rgba(20, 36, 92, .46), rgba(10, 14, 32, .74)); }
.ind-card.c6 { --in: 1.4s; --bob: 8.6s; --x1: -8px; --y1: -7px; --r1: -1.1deg; --x2: 5px; --y2: 12px; --r2: 2deg; --x3: -6px; --y3: -3px; --r3: -1.5deg;  --tint: linear-gradient(165deg, rgba(36, 48, 72, .44), rgba(12, 16, 28, .74)); }
.ind-card.c7 { --in: 1.68s; --bob: 7.5s; --x1: 3px; --y1: 12px; --r1: .7deg; --x2: -10px; --y2: -5px; --r2: -2.1deg; --x3: 7px; --y3: 6px; --r3: 1.2deg;  --tint: linear-gradient(165deg, rgba(92, 42, 12, .42), rgba(28, 14, 8, .74)); }
.ind-card.c8 { --in: 1.96s; --bob: 8.8s; --x1: -4px; --y1: -9px; --r1: 2.2deg; --x2: 9px; --y2: 7px; --r2: -1deg; --x3: -2px; --y3: -12px; --r3: 1.6deg;  --tint: linear-gradient(165deg, rgba(12, 62, 88, .42), rgba(8, 20, 36, .74)); }
.ind-card.c9 { --in: 2.24s; --bob: 7s; --x1: 6px; --y1: 8px; --r1: -1.2deg; --x2: -7px; --y2: -9px; --r2: 1.7deg; --x3: 3px; --y3: 5px; --r3: .8deg; --scene: radial-gradient(circle at 28% 18%, #3ee0ff 0%, #0a3a4a 42%, #041018 100%); --tint: linear-gradient(180deg, rgba(4, 20, 28, .2), rgba(4, 12, 18, .55)); }
.ind-card.c10 { --in: 2.52s; --bob: 8.3s; --x1: -6px; --y1: -11px; --r1: 1.4deg; --x2: 8px; --y2: 6px; --r2: -1.6deg; --x3: -4px; --y3: -8px; --r3: 1.1deg; --scene: radial-gradient(circle at 70% 20%, #ffd36a 0%, #e08918 38%, #3a1a08 100%); --tint: linear-gradient(180deg, rgba(40, 18, 4, .18), rgba(24, 10, 4, .55)); }
.ind-card.c11 { --in: 2.8s; --bob: 6.7s; --x1: 9px; --y1: -5px; --r1: -2deg; --x2: -5px; --y2: 10px; --r2: 1.3deg; --x3: 7px; --y3: -6px; --r3: -0.9deg; --scene: radial-gradient(circle at 50% 0%, #f0c060 0%, #1a4a48 48%, #0c1018 100%); --tint: linear-gradient(180deg, rgba(40, 28, 8, .22), rgba(8, 16, 18, .58)); }
.ind-card.c12 { --in: 3.08s; --bob: 9.1s; --x1: -3px; --y1: 13px; --r1: .6deg; --x2: 6px; --y2: -8px; --r2: -1.9deg; --x3: -9px; --y3: 4px; --r3: 1.5deg; --scene: radial-gradient(circle at 80% 80%, #4db8ff 0%, #123a78 46%, #071018 100%); --tint: linear-gradient(180deg, rgba(8, 20, 40, .2), rgba(6, 10, 20, .55)); }

.ind-card.c1 { left: 2%; top: 2%; width: 26%; z-index: 6; --tilt: -11deg }
.ind-card.c2 { left: 28%; top: -2%; width: 23%; z-index: 6; --tilt: 8deg }
.ind-card.c3 { left: 70%; top: 5%; width: 28%; z-index: 5; --tilt: -5deg }
.ind-card.c4 { left: 76%; top: 38%; width: 24%; z-index: 7; --tilt: 13deg }
.ind-card.c5 { left: -2%; top: 38%; width: 24%; z-index: 5; --tilt: 7deg }
.ind-card.c6 { left: 22%; top: 34%; width: 25%; z-index: 5; --tilt: -10deg }
.ind-card.c7 { left: 50%; top: -3%; width: 22%; z-index: 4; --tilt: 4deg }
.ind-card.c8 { left: -1%; top: 64%; width: 23%; z-index: 7; --tilt: -7deg }
.ind-card.c11 { left: 24%; top: 62%; width: 24%; z-index: 8; --tilt: 8deg }
.ind-card.c9 { left: 50%; top: 64%; width: 23%; z-index: 7; --tilt: 10deg }
.ind-card.c10 { left: 76%; top: 66%; width: 22%; z-index: 7; --tilt: -9deg }
.ind-card.c12 { left: 46%; top: 28%; width: 28%; z-index: 10; --tilt: -6deg }

.v2-industries .ind-card img {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center;
  border-radius: 0;
  display: block;
  transform: none;
  mix-blend-mode: lighten
}

.ind-card.c11 img {
  mix-blend-mode: normal;
  object-fit: contain;
  padding: 4%;
  background: radial-gradient(circle at 50% 40%, #3a2e18 0%, #121018 78%)
}

.ind-card.c11 span {
  font-size: 11.5px;
  letter-spacing: .02em;
  line-height: 1.15;
  padding-bottom: 5px
}

.ind-card span {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 3;
  padding: 16px 6px 6px;
  background: linear-gradient(180deg, transparent, rgba(8, 10, 16, .82) 58%);
  color: #fff;
  font-size: 13px;
  letter-spacing: .04em;
  line-height: 1.2
}

@keyframes indDrop {
  from {
    opacity: 0;
    translate: 0 -140px;
    filter: blur(6px)
  }
  to {
    opacity: 1;
    translate: 0 0;
    filter: blur(0)
  }
}

@keyframes indDrift {
  0%,
  100% { transform: translate(var(--x1), var(--y1)) rotate(calc(var(--tilt) + var(--r1))) }
  33% { transform: translate(var(--x2), var(--y2)) rotate(calc(var(--tilt) + var(--r2))) }
  66% { transform: translate(var(--x3), var(--y3)) rotate(calc(var(--tilt) + var(--r3))) }
}

@keyframes indOrbit {
  0% { transform: translate(9px, -8px) rotate(calc(var(--tilt) - 2.2deg)) }
  25% { transform: translate(-11px, -10px) rotate(calc(var(--tilt) + 1.8deg)) }
  50% { transform: translate(-8px, 9px) rotate(calc(var(--tilt) + 2.4deg)) }
  75% { transform: translate(12px, 6px) rotate(calc(var(--tilt) - 1.2deg)) }
  100% { transform: translate(9px, -8px) rotate(calc(var(--tilt) - 2.2deg)) }
}

@keyframes indSway {
  0%,
  100% { transform: translateY(-12px) rotate(calc(var(--tilt) - 1.6deg)) }
  50% { transform: translateY(12px) rotate(calc(var(--tilt) + 1.8deg)) }
}

.ind-card.ind-alt {
  animation:
    indDrop .9s cubic-bezier(.16, 1, .3, 1) var(--in) both,
    indOrbit var(--bob) ease-in-out calc(var(--in) + .9s) infinite
}

.ind-card.ind-sway {
  animation:
    indDrop .9s cubic-bezier(.16, 1, .3, 1) var(--in) both,
    indSway calc(var(--bob) * .85) ease-in-out calc(var(--in) + .9s) infinite
}

@media (prefers-reduced-motion: reduce) {
  .ind-card {
    opacity: 1;
    animation: none
  }
}

.v2-hero-visual {
  position: relative;
  border-radius: 28px;
  overflow: hidden;
  min-height: clamp(480px, 62vh, 720px);
  box-shadow: 0 28px 60px rgba(31, 30, 29, .14)
}

.v2-hero-visual img {
  width: 100%;
  max-width: none;
  height: clamp(420px, 54vh, 640px);
  object-fit: cover;
  object-position: 50% 50%;
  transform-origin: 50% 50%;
  border-radius: 28px;
  display: block
}

.v2-mind img {
  animation: mindKen 22s ease-in-out infinite alternate
}

.mind-aura,
.mind-rings,
.mind-net,
.mind-drift {
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: 28px
}

.mind-aura {
  left: 50%;
  top: 50%;
  inset: auto;
  width: 46%;
  aspect-ratio: 1;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(183, 49, 53, .32) 0%, rgba(183, 49, 53, .08) 42%, transparent 70%);
  animation: mindAura 3.4s ease-in-out infinite
}

.mind-ring {
  position: absolute;
  left: 50%;
  top: 50%;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  border: 1px dashed rgba(183, 49, 53, .42)
}

.mind-ring.r1 {
  width: 36%;
  aspect-ratio: 1;
  animation: mindSpin 26s linear infinite
}

.mind-ring.r2 {
  width: 52%;
  aspect-ratio: 1;
  border-style: solid;
  border-color: rgba(183, 49, 53, .22);
  animation: mindSpin 38s linear infinite reverse
}

.mind-ring.r3 {
  width: 70%;
  aspect-ratio: 1;
  border-color: rgba(183, 49, 53, .28);
  animation: mindSpin 52s linear infinite
}

.mind-orbit {
  position: absolute;
  left: 50%;
  top: 50%;
  aspect-ratio: 1;
  transform: translate(-50%, -50%);
  animation: mindSpin 14s linear infinite
}

.mind-orbit.o1 { width: 36%; animation-duration: 11s }
.mind-orbit.o2 { width: 52%; animation-duration: 17s; animation-direction: reverse }
.mind-orbit.o3 { width: 70%; animation-duration: 23s }

.mind-orbit i {
  position: absolute;
  top: 0;
  left: 50%;
  width: 9px;
  height: 9px;
  margin: -4.5px 0 0 -4.5px;
  border-radius: 50%;
  background: #b73135;
  box-shadow: 0 0 10px rgba(183, 49, 53, .95), 0 0 22px rgba(183, 49, 53, .45);
  animation: mindPulse 2.2s ease-in-out infinite
}

.mind-orbit.o2 i { width: 7px; height: 7px; margin: -3.5px 0 0 -3.5px; animation-delay: .4s }
.mind-orbit.o3 i { width: 8px; height: 8px; margin: -4px 0 0 -4px; animation-delay: .9s }

.mind-net {
  width: 100%;
  height: 100%;
  overflow: hidden
}

.mind-lines path {
  stroke-width: 1.1;
  opacity: .38;
  stroke-dasharray: 7 18;
  animation: mindFlow 3.6s linear infinite
}

.mind-lines path:nth-child(2) { animation-duration: 4.2s; animation-delay: .25s }
.mind-lines path:nth-child(3) { animation-duration: 2.9s; animation-delay: .7s }
.mind-lines path:nth-child(4) { animation-duration: 3.8s; animation-delay: .15s }
.mind-lines path:nth-child(5) { animation-duration: 3.2s; animation-delay: .85s }
.mind-lines path:nth-child(6) { animation-duration: 4.5s; animation-delay: .4s }
.mind-lines path:nth-child(7) { animation-duration: 2.7s; animation-delay: 1.05s }
.mind-lines path:nth-child(8) { animation-duration: 3.7s; animation-delay: .2s }
.mind-lines path:nth-child(9) { animation-duration: 4.1s; animation-delay: .55s }
.mind-lines path:nth-child(10) { animation-duration: 3.3s; animation-delay: .9s }

.mind-nodes circle {
  transform-box: fill-box;
  transform-origin: center;
  animation: mindPulse 2.3s ease-in-out infinite;
  filter: drop-shadow(0 0 6px rgba(183, 49, 53, .7))
}

.mind-nodes circle:nth-child(odd) { animation-duration: 2.8s }
.mind-nodes circle:nth-child(3n) { animation-delay: .45s }
.mind-nodes circle:nth-child(4n) { animation-delay: .9s }

.spark {
  offset-rotate: 0deg;
  animation: mindSpark 3.4s linear infinite
}

.spark.s1 { offset-path: path("M400 400 L120 90"); animation-duration: 2.9s }
.spark.s2 { offset-path: path("M400 400 L770 250"); animation-duration: 3.7s; animation-delay: .7s }
.spark.s3 { offset-path: path("M400 400 L560 770"); animation-duration: 3.2s; animation-delay: 1.2s }
.spark.s4 { offset-path: path("M400 400 L90 620"); animation-duration: 3.8s; animation-delay: 1.8s }

.mind-drift i {
  position: absolute;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #b73135;
  box-shadow: 0 0 8px rgba(183, 49, 53, .8);
  opacity: 0;
  animation: mindDrift 7.2s ease-in infinite
}

.mind-drift i:nth-child(1)  { left: 8%;  top: 16%; --dx: 160px; --dy: 140px; animation-delay: 0s }
.mind-drift i:nth-child(2)  { left: 88%; top: 22%; --dx: -170px; --dy: 120px; animation-delay: .6s }
.mind-drift i:nth-child(3)  { left: 12%; top: 78%; --dx: 150px; --dy: -150px; animation-delay: 1.2s }
.mind-drift i:nth-child(4)  { left: 84%; top: 74%; --dx: -155px; --dy: -130px; animation-delay: 1.8s }
.mind-drift i:nth-child(5)  { left: 50%; top: 6%;  --dx: 0; --dy: 170px; animation-delay: .3s }
.mind-drift i:nth-child(6)  { left: 6%;  top: 48%; --dx: 175px; --dy: 8px; animation-delay: 2.1s }
.mind-drift i:nth-child(7)  { left: 92%; top: 50%; --dx: -180px; --dy: -6px; animation-delay: .9s }
.mind-drift i:nth-child(8)  { left: 28%; top: 90%; --dx: 70px; --dy: -175px; animation-delay: 1.5s }
.mind-drift i:nth-child(9)  { left: 70%; top: 10%; --dx: -80px; --dy: 155px; animation-delay: 2.4s }
.mind-drift i:nth-child(10) { left: 18%; top: 36%; --dx: 130px; --dy: 50px; animation-delay: 3s }
.mind-drift i:nth-child(11) { left: 78%; top: 86%; --dx: -110px; --dy: -160px; animation-delay: 2.7s }
.mind-drift i:nth-child(12) { left: 42%; top: 88%; --dx: 20px; --dy: -165px; animation-delay: .45s }

@keyframes mindKen {
  from { transform: scale(1.04) }
  to { transform: scale(1.12) }
}

@keyframes mindAura {
  0%, 100% { opacity: .55; transform: translate(-50%, -50%) scale(.92) }
  50% { opacity: 1; transform: translate(-50%, -50%) scale(1.08) }
}

@keyframes mindSpin {
  to { transform: translate(-50%, -50%) rotate(360deg) }
}

@keyframes mindFlow {
  to { stroke-dashoffset: -90 }
}

@keyframes mindPulse {
  0%, 100% { opacity: .5; transform: scale(.85) }
  50% { opacity: 1; transform: scale(1.25) }
}

@keyframes mindSpark {
  0% { offset-distance: 0%; opacity: 0 }
  12% { opacity: 1 }
  82% { opacity: .75 }
  100% { offset-distance: 100%; opacity: 0 }
}

@keyframes mindDrift {
  0% { transform: translate(0, 0) scale(.4); opacity: 0 }
  18% { opacity: .85 }
  100% { transform: translate(var(--dx), var(--dy)) scale(.2); opacity: 0 }
}

@media (prefers-reduced-motion: reduce) {
  .v2-mind img,
  .mind-aura,
  .mind-ring,
  .mind-orbit,
  .mind-orbit i,
  .mind-lines path,
  .mind-nodes circle,
  .spark,
  .mind-drift i { animation: none }
}

.v2-hero-visual .planet {
  position: absolute;
  width: 118px;
  right: 18px;
  bottom: 18px;
  z-index: 2
}

.v2-hero-visual.v2-core {
  background:
    radial-gradient(56% 60% at 50% 42%, rgba(196, 59, 63, .12), transparent 70%),
    var(--paper);
  background-image:
    radial-gradient(56% 60% at 50% 42%, rgba(196, 59, 63, .12), transparent 70%),
    linear-gradient(rgba(196, 59, 63, .07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(196, 59, 63, .07) 1px, transparent 1px);
  background-size: auto, 44px 44px, 44px 44px;
  overflow: hidden;
  opacity: 0;
  transform: scale(.94);
  filter: blur(8px)
}

.v2-hero-visual.v2-unify {
  display: flex;
  align-items: center;
  background:
    radial-gradient(56% 60% at 50% 42%, rgba(196, 59, 63, .12), transparent 70%),
    var(--paper);
  background-image:
    radial-gradient(56% 60% at 50% 42%, rgba(196, 59, 63, .12), transparent 70%),
    linear-gradient(rgba(196, 59, 63, .07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(196, 59, 63, .07) 1px, transparent 1px);
  background-size: auto, 44px 44px, 44px 44px;
  overflow: hidden;
  opacity: 0;
  transform: translateY(16px)
}

.hero.is-ready .v2-hero-visual.v2-unify {
  animation: coreVisualIn .9s cubic-bezier(.16, 1, .3, 1) .2s forwards
}

.v2-hero-visual.v2-flow {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  min-height: 0;
  padding: 16px 14px;
  overflow: hidden;
  opacity: 0;
  transform: translateY(16px);
  box-shadow: 0 20px 48px rgba(31, 30, 29, .1)
}

.hero.is-ready .v2-hero-visual.v2-flow {
  animation: coreVisualIn .9s cubic-bezier(.16, 1, .3, 1) .2s forwards
}

.flow-board {
  position: relative;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 0
}

.flow-stream {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 3;
  overflow: hidden
}

.flow-rail {
  position: absolute;
  left: 50%;
  top: 16%;
  bottom: 8%;
  width: 2px;
  margin-left: -1px;
  background: linear-gradient(180deg, rgba(183, 49, 53, .08), rgba(183, 49, 53, .45), rgba(183, 49, 53, .08));
  border-radius: 2px
}

.flow-pkt {
  position: absolute;
  top: 0;
  left: 50%;
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 9px solid var(--red);
  margin-left: -5px;
  filter: drop-shadow(0 0 6px rgba(183, 49, 53, .85));
  animation: flowGo 3.4s linear infinite;
  opacity: 0
}

.flow-pkt.s1 { animation-name: flowGo1 }
.flow-pkt.s2 { animation-name: flowGo2 }
.flow-pkt.s3 { animation-name: flowGo3 }
.flow-pkt.s4 { animation-name: flowGo4 }
.flow-pkt.s5 { animation-name: flowGo5 }
.flow-pkt.late { animation-delay: 1.7s }

@keyframes flowGo1 {
  0%   { top: 12%; left: 10%; opacity: 0 }
  6%   { opacity: 1 }
  30%  { top: 34%; left: 50% }
  88%  { top: 90%; left: 50%; opacity: 1 }
  100% { top: 94%; left: 50%; opacity: 0 }
}
@keyframes flowGo2 {
  0%   { top: 12%; left: 30%; opacity: 0 }
  6%   { opacity: 1 }
  30%  { top: 34%; left: 50% }
  88%  { top: 90%; left: 50%; opacity: 1 }
  100% { top: 94%; left: 50%; opacity: 0 }
}
@keyframes flowGo3 {
  0%   { top: 12%; left: 50%; opacity: 0 }
  6%   { opacity: 1 }
  30%  { top: 34%; left: 50% }
  88%  { top: 90%; left: 50%; opacity: 1 }
  100% { top: 94%; left: 50%; opacity: 0 }
}
@keyframes flowGo4 {
  0%   { top: 12%; left: 70%; opacity: 0 }
  6%   { opacity: 1 }
  30%  { top: 34%; left: 50% }
  88%  { top: 90%; left: 50%; opacity: 1 }
  100% { top: 94%; left: 50%; opacity: 0 }
}
@keyframes flowGo5 {
  0%   { top: 12%; left: 90%; opacity: 0 }
  6%   { opacity: 1 }
  30%  { top: 34%; left: 50% }
  88%  { top: 90%; left: 50%; opacity: 1 }
  100% { top: 94%; left: 50%; opacity: 0 }
}

.flow-panel {
  background: #f7f6f3;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 14px 12px 16px;
  text-align: center
}

.flow-panel.is-core {
  background: #fff;
  border: 1.5px solid rgba(183, 49, 53, .35);
  box-shadow: 0 10px 28px rgba(183, 49, 53, .08);
  padding: 16px 12px 14px
}

.flow-panel.is-out {
  background: #f8f1f1
}

.flow-panel h3 {
  margin: 0 0 12px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: -.01em;
  color: var(--ink)
}

.flow-panel.is-out h3 { color: var(--red-dk) }

.flow-items {
  display: grid;
  gap: 8px 6px
}

.flow-items.n5 { grid-template-columns: repeat(5, minmax(0, 1fr)) }
.flow-items.n4 { grid-template-columns: repeat(4, minmax(0, 1fr)) }
.flow-items.n3 { grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 4px 0 14px }

.flow-items span {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 650;
  line-height: 1.25;
  color: var(--ink);
  letter-spacing: -.01em
}

.flow-items i {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 15px;
  background: #fff;
  color: var(--red);
  border: 1px solid rgba(183, 49, 53, .18);
  box-shadow: 0 6px 14px rgba(31, 30, 29, .06)
}

.flow-panel.is-core .flow-items i {
  width: 42px;
  height: 42px;
  font-size: 17px;
  color: var(--red-dk);
  border-color: rgba(183, 49, 53, .28)
}

.flow-panel.is-out .flow-items i {
  background: #fff;
  color: #7a2a2d
}

.flow-mark {
  display: inline-flex;
  align-items: center;
  background: var(--red);
  color: #fff;
  border-radius: 999px;
  padding: 7px 16px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: -.01em;
  margin: 0 auto 8px
}

.flow-mark .tm { color: #fff }

.flow-sub {
  margin: 0 0 12px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--mut)
}

.flow-seal {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #f4f1ee;
  border-radius: 999px;
  padding: 7px 14px;
  font-size: 11.5px;
  font-weight: 650;
  color: var(--ink);
  letter-spacing: -.01em
}

.flow-seal i { color: var(--red) }

.flow-join {
  position: relative;
  height: 42px;
  margin: 2px 0
}

.flow-join.slim { height: 34px }

.flow-fan {
  position: absolute;
  inset: 0 8% 4px;
  width: 84%;
  height: 32px;
  margin: 0 auto;
  overflow: visible
}

.flow-fan path {
  fill: none;
  stroke: var(--red);
  stroke-width: 1.35;
  opacity: .38;
  stroke-dasharray: 5 7;
  animation: flowDash 1.2s linear infinite
}

@keyframes flowDash {
  to { stroke-dashoffset: -24 }
}

.story {
  width: 100%;
  padding: clamp(20px, 2.8vw, 32px) clamp(16px, 2.2vw, 28px) 22px
}

.story-lead {
  margin: 0 0 18px;
  font-size: clamp(16px, 1.55vw, 20px);
  font-weight: 650;
  letter-spacing: -.03em;
  line-height: 1.28;
  color: var(--ink);
  max-width: 28ch
}

.story-kicker {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--red);
  font-weight: 500;
  margin: 0 0 10px
}

.story-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px
}

.story-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 12px 13px 13px;
  box-shadow: 0 8px 18px rgba(31, 30, 29, .05)
}

.story-card em {
  display: block;
  font-style: normal;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: -.02em;
  color: var(--ink);
  margin: 0 0 4px
}

.story-card span {
  display: block;
  font-size: 12px;
  line-height: 1.35;
  color: var(--mut)
}

.story-card.is-out {
  border-color: rgba(183, 49, 53, .22);
  background: linear-gradient(180deg, #fff, #fbf6f6)
}

.story-card.is-out em { color: var(--red-dk) }

.story-join {
  display: flex;
  justify-content: center;
  height: 22px;
  margin: 4px 0
}

.story-join i {
  width: 1px;
  height: 100%;
  background: var(--red);
  opacity: .45;
  position: relative
}

.story-join i:after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -2px;
  width: 7px;
  height: 7px;
  border-right: 1.5px solid var(--red);
  border-bottom: 1.5px solid var(--red);
  transform: translateX(-50%) rotate(45deg);
  opacity: .8
}

.story-hub {
  position: relative;
  width: fit-content;
  max-width: 92%;
  margin: 2px auto 6px;
  background: #fff;
  border: 2px solid var(--red);
  border-radius: 999px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 14px 28px;
  box-shadow: 0 12px 28px rgba(183, 49, 53, .14)
}

.story-ring {
  display: none
}

.story-hub b {
  font-size: 15px;
  font-weight: 700;
  letter-spacing: -.02em;
  color: var(--ink);
  line-height: 1.15
}

.story-hub small {
  display: block;
  margin-top: 6px;
  font-size: 11.5px;
  line-height: 1.35;
  color: var(--mut);
  font-weight: 500
}

.hero.is-ready .v2-hero-visual.v2-core,
.v2-core.core-animate {
  animation: coreVisualIn 1s cubic-bezier(.16, 1, .3, 1) .75s forwards
}

.core-plexus,
.core-web,
.core-nodes {
  position: absolute;
  inset: 0;
  pointer-events: none
}

.core-plexus {
  background-image:
    radial-gradient(circle at 18% 22%, rgba(183, 49, 53, .22) 0 1.2px, transparent 1.8px),
    radial-gradient(circle at 72% 18%, rgba(183, 49, 53, .16) 0 1.2px, transparent 1.8px),
    radial-gradient(circle at 84% 70%, rgba(183, 49, 53, .18) 0 1.2px, transparent 1.8px),
    radial-gradient(circle at 22% 78%, rgba(183, 49, 53, .14) 0 1.2px, transparent 1.8px);
  background-size: 160px 160px, 200px 200px, 140px 140px, 180px 180px;
  animation: corePlexus 18s linear infinite;
  opacity: .55
}

.core-web {
  width: 100%;
  height: 100%
}

.core-lines path {
  stroke: var(--red);
  stroke-width: 1.45;
  opacity: .55;
  filter: drop-shadow(0 0 3px rgba(183, 49, 53, .4));
  stroke-dasharray: 4 10;
  animation: coreFlow 2.4s linear infinite
}

.core-lines path:nth-child(odd) { animation-duration: 2.9s }
.core-lines path:nth-child(3n) { animation-delay: .35s }

.core-pkt {
  fill: var(--red);
  offset-rotate: 0deg;
  filter: drop-shadow(0 0 6px rgba(183, 49, 53, .85));
  animation: corePkt 2.8s linear infinite
}

.core-pkt:nth-child(1)  { offset-path: path("M400 400 L400 112"); animation-duration: 2.5s }
.core-pkt:nth-child(2)  { offset-path: path("M400 400 L525 140"); animation-duration: 2.9s; animation-delay: .15s }
.core-pkt:nth-child(3)  { offset-path: path("M400 400 L625 221"); animation-duration: 3.2s; animation-delay: .3s }
.core-pkt:nth-child(4)  { offset-path: path("M400 400 L681 336"); animation-duration: 2.7s; animation-delay: .45s }
.core-pkt:nth-child(5)  { offset-path: path("M400 400 L681 464"); animation-duration: 3.1s; animation-delay: .6s }
.core-pkt:nth-child(6)  { offset-path: path("M400 400 L625 579"); animation-duration: 2.6s; animation-delay: .2s }
.core-pkt:nth-child(7)  { offset-path: path("M400 400 L525 660"); animation-duration: 3.3s; animation-delay: .75s }
.core-pkt:nth-child(8)  { offset-path: path("M400 400 L400 688"); animation-duration: 2.8s; animation-delay: .4s }
.core-pkt:nth-child(9)  { offset-path: path("M400 400 L275 660"); animation-duration: 3s;  animation-delay: .1s }
.core-pkt:nth-child(10) { offset-path: path("M400 400 L175 579"); animation-duration: 2.55s; animation-delay: .55s }
.core-pkt:nth-child(11) { offset-path: path("M400 400 L119 464"); animation-duration: 3.15s; animation-delay: .25s }
.core-pkt:nth-child(12) { offset-path: path("M400 400 L119 336"); animation-duration: 2.7s; animation-delay: .7s }
.core-pkt:nth-child(13) { offset-path: path("M400 400 L175 221"); animation-duration: 2.95s; animation-delay: .35s }
.core-pkt:nth-child(14) { offset-path: path("M400 400 L275 140"); animation-duration: 2.65s; animation-delay: .5s }

.core-hub {
  position: absolute;
  left: 50%;
  top: 50%;
  width: min(34%, 210px);
  aspect-ratio: 1;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background:
    radial-gradient(circle at 50% 46%, #fff 0%, #f7f1ee 46%, rgba(250, 248, 245, .35) 72%, transparent 74%);
  box-shadow: 0 0 40px 8px rgba(183, 49, 53, .18), inset 0 0 28px rgba(183, 49, 53, .08);
  animation: corePulse 4.2s ease-in-out infinite;
  z-index: 2
}

.core-ring {
  position: absolute;
  inset: -6%;
  border-radius: 50%;
  border: 1px solid rgba(183, 49, 53, .28);
  animation: coreRing 5.5s ease-in-out infinite
}

.core-ring.r2 {
  inset: -14%;
  border-color: rgba(183, 49, 53, .14);
  animation-duration: 7s;
  animation-delay: .6s
}

.core-hub-copy {
  position: absolute;
  inset: 0;
  display: grid;
  place-content: center;
  text-align: center;
  color: var(--ink);
  padding: 12%
}

.core-hub-copy strong {
  font-size: clamp(15px, 1.9vw, 24px);
  font-weight: 700;
  letter-spacing: -.03em;
  line-height: 1.1
}

.core-hub-copy span {
  display: block;
  margin-top: 6px;
  font-size: clamp(10px, 1.05vw, 12px);
  font-weight: 400;
  letter-spacing: .04em;
  color: var(--mut)
}

@keyframes coreVisualIn {
  to {
    opacity: 1;
    transform: none;
    filter: none
  }
}

.core-node {
  position: absolute;
  inset: 14%;
  transform: rotate(var(--a))
}

.core-node-slot {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%)
}

.core-node-enter {
  opacity: 0;
  will-change: transform, opacity
}

.core-node span {
  display: block;
  transform: rotate(calc(var(--a) * -1));
  padding: 7px 12px;
  background: #fff;
  border: 1px solid rgba(183, 49, 53, .22);
  border-radius: 999px;
  color: var(--ink);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .01em;
  white-space: nowrap;
  box-shadow: 0 10px 22px rgba(31, 30, 29, .08)
}

.hero.is-ready .core-node-enter,
.v2-core.core-animate .core-node-enter {
  animation: coreEnter 1s cubic-bezier(.16, 1, .3, 1) 1.45s forwards
}

.hero.is-ready .core-node[data-enter="down"] .core-node-enter,
.v2-core.core-animate .core-node[data-enter="down"] .core-node-enter { animation-name: coreEnterDown }
.hero.is-ready .core-node[data-enter="down-left"] .core-node-enter,
.v2-core.core-animate .core-node[data-enter="down-left"] .core-node-enter { animation-name: coreEnterDownLeft }
.hero.is-ready .core-node[data-enter="left"] .core-node-enter,
.v2-core.core-animate .core-node[data-enter="left"] .core-node-enter { animation-name: coreEnterLeft }
.hero.is-ready .core-node[data-enter="up-left"] .core-node-enter,
.v2-core.core-animate .core-node[data-enter="up-left"] .core-node-enter { animation-name: coreEnterUpLeft }
.hero.is-ready .core-node[data-enter="up"] .core-node-enter,
.v2-core.core-animate .core-node[data-enter="up"] .core-node-enter { animation-name: coreEnterUp }
.hero.is-ready .core-node[data-enter="up-right"] .core-node-enter,
.v2-core.core-animate .core-node[data-enter="up-right"] .core-node-enter { animation-name: coreEnterUpRight }
.hero.is-ready .core-node[data-enter="right"] .core-node-enter,
.v2-core.core-animate .core-node[data-enter="right"] .core-node-enter { animation-name: coreEnterRight }
.hero.is-ready .core-node[data-enter="down-right"] .core-node-enter,
.v2-core.core-animate .core-node[data-enter="down-right"] .core-node-enter { animation-name: coreEnterDownRight }

.hero.is-ready .core-node span,
.v2-core.core-animate .core-node span {
  animation: coreBob 4.8s ease-in-out infinite 2.75s
}

.hero.is-ready .core-hub,
.v2-core.core-animate .core-hub {
  animation: coreHubIn .9s cubic-bezier(.16, 1, .3, 1) 1.15s both, corePulse 4.2s ease-in-out infinite 2.2s
}

.hero.is-ready .core-web,
.hero.is-ready .core-plexus,
.v2-core.core-animate .core-web,
.v2-core.core-animate .core-plexus {
  animation: coreVisualIn 1s cubic-bezier(.16, 1, .3, 1) .95s both
}

@keyframes coreEnterDown {
  from { opacity: 0; transform: translateY(-90px) scale(.55) }
  to { opacity: 1; transform: none }
}

@keyframes coreEnterDownLeft {
  from { opacity: 0; transform: translate(80px, -80px) scale(.55) }
  to { opacity: 1; transform: none }
}

@keyframes coreEnterLeft {
  from { opacity: 0; transform: translateX(100px) scale(.55) }
  to { opacity: 1; transform: none }
}

@keyframes coreEnterUpLeft {
  from { opacity: 0; transform: translate(80px, 80px) scale(.55) }
  to { opacity: 1; transform: none }
}

@keyframes coreEnterUp {
  from { opacity: 0; transform: translateY(90px) scale(.55) }
  to { opacity: 1; transform: none }
}

@keyframes coreEnterUpRight {
  from { opacity: 0; transform: translate(-80px, 80px) scale(.55) }
  to { opacity: 1; transform: none }
}

@keyframes coreEnterRight {
  from { opacity: 0; transform: translateX(-100px) scale(.55) }
  to { opacity: 1; transform: none }
}

@keyframes coreEnterDownRight {
  from { opacity: 0; transform: translate(-80px, -80px) scale(.55) }
  to { opacity: 1; transform: none }
}

@keyframes coreHubIn {
  from { opacity: 0; transform: translate(-50%, -50%) scale(.7) }
  to { opacity: 1; transform: translate(-50%, -50%) scale(1) }
}

.v2-core.core-animate .core-node:nth-child(odd) span { animation-delay: 2.85s }
.v2-core.core-animate .core-node:nth-child(3n) span { animation-delay: 3.1s }

.hero.is-ready .core-node:nth-child(odd) span { animation-delay: 2.85s }
.hero.is-ready .core-node:nth-child(3n) span { animation-delay: 3.1s }

@keyframes corePlexus {
  to { background-position: 180px 90px, -110px 60px, 80px -70px, -90px 100px, 0 0, 0 0 }
}

@keyframes coreFlow {
  to { stroke-dashoffset: -76 }
}

@keyframes corePkt {
  0% { offset-distance: 14%; opacity: 0 }
  8% { opacity: 1 }
  82% { opacity: 1 }
  100% { offset-distance: 92%; opacity: 0 }
}

@keyframes corePulse {
  0%, 100% { box-shadow: 0 0 32px 6px rgba(183, 49, 53, .14), inset 0 0 24px rgba(183, 49, 53, .06) }
  50% { box-shadow: 0 0 52px 12px rgba(183, 49, 53, .28), inset 0 0 32px rgba(183, 49, 53, .12) }
}

@keyframes coreRing {
  0%, 100% { transform: scale(.96); opacity: .45 }
  50% { transform: scale(1.06); opacity: 1 }
}

@keyframes coreBob {
  0%, 100% { transform: rotate(calc(var(--a) * -1)) translateY(0) }
  50% { transform: rotate(calc(var(--a) * -1)) translateY(-5px) }
}

@media (prefers-reduced-motion: reduce) {
  .v2-hero-visual.v2-core,
  .v2-hero-visual.v2-unify,
  .v2-hero-visual.v2-flow,
  .core-node-enter {
    opacity: 1;
    transform: none;
    filter: none
  }

  .hero.is-ready .v2-hero-visual.v2-core,
  .hero.is-ready .v2-hero-visual.v2-unify,
  .hero.is-ready .v2-hero-visual.v2-flow,
  .v2-core.core-animate,
  .hero.is-ready .core-node-enter,
  .v2-core.core-animate .core-node-enter,
  .hero.is-ready .core-hub,
  .v2-core.core-animate .core-hub,
  .hero.is-ready .core-web,
  .hero.is-ready .core-plexus,
  .v2-core.core-animate .core-web,
  .v2-core.core-animate .core-plexus,
  .flow-chevron,
  .flow-pkt,
  .flow-fan path {
    animation: none
  }

  .core-plexus,
  .core-lines path,
  .core-pkt,
  .core-hub,
  .core-ring,
  .core-node span { animation: none }
}

@media (max-width: 980px) {
  .core-hub { width: min(42%, 220px) }
  .core-node span { font-size: 11px; padding: 6px 10px }
}

.v2-trust {
  justify-content: center;
  margin-top: 36px
}

@media (max-width: 980px) {
  .trust,
  .v2-trust {
    display: grid;
    grid-template-columns: 1fr 1fr;
    justify-content: stretch;
    align-items: start;
    gap: 14px 18px;
    flex-wrap: wrap
  }

  .trust span,
  .v2-trust span {
    white-space: normal;
    line-height: 1.45
  }
}

@media (max-width: 560px) {
  .trust,
  .v2-trust {
    grid-template-columns: 1fr
  }
}

.v2-banner {
  background: #0c0d0e;
  color: #fff;
  padding: clamp(56px, 8vw, 100px) 0
}

.v2-banner-copy {
  max-width: 55em;
  margin: 0 0 clamp(36px, 5vw, 56px);
  font-size: clamp(18px, 2.1vw, 22px);
  line-height: 1.55;
  color: #fff;
  font-weight: 400
}

.v2-banner-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: clamp(20px, 4vw, 48px)
}

.v2-banner-stats .bnum {
  /* font-family: 'Fraunces', serif; */
  font-weight: 700;
  font-size: clamp(36px, 4.4vw, 56px);
  color: #b73135;
  letter-spacing: -.04em;
  line-height: 1
}

.v2-banner-stats .blab {
  margin-top: 12px;
  color: #fff;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: .01em
}

.v2-mission {
  padding: clamp(56px, 8vw, 96px) 0;
  background:
    radial-gradient(ellipse 70% 80% at 8% 20%, rgba(183, 49, 53, .08), transparent 55%),
    radial-gradient(ellipse 50% 60% at 92% 80%, rgba(12, 40, 72, .06), transparent 50%),
    #f7f6f4
}

.v2-mission-inner {
  max-width: 76rem
}

.v2-mission .lab {
  margin-bottom: 14px
}

.v2-mission h2 {
  margin: 0 0 18px;
  font-size: clamp(28px, 3.6vw, 44px);
  letter-spacing: -.02em;
  line-height: 1.15;
  color: #121417
}

.v2-mission p {
  margin: 0;
  font-size: clamp(17px, 1.7vw, 20px);
  line-height: 1.65;
  color: #3a4048;
  max-width: 72em
}

.mission-sec {
  padding: clamp(56px, 8vw, 96px) 0;
  background: var(--paper);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line)
}

.mission-row {
  display: grid;
  grid-template-columns: minmax(200px, .7fr) minmax(0, 1.3fr);
  gap: clamp(28px, 5vw, 64px);
  align-items: start
}

.mission-title {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 18px
}

.mission-ico {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #fff;
  background: radial-gradient(circle at 32% 28%, #e55b5b, #b73135 62%, #8e2225);
  box-shadow: 0 8px 20px rgba(183, 49, 53, .26)
}

.mission-ico i { font-size: 20px }

.mission-title h2 {
  margin: 0;
  font-size: clamp(32px, 4vw, 48px);
  letter-spacing: -.03em;
  line-height: 1.08;
  color: var(--ink);
  white-space: nowrap
}

.mission-copy {
  margin: 0;
  padding-top: 6px;
  font-size: clamp(17px, 1.7vw, 18px);
  line-height: 1.7;
  color: #3a4048;
  max-width: 44em;
  border-left: 1px solid var(--line);
  padding-left: clamp(20px, 3vw, 36px)
}

@media (max-width: 900px) {
  .mission-row {
    grid-template-columns: 1fr;
    gap: 22px
  }

  .mission-copy {
    border-left: 0;
    padding-left: 0;
    border-top: 1px solid var(--line);
    padding-top: 22px
  }
}

.v2-why-head {
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 40px;
  align-items: end;
  margin-bottom: 36px
}

.why-rows {
  display: grid;
  gap: clamp(22px, 3vw, 36px)
}

.why-row {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr);
  gap: clamp(18px, 3vw, 32px);
  align-items: stretch
}

.why-row:nth-child(even) .why-media {
  order: 2
}

.why-media {
  margin: 0;
  overflow: hidden;
  border-radius: 18px;
  min-height: 0;
  aspect-ratio: 16 / 10;
  background: #f4efe8
}

.why-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block
}

.why-copy {
  background: #fff;
  border: 1px solid rgba(31, 30, 29, .06);
  border-radius: 18px;
  padding: clamp(22px, 3vw, 32px);
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 10px 16px;
  align-content: center;
  box-shadow: 0 14px 36px rgba(31, 30, 29, .08), 0 2px 10px rgba(31, 30, 29, .04);
  transition: transform .32s var(--ease), box-shadow .32s var(--ease)
}

.why-copy:hover {
  transform: translateY(-4px);
  box-shadow: 0 22px 48px rgba(31, 30, 29, .12)
}

.why-copy b {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 13px;
  color: var(--red);
  padding-top: 6px
}

.why-copy h3 {
  font-size: clamp(22px, 2.2vw, 28px);
  margin: 0 0 10px;
  letter-spacing: -.02em
}

.why-copy p {
  margin: 0;
  color: var(--mut);
  font-size: 15.5px;
  line-height: 1.65
}

.v2-why-split {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(320px, 1.2fr);
  gap: clamp(28px, 4vw, 48px);
  align-items: start
}

.v2-why-split .v2-feature {
  margin: 0;
  position: sticky;
  top: 96px;
  overflow: visible
}

.v2-why-split .v2-feature img {
  width: 100%;
  height: auto;
  min-height: 0;
  object-fit: contain;
  border-radius: 24px;
  display: block
}

.v2-feature {
  margin: 0 0 36px;
  overflow: hidden;
  border-radius: 24px
}

.v2-feature img {
  width: 100%;
  height: auto;
  display: block
}

.why-rail {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 0
}

.why-rail li {
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: 16px;
  padding: 22px 0;
  border-top: 1px solid var(--line)
}

.why-rail b {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 13px;
  color: var(--red);
  padding-top: 4px
}

.why-rail h3 {
  font-size: 22px;
  margin: 0 0 6px
}

.why-rail p {
  margin: 0;
  color: var(--mut);
  font-size: 15px
}

.faq-split {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: clamp(28px, 5vw, 72px);
  align-items: start
}

.faq-split .head { max-width: none }
.faq-split .faq-list { margin-top: 0; max-width: none }

/* ---------- FAQ panel (index + faq page) ---------- */
.faq-panel {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 8% 18%, rgba(183, 49, 53, .08), transparent 34%),
    radial-gradient(circle at 92% 82%, rgba(183, 49, 53, .06), transparent 28%),
    linear-gradient(180deg, #fff 0%, var(--paper) 100%)
}

.faq-panel:before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(31, 30, 29, .04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(31, 30, 29, .04) 1px, transparent 1px);
  background-size: 28px 28px;
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, .45), transparent 88%);
  pointer-events: none
}

.faq-panel .wrap { position: relative; z-index: 1 }

.faq-intro {
  position: sticky;
  top: 92px
}

.faq-intro h2 {
  margin-top: 14px;
  font-size: clamp(28px, 3.6vw, 44px)
}

.faq-intro .sub {
  margin-top: 16px;
  max-width: 34ch
}

.faq-help {
  margin-top: 28px;
  padding: 22px 20px;
  border-radius: 18px;
  background: rgba(255, 255, 255, .88);
  border: 1px solid rgba(183, 49, 53, .14);
  box-shadow: 0 16px 40px rgba(31, 30, 29, .08)
}

.faq-help-top {
  display: flex;
  gap: 14px;
  align-items: flex-start
}

.faq-help-icon {
  flex: none;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  color: var(--red);
  background: rgba(183, 49, 53, .1);
  border: 1px solid rgba(183, 49, 53, .16)
}

.faq-help-icon i { font-size: 17px }

.faq-help strong {
  display: block;
  font-size: 16px;
  letter-spacing: -.02em
}

.faq-help p {
  margin: 6px 0 0;
  color: var(--mut);
  font-size: 14.5px;
  line-height: 1.55
}

.faq-help-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 16px;
  align-items: center;
  margin-top: 18px
}

.faq-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--red-dk);
  font-size: 14px;
  font-weight: 600;
  text-decoration: none
}

.faq-link i {
  font-size: 12px;
  transition: transform .25s var(--ease)
}

.faq-link:hover i { transform: translateX(4px) }

.faq-topics {
  list-style: none;
  margin: 24px 0 0;
  padding: 0;
  display: grid;
  gap: 12px
}

.faq-topics li {
  padding: 12px 14px;
  border-radius: 12px;
  background: rgba(255, 255, 255, .72);
  border: 1px solid var(--line);
  color: var(--mut);
  font-size: 14px;
  line-height: 1.5
}

.faq-topics span {
  display: block;
  margin-bottom: 2px;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10.5px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--red);
  font-weight: 500
}

.faq-stack {
  display: flex;
  flex-direction: column;
  gap: 10px
}

.faq-panel .faq-item {
  border: 1px solid rgba(31, 30, 29, .08);
  border-radius: 16px;
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 10px 28px rgba(31, 30, 29, .06);
  overflow: hidden;
  counter-increment: none;
  transition: border-color .28s var(--ease), box-shadow .28s var(--ease), transform .28s var(--ease), background .28s var(--ease)
}

.faq-panel .faq-item:hover {
  transform: translateY(-2px);
  border-color: rgba(183, 49, 53, .22);
  box-shadow: 0 16px 36px rgba(31, 30, 29, .1)
}

.faq-panel .faq-item[open] {
  border-color: rgba(183, 49, 53, .34);
  background: #fff;
  box-shadow: 0 18px 42px rgba(183, 49, 53, .12), inset 4px 0 0 var(--red)
}

.faq-panel .faq-item summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 18px 20px;
  font-size: 17px;
  font-weight: 650;
  line-height: 1.35
}

.faq-panel .faq-item summary:before,
.faq-panel .faq-item summary:after {
  display: none
}

.faq-q {
  flex: 1;
  min-width: 0
}

.faq-toggle {
  flex: none;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  position: relative;
  border: 1px solid rgba(183, 49, 53, .2);
  background: rgba(183, 49, 53, .06);
  transition: transform .3s var(--ease), background .25s, border-color .25s
}

.faq-toggle:before,
.faq-toggle:after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 12px;
  height: 2px;
  border-radius: 999px;
  background: var(--red);
  transform: translate(-50%, -50%);
  transition: transform .3s var(--ease), opacity .25s
}

.faq-toggle:after {
  transform: translate(-50%, -50%) rotate(90deg)
}

.faq-panel .faq-item[open] .faq-toggle {
  background: var(--red);
  border-color: var(--red);
  transform: rotate(180deg)
}

.faq-panel .faq-item[open] .faq-toggle:before,
.faq-panel .faq-item[open] .faq-toggle:after {
  background: #fff
}

.faq-panel .faq-item[open] .faq-toggle:after {
  opacity: 0;
  transform: translate(-50%, -50%) rotate(90deg) scale(0)
}

.faq-panel .faq-item[open] summary {
  color: var(--red-dk)
}

.faq-a {
  padding: 0 20px 20px
}

.faq-a p {
  margin: 0;
  padding: 0 0 0 16px;
  border-left: 2px solid rgba(183, 49, 53, .18);
  color: #4f4a45;
  font-size: 15.5px;
  line-height: 1.68
}

.faq-panel .faq-item[open] .faq-a p {
  animation: faqIn .35s var(--ease)
}

.faq-page {
  padding-top: clamp(48px, 6vw, 72px)
}

@media(max-width:980px) {
  .faq-intro {
    position: static
  }

  .faq-panel .faq-item summary {
    padding: 16px 16px;
    font-size: 16px
  }

  .faq-a {
    padding: 0 16px 16px
  }

  .faq-toggle {
    width: 30px;
    height: 30px
  }
}

.v2-cta-band {
  position: relative;
  overflow: hidden;
  color: #fff;
  background: #0c0a09;
  padding: clamp(80px, 10vw, 130px) 0
}

.v2-cta-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .38;
  z-index: 0
}

.v2-cta-band:before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(12, 10, 9, .55), rgba(12, 10, 9, .38));
  z-index: 1
}

.v2-cta-band .wrap { position: relative; z-index: 2 }
.v2-cta-band .sub { color: #e8e2dc }
.v2-cta-band .btn.ghost {
  color: #fff;
  border-color: rgba(255, 255, 255, .45)
}

.lead-section {
  /* background-image: url("../assets/v2-lead-bg.jpg") */
}

.lead-section:before {
  background: linear-gradient(180deg, rgba(250, 248, 245, .35), rgba(250, 248, 245, .72))
}

body.v2 .lead-card {
  background: rgba(255, 255, 255, .92);
  color: var(--ink);
  box-shadow: 0 16px 40px rgba(31, 30, 29, .1), 0 2px 8px rgba(31, 30, 29, .05)
}

body.v2 .g3,
body.v2 .g4,
body.v2 .posts {
  gap: 20px;
  background: none
}

body.v2 .g3 > div,
body.v2 .g3 > a,
body.v2 .g4 > div,
body.v2 .g4 > a,
body.v2 .card,
body.v2 .sol,
body.v2 .contact-card,
body.v2 .posts article,
body.v2 .faq-item {
  box-shadow: 0 14px 36px rgba(31, 30, 29, .08), 0 2px 10px rgba(31, 30, 29, .04);
  border: 1px solid rgba(31, 30, 29, .06);
  transition: transform .32s var(--ease), box-shadow .32s var(--ease), border-color .32s var(--ease)
}

body.v2 .g3 > div:hover,
body.v2 .g3 > a:hover,
body.v2 .g4 > div:hover,
body.v2 .g4 > a:hover,
body.v2 .card:hover,
body.v2 .sol:hover,
body.v2 .contact-card:hover,
body.v2 .posts article:hover,
body.v2 .faq-item:hover,
body.v2 .lead-card:hover,
body.v2 .why-rail li:hover {
  transform: translateY(-5px);
  box-shadow: 0 22px 48px rgba(31, 30, 29, .14), 0 0 0 1px rgba(183, 49, 53, .14);
  border-color: transparent
}

body.v2 .why-rail {
  gap: 18px 20px
}

body.v2 .why-rail li {
  background: #fff;
  border: 1px solid rgba(31, 30, 29, .06);
  border-radius: 18px;
  padding: 22px 20px;
  box-shadow: 0 14px 36px rgba(31, 30, 29, .08), 0 2px 10px rgba(31, 30, 29, .04);
  transition: transform .32s var(--ease), box-shadow .32s var(--ease)
}

body.v2 section:not(.dark):not(.deep) .precept {
  background: #fff;
  border: 1px solid rgba(31, 30, 29, .06);
  border-radius: 18px;
  padding: 16px 20px 18px;
  margin-top: 10px;
  box-shadow: 0 14px 36px rgba(31, 30, 29, .08), 0 2px 10px rgba(31, 30, 29, .04)
}

body.v2 .dark .g3 > div,
body.v2 .dark .g3 > a,
body.v2 .deep .g3 > div,
body.v2 .deep .g3 > a,
body.v2 .dark .g4 > div,
body.v2 .deep .g4 > div {
  box-shadow: 0 16px 40px rgba(0, 0, 0, .32);
  border-color: rgba(255, 255, 255, .06)
}

body.v2 .deep .g4 > div,
body.v2 .deep .g4 > a {
  color: var(--ink)
}

body.v2 .deep .g4 h3 {
  color: var(--ink)
}

body.v2 .lead-card h3 { color: var(--ink) }
body.v2 .lead-card li { color: var(--mut) }
body.v2 .lead-note { color: #000 }

.lead-grid {
  grid-template-columns: 1fr 1fr
}

.lead-card {
  display: grid;
  grid-template-columns: 188px minmax(0, 1fr);
  grid-template-rows: auto auto 1fr;
  text-align: left;
  align-items: start;
  gap: 8px 22px
}

.lead-card .lead-photo {
  margin: 0;
  grid-column: 1;
  grid-row: 1 / span 3;
  width: 188px;
  height: 188px;
  flex: none
}

body.v2 .lead-card:hover .lead-photo {
  transform: none
}

.lead-card h3,
.lead-card .role,
.lead-card ul { grid-column: 2 }

@media(max-width:980px) {
  .v2-hero-grid,
  .v2-why-head,
  .v2-why-split,
  .why-row,
  .faq-split,
  .why-rail,
  .lead-grid {
    grid-template-columns: 1fr
  }

  .why-row:nth-child(even) .why-media {
    order: 0
  }

  .why-media {
    min-height: 0;
    aspect-ratio: 16 / 10
  }

  .v2-why-split .v2-feature {
    position: static
  }

  .v2-why-split .v2-feature img {
    min-height: 0
  }

  .v2-hero-visual.v2-unify {
    min-height: 0
  }

  .flow-items span { font-size: 10.5px }

  .v2-hero-copy .h1 {
    white-space: normal;
    font-size: clamp(28px, 7vw, 40px)
  }

  .ind-board {
    min-height: 340px;
    height: 58vw;
    max-height: 420px;
    transform: rotateX(4deg) rotateY(-6deg)
  }

  .ind-card { border-radius: 10px }

  .v2-banner-stats {
    grid-template-columns: 1fr 1fr
  }

  .v2-dc-facility,
  .v2-dc-track,
  .v2-dc-my {
    grid-template-columns: 1fr
  }

  .v2-dc-stack article {
    margin-left: 0 !important;
    margin-right: 0 !important
  }

  .v2-dc-track:before { display: none }

  .v2-dc-track li { padding: 0 0 28px }

  .v2-sv-pillars {
    grid-template-columns: 1fr
  }

  .v2-sv-pillars article,
  .v2-sv-pillars article:nth-child(-n+2) {
    grid-column: auto
  }

  .lead-card {
    grid-template-columns: 1fr;
    text-align: center
  }

  .lead-card .lead-photo { margin: 0 auto 8px }
  .lead-card h3,
  .lead-card .role,
  .lead-card ul { grid-column: auto }
  .lead-card ul { text-align: left }
}

body.v2 .steps.pictured .step:nth-child(even) {
  direction: rtl
}

body.v2 .steps.pictured .step:nth-child(even) .step-copy {
  direction: ltr;
  unicode-bidi: isolate;
  text-align: right
}

body.v2 .steps.pictured .step:nth-child(even) .step-copy p {
  margin-left: auto
}

body.v2 .wwd-intro h2 {
  /* font-family: 'Fraunces', serif; */
  font-weight: 500
}
body.v2 .wwd-card h3 {
  /* font-family: 'Fraunces', serif; */
  font-weight: 500
}

/* ---- Solutions stage ---- */
.sol-stage {
  position: relative;
  overflow: hidden;
  background: linear-gradient(135deg, #0c1928 0%, #0f2236 40%, #14203a 70%, #1a1420 100%);
  padding: clamp(56px, 8vw, 100px) 0
}

.sol-circuit {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  pointer-events: none
}

.sol-stage .wrap { position: relative; z-index: 1 }

.sol-stage-grid {
  display: grid;
  grid-template-columns: minmax(260px, .9fr) minmax(0, 1.15fr);
  gap: clamp(36px, 5vw, 72px);
  align-items: center
}

.sol-hub {
  position: relative;
  width: min(100%, 400px);
  aspect-ratio: 1;
  margin: 0 auto
}

.sol-hub-rings {
  position: absolute;
  inset: 0;
  pointer-events: none
}

.sol-ring {
  position: absolute;
  left: 50%; top: 50%;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  border: 1.5px solid rgba(183, 49, 53, .5);
  animation: solRingPulse 5s ease-in-out infinite
}

.sol-ring.r1 { width: 56%; aspect-ratio: 1; animation-duration: 5.2s }
.sol-ring.r2 { width: 76%; aspect-ratio: 1; border-color: rgba(183, 49, 53, .35); animation-duration: 6.6s; animation-delay: .5s }
.sol-ring.r3 { width: 96%; aspect-ratio: 1; border-color: rgba(183, 49, 53, .22); animation-duration: 8s; animation-delay: 1s }

.sol-orbit-track {
  position: absolute;
  inset: 0;
  animation: solOrbitSpin 48s linear infinite
}

.sol-chip {
  position: absolute;
  left: 50%; top: 50%;
  width: 72px; height: 72px;
  margin: -36px 0 0 -36px;
  transform: rotate(calc(var(--a) * 1deg)) translate(0, -min(142px, 35vw));
  text-decoration: none;
  z-index: 2
}

.sol-chip-inner {
  display: block;
  width: 100%; height: 100%;
  border-radius: 50%;
  overflow: hidden;
  border: 2px solid rgba(183, 49, 53, .6);
  box-shadow: 0 0 18px rgba(183, 49, 53, .35), 0 8px 24px rgba(0, 0, 0, .4);
  animation: solOrbitSpinReverse 48s linear infinite;
  transition: transform .28s var(--ease), box-shadow .28s var(--ease)
}

.sol-chip img { width: 100%; height: 100%; object-fit: cover; display: block }

.sol-chip:hover .sol-chip-inner {
  transform: scale(1.12);
  box-shadow: 0 0 28px rgba(183, 49, 53, .55), 0 0 0 2px rgba(183, 49, 53, .7)
}

.sol-core {
  position: absolute;
  left: 50%; top: 50%;
  transform: translate(-50%, -50%);
  width: min(42%, 154px);
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle at 40% 36%, #1e3a5c, #0f2236 70%);
  border: 2px solid rgba(183, 49, 53, .65);
  box-shadow: 0 0 0 8px rgba(15, 34, 54, .85), 0 0 50px rgba(183, 49, 53, .35), 0 18px 44px rgba(0, 0, 0, .3);
  animation: solCorePulse 3s ease-in-out infinite;
  display: grid;
  place-content: center;
  text-align: center;
  padding: 12px;
  z-index: 3
}

.sol-core-lab {
  /* font-family: 'Fraunces', serif; */
  font-size: clamp(16px, 2.2vw, 22px);
  font-weight: 500;
  letter-spacing: -.02em;
  color: #dce8f4;
  line-height: 1.15
}

.sol-core-sub {
  display: block;
  margin-top: 5px;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 9px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: rgba(183, 49, 53, .85)
}

.sol-list { display: grid; gap: 12px }

.sol-item {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 14px;
  align-items: start;
  padding: 20px 22px;
  background: linear-gradient(135deg, rgba(20, 40, 65, .7) 0%, rgba(15, 28, 48, .8) 100%);
  border: 1px solid rgba(183, 49, 53, .3);
  border-left: 3px solid rgba(183, 49, 53, .7);
  border-radius: 14px;
  text-decoration: none;
  color: #fff;
  backdrop-filter: blur(10px);
  box-shadow: 0 6px 28px rgba(183, 49, 53, .15), 0 2px 6px rgba(0, 0, 0, .3), inset 0 1px 0 rgba(255, 255, 255, .06);
  transition: transform .32s var(--ease), border-color .32s var(--ease), box-shadow .32s var(--ease), background .32s var(--ease);
  position: relative;
  overflow: hidden
}

.sol-item::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: radial-gradient(ellipse at 0% 0%, rgba(183, 49, 53, .1) 0%, transparent 60%);
  pointer-events: none;
  transition: opacity .32s var(--ease);
  opacity: 1
}

.sol-item:hover {
  transform: translateY(-5px) scale(1.015);
  border-color: rgba(183, 49, 53, .6);
  border-left-color: rgba(183, 49, 53, 1);
  box-shadow: 0 12px 44px rgba(183, 49, 53, .3), 0 0 20px rgba(183, 49, 53, .12), 0 24px 48px rgba(0, 0, 0, .35);
  background: linear-gradient(135deg, rgba(30, 48, 72, .8) 0%, rgba(20, 34, 56, .85) 100%)
}

.sol-item:hover::before { opacity: 0 }

.sol-item .n {
  color: #b73135;
  padding-top: 2px;
  font-weight: 700;
  font-size: 18px;
  text-shadow: 0 0 12px rgba(183, 49, 53, .4)
}

body.v2 .sol-item h3 {
  /* font-family: 'Fraunces', serif; */
  font-weight: 500;
  font-size: clamp(18px, 1.5vw, 22px);
  letter-spacing: -.02em;
  margin: 0;
  line-height: 1.2;
  color: #e8f0fa
}

.sol-item p {
  margin: 6px 0 0;
  color: rgba(200, 210, 225, .72);
  font-size: 14.5px;
  line-height: 1.55
}

.sol-item .more {
  margin-top: 10px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  color: #d94449;
  border-bottom: 1.5px solid rgba(183, 49, 53, .5);
  padding-bottom: 2px
}

.sol-item .more i { font-size: 11px; transition: transform .22s var(--ease) }
.sol-item:hover .more i { transform: translateX(4px) }

@keyframes solOrbitSpin { to { transform: rotate(360deg) } }
@keyframes solOrbitSpinReverse { to { transform: rotate(-360deg) } }
@keyframes solRingPulse { 0%, 100% { opacity: .5 } 50% { opacity: 1 } }
@keyframes solCorePulse { 0%, 100% { box-shadow: 0 0 0 8px rgba(15,34,54,.85), 0 0 50px rgba(183,49,53,.35), 0 18px 44px rgba(0,0,0,.3) } 50% { box-shadow: 0 0 0 12px rgba(15,34,54,.85), 0 0 80px rgba(183,49,53,.5), 0 18px 44px rgba(0,0,0,.3) } }

@media (max-width: 920px) {
  .sol-stage-grid { grid-template-columns: 1fr; gap: 40px }
  .sol-hub { width: min(100%, 320px) }
  .sol-chip { width: 60px; height: 60px; margin: -30px 0 0 -30px; transform: rotate(calc(var(--a) * 1deg)) translate(0, -min(110px, 32vw)) }
}

@media (prefers-reduced-motion: reduce) {
  .sol-orbit-track, .sol-chip-inner, .sol-ring, .sol-circuit { animation: none !important }
}

/* ---------- CONFERENCES ---------- */
.conf-sec {
  padding-top: clamp(40px, 5vw, 64px)
}

.conf-year + .conf-year {
  margin-top: clamp(48px, 7vw, 88px)
}

.conf-year-head h2 {
  font-size: clamp(40px, 6vw, 72px);
  letter-spacing: -.04em;
  margin: 8px 0 28px
}

.conf-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px
}

.conf-card {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
  background: #fff;
  border: 1px solid rgba(31, 30, 29, .1);
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 14px 36px rgba(31, 30, 29, .07);
  transition: transform .28s var(--ease), box-shadow .28s var(--ease), border-color .28s
}

.conf-card:hover {
  transform: translateY(-4px);
  border-color: rgba(183, 49, 53, .28);
  box-shadow: 0 22px 48px rgba(31, 30, 29, .12)
}

.conf-card-soon {
  background: #f7f4f0;
  border-style: dashed;
  cursor: default
}

.conf-card-soon:hover {
  transform: none;
  border-color: rgba(31, 30, 29, .14);
  box-shadow: 0 14px 36px rgba(31, 30, 29, .07)
}

.conf-logo {
  display: grid;
  place-items: center;
  min-height: 140px;
  padding: 22px 24px;
  background: #f4f1ec;
  border-bottom: 1px solid rgba(31, 30, 29, .06)
}

.conf-logo img {
  width: 100%;
  max-width: 260px;
  height: auto;
  object-fit: contain
}

.conf-logo-dark {
  background: #0b1f4a
}

.conf-logo-tribalnet {
  background: #b45a3c;
  padding: 0
}

.conf-logo-tribalnet img {
  max-width: 180px;
  width: 70%;
  border-radius: 12px
}

.conf-logo-ncai {
  background: #1a1510
}

.conf-logo-iga {
  background: #f4f1ec
}

.conf-logo-soon {
  background: transparent;
  border-bottom: 0;
  min-height: 100px
}

.conf-logo-soon span {
  font-size: 42px;
  letter-spacing: .2em;
  color: rgba(31, 30, 29, .28);
  font-weight: 700
}

.conf-body {
  padding: 22px 24px 24px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1
}

.conf-body h3 {
  margin: 0;
  font-size: 22px;
  letter-spacing: -.02em
}

.conf-body p {
  margin: 0;
  color: var(--mut);
  font-size: 14.5px;
  line-height: 1.55;
  flex: 1
}

.conf-meta {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 15px;
  color: var(--red);
  margin-top: 6px
}

.conf-card .c-go {
  margin-top: 10px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  color: var(--red)
}

.conf-card .c-go i {
  font-size: 11px;
  transition: transform .22s var(--ease)
}

.conf-card:hover .c-go i {
  transform: translate(2px, -2px)
}

@media (max-width: 980px) {
  .conf-grid { grid-template-columns: 1fr 1fr }
}

@media (max-width: 640px) {
  .conf-grid { grid-template-columns: 1fr }
}