h1 {

  font-size: clamp(52px, 7vw, 96px);

  line-height: .88;

  letter-spacing: -4px;

  text-transform: uppercase;

  margin-bottom: 26px;

}



h1 span,

.arsenal-head span,

.paths-head span {

  color: var(--purple2);

}



.hero-text {

  max-width: 620px;

  color: #dedee8;

  font-size: 18px;

  line-height: 1.5;

  margin-bottom: 30px;

}



.split h2,

.section-head h2,

.manifesto-content h2,

.paths-head h2,

.method h2,

.apply h2,

.contact h2 {

  font-size: clamp(34px, 4vw, 58px);

  line-height: .98;

  letter-spacing: -2.2px;

  margin-bottom: 0;

}



.split p,

.section-head p,

.manifesto-content > p,

.paths-head p,

.apply p {

  color: var(--muted);

  font-size: 17px;

  line-height: 1.65;

  margin-bottom: 0;

}



.intro-grid,

.manifesto-grid {

  margin-top: 30px;

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 12px;

}



.intro-grid article,

.manifesto-grid article,

.paths-grid article,

.platform-grid article,

.timeline article,

.apply,

.contact {

  border: 1px solid var(--line);

  border-radius: 18px;

  background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.018));

}



.intro-grid article,

.manifesto-grid article,

.platform-grid article {

  padding: 28px;

}



.intro-grid span,

.manifesto-grid span,

.platform-grid span,

.timeline span {

  color: var(--purple2);

  font-size: 25px;

  font-weight: 950;

}



.intro-grid h3,

.manifesto-grid h3,

.platform-grid h3,

.timeline h3 {

  font-size: 16px;

  text-transform: uppercase;

  margin: 18px 0 10px;

}



.intro-grid p,

.manifesto-grid p,

.platform-grid p,

.paths-grid p,

.timeline p,

.contact p {

  color: var(--muted);

  line-height: 1.55;

  font-size: 14px;

}



/* =========================

   MANIFESTO + CAROUSEL

========================= */



.manifesto {

  overflow: visible;

}



.manifesto-layout {

  display: grid;

  grid-template-columns: minmax(0, 1.05fr) minmax(360px, .95fr);

  gap: clamp(36px, 5vw, 80px);

  align-items: center;

}



.manifesto-content h2 {

  max-width: 760px;

}



.manifesto-content > p {

  max-width: 680px;

  margin-top: 24px;

}



.manifesto-layout .manifesto-grid {

  margin-top: 42px;

}



.manifesto-carousel {

  position: relative;

  min-height: 520px;

  display: flex;

  align-items: center;

  justify-content: center;

  overflow: visible;

}



.manifesto-carousel::before {

  content: "";

  position: absolute;

  width: 620px;

  height: 620px;

  border-radius: 50%;

  background: radial-gradient(circle, rgba(132,48,255,.24), rgba(132,48,255,.10) 42%, transparent 72%);

  filter: blur(48px);

  pointer-events: none;

}



.scene {

  width: min(440px, 80vw);

  height: 440px;

  perspective: 1200px;

  display: grid;

  place-items: center;

  overflow: visible;

}



.a3d {

  position: relative;

  width: 100%;

  height: 100%;

  transform-style: preserve-3d;

  animation: supraRotate 38s linear infinite;

}



@keyframes supraRotate {

  from {

    transform: rotateY(0deg);

  }



  to {

    transform: rotateY(360deg);

  }

}



.card3d {

  position: absolute;

  inset: 50% auto auto 50%;

  width: 210px;

  height: 290px;

  object-fit: cover;

  border-radius: 24px;

  border: 1px solid rgba(255,255,255,.14);

  background: rgba(255,255,255,.03);

  box-shadow:

    0 30px 90px rgba(0,0,0,.55),

    0 0 36px rgba(132,48,255,.15);

  backface-visibility: hidden;

  transform:

    translate(-50%, -50%)

    rotateY(calc(360deg / var(--n) * var(--i)))

    translateZ(310px);

}



.card3d:hover {

  box-shadow:

    0 42px 110px rgba(0,0,0,.62),

    0 0 54px rgba(132,48,255,.30);

}



/* =========================

   ARSENAL

========================= */



.arsenal {

  padding: 72px 50px;

  margin-top: 4px;

}



.arsenal-head {

  display: grid;

  grid-template-columns: .9fr 1.1fr;

  gap: 54px;

  align-items: end;

  margin-bottom: 34px;

}



.arsenal-head h2 {

  font-size: clamp(52px, 7vw, 96px);

  line-height: .86;

  letter-spacing: -4px;

  text-transform: uppercase;

  margin: 0;

}



.arsenal-head p {

  color: var(--muted);

  font-size: 17px;

  line-height: 1.65;

  margin: 0;

}



.arsenal-list {

  display: grid;

  gap: 0;

  border-top: 1px solid var(--line);

}



