@import "./fonts.css";
@import "./tokens.css";

img, video { display: block; max-width: 100%; height: auto; }
button, input, select, textarea { font: inherit; color: inherit; }

button, a, summary, label, [role="button"] { touch-action: manipulation; }

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

html {
  font-size: 16px;
  color-scheme: dark;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  background: var(--color-surface-0);
  color: var(--color-text-100);
  font-family: var(--dda-font-body);

  font-feature-settings: "ss01" 1, "cv11" 1, "kern" 1, "calt" 1;

}

em {
  font-family: var(--dda-font-editorial);
  font-style: italic;
  font-weight: 400;
}

.skip-to-content {
  position: fixed;
  top: var(--dda-size-4);
  left: var(--dda-size-4);
  z-index: var(--dda-z-modal);
  padding: var(--dda-size-3) var(--dda-size-5);
  background: var(--color-surface-elevated);
  color: var(--color-text-100);
  font-family: var(--dda-font-body);
  font-size: var(--dda-text-sm);
  text-decoration: none;
  border: 1px solid var(--color-border-subtle);
  border-radius: var(--dda-radius-2);
  transform: translateY(calc(-100% - var(--dda-size-6)));
  transition: transform var(--duration-hover) var(--dda-ease-out-expo);
}

.skip-to-content:focus-visible {
  transform: translateY(0);
  outline: none;
  box-shadow: var(--shadow-focus);
}

.header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: var(--dda-z-header);
  height: var(--header-height);
  background: transparent;

  overflow: hidden;
}

.header__shape {
  position: absolute;
  top: 0;
  left: 0;

  width: calc(100% + 4px);
  height: calc(100% + 4px);
  z-index: 0;
  pointer-events: none;
  background: var(--color-accent-gold);
  will-change: transform;

  clip-path: polygon(
    0 0,
    100% 0,
    100% calc(100% - var(--header-chamfer) - 8px),
    calc(100% - var(--header-chamfer) - 8px) 100%,
    calc(var(--header-chamfer) + 4px) 100%,
    0 calc(100% - var(--header-chamfer) - 4px)
  );
}

.header__shape::before {
  content: '';
  position: absolute;

  top: 2px;
  right: 6px;
  bottom: 6px;
  left: 2px;
  background: var(--header-bg);
  will-change: transform;
  clip-path: polygon(
    0 0,
    100% 0,
    100% calc(100% - var(--header-chamfer)),
    calc(100% - var(--header-chamfer)) 100%,
    var(--header-chamfer) 100%,
    0 calc(100% - var(--header-chamfer))
  );
}

.header__inner {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  height: 100%;

  overflow: hidden;

  padding-top: 0;
  padding-bottom: 0;
  padding-left: calc(var(--header-chamfer) + var(--dda-size-4));
  padding-right: var(--dda-size-8);
  max-width: 1440px;
  margin: 0 auto;
  gap: var(--dda-size-8);
}

.header__logo {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  text-decoration: none;

  position: relative;
  top: 1px;

  opacity: 0;
  animation: headerReveal 1.2s var(--dda-ease-out-expo) 0.3s forwards;
}

.header__logo:focus-visible {
  outline: none;
  box-shadow: var(--shadow-focus);
  border-radius: var(--dda-radius-2);
}

.header__logo img {
  height: var(--header-logo-height);
  width: auto;
  display: block;
  filter: brightness(1.04);
}

.header__spacer {
  flex: 1;
}

.header__nav {
  display: flex;
  align-items: center;
  gap: var(--dda-size-8);

  opacity: 0;
  animation: headerReveal 1.2s var(--dda-ease-out-expo) 0.5s forwards;
}

.header__nav a {
  position: relative;
  display: inline-flex;
  align-items: center;
  padding: var(--dda-size-1) 0;
  text-decoration: none;

  color: var(--color-text-100);

  font-family: var(--dda-font-body);
  font-size: var(--dda-text-sm);
  font-weight: 600;
  letter-spacing: var(--dda-tracking-widest);
  text-transform: uppercase;

  transition: color var(--dda-duration-fast) var(--dda-ease-out-quart);
}

.header__nav a::before {
  content: '';
  position: absolute;
  inset: -11px 0;
}

.header__nav a::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  right: 0;
  height: 1px;
  background: var(--color-accent-on-dark);
  transform-origin: left center;
  transform: scaleX(0);
  transition: transform var(--dda-duration-fast) var(--dda-ease-out-expo);
}

.header__nav a:hover {
  color: var(--color-text-100);
}

.header__nav a:hover::after,
.header__nav a[aria-current="page"]::after,
.header__nav a.header__nav-link--active::after {
  transform: scaleX(1);
}

.header__nav a[aria-current="page"],
.header__nav a.header__nav-link--active {
  color: var(--color-text-100);
}

.header__nav a:focus-visible {
  outline: none;
  box-shadow: var(--shadow-focus);
  border-radius: var(--dda-radius-1);
}

.header__nav-divider {
  width: 1px;
  height: var(--dda-size-4);
  background: var(--color-border-hairline);
  flex-shrink: 0;
}

.header__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--dda-size-2);
  flex-shrink: 0;

  margin: 1.5px;
  padding: var(--dda-size-3) var(--dda-size-5);
  min-width: 0;
  max-width: 100%;

  background: var(--dda-teal-500);
  color: var(--color-text-100);
  text-decoration: none;
  border-radius: 0;

  border: none;
  cursor: pointer;

  font-family: var(--dda-font-body);
  font-size: var(--dda-text-sm);
  font-weight: 600;
  letter-spacing: var(--dda-tracking-wider);
  text-transform: uppercase;
  text-align: center;
  line-height: 1.2;

  clip-path: polygon(
    0 0,
    calc(100% - 9px) 0,
    100% 9px,
    100% 100%,
    9px 100%,
    0 calc(100% - 9px)
  );

  box-shadow: inset 0 0 12px var(--color-accent-gold-glow-inner);

  transition:
    color var(--dda-duration-fast) var(--dda-ease-out-quart),
    box-shadow var(--dda-duration-fast) var(--dda-ease-out-quart);
}

.header__cta-arrow {
  color: var(--color-accent-gold);
  font-style: normal;
  transition: color var(--dda-duration-fast) var(--dda-ease-out-quart);
}

.header__cta:hover {
  color: var(--color-text-100);
  box-shadow: inset 0 0 14px var(--color-accent-gold-glow-inner-hover);
}

.header__cta:hover .header__cta-arrow {
  color: var(--color-accent-gold-hover);
}

.header__cta-frame:hover {
  background: var(--color-accent-gold-hover);
  filter: var(--header-cta-lift-hover);
  transform: translateY(-1px);
}

.header__cta-frame:has(.header__cta:active) {
  background: var(--color-accent-gold-deep);
  transform: translateY(1px);
  filter: var(--header-cta-lift-press);
  transition-duration: var(--dda-duration-instant);
}

.header__cta:focus-visible {
  outline: none;
  box-shadow: var(--shadow-focus);
}

.header__hamburger {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: flex-end;
  gap: var(--dda-size-1);
  width: 44px;
  height: 44px;
  background: none;
  border: none;
  cursor: pointer;
  padding: var(--dda-size-2);
  flex-shrink: 0;

  opacity: 0;
  animation: headerReveal 1.2s var(--dda-ease-out-expo) 0.5s forwards;
}

.header__hamburger:focus-visible {
  outline: none;
  box-shadow: var(--shadow-focus);
  border-radius: var(--dda-radius-2);
}

.header__hamburger-bar {
  display: block;
  height: 1px;
  background: var(--color-text-100);
  border-radius: 0;
  transition:
    transform var(--dda-duration-fast) var(--dda-ease-out-expo),
    opacity var(--dda-duration-fast) var(--dda-ease-out-quart),
    width var(--dda-duration-fast) var(--dda-ease-out-expo);
}

.header__hamburger-bar:nth-child(1) { width: 22px; }
.header__hamburger-bar:nth-child(2) { width: 16px; }
.header__hamburger-bar:nth-child(3) { width: 10px; }

.header__hamburger[aria-expanded="true"] .header__hamburger-bar:nth-child(1) {
  transform: translateY(6px) rotate(45deg);
  width: 22px;
}
.header__hamburger[aria-expanded="true"] .header__hamburger-bar:nth-child(2) {
  opacity: 0;
  transform: scaleX(0);
}
.header__hamburger[aria-expanded="true"] .header__hamburger-bar:nth-child(3) {
  transform: translateY(-6px) rotate(-45deg);
  width: 22px;
}

.header__sheet {
  display: none;
  position: fixed;

  top: calc(var(--header-height-mobile) - var(--header-chamfer));
  left: 0;
  right: 0;
  z-index: calc(var(--dda-z-header) - 1);

  background: var(--header-bg);
  backdrop-filter: var(--header-backdrop);
  -webkit-backdrop-filter: var(--header-backdrop);

  border-bottom: 2px solid var(--color-accent-gold-rule);

  border-bottom-left-radius: var(--dda-radius-card);
  border-bottom-right-radius: var(--dda-radius-card);

  box-shadow: var(--dda-shadow-lift);
  padding: var(--dda-size-3) clamp(var(--dda-size-6), 6vw, var(--dda-size-12));

  padding-top: calc(var(--dda-size-3) + var(--header-chamfer));
  padding-bottom: var(--dda-size-5);

  transform: translateY(calc(-1 * var(--dda-size-2)));
  opacity: 0;
  transition:
    transform var(--dda-duration-fast) var(--dda-ease-out-expo),
    opacity var(--dda-duration-fast) var(--dda-ease-out-quart);
}

.header__sheet.is-open {
  display: block;
  transform: translateY(0);
  opacity: 1;

  overscroll-behavior: contain;
}

.header__sheet-backdrop {
  position: fixed;
  inset: 0;
  background: var(--color-scrim-modal);
  z-index: calc(var(--dda-z-header) - 2);
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--dda-duration-fast) var(--dda-ease-out-quart);
}

body:has(.header__sheet.is-open) .header__sheet-backdrop {
  opacity: 1;
}

.header__sheet-nav {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin-bottom: var(--dda-size-4);
}

.header__sheet-nav a {
  display: flex;
  align-items: center;
  padding: var(--dda-size-4) 0;
  text-decoration: none;
  color: var(--color-text-100);
  font-family: var(--dda-font-body);
  font-size: var(--dda-text-sm);
  font-weight: 600;
  letter-spacing: var(--dda-tracking-widest);
  text-transform: uppercase;
  border-bottom: 1px solid var(--color-border-hairline);
  min-height: 44px;

  transition: color var(--dda-duration-fast) var(--dda-ease-out-quart);
}

.header__sheet-nav a:last-child {
  border-bottom: none;
}

.header__sheet-nav a:hover,
.header__sheet-nav a[aria-current="page"] {
  color: var(--color-text-100);
}

.header__sheet-nav a[aria-current="page"]::before {
  content: '';
  display: inline-block;
  width: var(--dda-size-4);
  height: 1px;
  background: var(--color-accent-on-dark);
  margin-right: var(--dda-size-3);
  flex-shrink: 0;
}

.header__sheet-nav a:focus-visible {
  outline: none;
  box-shadow: var(--shadow-focus);
}

.header__sheet .header__cta-frame--block {
  width: 100%;
  opacity: 1;
  animation: none;
}

.header__sheet .header__cta--block {
  flex: 1;
  padding: var(--dda-size-2) var(--dda-size-5);
  min-height: 40px;
}