.arsenal-list article {

  display: grid;

  grid-template-columns: 80px 1fr 1.15fr;

  gap: 24px;

  align-items: center;

  padding: 26px 0;

  border-bottom: 1px solid var(--line);

}



.arsenal-list article span {

  color: var(--purple2);

  font-size: 18px;

  font-weight: 950;

}



.arsenal-list article h3 {

  margin: 0;

  font-size: 22px;

  letter-spacing: -1px;

  text-transform: uppercase;

}



.arsenal-list article p {

  margin: 0;

  color: var(--muted);

  line-height: 1.55;

}



/* =========================

   PLATFORMS

========================= */



.platforms .section-head {

  max-width: 940px;

}



.platform-grid {

  margin-top: 34px;

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 14px;

}



.platform-grid article {

  min-height: 230px;

}



.platform-grid article:nth-child(5) {

  background:

    radial-gradient(circle at 85% 20%, rgba(139,44,255,.28), transparent 32%),

    linear-gradient(180deg, rgba(139,44,255,.13), rgba(255,255,255,.025));

  border-color: rgba(189,116,255,.42);

}



/* =========================

   PATHS

========================= */



.paths-head {

  display: grid;

  grid-template-columns: 1fr .85fr;

  gap: 54px;

  align-items: end;

  margin-bottom: 34px;

}



.paths-head h2 {

  font-size: clamp(46px, 6vw, 80px);

  line-height: .88;

  letter-spacing: -3.2px;

  text-transform: uppercase;

  margin: 0;

}



.paths-grid {

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 14px;

}



.paths-grid article {

  padding: 30px;

  min-height: 300px;

}



.paths-grid .highlight {

  background:

    radial-gradient(circle at 82% 20%, rgba(139,44,255,.28), transparent 30%),

    linear-gradient(180deg, rgba(139,44,255,.14), rgba(255,255,255,.025));

  border-color: rgba(189,116,255,.42);

}



.path-label {

  color: var(--purple2);

  font-size: 11px;

  font-weight: 950;

  letter-spacing: .14em;

  text-transform: uppercase;

  margin-bottom: 24px;

}



.paths-grid h3 {

  font-size: 28px;

  line-height: 1;

  letter-spacing: -1.2px;

  margin-bottom: 16px;

}



.paths-grid ul {

  list-style: none;

  padding: 0;

  margin: 24px 0 0;

  display: grid;

  gap: 10px;

}



.paths-grid li {

  color: #e6e6ef;

  font-size: 13px;

  text-transform: uppercase;

  letter-spacing: .08em;

}



.paths-grid li::before {

  content: "↗";

  color: var(--purple2);

  margin-right: 8px;

}



/* =========================

   METHOD

========================= */



.timeline {

  margin-top: 34px;

  display: grid;

  grid-template-columns: repeat(4, 1fr);

  gap: 12px;

}



.timeline article {

  padding: 26px;

  min-height: 220px;

}



/* =========================

   APPLY

========================= */



.apply {

  display: grid;

  grid-template-columns: .9fr 1.1fr;

  gap: 24px;

  align-items: stretch;

  padding: 44px;

  background:

    radial-gradient(circle at 90% 24%, rgba(139,44,255,.22), transparent 28%),

    rgba(0,0,0,.44);

}



.apply-copy {

  align-self: center;

}



.apply p {

  max-width: 730px;

}



.apply-form {

  display: grid;

  gap: 14px;

  border: 1px solid var(--line);

  border-radius: 20px;

  background: rgba(0,0,0,.32);

  padding: 18px;

}



.form-row {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 12px;

}



.apply-form label {

  display: grid;

  gap: 8px;

  color: #e8e8ef;

  font-size: 12px;

  font-weight: 850;

  text-transform: uppercase;

  letter-spacing: .08em;

}



.apply-form input,

.apply-form select,

.apply-form textarea {

  width: 100%;

  border: 1px solid var(--line);

  border-radius: 14px;

  background: rgba(255,255,255,.055);

  color: #fff;

  padding: 14px;

  outline: none;

  resize: vertical;

}



.apply-form select option {

  background: #08080d;

  color: #fff;

}



.apply-form input:focus,

.apply-form select:focus,

.apply-form textarea:focus {

  border-color: rgba(189,116,255,.65);

  box-shadow: 0 0 0 4px rgba(139,44,255,.12);

}



.checkline {

  grid-template-columns: 18px 1fr !important;

  align-items: start;

  text-transform: none !important;

  letter-spacing: 0 !important;

  font-weight: 500 !important;

  color: var(--muted) !important;

}



.checkline input {

  width: 18px;

  height: 18px;

  padding: 0;

  margin-top: 2px;

}



.form-submit {

  width: 100%;

}



.form-status {

  min-height: 20px;

  margin: 0;

  color: var(--muted);

  font-size: 13px;

}