@keyframes headerReveal {
  0% {
    opacity: 0;
    transform: translateY(-8px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.header::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 4px;
  pointer-events: none;
  background-image: repeating-linear-gradient(
    90deg,
    var(--color-border-hairline) 0px,
    var(--color-border-hairline) 1px,
    transparent 1px,
    transparent 80px
  );

  background-position: 40px 0;
}

.header__cta-frame {

  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;

  background: var(--color-accent-gold);
  clip-path: polygon(
    0 0,
    calc(100% - 9px) 0,
    100% 9px,
    100% 100%,
    9px 100%,
    0 calc(100% - 9px)
  );

  filter: var(--header-cta-lift);

  transition:
    background-color var(--dda-duration-fast) var(--dda-ease-out-quart),
    filter var(--dda-duration-fast) var(--dda-ease-out-quart),
    transform var(--dda-duration-fast) var(--dda-ease-out-quart);

  opacity: 0;
  animation: headerReveal 1.2s var(--dda-ease-out-expo) 0.7s forwards;
}

@media (max-width: 1023px) {

  .header__logo img {
    height: var(--header-logo-height-mobile);
  }

  .header__nav,
  .header__nav-divider,
  .header__inner > .header__cta-frame {
    display: none;
  }

  .header__hamburger {
    display: flex;
  }

  .header__sheet {
    top: calc(var(--header-height-mobile) - var(--header-chamfer));
  }
}

@media (prefers-reduced-motion: reduce) {
  .header__nav a::after,
  .header__hamburger-bar,
  .header__sheet,
  .header__cta {
    transition: none;
  }
}

.hero {
  position: relative;
  z-index: 2;
  width: 100%;

  height: 130vh;
  background: var(--hero-canvas-bg);
}

.hero__sticky {
  position: sticky;
  top: 0;
  width: 100%;
  height: 100vh;
  height: 100dvh;
  overflow: hidden;
}

.hero__canvas {
  position: absolute;
  inset: 0;
  z-index: var(--dda-z-canvas);
}

.hero__overlay {
  position: absolute;
  inset: 0;
  z-index: 8;
  background: var(--color-surface-0);
  opacity: 0;
  pointer-events: none;
}

.hero__depth {
  position: absolute;
  inset: 0;
  z-index: 2;
  background: radial-gradient(
    ellipse 70% 60% at 50% 48%,
    rgba(10, 15, 30, 0.4) 0%,
    transparent 70%
  );
  pointer-events: none;
}

.hero__grain {
  position: absolute;
  inset: 0;
  z-index: 3;
  opacity: 0.03;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-repeat: repeat;
  background-size: 256px 256px;
}

.hero__content {
  position: relative;
  z-index: var(--dda-z-content);
  height: 100%;

  display: grid;
  grid-template-rows: 3fr auto 4fr;
  justify-items: center;
  padding: var(--header-height) var(--dda-size-8) 0;
  text-align: center;
  pointer-events: none;
}

@media (orientation: portrait) {
  .hero__content {
    grid-template-rows: 2fr auto 3fr;
  }
}

@media (orientation: portrait) and (max-height: 720px) {
  .hero__content {
    grid-template-rows: 1fr auto 2.5fr;
  }
}

.hero__headline {
  grid-row: 2;
  font-family: var(--dda-font-body);
  font-weight: 600;
  font-size: var(--dda-text-3xl);
  line-height: var(--dda-leading-tight);
  letter-spacing: var(--dda-tracking-tight);
  color: var(--color-text-100);
  max-width: var(--content-max-display);
  text-wrap: balance;
  opacity: 0;
  animation: headlineReveal 2s var(--dda-ease-out-expo) 0.6s forwards;
}

.hero__bottom {
  grid-row: 3;
  align-self: start;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--dda-size-6);
}

.hero__continuation {
  display: block;
  margin-top: var(--dda-size-6);
  font-family: var(--dda-font-body);
  font-weight: 400;
  font-size: var(--dda-text-lg);
  line-height: var(--dda-leading-relaxed);
  letter-spacing: var(--dda-tracking-wide);
  color: var(--color-text-80);
  max-width: 640px;
  opacity: 0;
  animation: subReveal 1.8s var(--dda-ease-out-expo) 1.4s forwards;
}

.hero__cta-gold {
  display: inline-flex;
  align-items: center;
  gap: var(--dda-size-3);
  pointer-events: all;
  cursor: pointer;
  text-decoration: none;
  border: none;

  padding: var(--dda-size-4) var(--dda-size-8);
  border-radius: var(--hero-cta-radius);

  background: var(--hero-cta-gradient);
  color: var(--dda-slate-950);

  font-family: var(--dda-font-body);
  font-weight: 600;
  font-size: var(--dda-text-md);
  letter-spacing: var(--dda-tracking-wider);
  text-transform: uppercase;
  line-height: 1.2;

  box-shadow: var(--hero-cta-shadow);

  opacity: 0;
  transform: translateY(8px);
  animation: subReveal 1.8s var(--dda-ease-out-expo) 1.4s forwards;

  transition:
    box-shadow var(--dda-duration-fast) var(--dda-ease-out-quart),
    transform var(--dda-duration-fast) var(--dda-ease-out-quart),
    background var(--dda-duration-fast) var(--dda-ease-out-quart);
}

.hero__cta-gold:hover {
  transform: translateY(-2px);
  box-shadow: var(--hero-cta-shadow-hover);
  background: var(--hero-cta-gradient-hover);
}

.hero__cta-gold:active {
  transform: translateY(1px);
  box-shadow: var(--hero-cta-shadow-active);
  transition-duration: var(--dda-duration-instant);
}

.hero__cta-gold:focus-visible {
  outline: none;
  box-shadow: var(--hero-cta-focus-shadow);
}

.hero__cta-gold-arrow {
  font-style: normal;
  color: var(--dda-slate-950);
}

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

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

.hero__rule {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 1px;
  z-index: var(--dda-z-content);
  background: linear-gradient(
    90deg,
    transparent 5%,
    var(--dda-teal-600-a12) 25%,
    var(--dda-teal-600-a12) 75%,
    transparent 95%
  );
}

.hero__scroll-cue {
  position: absolute;
  bottom: var(--dda-size-10);
  left: 50%;
  transform: translateX(-50%);
  width: 1px;
  height: 48px;
  overflow: hidden;
  opacity: 0;
  animation: cueAppear var(--dda-duration-slow) ease 3.2s forwards;
  z-index: var(--dda-z-content);
}

.hero__scroll-cue::after {
  content: '';
  position: absolute;
  top: -48px;
  left: 0;
  width: 1px;
  height: 48px;
  background: linear-gradient(
    180deg,
    transparent 0%,
    var(--color-interactive-default) 80%,
    transparent 100%
  );

  animation: cueDescend 2.8s cubic-bezier(0.4, 0, 0.2, 1) 3.8s infinite;
}

@keyframes cueAppear {
  to {
    opacity: 0.45;
  }
}

@keyframes cueDescend {
  0% {
    top: -48px;
  }
  50% {
    top: 48px;
  }
  100% {
    top: 48px;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  .hero__headline,
  .hero__continuation,
  .hero__cta-gold,
  .header__logo,
  .header__nav,
  .hero__scroll-cue {
    opacity: 1;
    transform: none;
  }
}

.gray-zone {
  position: relative;
  width: 100%;
}

.recognition-stage {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 130vh;
  margin-top: -130vh;
}

.recognition-stage__sticky {
  position: sticky;
  top: 0;
  width: 100%;
  height: 100vh;
  height: 100dvh;
  overflow: hidden;
}

.gray-zone__block--recognition {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: var(--color-surface-0);
  color: var(--color-text-100);
  isolation: isolate;
}

.gray-zone__bg-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;

  object-position: 63% 50%;
  z-index: 0;
  user-select: none;
  -webkit-user-drag: none;

  top: calc(var(--header-height) / 2);
}

.gray-zone__overlay {
  position: absolute;
  inset: 0;

  background:
    linear-gradient(
      180deg,
      rgba(10, 15, 30, 0.85) 0%,
      rgba(10, 15, 30, 0.78) 20%,
      rgba(10, 15, 30, 0.62) 36%,
      rgba(10, 15, 30, 0.35) 48%,
      rgba(10, 15, 30, 0.35) 72%,
      rgba(10, 15, 30, 0.62) 84%,
      rgba(10, 15, 30, 0.92) 100%
    );
  z-index: 1;
  pointer-events: none;
}

.gray-zone__block--recognition .gray-zone__block-content {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 1400px;
  min-height: 100%;
  margin: 0 auto;

  padding:
    calc(var(--header-height) + var(--dda-size-6))
    var(--spacing-section-gutter)
    clamp(var(--dda-size-4), 3vh, var(--dda-size-8));
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  text-align: center;
  box-sizing: border-box;
}

.gray-zone__top,
.gray-zone__bottom {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

.gray-zone__top {
  gap: var(--dda-size-6);
}

.gray-zone__bottom {
  gap: var(--dda-size-5);
}

.gray-zone__block--recognition .gray-zone__beats {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--dda-size-4);
  max-width: var(--content-max-display);
}

.gray-zone__block--two-paths {
  position: relative;
  width: 100%;
  background: var(--color-surface-light);
  color: var(--color-text-light-100);

  padding: clamp(var(--dda-size-10), 5vh, var(--dda-size-14)) 0 clamp(var(--dda-size-3), 2vh, var(--dda-size-5));
}

.gray-zone__block--two-paths .gray-zone__block-content {
  max-width: 1600px;
  margin: 0 auto;

  padding: 0 var(--spacing-section-gutter-narrow);
  display: flex;
  flex-direction: column;
  align-items: center;
}

.gray-zone__block--two-paths .gray-zone__headline {
  margin: 0 0 clamp(var(--dda-size-6), 4vh, var(--dda-size-12)) 0;
  max-width: var(--content-max-display);
  text-align: center;
}

.gray-zone__paths {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(var(--dda-size-4), 2vw, var(--dda-size-8));
  width: 100%;
  max-width: 1500px;
}

.gray-zone__path {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  background: var(--color-surface-0);
  border: none;
  border-radius: var(--dda-radius-card);
  overflow: hidden;
  min-height: clamp(580px, 70vh, 740px);
}

.gray-zone__path:nth-child(odd) {
  flex-direction: row-reverse;
}

.gray-zone__path-body {
  flex: 1 1 50%;
  padding: clamp(var(--dda-size-3), 1vw, var(--dda-size-4));
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.gray-zone__path-text {
  font-family: var(--dda-font-body);
  font-weight: 400;
  font-size: clamp(1rem, 1.2vw, 1.18rem);
  line-height: 1.55;
  letter-spacing: -0.008em;
  color: var(--color-text-80);
  margin: 0;
  text-wrap: pretty;
}

.gray-zone__path-lead {
  font-weight: 500;
  color: var(--color-text-100);
}

.gray-zone__path-media {
  flex: 0 0 50%;
  overflow: hidden;
  background: var(--dda-slate-850);
}

.gray-zone__path-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}

.gray-zone__path-img--left {
  object-position: 30% center;
}

.gray-zone__block--two-paths .gray-zone__beat--conclusion {
  font-weight: 500;
  font-size: clamp(2rem, 3.6vw, 2.8rem);
  line-height: 1.15;
  letter-spacing: -0.02em;
  max-width: var(--content-max-display);
  margin-top: clamp(var(--dda-size-3), 2vh, var(--dda-size-5));
  text-align: center;
  text-wrap: balance;
}

@media (max-width: 767px) {
  .gray-zone__paths {
    grid-template-columns: 1fr;
    gap: var(--dda-size-14);
  }

  .gray-zone__path,
  .gray-zone__path:nth-child(odd) {
    flex-direction: column;
    min-height: 0;
  }

  .gray-zone__path-media {
    order: -1;
    flex: 0 0 auto;
    aspect-ratio: 16 / 10;
  }

  .gray-zone__path-body {
    flex: 0 0 auto;
    padding: clamp(var(--dda-size-8), 6vw, var(--dda-size-12));
  }
}

.gray-zone__headline {
  font-family: var(--dda-font-body);
  font-weight: 600;
  font-size: var(--dda-text-3xl);
  line-height: var(--dda-leading-tight);
  letter-spacing: var(--dda-tracking-tight);
  text-wrap: balance;
  margin: 0;
}

.gray-zone__block--recognition .gray-zone__headline {
  color: var(--color-text-on-photo);

  max-width: var(--content-max-display);

  font-size: min(
    clamp(2.4rem, 4vw, 3.8rem),
    clamp(1.75rem, calc(-8.55rem + 25vh), 3.8rem)
  );
}

.gray-zone__block--two-paths .gray-zone__headline {
  color: var(--color-text-light-100);
}

.gray-zone__beat {
  font-family: var(--dda-font-body);
  font-weight: 400;
  font-size: 1.0625rem;
  letter-spacing: 0.003em;
  margin: 0;
  text-wrap: pretty;
}

.gray-zone__block--recognition .gray-zone__beat {
  color: var(--color-text-on-photo-90);

  font-size: min(
    clamp(1.15rem, 1.45vw, 1.35rem),
    clamp(0.9rem, calc(-5.35rem + 15vh), 1.35rem)
  );
  line-height: 1.55;
  letter-spacing: -0.008em;
  max-width: var(--content-max-display);
}

.gray-zone__block--recognition .gray-zone__beat--lead-in {
  color: var(--color-text-on-photo-95);
  max-width: var(--content-max-display);
}

.gray-zone__block--recognition .gray-zone__beat--promoted {
  font-family: var(--dda-font-body);
  font-weight: 500;
  font-size: clamp(2rem, 3.6vw, 2.8rem);
  line-height: 1.15;
  letter-spacing: -0.02em;
  color: var(--color-text-on-photo-92);
  max-width: 30ch;
  text-wrap: balance;
}

.gray-zone__block--two-paths .gray-zone__beat {
  color: var(--color-text-light-60);
  line-height: 1.6;
}

.gray-zone__block--two-paths .gray-zone__beat--conclusion {
  color: var(--color-text-light-100);
}

.gray-zone [data-reveal],
.recognition-stage [data-reveal] {
  opacity: 0;
  transform: translateY(8px);
  transition:
    opacity var(--dda-duration-slow) var(--dda-ease-out-expo),
    transform var(--dda-duration-slow) var(--dda-ease-out-expo);
  transition-delay: var(--reveal-delay, 0ms);
}

.gray-zone__block.is-visible [data-reveal] {
  opacity: 1;
  transform: translateY(0);
}

.gray-zone__block--recognition [data-reveal] {
  filter: blur(6px);
  transition:
    opacity var(--dda-duration-slow) var(--dda-ease-out-expo),
    transform var(--dda-duration-slow) var(--dda-ease-out-expo),
    filter var(--dda-duration-slow) var(--dda-ease-out-expo);
  transition-delay: var(--reveal-delay, 0ms);
}

.gray-zone__block--recognition.is-visible [data-reveal] {
  filter: blur(0);
}

.gray-zone__block--recognition [data-reveal].gray-zone__beat--promoted {
  transition:
    opacity var(--dda-duration-slow) var(--dda-ease-out-expo) var(--reveal-delay, 0ms),
    transform var(--dda-duration-slow) var(--dda-ease-out-expo) var(--reveal-delay, 0ms),
    filter var(--dda-duration-slow) var(--dda-ease-out-expo) var(--reveal-delay, 0ms),
    color 700ms var(--dda-ease-out-expo) calc(var(--reveal-delay, 0ms) + 500ms);
}

.gray-zone__block--recognition.is-visible .gray-zone__beat--promoted {
  color: var(--dda-steel-400);
}

@media (max-width: 767px) {

  .gray-zone__bg-image {
    object-position: center center;
  }

  .gray-zone__overlay {
    background:
      linear-gradient(
        180deg,
        rgba(10, 15, 30, 0.88) 0%,
        rgba(10, 15, 30, 0.82) 25%,
        rgba(10, 15, 30, 0.70) 44%,
        rgba(10, 15, 30, 0.35) 56%,
        rgba(10, 15, 30, 0.35) 74%,
        rgba(10, 15, 30, 0.72) 85%,
        rgba(10, 15, 30, 0.95) 100%
      );
  }

  .gray-zone__block--recognition .gray-zone__block-content {

    padding-bottom: max(
      clamp(var(--dda-size-8), calc(-150px + 27.7vh), var(--dda-size-20)),
      calc(env(safe-area-inset-bottom) + var(--dda-size-1))
    );
  }

  .gray-zone__block--recognition .gray-zone__beats {
    max-width: none;
  }

  .gray-zone__beat--promoted {
    max-width: 14ch;
  }
}

.false-binary {
  position: relative;
  width: 100%;

  background: var(--color-surface-1);
  color: var(--color-text-100);
  padding:
    clamp(var(--dda-size-12), 7vh, var(--dda-size-16))
    0
    clamp(var(--dda-size-10), 6vh, var(--dda-size-14));

  border-top: 1px solid var(--color-border-hairline);
}

.false-binary__stage {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 var(--spacing-section-gutter);
  display: grid;

  grid-template-columns: minmax(0, 5fr) minmax(0, 4fr);
  column-gap: clamp(var(--dda-size-12), 6vw, var(--dda-size-24));
  align-items: start;
  box-sizing: border-box;
}

.false-binary__lede {
  padding-right: clamp(var(--dda-size-4), 2vw, var(--dda-size-8));
  padding-top: clamp(var(--dda-size-10), 3vw, var(--dda-size-14));
}

.false-binary__headline {
  font-family: var(--dda-font-body);
  font-weight: 500;
  font-size: var(--dda-text-3xl);
  line-height: 1.08;
  letter-spacing: var(--dda-tracking-snug);

  color: var(--color-text-80);
  max-width: 16ch;
  margin: 0;
}

.false-binary__headline-line1,
.false-binary__headline-line2 {
  display: block;
  opacity: 0;
  transform: translateY(8px);
  transition:
    opacity var(--dda-duration-slow) var(--dda-ease-out-expo),
    transform var(--dda-duration-slow) var(--dda-ease-out-expo);
}

.false-binary__headline-line2 {
  color: var(--color-text-100);
}

.false-binary__body {

  padding-top: clamp(var(--dda-size-2), 1vw, var(--dda-size-3));
  max-width: var(--content-measure-narrow);
}

.false-binary__beat {
  font-family: var(--dda-font-body);
  font-weight: 400;
  font-size: clamp(1.08rem, 1.15vw, 1.2rem);
  line-height: 1.55;
  letter-spacing: -0.005em;
  color: var(--color-text-80);
  margin: 0;
  text-wrap: pretty;
  opacity: 0;
  transform: translateY(8px);
  transition:
    opacity var(--dda-duration-slow) var(--dda-ease-out-expo),
    transform var(--dda-duration-slow) var(--dda-ease-out-expo);
}

.false-binary__beat + .false-binary__beat {
  margin-top: clamp(var(--dda-size-5), 2vw, var(--dda-size-8));
}

.false-binary__term {
  color: var(--color-text-100);
  letter-spacing: 0.005em;
}

.false-binary__lead {
  color: var(--color-text-100);
}

.false-binary.is-visible .false-binary__headline-line1 {
  opacity: 1;
  transform: none;
  transition-delay: 80ms;
}

.false-binary.is-visible .false-binary__headline-line2 {
  opacity: 1;
  transform: none;
  transition-delay: 200ms;
}

.false-binary.is-visible .false-binary__beat--1 {
  opacity: 1;
  transform: none;
  transition-delay: 680ms;
}

.false-binary.is-visible .false-binary__beat--2 {
  opacity: 1;
  transform: none;
  transition-delay: 840ms;
}

@media (max-width: 767px) {
  .false-binary__stage {
    grid-template-columns: 1fr;
    row-gap: clamp(var(--dda-size-8), 5vh, var(--dda-size-12));
  }

  .false-binary__lede {
    padding-right: 0;
  }

  .false-binary__body {
    padding-top: 0;
    max-width: none;
  }

  .false-binary__headline {
    max-width: none;

    font-size: clamp(1.85rem, 8vw, 2.2rem);
  }

  .false-binary__headline-line1,
  .false-binary__headline-line2 {
    text-wrap: balance;
  }
}

@media (prefers-reduced-motion: reduce) {
  .false-binary__headline-line1,
  .false-binary__headline-line2,
  .false-binary__beat {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

.method {
  position: relative;
  width: 100%;
  background: var(--color-surface-light);
  color: var(--color-text-light-60);

  padding:
    clamp(var(--dda-size-10), 5vh, var(--dda-size-14))
    var(--spacing-section-gutter)
    clamp(var(--dda-size-8), 4vh, var(--dda-size-12));
  scroll-margin-top: var(--header-height);
}

.method__stage {
  position: relative;
  width: 100%;
  max-width: var(--method-stage-max);
  margin: 0 auto;
}

.method__section-headline {
  font-family: var(--dda-font-body);
  font-weight: 600;
  font-size: var(--dda-text-3xl);
  line-height: var(--dda-leading-tight);
  letter-spacing: var(--dda-tracking-tight);
  color: var(--color-text-light-100);
  text-align: center;
  text-wrap: balance;

  margin: 0 0 clamp(var(--dda-size-6), 3vh, var(--dda-size-10)) 0;
}

.method__lede {
  display: flex;
  flex-direction: column;
  gap: var(--dda-size-2);
}

.method__intro {
  font-family: var(--dda-font-body);
  font-weight: 600;
  font-size: var(--dda-text-xl);
  line-height: var(--dda-leading-snug);
  letter-spacing: var(--dda-tracking-snug);
  color: var(--method-text-primary);
  max-width: var(--content-measure);
  margin: 0;
  text-wrap: balance;
}

.method__parent {
  width: 100%;
  background: var(--method-surface-container);
  border: 1px solid var(--method-outline);
  border-radius: var(--method-parent-radius);
  box-shadow: var(--method-shadow-parent);
  padding: clamp(var(--dda-size-6), 4vw, var(--dda-size-12));
  display: flex;
  flex-direction: column;
  gap: clamp(var(--dda-size-10), 6vw, var(--dda-size-16));
}

.method__pillars {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--dda-size-6);
  width: 100%;
}

.method__pillar {
  display: flex;
  flex-direction: column;
  gap: var(--dda-size-3);
  padding: var(--dda-size-6);
  border: 1px solid var(--method-outline);
  border-radius: var(--method-card-radius);
  background: var(--method-card-regulate);
}
.method__pillar[data-pillar="regulate"] { background: var(--method-card-regulate); }
.method__pillar[data-pillar="debug"]    { background: var(--method-card-debug); }
.method__pillar[data-pillar="track"]    { background: var(--method-card-track); }

.method__pillar-name {
  font-family: var(--dda-font-body);
  font-weight: 600;

  font-size: var(--dda-text-xl);
  line-height: var(--dda-leading-snug);
  letter-spacing: var(--dda-tracking-snug);
  color: var(--method-text-primary);
  margin: 0;
  text-wrap: balance;
}

.method__pillar-body {
  font-family: var(--dda-font-body);
  font-weight: 400;
  font-size: var(--dda-text-sm);
  line-height: var(--dda-leading-normal);
  color: var(--method-text-muted);
  margin: 0;
  text-wrap: pretty;
}

.method__video {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--dda-size-8);
  width: 100%;
  margin: 0;
}

.method__video-label {
  font-family: var(--dda-font-signage);
  font-size: var(--dda-text-xs);
  text-transform: uppercase;
  letter-spacing: var(--dda-tracking-widest);
  color: var(--method-text-variant);
}

.method__video-frame {
  position: relative;
  width: 100%;
  max-width: var(--method-video-max);
  aspect-ratio: 16 / 9;
  background: var(--method-surface);
  border: 1px solid var(--method-outline);
  border-radius: var(--method-card-radius);
  overflow: hidden;
}

.method__video-iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}

.method__video-caption {
  font-family: var(--dda-font-signage);
  font-size: var(--dda-text-xs);
  line-height: var(--dda-leading-snug);
  letter-spacing: var(--dda-tracking-widest);
  text-transform: uppercase;
  text-align: center;
}

.method__video-caption a {
  display: inline-block;

  padding: var(--dda-size-4) 0;
  color: var(--method-accent-bright);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: border-color var(--duration-hover) var(--ease-ui), color var(--duration-hover) var(--ease-ui);
  touch-action: manipulation;
  -webkit-tap-highlight-color: color-mix(in oklch, var(--method-accent-bright) 15%, transparent);
}

.method__video-caption a:hover,
.method__video-caption a:focus-visible {
  color: var(--method-text-primary);
  border-bottom-color: var(--method-accent-bright);
}

.method__video-caption a:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px var(--method-surface), 0 0 0 4px var(--method-accent-bright);
  border-radius: var(--dda-radius-1);
}

.method__dashboard {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--dda-size-8);
  margin-top: clamp(var(--dda-size-10), 7vh, var(--dda-size-16));
}

.method__dashboard-label {
  font-family: var(--dda-font-signage);
  font-size: var(--dda-text-xs);
  text-transform: uppercase;
  letter-spacing: var(--dda-tracking-widest);
  color: var(--color-text-light-60);
  text-align: center;
}

.method__dashboard-frame {
  position: relative;
  width: 100%;
  max-width: var(--method-dashboard-max);

  background: var(--method-dashboard-mat);
  border: 1px solid var(--method-dashboard-mat-border);
  border-radius: var(--method-card-radius);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.04) inset,
    0 14px 40px rgba(0, 0, 0, 0.55),
    0 2px 6px rgba(0, 0, 0, 0.35);

  padding: clamp(4px, 0.4vw, 6px);
  display: flex;
  align-items: stretch;
  justify-content: center;
  overflow: hidden;
}

.method__dashboard-screen {
  flex: 1;
  background: var(--method-surface-container);
  border-radius: calc(var(--method-card-radius) - 3px);
  padding: clamp(var(--dda-size-3), 1.6vw, var(--dda-size-5));
  display: flex;
  align-items: center;
  justify-content: center;
}

.method__dashboard-image {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--dda-radius-1);
}

.method__close {
  margin-top: clamp(var(--dda-size-8), 5vh, var(--dda-size-12));
  text-align: center;
}

.method__close-line {
  font-family: var(--dda-font-body);
  font-weight: 400;
  font-size: clamp(var(--dda-text-xl), 2vw, var(--dda-text-2xl));
  line-height: var(--dda-leading-tight);
  color: var(--color-text-light-100);
  max-width: var(--content-measure);
  margin: 0 auto;
  text-wrap: pretty;
}

.method__close-accent {
  color: var(--color-accent);
  font-style: normal;
}