.form-status.success {

  color: #72e39a;

}



.form-status.error {

  color: #ff8c8c;

}



/* =========================

   CONTACT

========================= */



.contact {

  display: grid;

  grid-template-columns: .85fr 1.15fr;

  gap: 18px;

  padding: 18px;

}



.contact-copy {

  padding: 34px;

}



.contact a {

  color: #fff;

}



.map-card {

  overflow: hidden;

  border-radius: 18px;

  min-height: 320px;

  border: 1px solid var(--line);

  background: #111;

}



.map-card iframe {

  width: 100%;

  height: 100%;

  min-height: 320px;

  border: 0;

  filter: grayscale(1) invert(.92) contrast(.9);

}



/* =========================

   FOOTER

========================= */



.site-footer {

  width: min(var(--max), calc(100vw - var(--rail) - 32px));

  margin: 14px auto 28px;

  border: 1px solid var(--line);

  border-radius: var(--radius);

  background: #040407;

  padding: 32px;

  display: grid;

  grid-template-columns: 1.3fr .75fr .75fr;

  gap: 28px;

}



.site-footer p {

  color: var(--muted);

  max-width: 520px;

  line-height: 1.6;

}



.site-footer nav {

  display: grid;

  gap: 10px;

  align-content: start;

}



.site-footer a,

.site-footer button {

  color: var(--muted);

  background: transparent;

  border: 0;

  text-align: left;

  padding: 0;

  cursor: pointer;

}



.site-footer a:hover,

.site-footer button:hover {

  color: #fff;

}



.footer-bottom {

  grid-column: 1 / -1;

  border-top: 1px solid var(--line);

  padding-top: 18px;

  display: flex;

  justify-content: space-between;

  gap: 16px;

  flex-wrap: wrap;

  color: var(--muted2);

  font-size: 12px;

}



/* =========================

   LEGAL PAGES

========================= */



.legal-page {

  width: min(920px, calc(100vw - 32px));

  margin: 40px auto;

}



.legal-page .footer-brand {

  margin-bottom: 24px;

}



.legal-card {

  padding: 46px;

}



.legal-card h1 {

  font-size: clamp(42px, 6vw, 78px);

  line-height: .9;

  letter-spacing: -3px;

  margin-bottom: 28px;

}



.legal-card h2 {

  margin-top: 34px;

  margin-bottom: 12px;

  font-size: 22px;

}



.legal-card p,

.legal-card li {

  color: var(--muted);

  line-height: 1.7;

}



.legal-card ul {

  padding-left: 20px;

}



.legal-card a:not(.btn) {

  color: #fff;

  text-decoration: underline;

}



.legal-card .btn {

  margin-top: 24px;

}



/* =========================

   RESPONSIVE FALLBACK

========================= */



@media (max-width: 1100px) {

  .manifesto-layout {

    grid-template-columns: 1fr;

  }



  .manifesto-carousel {

    min-height: 460px;

  }



  .scene {

    width: min(360px, 82vw);

    height: 360px;

  }



  .card3d {

    width: 170px;

    height: 240px;

    transform:

      translate(-50%, -50%)

      rotateY(calc(360deg / var(--n) * var(--i)))

      translateZ(245px);

  }



  .platform-grid {

    grid-template-columns: repeat(2, 1fr);

  }

}



@media (max-width: 880px) {

  .intro-grid,

  .manifesto-grid,

  .paths-grid,

  .platform-grid,

  .timeline {

    grid-template-columns: 1fr;

  }



  .arsenal,

  .apply {

    padding: 34px 22px;

  }



  .arsenal-head,

  .paths-head,

  .apply,

  .contact {

    grid-template-columns: 1fr;

  }



  .arsenal-list article {

    grid-template-columns: 1fr;

    gap: 10px;

  }



  .form-row {

    grid-template-columns: 1fr;

  }



  .site-footer {

    grid-template-columns: 1fr;

  }

}



@media (max-width: 560px) {

  h1 {

    letter-spacing: -2.4px;

  }



  .split h2,

  .section-head h2,

  .manifesto-content h2,

  .paths-head h2,

  .method h2,

  .apply h2,

  .contact h2 {

    letter-spacing: -1.5px;

  }



  .manifesto-carousel {

    min-height: 340px;

    overflow: hidden;

  }



  .manifesto-carousel::before {

    width: 320px;

    height: 320px;

    opacity: .45;

    filter: blur(45px);

  }



  .scene {

    width: 280px;

    height: 280px;

  }



  .card3d {

    width: 140px;

    height: 200px;

    border-radius: 18px;

    transform:

      translate(-50%, -50%)

      rotateY(calc(360deg / var(--n) * var(--i)))

      translateZ(190px);

  }



  .site-footer {

    width: calc(100vw - 28px);

    padding: 24px;

  }

}



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

  .a3d {

    animation-duration: 120s;

  }

}