.method [data-reveal] {
  opacity: 0;
  transform: translateY(var(--dda-size-3));
  transition:
    opacity var(--duration-reveal) var(--ease-reveal) var(--reveal-delay, 0ms),
    transform var(--duration-reveal) var(--ease-reveal) var(--reveal-delay, 0ms);
}

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

@media (max-width: 1023px) {
  .method__pillars {
    gap: var(--dda-size-4);
  }
}

@media (max-width: 767px) {
  .method__pillars {
    grid-template-columns: 1fr;
  }
  .method__parent {
    padding: var(--dda-size-6);
  }
  .method__dashboard {
    margin-top: clamp(var(--dda-size-12), 10vh, var(--dda-size-16));
  }
  .method__close {
    margin-top: clamp(var(--dda-size-10), 8vh, var(--dda-size-16));
  }
}

.founders {
  position: relative;
  width: 100%;
  background: var(--founders-surface);
  color: var(--method-text-muted);
  padding:
    var(--spacing-section-pad-top)
    var(--spacing-section-gutter)
    clamp(var(--dda-size-8), 5vh, var(--dda-size-12));
  scroll-margin-top: var(--header-height);
  overflow: hidden;
}

.founders__stage {
  position: relative;
  width: 100%;
  max-width: var(--founders-stage-max);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: clamp(var(--dda-size-8), 4vw, var(--dda-size-12));
}

.founders__card {
  position: relative;
  border-radius: var(--founders-card-radius);
  padding: clamp(var(--dda-size-8), 5vw, var(--dda-size-16));
  box-shadow: var(--founders-shadow);
  overflow: hidden;
}

.founders__card--light {
  background: var(--founders-card-light);
  color: var(--founders-card-light-text);
  border: 1px solid var(--founders-card-light-border);
}

.founders__card--dark {
  background: var(--founders-card-dark);
  color: var(--founders-card-dark-text);
  border: 1px solid var(--founders-card-dark-border);
}

.founders__section-headline {
  font-family: var(--dda-font-body);
  font-weight: 600;
  font-size: var(--dda-text-3xl);
  line-height: var(--dda-leading-tight);
  letter-spacing: var(--dda-tracking-tight);
  color: var(--method-text-primary);
  text-align: center;
  text-wrap: balance;
  margin: 0;
}

.founders__headline {
  font-family: var(--dda-font-body);
  font-weight: 600;
  font-size: var(--dda-text-3xl);
  line-height: var(--method-headline-leading);
  letter-spacing: var(--dda-tracking-snug);
  margin: 0 0 clamp(var(--dda-size-8), 4vw, var(--dda-size-12)) 0;
  text-wrap: balance;
}

.founders__card--light .founders__headline {
  color: var(--founders-card-light-text);
}

.founders__card--dark .founders__headline {
  color: var(--founders-card-dark-text);
}

.founders__headline--right {
  text-align: right;
}

.founders__accent {
  font-style: normal;
}

.founders__card--light .founders__accent {
  color: var(--founders-card-light-accent);
}

.founders__card--dark .founders__accent {
  color: var(--founders-card-dark-accent);
}

.founders__row {
  display: grid;
  grid-template-columns: minmax(260px, 4fr) minmax(0, 8fr);
  gap: clamp(var(--dda-size-8), 4vw, var(--dda-size-16));
  align-items: start;
}

.founders__row--mirror {
  grid-template-columns: minmax(0, 8fr) minmax(260px, 4fr);
}

.founders__portrait {
  position: relative;
  margin: 0;
  width: 100%;
  aspect-ratio: 7 / 9;
  background: var(--method-surface);
  overflow: hidden;
  outline: 1px solid var(--color-border-subtle);
  outline-offset: -1px;
}

.founders__card--light .founders__portrait {
  outline-color: var(--founders-card-light-border);
}

.founders__portrait img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.founders__bio {
  display: flex;
  flex-direction: column;
  padding-top: clamp(var(--dda-size-2), 2vw, var(--dda-size-12));
}

.founders__bio--right {
  text-align: left;
}

@media (min-width: 768px) {
  .founders__bio--right {
    text-align: right;
  }
}

.founders__folio {
  font-family: var(--dda-font-signage);
  font-size: var(--dda-text-xs);
  text-transform: uppercase;
  letter-spacing: var(--dda-tracking-widest);
  margin-bottom: var(--dda-size-4);
}

.founders__card--light .founders__folio {
  color: var(--founders-card-light-muted);
}

.founders__card--dark .founders__folio {
  color: var(--founders-card-dark-mono);
}

.founders__name {
  font-family: var(--dda-font-body);
  font-size: var(--method-card-name-size);
  font-weight: 600;
  line-height: var(--dda-leading-snug);
  letter-spacing: var(--dda-tracking-snug);
  margin: 0 0 var(--dda-size-6) 0;
}

.founders__card--light .founders__name {
  color: var(--founders-card-light-text);
}

.founders__card--dark .founders__name {
  color: var(--founders-card-dark-text);
}

.founders__body {
  font-family: var(--dda-font-body);
  font-size: var(--dda-text-base);
  line-height: var(--dda-leading-relaxed);
  margin: 0 0 var(--dda-size-6) 0;
  max-width: 56ch;
  text-wrap: pretty;
}

.founders__body:last-child {
  margin-bottom: 0;
}

.founders__card--light .founders__body {
  color: var(--founders-card-light-muted);
}

.founders__card--dark .founders__body {
  color: var(--founders-card-dark-muted);
}

@media (min-width: 768px) {
  .founders__bio--right .founders__body {
    margin-left: auto;
  }
}

.founders__together {
  font-family: var(--dda-font-body);
  font-weight: 400;
  font-size: clamp(var(--dda-text-xl), 2vw, var(--dda-text-2xl));
  line-height: var(--dda-leading-tight);
  color: var(--method-text-primary);
  text-align: center;
  margin: var(--dda-size-2) auto 0;
  padding: var(--dda-size-2) 0;
  max-width: 56ch;
  text-wrap: pretty;
}

.founders__together-accent {
  color: var(--dda-steel-400);
  font-style: normal;
}

.founders [data-reveal] {
  opacity: 0;
  transform: translateY(var(--dda-size-3));
  transition:
    opacity var(--duration-reveal) var(--ease-reveal) var(--reveal-delay, 0ms),
    transform var(--duration-reveal) var(--ease-reveal) var(--reveal-delay, 0ms);
}

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

@media (max-width: 1023px) {
  .founders__row {
    grid-template-columns: minmax(220px, 4fr) minmax(0, 8fr);
    gap: var(--dda-size-8);
  }
  .founders__row--mirror {
    grid-template-columns: minmax(0, 8fr) minmax(220px, 4fr);
  }
}

@media (max-width: 767px) {
  .founders__row,
  .founders__row--mirror {
    grid-template-columns: 1fr;
    gap: var(--dda-size-6);
  }

  .founders__row--mirror .founders__bio { order: 2; }
  .founders__row--mirror .founders__portrait { order: 1; }
  .founders__card {
    padding: var(--dda-size-6);
  }
  .founders__headline--right {
    text-align: left;
  }
  .founders__bio--right {
    text-align: left;
  }
  .founders__bio--right .founders__body {
    margin-left: 0;
  }
  .founders__portrait {
    max-width: 360px;
    margin: 0 auto;
  }
}

.proof {
  position: relative;
  width: 100%;
  background: var(--color-surface-light);
  color: var(--color-text-light-100);
  padding:
    var(--spacing-section-pad-top)
    var(--spacing-section-gutter)
    var(--spacing-section-pad-bottom);
  scroll-margin-top: var(--header-height);
  overflow: hidden;
}

.proof__stage {
  position: relative;
  width: 100%;
  max-width: var(--method-stage-max);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: clamp(var(--dda-size-16), 9vh, var(--dda-size-24));
}

.proof__headline {
  font-family: var(--dda-font-body);
  font-weight: 600;
  font-size: var(--dda-text-4xl);
  line-height: var(--dda-leading-tight);
  letter-spacing: var(--dda-tracking-tight);
  color: var(--color-text-light-100);
  text-align: center;
  text-wrap: balance;
  max-width: 18ch;
  margin: 0 auto;
}

.proof__layer {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: clamp(var(--dda-size-8), 4vh, var(--dda-size-12));
}

.proof__layer-eyebrow {
  display: flex;
  align-items: center;
  gap: var(--dda-size-3);
  margin: 0;
}

.proof__layer-rule {
  display: inline-block;
  width: var(--dda-size-8);
  height: 1px;
  background: var(--color-accent);
  flex-shrink: 0;
}

.proof__layer-label {
  font-family: var(--dda-font-signage);
  font-size: var(--dda-text-xs);
  letter-spacing: var(--dda-tracking-widest);
  text-transform: uppercase;
  color: var(--color-text-light-60);
}

.proof__layer-frame {
  font-family: var(--dda-font-body);
  font-weight: 400;
  font-size: var(--dda-text-md);
  line-height: var(--dda-leading-relaxed);
  color: var(--color-text-light-60);
  max-width: 56ch;
  margin: 0;
  text-wrap: pretty;
}

.proof__numbers {
  width: 100%;
}

.proof__headline + .proof__numbers {
  margin-top: calc(-1 * clamp(var(--dda-size-8), 4vh, var(--dda-size-12)));
}

.proof__numbers-lead,
.proof__numbers-sublead,
.proof__layer-lead {
  font-family: var(--dda-font-body);
  font-weight: 500;
  font-size: var(--dda-text-2xl);
  line-height: 1.25;
  letter-spacing: var(--dda-tracking-snug);
  color: var(--color-text-light-100);
  text-align: center;
  text-wrap: balance;
}

.proof__layer-lead {
  margin: 0 auto;
  max-width: 56ch;
}

.proof__layer:has(> .proof__wall--facebook) .proof__layer-lead {
  text-wrap: wrap;
}

.proof__numbers-lead {
  margin: 0 0 clamp(var(--dda-size-6), 2vh, var(--dda-size-10));
}

.proof__numbers-sublead {

  margin: clamp(var(--dda-size-2), 1vh, var(--dda-size-4)) 0 0;
}

.proof__numbers-source,
.proof__layer-source {
  margin: clamp(var(--dda-size-6), 2.4vh, var(--dda-size-10)) 0 0;
  font-family: var(--dda-font-body);
  font-weight: 400;
  font-style: italic;
  font-size: var(--dda-text-sm);
  line-height: 1.45;
  color: var(--color-text-light-60);
  text-align: center;
  text-wrap: pretty;
}

.proof__footnote-mark {
  font-style: normal;
  margin-left: 0.15em;
  color: var(--color-text-light-60);
}

.proof__numbers-grid {
  --card-chamfer: 18px;
  --card-ring: 1.5px;

  --card-chamfer-inner: calc(var(--card-chamfer) - var(--card-ring) * 0.586);
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: clamp(var(--dda-size-4), 1.6vw, var(--dda-size-6));
  row-gap: clamp(var(--dda-size-4), 1.6vw, var(--dda-size-6));
  align-items: stretch;
  text-align: center;
}

.proof__numbers-grid .proof__metric:nth-child(1) { grid-column: 1 / span 2; grid-row: 1; }
.proof__numbers-grid .proof__metric:nth-child(2) { grid-column: 3 / span 2; grid-row: 1; }
.proof__numbers-grid .proof__metric:nth-child(3) { grid-column: 5 / span 2; grid-row: 1; }
.proof__numbers-grid .proof__numbers-sublead { grid-column: 1 / -1; grid-row: 2; }
.proof__numbers-grid .proof__metric:nth-child(5) { grid-column: 2 / span 2; grid-row: 3; }
.proof__numbers-grid .proof__metric:nth-child(6) { grid-column: 4 / span 2; grid-row: 3; }

.proof__metric {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--dda-size-3);
  padding: clamp(var(--dda-size-6), 2.4vw, var(--dda-size-10)) clamp(var(--dda-size-4), 1.6vw, var(--dda-size-6));
  background: var(--color-accent-gold);
  clip-path: polygon(
    var(--card-chamfer) 0,
    100% 0,
    100% calc(100% - var(--card-chamfer)),
    calc(100% - var(--card-chamfer)) 100%,
    0 100%,
    0 var(--card-chamfer)
  );
}

.proof__metric::before {
  content: '';
  position: absolute;
  inset: var(--card-ring);
  background: var(--dda-green-midnight);
  clip-path: polygon(
    var(--card-chamfer-inner) 0,
    100% 0,
    100% calc(100% - var(--card-chamfer-inner)),
    calc(100% - var(--card-chamfer-inner)) 100%,
    0 100%,
    0 var(--card-chamfer-inner)
  );
}

.proof__metric > * {
  position: relative;
}

.proof__metric-value {
  font-family: var(--dda-font-body);
  font-weight: 600;
  font-size: clamp(2.2rem, 3.6vw, 3.4rem);
  line-height: var(--dda-leading-tight);

  letter-spacing: -0.01em;
  color: var(--color-text-100);
  font-variant-numeric: tabular-nums;
}

.proof__metric-label {
  font-family: var(--dda-font-signage);
  font-size: var(--dda-text-xs);
  font-weight: 400;
  letter-spacing: var(--dda-tracking-widest);
  text-transform: uppercase;
  color: var(--color-text-100);
  line-height: var(--dda-leading-snug);
}

.proof__metric-meta {
  font-family: var(--dda-font-body);
  font-weight: 400;
  font-size: var(--dda-text-xs);
  line-height: var(--dda-leading-normal);
  color: var(--color-text-60);
  max-width: 22ch;
  text-wrap: pretty;
}

.proof__wall {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(var(--dda-size-3), 1.4vw, var(--dda-size-5));
  align-items: start;
}

.proof__col {
  display: flex;
  flex-direction: column;
  gap: clamp(var(--dda-size-3), 1.4vw, var(--dda-size-5));
  min-width: 0;
}

.proof__card {
  break-inside: avoid;
  background: var(--color-surface-light-card);
  border: 1px solid var(--color-border-light);
  border-radius: var(--dda-radius-card);
  overflow: hidden;
  box-shadow:
    0 1px 2px rgba(15, 23, 42, 0.04),
    0 8px 24px -12px rgba(15, 23, 42, 0.10);
}

.proof__card-image {
  display: block;
  width: 100%;
  height: auto;
}

.proof__card--placeholder {
  aspect-ratio: 4 / 5;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--color-surface-light-card);
  border: 1px dashed var(--color-border-light);
  box-shadow: none;
  margin: 0;
}

.proof__placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--dda-size-2);
  padding: var(--dda-size-6);
  text-align: center;
}

.proof__placeholder-tag {
  font-family: var(--dda-font-signage);
  font-size: var(--dda-text-xs);
  letter-spacing: var(--dda-tracking-widest);
  text-transform: uppercase;
  color: var(--color-text-light-muted);
}

.proof__placeholder-gloss {
  font-family: var(--dda-font-body);
  font-size: var(--dda-text-sm);
  line-height: var(--dda-leading-snug);
  color: var(--color-text-light-60);
  max-width: 22ch;
}

.proof__card--discord {
  background: var(--method-surface-container);
  color: var(--color-text-100);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: var(--dda-radius-card);
  padding: var(--dda-size-4) var(--dda-size-4) var(--dda-size-3);
  display: flex;
  flex-direction: column;
  gap: var(--dda-size-3);
  box-shadow:
    0 1px 2px rgba(15, 23, 42, 0.08),
    0 8px 24px -12px rgba(15, 23, 42, 0.18);
}

.proof__panels {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(var(--dda-size-5), 2vw, var(--dda-size-8));
  margin-top: clamp(var(--dda-size-8), 4vh, var(--dda-size-12));
  align-items: stretch;
}

.proof__wall + .proof__panels {
  margin-top: 0;
}

@media (max-width: 768px) {
  .proof__panels {
    grid-template-columns: 1fr;
  }
}

.proof__panel--discord {
  background: var(--method-surface-container);
  color: var(--color-text-100);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: var(--dda-radius-card);
  padding: var(--dda-size-6) var(--dda-size-6) var(--dda-size-5);
  display: flex;
  flex-direction: column;
  gap: var(--dda-size-4);
  box-shadow:
    0 1px 2px rgba(15, 23, 42, 0.08),
    0 12px 32px -14px rgba(15, 23, 42, 0.22);
}

.proof__discord-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--dda-size-3);
  padding-bottom: var(--dda-size-3);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  font-family: var(--dda-font-body);
  font-size: 0.78rem;
  letter-spacing: 0.01em;
  color: var(--dda-cool-white-a55);
}

.proof__discord-channel {
  display: inline-flex;
  align-items: center;
  font-weight: 600;
  color: var(--color-text-100);
}

.proof__discord-channel::before {
  content: '#';
  margin-right: var(--dda-size-1);
  color: var(--dda-cool-white-a45);
  font-weight: 400;
}

.proof__discord-domain {
  display: inline-flex;
  align-items: center;
  gap: var(--dda-size-2);
  font-family: var(--dda-font-signage);
  font-size: 0.62rem;
  letter-spacing: var(--dda-tracking-widest);
  text-transform: uppercase;
  color: var(--dda-red-500);
}

.proof__discord-domain::before {
  content: '';
  display: inline-block;
  width: 14px;
  height: 1px;
  background: currentColor;
  opacity: 0.7;
}

.proof__discord-message {
  margin: 0;
  font-family: var(--dda-font-body);
  font-size: 0.92rem;
  line-height: 1.6;
  color: var(--dda-cool-white-a92);
  letter-spacing: 0;
  flex: 1;
  text-wrap: pretty;
}

.proof__discord-message p {
  margin: 0 0 var(--dda-size-3);
}

.proof__discord-message p:last-child {
  margin-bottom: 0;
}

.proof__discord-message em {
  font-family: var(--dda-font-editorial);
  font-style: italic;
}

.proof__panel--discord .proof__discord-message {
  font-size: 0.95rem;
  line-height: 1.65;
}

.proof__domain {
  display: flex;
  flex-direction: column;
  gap: clamp(var(--dda-size-5), 2vw, var(--dda-size-8));
  margin-top: clamp(var(--dda-size-8), 4vh, var(--dda-size-12));
}

.proof__domain:first-of-type {
  margin-top: 0;
}

.proof__domain-header {
  font-family: var(--dda-font-signage);
  font-weight: 400;
  font-size: var(--dda-text-2xl);
  line-height: var(--dda-leading-tight);
  letter-spacing: var(--dda-tracking-tight);
  color: var(--color-text-light-100);
  margin: 0;
  text-transform: none;
}

.proof__loadmore {
  display: flex;
  justify-content: center;
  margin-top: var(--dda-size-4);
}

.proof__loadmore-button {
  appearance: none;
  background: transparent;
  border: 1px solid var(--color-border-light);
  border-radius: var(--dda-radius-pill);
  padding: var(--dda-size-3) var(--dda-size-6);
  min-height: var(--dda-size-11);
  font-family: var(--dda-font-signage);
  font-size: var(--dda-text-sm);
  letter-spacing: var(--dda-tracking-wide);
  text-transform: uppercase;
  color: var(--color-text-light-100);
  cursor: pointer;
  transition:
    background var(--dda-duration-fast) ease,
    border-color var(--dda-duration-fast) ease,
    color var(--dda-duration-fast) ease;
}

.proof__loadmore-button:hover,
.proof__loadmore-button:focus-visible {
  background: var(--color-surface-light-card);
  border-color: var(--color-text-light-60);
  color: var(--color-text-light-100);
  outline: none;
}

.proof__loadmore-button:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

.proof__loadmore-button:active {
  background: var(--color-border-light);
  border-color: var(--color-text-light-60);
  transition-duration: var(--dda-duration-instant);
}

.proof__loadmore-content[hidden] {
  display: none;
}

.proof__loadmore-content {
  display: block;
}

.proof__transition {
  font-family: var(--dda-font-body);
  font-weight: 400;
  font-size: var(--dda-text-2xl);
  line-height: var(--dda-leading-tight);
  letter-spacing: var(--dda-tracking-snug);
  color: var(--color-text-light-100);
  text-align: center;
  max-width: 56ch;
  margin: 0 auto;
  text-wrap: balance;
}

.proof__wrappeds {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(var(--dda-size-6), 2.4vw, var(--dda-size-10));
  align-items: start;
  justify-items: stretch;
  max-width: var(--method-stage-max);
  margin: 0 auto;
  width: 100%;
}

.proof__wrapped {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  margin: 0;
  width: 100%;
  position: relative;

  min-height: 720px;

  background: var(--method-surface-container);
  border: 1px solid var(--method-outline);
  border-radius: 3px;
  overflow: hidden;
}
.proof__wrapped.is-igrendered {
  background: transparent;
  border: none;
  overflow: visible;
}

.proof__wrapped.is-igfailed {
  min-height: 0;
}

.proof__wrapped .instagram-media {
  width: 100% !important;
  margin: 0 !important;
}

.proof__wrapped > .instagram-media,
.proof__wrapped > iframe {
  display: none;
}
.proof__wrapped.is-igrendered > iframe.instagram-media-rendered {
  display: block;
}

.proof__wrapped-fallback {
  display: none;
  flex-direction: column;
  width: 100%;
  text-decoration: none;
  color: inherit;
  background: var(--method-surface-container);
  overflow: hidden;
  animation: proof-wrapped-fallback-in 280ms ease-out;
}

.proof__wrapped.is-igfailed .proof__wrapped-fallback {
  display: flex;
}

.proof__wrapped.is-igrendered .proof__wrapped-fallback {
  display: none;
}

@keyframes proof-wrapped-fallback-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

.proof__wrapped-fallback-img {
  width: 100%;
  height: auto;
  display: block;
  aspect-ratio: 4 / 5;
  object-fit: cover;
}

.proof__wrapped-fallback-cta {
  display: block;
  text-align: center;
  padding: var(--dda-size-3) var(--dda-size-4);
  font-family: var(--dda-font-body);
  font-size: var(--dda-text-sm);
  font-weight: 500;
  letter-spacing: var(--dda-tracking-snug);
  color: var(--method-text-muted);
  background: var(--method-surface-container);
  border-top: 1px solid var(--method-outline);
  transition: color var(--dda-duration-fast) ease;
}

.proof__wrapped-fallback:hover .proof__wrapped-fallback-cta,
.proof__wrapped-fallback:focus-visible .proof__wrapped-fallback-cta {
  color: var(--method-text-primary);
}

.proof__wrapped-fallback:active .proof__wrapped-fallback-cta {
  background: var(--method-card-track);
  color: var(--method-text-primary);
  transition-duration: var(--dda-duration-instant);
}

.proof__videos {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(var(--dda-size-12), 8vh, var(--dda-size-20));
}

.proof__video {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--dda-size-5);
  margin: 0;
}

.proof__video--landscape .proof__video-caption,
.proof__video--landscape .proof__video-frame {
  width: 100%;
  max-width: 1000px;
}

.proof__video--portrait .proof__video-caption,
.proof__video--portrait .proof__video-frame {
  width: 100%;
  max-width: 480px;
}

.proof__video-caption {
  display: flex;
  flex-direction: column;
  gap: var(--dda-size-2);
  margin: 0;
  text-align: left;
  width: 100%;
}

.proof__video-name {
  font-family: var(--dda-font-body);
  font-weight: 600;
  font-size: var(--dda-text-md);
  line-height: var(--dda-leading-snug);
  letter-spacing: var(--dda-tracking-snug);
  color: var(--color-text-light-100);
  margin: 0;
}

.proof__video-summary {
  font-family: var(--dda-font-body);
  font-weight: 400;
  font-size: var(--dda-text-sm);
  line-height: var(--dda-leading-normal);
  color: var(--color-text-light-60);
  margin: 0;
  text-wrap: pretty;
}

.proof__video-frame {
  position: relative;
  background: var(--color-surface-0);
  border: 1px solid var(--color-border-light);
  border-radius: var(--dda-radius-card);
  box-shadow:
    0 1px 2px rgba(15, 23, 42, 0.04),
    0 14px 40px rgba(15, 23, 42, 0.12);
  overflow: hidden;
}

.proof__video--landscape .proof__video-frame {
  aspect-ratio: 16 / 9;
}

.proof__video--portrait .proof__video-frame {
  aspect-ratio: 9 / 16;
}

.proof__video-screen,
.proof__video-iframe {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  background: var(--color-surface-0);
  border: 0;
}

.proof__video-screen {
  padding: 0;
  cursor: pointer;
}

.proof__video-screen:focus-visible {
  outline: 2px solid var(--color-focus-ring);
  outline-offset: 4px;
}

.proof__video-poster {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
}

.proof__video-play {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}

.proof__video-play::before {
  content: '';
  width: clamp(56px, 6vw, 84px);
  height: clamp(56px, 6vw, 84px);
  border-radius: 50%;
  background: color-mix(in srgb, var(--color-text-light-100) 72%, transparent);
  border: 1px solid color-mix(in srgb, var(--dda-cool-white) 18%, transparent);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  transition: background var(--duration-hover) var(--ease-ui);
}

.proof__video-play::after {
  content: '';
  position: absolute;
  width: 0;
  height: 0;
  border-left: clamp(14px, 1.4vw, 20px) solid var(--dda-cool-white);
  border-top: clamp(10px, 1vw, 14px) solid transparent;
  border-bottom: clamp(10px, 1vw, 14px) solid transparent;
  margin-left: clamp(3px, 0.3vw, 5px);
}

.proof__video-screen:hover .proof__video-play::before,
.proof__video-screen:focus-visible .proof__video-play::before {
  background: color-mix(in srgb, var(--color-text-light-100) 88%, transparent);
}

.proof__wall--facebook {

}

.proof [data-reveal] {
  opacity: 0;
  transform: translateY(var(--dda-size-3));
  transition:
    opacity var(--duration-reveal) var(--ease-reveal) var(--reveal-delay, 0ms),
    transform var(--duration-reveal) var(--ease-reveal) var(--reveal-delay, 0ms);
}

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

@media (max-width: 1079px) {
  .proof__wrappeds {
    grid-template-columns: 1fr;
    max-width: 540px;
    gap: clamp(var(--dda-size-8), 5vh, var(--dda-size-12));
  }
}

@media (max-width: 1023px) {

  .proof__numbers-grid {
    grid-template-columns: 1fr;
    row-gap: clamp(var(--dda-size-4), 2vh, var(--dda-size-6));
    max-width: 520px;
    margin-inline: auto;
  }
  .proof__numbers-grid .proof__metric:nth-child(1),
  .proof__numbers-grid .proof__metric:nth-child(2),
  .proof__numbers-grid .proof__metric:nth-child(3),
  .proof__numbers-grid .proof__metric:nth-child(5),
  .proof__numbers-grid .proof__metric:nth-child(6),
  .proof__numbers-grid .proof__numbers-sublead {
    grid-column: 1;
    grid-row: auto;
  }
  .proof__wall {
    display: block;
    column-count: 2;
    column-gap: clamp(var(--dda-size-3), 1.4vw, var(--dda-size-5));
  }
  .proof__col {
    display: contents;
  }
  .proof__card {
    margin-bottom: clamp(var(--dda-size-3), 1.4vw, var(--dda-size-5));
  }
}

@media (max-width: 767px) {
  .proof__wall {
    column-count: 1;
  }
  .proof__wrappeds {

    max-width: 100%;
  }
  .proof__stage {
    gap: clamp(var(--dda-size-12), 8vh, var(--dda-size-20));
  }
}

.who {
  position: relative;
  background: var(--who-surface);

  padding:
    var(--spacing-section-pad-top)
    var(--spacing-section-gutter)
    var(--spacing-section-pad-bottom);
  scroll-margin-top: var(--header-height);
}

.who__stage {
  width: 100%;
  max-width: var(--who-stage-max);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: clamp(var(--dda-size-10), 5vh, var(--dda-size-16));
}

.who__lede {
  align-self: center;
  text-align: center;
}

.who__headline {
  font-family: var(--dda-font-body);
  font-weight: 600;

  font-size: clamp(1.2rem, 5.2vw, 3.5rem);
  letter-spacing: var(--dda-tracking-snug);
  line-height: var(--dda-leading-tight);
  color: var(--who-text-primary);
  text-align: center;
  white-space: nowrap;

  width: max-content;
  max-width: 100%;
  margin: 0 auto var(--dda-size-6);
}

.who__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(var(--dda-size-4), 2vw, var(--dda-size-8));
}

.who__panel {

  --who-chamfer: clamp(16px, 1.6vw, 24px);
  --who-frame: 1.5px;

  --who-chamfer-inner: calc(var(--who-chamfer) - var(--who-frame) * 0.586);
  position: relative;
  isolation: isolate;
  border-radius: 0;
  border: none;
  background: var(--color-accent-gold);
  clip-path: polygon(
    0 0,
    calc(100% - var(--who-chamfer)) 0,
    100% var(--who-chamfer),
    100% calc(100% - var(--who-chamfer)),
    calc(100% - var(--who-chamfer)) 100%,
    var(--who-chamfer) 100%,
    0 calc(100% - var(--who-chamfer))
  );

  padding:
    clamp(var(--dda-size-8), 5vw, var(--dda-size-16))
    clamp(var(--dda-size-5), 2.4vw, var(--dda-size-10));
  display: flex;
  flex-direction: column;
  gap: var(--dda-size-10);

  filter: drop-shadow(0 18px 36px rgba(0, 0, 0, 0.45));
}

.who__panel::before {
  content: '';
  position: absolute;
  inset: var(--who-frame);
  z-index: -1;
  background: var(--who-panel-bg);
  clip-path: polygon(
    0 0,
    calc(100% - var(--who-chamfer-inner)) 0,
    100% var(--who-chamfer-inner),
    100% calc(100% - var(--who-chamfer-inner)),
    calc(100% - var(--who-chamfer-inner)) 100%,
    var(--who-chamfer-inner) 100%,
    0 calc(100% - var(--who-chamfer-inner))
  );

  box-shadow: inset 0 1px 0 0 rgba(var(--who-accent-gold-rgb), 0.08);
}

.who__panel--for { --who-panel-bg: var(--who-panel-for); }
.who__panel--not { --who-panel-bg: var(--who-panel-not); }

.who__panel-eyebrow-row {
  display: flex;
  align-items: center;
  gap: var(--dda-size-3);
  margin: 0;
}

.who__panel-eyebrow-rule {
  display: inline-block;
  width: var(--dda-size-6);
  height: 1px;
  background: var(--who-accent-gold);
  opacity: 0.5;
  flex-shrink: 0;
}

.who__panel-eyebrow {
  font-family: var(--dda-font-signage);
  font-size: var(--dda-text-base);
  letter-spacing: var(--dda-tracking-widest);
  text-transform: uppercase;
  color: var(--who-accent-gold);
}

.who__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--dda-size-6);
}

.who__row {
  display: flex;
  gap: var(--dda-size-5);
  align-items: flex-start;
}

.who__row-num {
  flex-shrink: 0;
  width: var(--dda-size-8);
  font-family: var(--dda-font-signage);
  font-size: var(--dda-text-xs);
  letter-spacing: var(--dda-tracking-widest);
  text-transform: uppercase;
  color: var(--who-accent-gold);
  font-variant-numeric: tabular-nums;
  padding-top: var(--dda-size-1);
}

.who__row-body {
  flex: 1;
  font-family: var(--dda-font-body);
  font-size: var(--dda-text-md);
  line-height: var(--dda-leading-relaxed);
  color: var(--who-text-primary);
}

.who [data-reveal] {
  opacity: 0;
  transform: translateY(18px);
  transition:
    opacity var(--duration-reveal) var(--ease-reveal),
    transform var(--duration-reveal) var(--ease-reveal);
  transition-delay: var(--reveal-delay, 0ms);
}

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

@media (prefers-reduced-motion: reduce) {
  .who [data-reveal] {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

@media (max-width: 1023px) {
  .who__grid {
    grid-template-columns: 1fr;
    gap: var(--dda-size-6);
  }
  .who__headline {
    max-width: none;
  }
}

@media (max-width: 767px) {
  .who__stage {
    padding: 0 var(--dda-size-6);
  }
  .who__close {
    margin-top: var(--dda-size-10);
  }
}

.faq {
  position: relative;
  padding:
    var(--spacing-section-pad-top)
    var(--spacing-section-gutter)
    var(--spacing-section-pad-bottom);
  scroll-margin-top: var(--header-height);
}
.faq__stage {
  position: relative;
  width: 100%;
  max-width: var(--content-max-display);
  margin: 0 auto;
}

.faq__headline {
  font-family: var(--dda-font-body);
  font-weight: 600;

  font-size: clamp(1.5rem, 6.4vw, 3.8rem);
  line-height: var(--dda-leading-tight);
  letter-spacing: var(--dda-tracking-tight);
  color: var(--color-text-light-100);
  text-align: center;
  white-space: nowrap;
  max-width: none;
  margin: 0 auto clamp(var(--dda-size-10), 6vh, var(--dda-size-16));
}

.faq__item {
  border-bottom: 1px solid var(--color-border-light);
}
.faq__item:first-of-type {
  border-top: 1px solid var(--color-border-light);
}

.faq__trigger {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--dda-size-8);
  padding: var(--dda-size-6) 0;
  position: relative;
}
.faq__trigger::-webkit-details-marker { display: none; }
.faq__trigger::marker { content: ''; }
.faq__trigger:focus-visible {
  outline: none;
  box-shadow: var(--shadow-focus-light);
  border-radius: var(--dda-radius-2);
}

.faq__question {
  font-family: var(--dda-font-body);
  font-weight: 500;
  font-size: clamp(1.25rem, 1.6vw + 0.4rem, 1.75rem);
  line-height: 1.32;
  letter-spacing: var(--dda-tracking-snug);
  color: var(--color-text-light-100);
  flex: 1 1 auto;
  text-wrap: balance;
  margin: 0;
  padding-top: 2px;
}

.faq__indicator {
  position: relative;
  flex-shrink: 0;
  width: 22px;
  height: 22px;
  margin-top: var(--dda-size-2);
}
.faq__indicator::before,
.faq__indicator::after {
  content: '';
  position: absolute;
  background: var(--color-text-light-60);
  transition: opacity var(--duration-hover) var(--ease-ui), background var(--duration-hover) var(--ease-ui);
}
.faq__indicator::before { left: 0; right: 0; top: 50%; height: 1px; margin-top: -0.5px; }
.faq__indicator::after  { top: 0; bottom: 0; left: 50%; width: 1px;  margin-left: -0.5px; }

.faq__trigger:hover .faq__indicator::before,
.faq__trigger:hover .faq__indicator::after {
  background: var(--color-text-light-100);
}
.faq__item[open] .faq__indicator::after  { opacity: 0; }
.faq__item[open] .faq__indicator::before { background: var(--color-text-light-100); }

.faq__panel {
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  transition:
    max-height var(--duration-reveal) var(--ease-reveal),
    opacity var(--duration-reveal) var(--ease-reveal);
}
.faq__item[open] .faq__panel {
  opacity: 1;
  max-height: 1200px;
}
.faq__panel-inner {
  padding: 0 0 var(--dda-size-10) 0;
  max-width: 62ch;
}
.faq__panel-inner > p + p {
  margin-top: var(--dda-size-4);
}

.faq__answer {
  font-family: var(--dda-font-body);
  font-weight: 400;
  font-size: var(--dda-text-md);
  line-height: var(--dda-leading-relaxed);
  color: var(--color-text-light-60);
  text-wrap: pretty;
}

@media (max-width: 767px) {
  .faq__trigger {
    padding: var(--dda-size-5) 0;
    gap: var(--dda-size-4);
  }
  .faq__question {
    font-size: clamp(1.1rem, 1rem + 1.4vw, 1.35rem);
  }
  .faq__panel-inner {
    padding-bottom: var(--dda-size-8);
  }
  .faq__answer {
    font-size: var(--dda-text-base);
    line-height: var(--dda-leading-normal);
  }
}

@media (prefers-reduced-motion: reduce) {
  .faq__panel,
  .faq__indicator::before,
  .faq__indicator::after {
    transition: none !important;
  }
  .faq__item[open] .faq__panel {
    max-height: none !important;
  }
}

.site-footer {
  position: relative;
  background: var(--color-surface-0);
  padding: var(--dda-size-8) var(--dda-size-10);
  border-top: 1px solid var(--color-border-hairline);
  scroll-margin-top: var(--header-height);
}
.site-footer__stage {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--dda-size-6);
  max-width: 1240px;
  margin: 0 auto;
  text-align: center;
}
.site-footer__copyright {
  font-family: var(--dda-font-body);
  font-size: var(--dda-text-base);
  line-height: var(--dda-leading-normal);
  color: var(--color-text-80);
  margin: 0;
}
.site-footer__social {
  display: flex;
  align-items: center;
  gap: var(--dda-size-2);
}
.site-footer__social-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--dda-size-11);
  height: var(--dda-size-11);
  color: var(--color-text-60);
  border-radius: var(--dda-radius-2);
  transition: color var(--duration-hover) ease;
}
.site-footer__social-link:hover {
  color: var(--color-text-100);
}
.site-footer__social-link:focus-visible {
  outline: none;
  box-shadow: var(--shadow-focus);
}
.site-footer__social-link svg {
  width: var(--dda-size-5);
  height: var(--dda-size-5);
  display: block;
}

@media (max-width: 767px) {
  .site-footer {
    padding: var(--dda-size-6) var(--dda-size-6);
  }
}

@media (max-width: 767px) {

}

.section--light {
  background-color: var(--color-surface-light) !important;
  color: var(--color-text-light-100);
}

.section--light::before {
  display: none !important;
}

.section--light {
  border-top: 2px solid var(--color-accent);
}

@media (prefers-reduced-motion: reduce) {
  [data-reveal] {
    --reveal-delay: 0ms !important;
    transition-duration: 0.01ms !important;
    transition-delay: 0ms !important;
  }
}
