html {
        scroll-behavior: smooth;
      }

      .ti {
        display: inline-block;
        width: 1em;
        height: 1em;
        flex: 0 0 auto;
        fill: none;
        stroke: currentColor;
        stroke-width: 2;
        stroke-linecap: round;
        stroke-linejoin: round;
        vertical-align: -0.125em;
      }

      .icon-sprite {
        position: absolute;
        width: 0;
        height: 0;
        overflow: hidden;
      }

      @font-face {
        font-family: 'Inter';
        src: url('assets/fonts/Inter-VariableFont_opsz,wght.ttf') format('truetype');
        font-style: normal;
        font-weight: 100 900;
        font-display: swap;
      }

      @font-face {
        font-family: 'Inter';
        src: url('assets/fonts/Inter-Italic-VariableFont_opsz,wght.ttf') format('truetype');
        font-style: italic;
        font-weight: 100 900;
        font-display: swap;
      }

      @font-face {
        font-family: 'Space Grotesk';
        src: url('assets/fonts/SpaceGrotesk-VariableFont_wght.ttf') format('truetype');
        font-style: normal;
        font-weight: 300 700;
        font-display: swap;
      }

      @font-face {
        font-family: 'VT323';
        src: url('assets/fonts/VT323-Regular.ttf') format('truetype');
        font-style: normal;
        font-weight: 400;
        font-display: swap;
      }

      body {
        background-color: #0a0b0e;
        color: #ffffff;
        font-family: 'Inter', sans-serif;
      }
      .text-h1 { font-size: 72px; line-height: 1.1; letter-spacing: -0.04em; font-weight: 800; }
      .text-h2 { font-size: 48px; line-height: 1.2; letter-spacing: -0.03em; font-weight: 700; }
      .text-h3 { font-size: 32px; line-height: 1.3; letter-spacing: -0.02em; font-weight: 700; }
      .text-body-lg { font-size: 18px; line-height: 1.6; font-weight: 400; }
      .text-body-md { font-size: 16px; line-height: 1.6; font-weight: 400; }
      .text-label-caps { font-size: 14px; line-height: 1.0; letter-spacing: 0.1em; font-weight: 500; text-transform: uppercase; font-family: 'Space Grotesk', sans-serif; }

      .site-header {
        position: fixed;
        inset: 0 0 auto 0;
        z-index: 50;
        color: #ffffff;
        background: transparent;
        border: 0;
        backdrop-filter: none;
        transition: color 180ms var(--ease);
      }

      .site-header__inner {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 32px;
        min-height: 80px;
        max-width: 1280px;
        margin: 0 auto;
        padding: 0 24px;
      }

      .site-header__nav {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 34px;
        color: inherit;
      }

      .site-header__nav a,
      .site-header__cta {
        color: inherit;
        text-decoration: none;
        font-family: 'Space Grotesk', sans-serif;
        font-size: 0.78rem;
        letter-spacing: 0.1em;
        text-transform: uppercase;
        font-weight: 700;
        transition: opacity 180ms ease, transform 180ms ease, color 180ms ease;
      }

      .site-header__nav a:hover,
      .site-header__cta:hover {
        opacity: 0.72;
        transform: translateY(-1px);
      }

      .site-header__cta {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 44px;
        padding: 0 18px;
        color: #ffffff;
        background: linear-gradient(180deg, rgba(37, 99, 235, 0.98), rgba(23, 78, 212, 0.98));
        box-shadow: 0 14px 34px rgba(37, 99, 235, 0.2);
      }

      .site-header__toggle {
        display: none;
        position: relative;
        width: 48px;
        height: 48px;
        border: 1px solid currentColor;
        background: transparent;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        gap: 4px;
        padding: 0;
        color: #0a0b0e;
        border-radius: 0;
      }

      .site-header[data-theme="dark"] .site-header__toggle {
        background: transparent;
        border-color: rgba(255, 255, 255, 0.18);
        color: #ffffff;
      }

      .site-header[data-theme="light"] .site-header__toggle {
        background: transparent;
        border-color: rgba(10, 11, 14, 0.12);
        color: #0a0b0e;
      }

      .site-header__toggle span {
        display: block;
        width: 18px;
        height: 2px;
        background: currentColor;
        transition: transform 180ms ease, opacity 180ms ease;
      }

      .site-header__mobile {
        display: none;
      }

      .site-header__mobile-backdrop {
        display: none;
      }

      .site-header__mobile-panel {
        display: none;
      }

      .site-header-menu-open {
        overflow: hidden;
      }

      .site-header.is-menu-open .site-header__toggle span:nth-child(1) {
        transform: translateY(6px) rotate(45deg);
      }

      .site-header.is-menu-open .site-header__toggle span:nth-child(2) {
        opacity: 0;
      }

      .site-header.is-menu-open .site-header__toggle span:nth-child(3) {
        transform: translateY(-6px) rotate(-45deg);
      }

      .site-header[data-theme="light"] {
        color: #0a0b0e;
      }

      .site-header[data-theme="light"] .site-header__nav a {
        color: #0a0b0e;
      }

      .site-header[data-theme="dark"] .site-header__nav a {
        color: #ffffff;
      }

      @media (max-width: 768px) {
        .site-header__inner {
          justify-content: flex-end;
          min-height: 72px;
          gap: 0;
        }

        .site-header__cta {
          display: none;
        }

        .site-header__nav {
          display: none;
        }

        .site-header__toggle {
          display: inline-flex;
          width: 48px;
          height: 48px;
          border-radius: 0;
          background: transparent;
          backdrop-filter: none;
        }

        .site-header[data-theme="dark"] .site-header__toggle {
          border-color: rgba(255, 255, 255, 0.18);
          color: #ffffff;
        }

        .site-header[data-theme="light"] .site-header__toggle {
          border-color: rgba(10, 11, 14, 0.12);
          color: #0a0b0e;
        }

        .site-header__mobile {
          display: block;
          position: fixed;
          inset: 72px 0 0 0;
          pointer-events: none;
          opacity: 0;
          transition: opacity 180ms ease;
          z-index: 49;
        }

        .site-header.is-menu-open .site-header__mobile {
          pointer-events: auto;
          opacity: 1;
        }

        .site-header__mobile-backdrop {
          display: block;
          position: absolute;
          inset: 0;
          background: rgba(10, 11, 14, 0.48);
          backdrop-filter: blur(10px);
        }

        .site-header__mobile-panel {
          display: flex;
          position: relative;
          z-index: 1;
          flex-direction: column;
          gap: 10px;
          padding: 16px 20px 24px;
          border-top: 1px solid rgba(255, 255, 255, 0.08);
          background: rgba(10, 11, 14, 0.96);
          box-shadow: 0 24px 60px rgba(0, 0, 0, 0.28);
        }

        .site-header__mobile-panel a {
          display: flex;
          align-items: center;
          justify-content: space-between;
          min-height: 46px;
          padding: 0 6px;
          color: #ffffff;
          font-family: 'Space Grotesk', sans-serif;
          font-size: 0.88rem;
          font-weight: 700;
          letter-spacing: 0.12em;
          text-decoration: none;
          text-transform: uppercase;
          border-bottom: 1px solid rgba(255, 255, 255, 0.08);
        }

        .site-header__mobile-panel a:last-child {
          border-bottom: 0;
        }

        .site-header__mobile-panel .site-header__mobile-cta {
          margin-top: 2px;
          justify-content: center;
          min-height: 46px;
          color: #ffffff;
          background: linear-gradient(180deg, rgba(37, 99, 235, 0.98), rgba(23, 78, 212, 0.98));
          border: 0;
          box-shadow: 0 14px 34px rgba(37, 99, 235, 0.22);
        }
      }

      @property --button-border-angle {
        syntax: "<angle>";
        initial-value: 0deg;
        inherits: false;
      }

      @media (max-width: 768px) {
        .text-h1 { font-size: 40px; }
        .text-h2 { font-size: 32px; }
        .text-h3 { font-size: 24px; }
      }

      .grid-pattern {
        background-image: radial-gradient(circle at 1px 1px, #27272a 1px, transparent 0);
        background-size: 40px 40px;
      }

      .glass-card {
        background: rgba(255, 255, 255, 0.03);
        backdrop-filter: blur(12px);
        border: 1px solid rgba(37, 99, 235, 0.3);
        box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.37);
      }
      
      .glass-card:hover {
        border-color: rgba(37, 99, 235, 0.8);
        box-shadow: 0 0 20px rgba(37, 99, 235, 0.15);
      }

      .marquee {
        display: flex;
        overflow: hidden;
        user-select: none;
        gap: 2rem;
      }

      .marquee-content {
        flex-shrink: 0;
        display: flex;
        justify-content: space-around;
        min-width: 100%;
        gap: 2rem;
        animation: scroll 18s linear infinite;
      }

      @keyframes scroll {
        from { transform: translateX(0); }
        to { transform: translateX(-100%); }
      }

      .section-border {
        border-top: 1px solid rgba(39, 39, 42, 0.5);
      }

      .hero-fade-item {
        opacity: 0;
        transform: translateY(6px);
        filter: blur(6px);
        transition:
          opacity 0.4s ease-out,
          transform 0.4s ease-out,
          filter 0.4s ease-out;
        will-change: opacity, transform, filter;
      }

      .hero-fade-delay-350 {
        transition-delay: 0.35s;
      }

      .hero-fade-delay-500 {
        transition-delay: 0.5s;
      }

      .hero-fade-delay-650 {
        transition-delay: 0.65s;
      }

      .hero-fade-item.is-visible {
        opacity: 1;
        transform: translateY(0);
        filter: blur(0px);
      }

      html.reveal-ready [data-reveal] {
        opacity: 0;
        transform: translate3d(0, 28px, 0);
        filter: blur(10px);
        transition:
          opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1),
          transform 0.7s cubic-bezier(0.22, 1, 0.36, 1),
          filter 0.7s cubic-bezier(0.22, 1, 0.36, 1);
        transition-delay: var(--reveal-delay, 0ms);
        will-change: opacity, transform, filter;
      }

      .reveal-delay-40 {
        --reveal-delay: 40ms;
      }

      .reveal-delay-70 {
        --reveal-delay: 70ms;
      }

      .reveal-delay-80 {
        --reveal-delay: 80ms;
      }

      .reveal-delay-100 {
        --reveal-delay: 100ms;
      }

      .reveal-delay-120 {
        --reveal-delay: 120ms;
      }

      .reveal-delay-160 {
        --reveal-delay: 160ms;
      }

      .reveal-delay-180 {
        --reveal-delay: 180ms;
      }

      .reveal-delay-200 {
        --reveal-delay: 200ms;
      }

      .reveal-delay-250 {
        --reveal-delay: 250ms;
      }

      .reveal-delay-260 {
        --reveal-delay: 260ms;
      }

      .reveal-delay-280 {
        --reveal-delay: 280ms;
      }

      .reveal-delay-360 {
        --reveal-delay: 360ms;
      }

      html.reveal-ready [data-reveal].is-visible {
        opacity: 1;
        transform: translate3d(0, 0, 0);
        filter: blur(0);
      }

      html.reveal-ready [data-reveal="fade-left"] {
        transform: translate3d(-28px, 0, 0);
      }

      html.reveal-ready [data-reveal="fade-right"] {
        transform: translate3d(28px, 0, 0);
      }

      html.reveal-ready [data-reveal="scale-up"] {
        transform: scale(0.94);
      }

      html.reveal-ready [data-reveal="lift"] {
        transform: translate3d(0, 42px, 0);
      }

      @media (max-width: 768px) {
        html.reveal-ready [data-reveal] {
          transform: translate3d(0, 18px, 0);
          filter: blur(8px);
        }

        html.reveal-ready [data-reveal="fade-left"] {
          transform: translate3d(-16px, 0, 0);
        }

        html.reveal-ready [data-reveal="fade-right"] {
          transform: translate3d(16px, 0, 0);
        }

        html.reveal-ready [data-reveal="scale-up"] {
          transform: scale(0.97);
        }

        html.reveal-ready [data-reveal="lift"] {
          transform: translate3d(0, 24px, 0);
        }
      }

      @media (prefers-reduced-motion: reduce) {
        html.reveal-ready [data-reveal],
        .hero-fade-item {
          opacity: 1;
          transform: none;
          filter: none;
          transition: none;
          animation: none;
        }
      }

      .hero-landing {
        position: relative;
        min-height: min(860px, 100vh);
        display: flex;
        align-items: center;
        padding: clamp(132px, 12vw, 168px) 0 clamp(96px, 10vw, 132px);
        overflow: hidden;
        --hero-grid-x: 0px;
        --hero-grid-y: 0px;
        background:
          linear-gradient(180deg, rgba(10, 11, 14, 1) 0%, rgba(10, 11, 14, 1) 42%, rgba(8, 9, 13, 1) 100%);
      }

      .hero-landing__grid {
        position: absolute;
        inset: 0;
        z-index: 0;
        opacity: 0.88;
        pointer-events: none;
        background-image: radial-gradient(circle at 1px 1px, #27272a 1px, transparent 0);
        background-size: 40px 40px;
        mask-image: linear-gradient(to bottom, black, transparent 88%);
        transform: translate3d(var(--hero-grid-x), var(--hero-grid-y), 0);
        transition: transform 160ms var(--ease), opacity 220ms var(--ease);
      }

      .hero-landing__bg {
        position: absolute;
        inset: 0;
        pointer-events: none;
        z-index: 1;
        overflow: hidden;
      }

      .hero-landing__bg img {
        position: absolute;
        left: 50%;
        top: 50%;
        width: 100vw;
        max-width: none;
        height: auto;
        display: block;
        transform: translate(-50%, -50%);
        mix-blend-mode: multiply;
        opacity: 0.98;
      }

      .hero-landing__inner {
        position: relative;
        z-index: 2;
        width: 100%;
      }

      .hero-landing__grid-wrap {
        display: grid;
        grid-template-columns: repeat(12, minmax(0, 1fr));
        align-items: center;
        column-gap: 24px;
        position: relative;
      }

      .hero-landing__content {
        grid-column: 1 / span 7;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        max-width: 760px;
        text-align: left;
        position: relative;
        z-index: 1;
      }

      .hero-landing__title {
        margin: 0;
        max-width: 860px;
        color: var(--ink);
        font-family: var(--title-font);
        font-size: clamp(3rem, 6vw, 5.4rem);
        font-weight: 860;
        line-height: 0.95;
        letter-spacing: -0.055em;
        text-wrap: balance;
      }

      .hero-landing__title .accent {
        color: var(--blue);
      }

      .hero-landing__line {
        display: inline;
      }

      .hero-landing__line--tail {
        display: inline-flex;
        align-items: baseline;
        gap: 0.04em;
        white-space: nowrap;
      }

      .hero-landing__rotator {
        position: relative;
        display: inline-flex;
        align-items: center;
        justify-content: flex-start;
        width: 7.2ch;
        height: 1.08em;
        overflow: hidden;
        vertical-align: baseline;
        margin-left: 0.02em;
        margin-right: 0;
        top: 0.16em;
      }

      .hero-landing__rot-word {
        position: absolute;
        inset: 0;
        display: inline-flex;
        align-items: center;
        justify-content: flex-start;
        white-space: nowrap;
        line-height: 1;
        font-weight: 860;
        letter-spacing: -0.055em;
        color: #1d4ed8;
        transform: translateY(125%);
        opacity: 0;
        transition: transform 700ms cubic-bezier(0.22, 1, 0.36, 1), opacity 700ms cubic-bezier(0.22, 1, 0.36, 1);
      }

      .hero-landing__rot-word.is-active {
        transform: translateY(0);
        opacity: 1;
      }

      .hero-landing__rot-word.is-leaving {
        transform: translateY(-125%);
        opacity: 0;
      }

      @media (max-width: 480px) {
        .hero-landing__rotator {
          width: 6.8ch;
          height: 1em;
          top: 0.12em;
        }
      }

      .hero-landing__subtitle {
        margin: 22px 0 0;
        max-width: 760px;
        color: var(--muted);
        font-size: clamp(1rem, 1.22vw, 1.18rem);
        line-height: 1.66;
      }

      .hero-landing__actions {
        display: flex;
        justify-content: flex-start;
        gap: 14px;
        flex-wrap: wrap;
        margin-top: 34px;
      }

      .hero-landing__button {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 12px;
        min-height: 56px;
        padding: 0 24px;
        border: 1px solid transparent;
        font-family: var(--mono);
        font-size: 0.74rem;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: 0.08em;
        transition: transform 0.25s var(--ease), box-shadow 0.3s var(--ease), background 0.25s var(--ease), border-color 0.25s var(--ease);
      }

      .hero-landing__button:hover {
        transform: translateY(-2px);
      }

      .hero-landing__button--shiny {
        --button-fg: #ffffff;
        --button-transition: 260ms ease;

        isolation: isolate;
        position: relative;
        overflow: hidden;
        padding: 0 30px;
        border-radius: 0;
        border: 0;
        color: var(--button-fg);
        font-family: "Inter", sans-serif;
        background: linear-gradient(180deg, rgba(37, 99, 235, 0.98), rgba(23, 78, 212, 0.98));
        box-shadow:
          0 18px 44px rgba(37, 99, 235, 0.18);
        transition: transform 220ms var(--ease), box-shadow 260ms var(--ease), filter 260ms var(--ease);
        animation: none;
      }

      .hero-landing__button--shiny::before,
      .hero-landing__button--shiny::after {
        content: "";
        pointer-events: none;
        position: absolute;
        inset-inline-start: 50%;
        inset-block-start: 50%;
        translate: -50% -50%;
        z-index: -1;
      }

      .hero-landing__button--shiny::before {
        inset: 1px;
        translate: 0 0;
        width: auto;
        height: auto;
        border-radius: 0;
        background:
          linear-gradient(135deg, rgba(255, 255, 255, 0.12) 0%, transparent 28%) top left / 48% 48% no-repeat,
          linear-gradient(315deg, rgba(255, 255, 255, 0.08) 0%, transparent 34%) bottom right / 52% 52% no-repeat,
          radial-gradient(circle at 18% 22%, rgba(255, 255, 255, 0.16), transparent 24%);
        opacity: 0.5;
      }

      .hero-landing__button--shiny::after {
        inset: 0;
        translate: 0 0;
        width: auto;
        height: auto;
        border-radius: 0;
        background:
          linear-gradient(120deg, transparent 0%, rgba(255, 255, 255, 0.22) 48%, rgba(255, 255, 255, 0.9) 50%, rgba(255, 255, 255, 0.22) 52%, transparent 100%);
        transform: translateX(-130%) skewX(-18deg);
        opacity: 0;
        transition: opacity 220ms var(--ease);
      }

      .hero-landing__button--shiny span {
        position: relative;
        z-index: 1;
      }

      .hero-landing__button--shiny .ti {
        display: inline-block;
        transition: transform 220ms var(--ease);
        transform-origin: center;
      }

      .hero-landing__button--shiny:hover,
      .hero-landing__button--shiny:focus-visible {
        transform: translateY(-2px);
        filter: brightness(1.1);
        box-shadow:
          0 24px 72px rgba(37, 99, 235, 0.24),
          0 0 22px rgba(37, 99, 235, 0.26);
      }

      .hero-landing__button--shiny:hover::after,
      .hero-landing__button--shiny:focus-visible::after {
        opacity: 0.72;
        animation: hero-shiny-sweep 1.4s linear 1;
      }

      .hero-landing__button--shiny:hover i,
      .hero-landing__button--shiny:focus-visible i {
        animation: hero-button-icon-bounce 0.8s ease-in-out infinite;
      }

      @keyframes hero-shiny-sweep {
        0% {
          transform: translateX(-130%) skewX(-18deg);
        }
        100% {
          transform: translateX(130%) skewX(-18deg);
        }
      }

      @keyframes hero-button-icon-bounce {
        0%,
        100% {
          transform: translateX(0);
        }
        50% {
          transform: translateX(4px);
        }
      }

      .hero-landing__button--secondary {
        border-color: rgba(255, 255, 255, 0.1);
        background: rgba(255, 255, 255, 0.02);
        color: var(--ink);
      }

      @media (max-width: 768px) {
        .hero-landing {
          padding-top: 176px;
          padding-bottom: 100px;
          align-items: flex-end;
        }

        .hero-landing__content {
          grid-column: 1 / -1;
          margin-top: clamp(56px, 10vw, 84px);
        }

        .hero-landing__title {
          max-width: 10.8ch;
          font-size: clamp(2.42rem, 9.4vw, 3.35rem);
          line-height: 0.94;
          text-wrap: initial;
        }

        .hero-landing__line {
          display: block;
          white-space: nowrap;
        }

        .hero-landing__line--tail {
          display: inline-flex;
          width: auto;
          gap: 0.06em;
          white-space: nowrap;
        }

        .hero-landing__rotator {
          width: 6.3ch;
          margin-left: 0;
          top: 0.14em;
        }

        .hero-landing__subtitle {
          line-height: 1.58;
        }

      }

      @media (prefers-reduced-motion: reduce) {
        .hero-fade-item {
          opacity: 1;
          transform: none;
          filter: none;
          transition: none;
        }
      }

      .fold-shell {
        position: relative;
        min-height: 200svh;
      }

      .fold-shell + .fold-shell {
        margin-top: -100svh;
      }

      .fold-panel {
        position: sticky;
        top: 0;
        min-height: 100svh;
        display: flex;
        align-items: center;
        padding: clamp(84px, 8vw, 108px) 0 clamp(104px, 10vw, 136px);
        border-radius: 0;
        overflow: visible;
        box-shadow: 0 -24px 90px rgba(0, 0, 0, 0.35);
      }

      .fold-panel > .max-w-container-max {
        width: 100%;
      }

      .fold-panel::before {
        content: "";
        position: absolute;
        inset: 0;
        background: transparent;
        pointer-events: none;
      }

      .fold-panel::after {
        content: "";
        position: absolute;
        inset: auto 0 0 0;
        height: 1px;
        background: rgba(255, 255, 255, 0.16);
        pointer-events: none;
      }

      .quiz-shell {
        position: relative;
        z-index: 6;
      }

      .quiz-shell .fold-panel {
        align-items: center;
        background: #ffffff;
      }

      .quiz-stage {
        display: grid;
        grid-template-columns: minmax(0, 0.88fr) minmax(0, 1.12fr);
        gap: clamp(24px, 4vw, 56px);
        width: 100%;
        align-items: center;
      }

      .quiz-copy {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 18px;
        color: #0a0b0e;
      }

      .quiz-kicker {
        font-family: 'Space Grotesk', sans-serif;
        color: #2563eb;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.16em;
      }

      .quiz-kicker--spaced {
        margin-bottom: 10px;
      }

      .quiz-copy h2 {
        margin: 0;
        max-width: 13ch;
        color: #0a0b0e;
      }

      .quiz-copy p {
        margin: 0;
        max-width: 44ch;
        color: #52525b;
      }

      .quiz-pills {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
        margin-top: 10px;
      }

      .quiz-pill {
        display: inline-flex;
        align-items: center;
        min-height: 40px;
        padding: 0 14px;
        border: 1px solid rgba(10, 11, 14, 0.08);
        background: #ffffff;
        color: #0a0b0e;
        font-family: 'Space Grotesk', sans-serif;
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 0.12em;
        text-transform: uppercase;
      }

      .quiz-start {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 12px;
        min-height: 56px;
        padding: 0 24px;
        border: 0;
        background: #2563eb;
        color: #ffffff;
        font-family: 'Space Grotesk', sans-serif;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.12em;
        box-shadow: none;
        transition: transform 180ms ease, filter 180ms ease, background-color 180ms ease;
      }

      .quiz-start:hover {
        transform: translateY(-2px);
        background: #1d4ed8;
      }

      .quiz-card {
        position: relative;
        display: flex;
        flex-direction: column;
        min-height: 640px;
        padding: clamp(24px, 3vw, 40px);
        background: #ffffff;
        color: #0a0b0e;
        border: 1px solid rgba(10, 11, 14, 0.12);
        box-shadow: none;
      }

      .quiz-card__top {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
      }

      .quiz-card__step {
        font-family: 'Space Grotesk', sans-serif;
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 0.14em;
        text-transform: uppercase;
        color: #52525b;
      }

      .quiz-card__progress {
        height: 1px;
        margin-top: 18px;
        background: rgba(10, 11, 14, 0.08);
        overflow: hidden;
      }

      .quiz-card__progress span {
        display: block;
        width: 0;
        height: 100%;
        background: #2563eb;
        transition: width 220ms ease;
      }

      .quiz-card__body {
        display: flex;
        flex: 1;
        flex-direction: column;
        gap: 20px;
        margin-top: 28px;
      }

      .quiz-question {
        margin: 0;
        max-width: 18ch;
        color: #0a0b0e;
        font-family: 'Inter', sans-serif;
        font-size: clamp(1.55rem, 3vw, 2.6rem);
        line-height: 0.98;
        letter-spacing: -0.04em;
        text-wrap: balance;
      }

      .quiz-help {
        margin: 0;
        max-width: 44ch;
        color: #52525b;
        font-size: 15px;
        line-height: 1.65;
      }

      .quiz-options {
        display: grid;
        gap: 12px;
      }

      .quiz-option {
        appearance: none;
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        padding: 15px 16px;
        border: 1px solid rgba(10, 11, 14, 0.12);
        background: #ffffff;
        color: #0a0b0e;
        text-align: left;
        font-family: 'Inter', sans-serif;
        font-size: 15px;
        line-height: 1.4;
        transition: transform 180ms ease, border-color 180ms ease, background 180ms ease;
      }

      .quiz-option:hover {
        transform: translateY(-1px);
        border-color: rgba(37, 99, 235, 0.45);
        background: rgba(37, 99, 235, 0.04);
      }

      .quiz-option.is-selected {
        border-color: rgba(37, 99, 235, 0.9);
        background: rgba(37, 99, 235, 0.1);
      }

      .quiz-option small {
        color: #52525b;
      }

      .quiz-fields {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
      }

      .quiz-field {
        width: 100%;
        min-height: 52px;
        padding: 14px 16px;
        border: 1px solid rgba(10, 11, 14, 0.12);
        background: #ffffff;
        color: #0a0b0e;
        font-family: 'Inter', sans-serif;
        font-size: 15px;
      }

      .quiz-field::placeholder {
        color: #9ca3af;
      }

      .quiz-field--full {
        grid-column: 1 / -1;
      }

      .quiz-actions {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        margin-top: auto;
        padding-top: 24px;
      }

      .quiz-button {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        min-height: 52px;
        padding: 0 18px;
        border: 1px solid rgba(10, 11, 14, 0.12);
        background: transparent;
        color: #0a0b0e;
        font-family: 'Space Grotesk', sans-serif;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.12em;
        transition: transform 180ms ease, border-color 180ms ease, opacity 180ms ease;
      }

      .quiz-button:hover {
        transform: translateY(-1px);
        border-color: rgba(10, 11, 14, 0.24);
      }

      .quiz-button--primary {
        background: #2563eb;
        border-color: transparent;
        color: #ffffff;
        box-shadow: none;
      }

      .quiz-button--primary:hover {
        background: #1d4ed8;
      }

      .quiz-result {
        display: grid;
        gap: 16px;
      }

      .quiz-result__label {
        margin: 0;
        color: #2563eb;
        font-family: 'Space Grotesk', sans-serif;
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 0.14em;
        text-transform: uppercase;
      }

      .quiz-result__title {
        margin: 0;
        max-width: 15ch;
        color: #0a0b0e;
        font-family: 'Inter', sans-serif;
        font-size: clamp(1.8rem, 3vw, 3.1rem);
        line-height: 0.98;
        letter-spacing: -0.04em;
      }

      .quiz-result__text {
        margin: 0;
        max-width: 48ch;
        color: #52525b;
        font-size: 15px;
        line-height: 1.65;
      }

      .quiz-result__panel {
        margin-top: 8px;
        padding-top: 20px;
        border-top: 1px solid rgba(10, 11, 14, 0.08);
      }

      .quiz-summary-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
        margin-top: 12px;
      }

      .quiz-summary-item {
        padding: 14px 16px;
        border: 1px solid rgba(10, 11, 14, 0.12);
        background: #ffffff;
      }

      .quiz-summary-item strong {
        display: block;
        margin-bottom: 4px;
        color: #0a0b0e;
        font-family: 'Space Grotesk', sans-serif;
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 0.12em;
        text-transform: uppercase;
      }

      .quiz-summary-item span {
        color: #52525b;
        font-size: 14px;
        line-height: 1.45;
      }

      .quiz-note {
        margin-top: 10px;
        color: #6b7280;
        font-size: 13px;
        line-height: 1.5;
      }

      .quiz-confirmation {
        display: flex;
        align-items: flex-start;
        gap: 14px;
        margin-top: 18px;
        padding: 16px 18px;
        border: 1px solid rgba(37, 99, 235, 0.16);
        background: rgba(37, 99, 235, 0.06);
      }

      .quiz-confirmation__icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        width: 36px;
        height: 36px;
        border-radius: 999px;
        background: #2563eb;
        color: #ffffff;
      }

      .quiz-confirmation__icon svg {
        width: 20px;
        height: 20px;
      }

      .quiz-confirmation__body {
        display: flex;
        flex-direction: column;
        gap: 4px;
        min-width: 0;
      }

      .quiz-confirmation__title {
        margin: 0;
        color: #0a0b0e;
        font-family: 'Space Grotesk', sans-serif;
        font-size: 15px;
        font-weight: 700;
        line-height: 1.35;
      }

      .quiz-confirmation__text {
        margin: 0;
        color: #52525b;
        font-size: 14px;
        line-height: 1.5;
      }

      .quiz-confirmation--sending {
        border-color: rgba(37, 99, 235, 0.24);
        background: rgba(37, 99, 235, 0.04);
      }

      .quiz-confirmation--sending .quiz-confirmation__icon {
        background: #1d4ed8;
      }

      .quiz-confirmation--failed {
        border-color: rgba(220, 38, 38, 0.18);
        background: rgba(220, 38, 38, 0.05);
      }

      .quiz-confirmation--failed .quiz-confirmation__icon {
        background: #dc2626;
      }

      .quiz-result--low .quiz-result__label {
        color: #fbbf24;
      }

      .quiz-result--low .quiz-result__panel {
        border-top-color: rgba(251, 191, 36, 0.22);
      }

      .quiz-result--low .quiz-result__title {
        max-width: 13ch;
      }

      .quiz-result--low .quiz-button--primary {
        background: #2563eb;
      }

      @media (max-width: 960px) {
        .quiz-stage {
          grid-template-columns: 1fr;
        }

        .quiz-card {
          min-height: auto;
        }

        .quiz-fields,
        .quiz-summary-grid {
          grid-template-columns: 1fr;
        }
      }

      @media (max-width: 768px) {
        .fold-panel {
          padding-left: 20px;
          padding-right: 20px;
        }

        .quiz-shell {
          min-height: auto;
        }

        .quiz-shell + .fold-shell {
          margin-top: 0;
        }

        .quiz-shell .fold-panel {
          position: relative;
          top: auto;
          min-height: auto;
          height: auto;
          overflow: visible;
          padding-top: 56px;
          padding-bottom: 72px;
          box-shadow: none;
        }

        .contact-end {
          height: auto;
          margin-top: 0;
          overflow: hidden;
        }

        .contact-divider {
          display: none;
        }

        .contact-end .fold-panel {
          position: relative;
          top: auto;
          min-height: auto;
          height: auto;
          padding-top: 56px;
          padding-bottom: 48px;
        }

        .fold-panel > .max-w-container-max,
        .hero-landing__inner,
        .contact-end .contact-hero,
        .contact-end .contact-footer .flex,
        .quiz-stage,
        .projects-stage {
          padding-left: 0;
          padding-right: 0;
          box-sizing: border-box;
        }

        .hero-landing {
          padding-left: 20px;
          padding-right: 20px;
        }

        .hero-landing__actions {
          width: 100%;
        }

        .hero-landing__button {
          width: 100%;
        }

        .quiz-copy h2,
        .quiz-result__title,
        .hero-landing__title {
          text-wrap: pretty;
        }

        .quiz-copy p,
        .contact-end .contact-hero p,
        .hero-landing__subtitle {
          max-width: none;
        }

        .quiz-card,
        .project-slide,
        .process-card,
        .glass-card {
          width: 100%;
        }

        .projects-stage {
          gap: 24px;
        }
      }

      .projects-shell {
        min-height: 100svh;
      }

      .projects-panel {
        align-items: center;
      }

      .projects-stage {
        display: flex;
        flex-direction: column;
        gap: 32px;
        width: 100%;
        padding-top: 12px;
        padding-bottom: 12px;
      }

      .projects-viewport {
        width: 100%;
        overflow: hidden;
        min-height: 100svh;
        display: flex;
        align-items: stretch;
        padding-bottom: 0;
      }

      .projects-track {
        display: flex;
        gap: 24px;
        will-change: transform;
        transform: translate3d(0, 0, 0);
        height: 100%;
      }

      .project-slide {
        flex: 0 0 auto;
        width: 100svw;
        display: grid;
        grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr);
        gap: 24px;
        min-height: calc(100svh - clamp(160px, 18vw, 240px));
        padding: clamp(28px, 3vw, 40px);
        border: 1px solid rgba(255, 255, 255, 0.12);
        background: #0a0b0e;
        box-shadow: 0 24px 70px rgba(0, 0, 0, 0.32);
      }

      .project-slide__visual {
        position: relative;
        min-height: 100%;
        overflow: hidden;
        height: 100%;
        background:
          radial-gradient(circle at 20% 20%, rgba(37, 99, 235, 0.45), transparent 32%),
          radial-gradient(circle at 80% 30%, rgba(255, 255, 255, 0.16), transparent 28%),
          linear-gradient(145deg, #10131b, #05070b 72%);
        border: 1px solid rgba(255, 255, 255, 0.06);
      }

      .project-slide__visual-link {
        position: relative;
        display: block;
        width: 100%;
        height: 100%;
        color: inherit;
        text-decoration: none;
      }

      .project-slide__visual-link:focus-visible {
        outline: 2px solid #2563eb;
        outline-offset: 4px;
      }

      .project-slide__shot {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center top;
        filter: saturate(1.02) contrast(1.02);
        transform: scale(1.01);
      }

      .project-slide__overlay {
        position: absolute;
        inset: 0;
        background:
          linear-gradient(180deg, rgba(10, 11, 14, 0.06) 0%, rgba(10, 11, 14, 0.38) 100%),
          linear-gradient(90deg, rgba(10, 11, 14, 0.18) 0%, transparent 24%, transparent 76%, rgba(10, 11, 14, 0.18) 100%);
        pointer-events: none;
      }

      .project-slide__visual::before {
        content: "";
        position: absolute;
        inset: 24px;
        border: 1px solid rgba(255, 255, 255, 0.12);
      }

      .project-slide__label {
        position: absolute;
        left: 24px;
        top: 24px;
        display: inline-flex;
        align-items: center;
        gap: 8px;
        padding: 10px 14px;
        background: rgba(5, 7, 11, 0.72);
        border: 1px solid rgba(255, 255, 255, 0.12);
        color: white;
        font-family: 'Space Grotesk', sans-serif;
        font-size: 12px;
        letter-spacing: 0.08em;
        text-transform: uppercase;
      }

      .project-slide__copy {
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: 20px;
        padding: clamp(12px, 2vw, 24px);
        height: 100%;
      }

      @media (max-width: 960px) {
        .project-slide {
          grid-template-columns: 1fr;
          width: 100%;
          min-height: auto;
          padding: 16px;
          gap: 16px;
        }

        .project-slide__visual {
          min-height: 260px;
        }

        .project-slide__copy {
          padding: 0 0 8px;
          gap: 14px;
        }
      }

      .projects-hint {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 16px;
        color: rgba(255, 255, 255, 0.56);
        font-family: 'Space Grotesk', sans-serif;
        font-size: 12px;
        letter-spacing: 0.12em;
        text-transform: uppercase;
      }

      .process-section {
        background: #ffffff;
      }

      .process-kicker {
        color: #2563eb;
        font-family: 'Space Grotesk', sans-serif;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: 0.18em;
        text-transform: uppercase;
      }

      .process-grid {
        position: relative;
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 24px;
      }

      .process-grid::before {
        display: none;
      }

      .process-card {
        position: relative;
        text-align: left;
        padding: 0;
      }

      .process-card__decor {
        position: relative;
        margin: 0;
        width: 100%;
        min-height: 290px;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
        border-radius: 0;
        overflow: hidden;
        background: #2563eb;
        border: 1px solid #2563eb;
        box-shadow: none;
        padding: 24px 24px 22px;
      }

      .process-card__eyebrow {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        margin-bottom: 20px;
        color: rgba(255, 255, 255, 0.78);
        font-family: 'Space Grotesk', sans-serif;
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 0.14em;
        text-transform: uppercase;
      }

      .process-card__index {
        display: inline-flex;
        align-items: center;
        justify-content: center;
      }

      .process-card__arrow {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 30px;
        height: 30px;
        border: 1px solid rgba(255, 255, 255, 0.24);
        color: #ffffff;
      }

      .process-card__frame {
        position: relative;
        width: 64px;
        height: 64px;
        border: 1px solid rgba(255, 255, 255, 0.32);
        background: #ffffff;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 32px;
      }

      .process-card__badge {
        width: 100%;
        height: 100%;
        display: grid;
        place-items: center;
        border-radius: 0;
        background: #ffffff;
        border: none;
        color: #2563eb;
        box-shadow: none;
        position: relative;
      }

      .process-card__badge .ti {
        font-size: 26px;
      }

      .process-card h4 {
        color: #ffffff;
        font-family: 'Inter', sans-serif;
        font-size: 24px;
        line-height: 1.2;
        font-weight: 700;
        letter-spacing: 0;
        margin-bottom: 16px;
        max-width: 10ch;
      }

      .process-card p {
        color: rgba(255, 255, 255, 0.82);
        font-size: 15px;
        line-height: 1.6;
        max-width: none;
        margin: 0;
      }

      .process-card__ghost {
        position: absolute;
        right: -8px;
        bottom: -18px;
        font-size: 124px;
        color: rgba(255, 255, 255, 0.12);
        pointer-events: none;
        line-height: 1;
      }

      .process-card:hover .process-card__decor {
        background: #1d4ed8;
        border-color: #1d4ed8;
        transform: translateY(-4px);
        transition: background-color 180ms ease, border-color 180ms ease, transform 180ms ease;
      }

      .process-card:hover .process-card__arrow {
        transform: translateX(4px);
        transition: transform 180ms ease;
      }

      @media (max-width: 1200px) {
        .process-grid {
          grid-template-columns: repeat(3, minmax(0, 1fr));
        }
      }

      @media (max-width: 768px) {
        .process-grid {
          grid-template-columns: 1fr;
        }

        .process-card__decor {
          min-height: 240px;
        }

        .process-card h4 {
          max-width: none;
        }
      }

      .placeholder-slot {
        border: 2px dashed #27272a;
        background: rgba(39, 39, 42, 0.1);
        display: flex;
        align-items: center;
        justify-content: center;
        min-height: 200px;
        color: #52525b;
        font-family: 'Space Grotesk', sans-serif;
        text-transform: uppercase;
        font-size: 12px;
        letter-spacing: 2px;
      }

      .about-section {
        position: relative;
        z-index: 3;
        background:
          radial-gradient(circle at 82% 14%, rgba(29, 78, 216, 0.14), transparent 28%),
          linear-gradient(180deg, #0a0b0e 0%, #0a0b0e 100%);
        color: #ffffff;
        overflow: hidden;
      }

      .about-section::before {
        content: "";
        position: absolute;
        inset: 0;
        background-image: radial-gradient(circle at 1px 1px, rgba(255, 255, 255, 0.12) 1px, transparent 0);
        background-size: 42px 42px;
        opacity: 0.28;
        pointer-events: none;
      }

      .about-section__inner {
        position: relative;
        z-index: 1;
        max-width: 1280px;
        margin: 0 auto;
        padding: clamp(64px, 6vw, 92px) 24px;
      }

      .about-section__eyebrow {
        display: inline-flex;
        align-items: center;
        min-height: 32px;
        padding: 0 12px;
        margin-bottom: 20px;
        border: 1px solid rgba(255, 255, 255, 0.16);
        background: rgba(255, 255, 255, 0.03);
        color: #93c5fd;
        font-family: 'Space Grotesk', sans-serif;
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 0.14em;
        text-transform: uppercase;
      }

      .about-section__layout {
        display: grid;
        grid-template-columns: minmax(260px, 0.62fr) minmax(0, 1.15fr);
        gap: clamp(20px, 3vw, 40px);
        align-items: start;
      }

      .about-section__title {
        max-width: 14ch;
        margin: 0;
        font-size: clamp(2.2rem, 4vw, 3.6rem);
        line-height: 0.95;
        letter-spacing: -0.05em;
        text-wrap: balance;
      }

      .about-section__copy {
        display: flex;
        flex-direction: column;
        gap: 16px;
        max-width: none;
        width: 100%;
      }

      .about-section__copy p {
        margin: 0;
        max-width: none;
        color: rgba(255, 255, 255, 0.78);
        font-size: 17px;
        line-height: 1.65;
      }

      .about-section__portrait {
        position: relative;
        overflow: hidden;
        min-height: 420px;
        border: 1px solid rgba(255, 255, 255, 0.12);
        background:
          radial-gradient(circle at 30% 20%, rgba(29, 78, 216, 0.38), transparent 30%),
          linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.01));
        box-shadow: 0 30px 90px rgba(0, 0, 0, 0.32);
        justify-self: start;
        width: min(100%, 420px);
      }

      .about-section__portrait img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center top;
        filter: saturate(1.05) contrast(1.02);
      }

      .about-section__portrait::after {
        content: "";
        position: absolute;
        inset: 0;
        background:
          linear-gradient(180deg, rgba(10, 11, 14, 0.08) 0%, rgba(10, 11, 14, 0.42) 100%),
          linear-gradient(90deg, rgba(10, 11, 14, 0.18) 0%, transparent 20%, transparent 80%, rgba(10, 11, 14, 0.18) 100%);
      }

      .about-section__badge {
        position: absolute;
        left: 24px;
        top: 24px;
        z-index: 2;
        display: inline-flex;
        align-items: center;
        min-height: 34px;
        padding: 0 14px;
        border: 1px solid rgba(147, 197, 253, 0.2);
        background: rgba(10, 11, 14, 0.82);
        color: #ffffff;
        font-family: 'Space Grotesk', sans-serif;
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 0.14em;
        text-transform: uppercase;
      }

      .about-section__stats {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 16px;
        margin-top: 32px;
        padding-top: 4px;
      }

      .about-section__stat {
        padding: 0;
        border-top: 1px solid rgba(29, 78, 216, 0.24);
        background: transparent;
      }

      .about-section__stat-inner {
        padding-top: 12px;
      }

      .about-section__stat-label {
        display: block;
        margin-bottom: 10px;
        color: #60a5fa;
        font-family: 'Space Grotesk', sans-serif;
        font-size: 10px;
        font-weight: 700;
        letter-spacing: 0.14em;
        text-transform: uppercase;
      }

      .about-section__stat-value {
        margin: 0;
        color: #ffffff;
        font-family: 'Inter', sans-serif;
        font-size: 1rem;
        line-height: 1.4;
        letter-spacing: -0.02em;
      }

      @media (max-width: 960px) {
        .about-section__layout {
          grid-template-columns: 1fr;
        }

        .about-section__portrait {
          min-height: 340px;
          order: -1;
          justify-self: stretch;
          width: 100%;
        }

        .about-section__stats {
          grid-template-columns: 1fr;
        }
      }

      @media (max-width: 768px) {
        .about-section__inner {
          padding-top: 56px;
          padding-bottom: 56px;
        }

        .about-section__title {
          max-width: none;
          font-size: clamp(2rem, 8vw, 2.8rem);
        }

        .about-section__copy p {
          font-size: 16px;
        }
      }

      .case-studies {
        display: flex;
        flex-direction: column;
        gap: 28px;
      }

      .case-studies__intro {
        max-width: 58rem;
      }

      .case-studies__title {
        max-width: 54rem;
        line-height: 1.08;
        letter-spacing: -0.03em;
        text-wrap: balance;
      }

      .case-studies__intro p {
        max-width: 46rem;
      }

      .case-studies__grid {
        display: grid;
        grid-template-columns: repeat(12, minmax(0, 1fr));
        gap: 16px;
      }

      .case-study-card {
        position: relative;
        display: flex;
        flex-direction: column;
        overflow: hidden;
        min-height: 260px;
        padding: 28px;
        border: 1px solid rgba(10, 11, 14, 0.12);
        background:
          radial-gradient(circle at 20% 20%, rgba(37, 99, 235, 0.16), transparent 28%),
          linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
        box-shadow: 0 18px 44px rgba(10, 11, 14, 0.08);
      }

      .case-study-card::before {
        content: "";
        position: absolute;
        inset: 0;
        background-image:
          linear-gradient(to right, rgba(37, 99, 235, 0.08) 1px, transparent 1px),
          linear-gradient(to bottom, rgba(37, 99, 235, 0.08) 1px, transparent 1px);
        background-size: 44px 44px;
        opacity: 0.45;
        pointer-events: none;
        mask-image: radial-gradient(circle at top left, black 28%, transparent 100%);
      }

      .case-study-card > * {
        position: relative;
        z-index: 1;
      }

      .case-study-card--primary {
        color: #ffffff;
        background:
          radial-gradient(circle at 18% 20%, rgba(255, 255, 255, 0.14), transparent 26%),
          linear-gradient(145deg, #2563eb 0%, #1d4ed8 100%);
      }

      .case-study-card--dark {
        color: #ffffff;
        background:
          radial-gradient(circle at 18% 20%, rgba(37, 99, 235, 0.2), transparent 28%),
          linear-gradient(180deg, #111111 0%, #0a0b0e 100%);
      }

      .case-study-card--soft {
        background:
          radial-gradient(circle at 18% 20%, rgba(37, 99, 235, 0.12), transparent 28%),
          linear-gradient(180deg, #ffffff 0%, #eff6ff 100%);
      }

      .case-study-card--wide {
        grid-column: span 7;
      }

      .case-study-card--tall {
        grid-column: span 5;
      }

      .case-study-card--half {
        grid-column: span 4;
      }

      .case-study-card__top {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 16px;
      }

      .case-study-card__tag {
        display: inline-flex;
        align-items: center;
        min-height: 28px;
        padding: 0 10px;
        border: 1px solid currentColor;
        font-family: 'Space Grotesk', sans-serif;
        font-size: 10px;
        font-weight: 700;
        letter-spacing: 0.14em;
        text-transform: uppercase;
      }

      .case-study-card__badge {
        width: 44px;
        height: 44px;
        display: grid;
        place-items: center;
        border: 1px solid rgba(37, 99, 235, 0.22);
        background: rgba(255, 255, 255, 0.9);
        color: #2563eb;
        font-family: 'Space Grotesk', sans-serif;
        font-size: 14px;
        font-weight: 700;
      }

      .case-study-card--primary .case-study-card__badge,
      .case-study-card--dark .case-study-card__badge {
        background: rgba(255, 255, 255, 0.08);
        border-color: rgba(255, 255, 255, 0.18);
        color: #ffffff;
      }

      .case-study-card__content {
        display: flex;
        flex-direction: column;
        gap: 12px;
        margin-top: 44px;
      }

      .case-study-card__content h4 {
        margin: 0;
        max-width: 24ch;
        font-size: clamp(1.25rem, 1.45vw, 1.7rem);
        line-height: 1.06;
        letter-spacing: -0.03em;
        text-wrap: balance;
      }

      .case-study-card__content p {
        margin: 0;
        max-width: 44ch;
        color: #52525b;
        font-size: 0.94rem;
        line-height: 1.55;
      }

      .case-study-card--primary .case-study-card__content p,
      .case-study-card--dark .case-study-card__content p {
        color: rgba(255, 255, 255, 0.76);
      }

      .case-study-card__footer {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        margin-top: auto;
        padding-top: 24px;
      }

      .case-study-card__identity {
        display: flex;
        flex-direction: column;
        gap: 4px;
        min-width: 0;
      }

      .case-study-card__name {
        font-family: 'Inter', sans-serif;
        font-size: 0.98rem;
        font-weight: 700;
        letter-spacing: -0.02em;
      }

      .case-study-card__role {
        font-family: 'Space Grotesk', sans-serif;
        font-size: 10px;
        font-weight: 700;
        letter-spacing: 0.12em;
        text-transform: uppercase;
        opacity: 0.62;
      }

      .case-study-card__stats {
        display: flex;
        flex-direction: column;
        gap: 0;
        min-width: 0;
      }

      .case-study-card__avatar {
        width: 56px;
        height: 56px;
        flex: none;
        border-radius: 14px;
        overflow: hidden;
        border: 1px solid rgba(37, 99, 235, 0.18);
        background: rgba(37, 99, 235, 0.1);
      }

      .case-study-card__avatar img {
        width: 100%;
        height: 100%;
        object-fit: cover;
      }

      @media (max-width: 960px) {
        .case-studies__grid {
          grid-template-columns: 1fr;
        }

        .case-study-card--wide,
        .case-study-card--tall,
        .case-study-card--half {
          grid-column: auto;
        }

        .case-study-card {
          min-height: auto;
          padding: 20px;
        }

        .case-study-card__content h4 {
          max-width: none;
          font-size: clamp(1.28rem, 4.2vw, 1.55rem);
          line-height: 1.08;
        }
      }

      @media (max-width: 768px) {
        .case-studies__title {
          max-width: none;
          font-size: clamp(1.6rem, 6.3vw, 2.2rem);
        }
      }

      #problema {
        z-index: 2;
        min-height: auto;
        height: auto;
      }

      #problema.problem-section {
        position: relative;
        margin-top: 0;
        min-height: auto;
        padding: clamp(96px, 9vw, 128px) 24px clamp(96px, 9vw, 128px);
        background: #ffffff;
      }

      #problema.problem-section .fold-panel {
        position: relative;
        top: auto;
        min-height: auto;
        display: block;
        padding: 0;
        overflow: visible;
        box-shadow: none;
      }

      #problema.problem-section .fold-panel::after {
        display: none;
      }

      #servicos {
        margin-top: 0;
        box-shadow: none;
      }

      #servicos {
        z-index: 3;
      }

      #servicos .fold-panel {
        box-shadow: none;
      }

      #processo {
        z-index: 4;
      }

      #projetos {
        z-index: 5;
      }

      #contato {
        z-index: 6;
      }

      .contact-end {
        background: linear-gradient(180deg, #2563eb 0%, #1d4ed8 100%);
        min-height: 100svh;
        margin-top: -100svh;
        position: relative;
        overflow: visible;
        border-top: 0;
      }

      .section-solid {
        background-color: #0a0b0e;
      }

      .contact-section {
        background: #2563eb;
      }

      .contact-footer {
        background: transparent;
        border-top: 1px solid rgba(255, 255, 255, 0.14);
      }

      .contact-divider {
        position: absolute;
        left: 50%;
        top: 0;
        width: min(160px, 18vw);
        aspect-ratio: 1 / 1;
        transform: translate(-50%, -50%);
        z-index: 3;
        pointer-events: none;
      }

      .contact-end .fold-panel {
        background: transparent;
        min-height: 100svh;
        height: auto;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        padding-top: clamp(18px, 2vw, 28px);
        padding-bottom: clamp(8px, 1.5vw, 16px);
        position: relative;
        overflow: visible;
      }

      .contact-divider__orb {
        position: relative;
        width: 100%;
        height: 100%;
        border-radius: 50%;
        background: #2563eb;
        border: none;
        box-shadow: none;
        overflow: hidden;
      }

      .contact-divider__ring {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        animation: contact-ring-spin 18s linear infinite;
        transform-origin: center center;
      }

      .contact-divider__char {
        position: absolute;
        left: 50%;
        top: 50%;
        width: 1em;
        height: 1em;
        transform-origin: center center;
        display: block;
        margin-left: -0.5em;
        margin-top: -0.5em;
      }

      .contact-divider__char span {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        font-family: 'VT323', monospace;
        font-size: 10px;
        font-weight: 700;
        letter-spacing: 0.06em;
        color: rgba(255, 255, 255, 0.98);
        text-shadow: 0 1px 0 rgba(5, 15, 32, 0.25);
        line-height: 1;
      }

      .contact-divider__logo {
        position: absolute;
        inset: 50% auto auto 50%;
        transform: translate(-50%, -50%);
        width: clamp(50px, 5.8vw, 72px);
        height: clamp(50px, 5.8vw, 72px);
        border-radius: 9999px;
        overflow: hidden;
        border: 1px solid rgba(255, 255, 255, 0.18);
        box-shadow: none;
        background: transparent;
      }

      .contact-divider__logo img {
        width: 100%;
        height: 100%;
        object-fit: cover;
      }

      @keyframes contact-ring-spin {
        from { transform: rotate(0deg); }
        to { transform: rotate(360deg); }
      }

      .contact-end .contact-hero {
        flex: 1 1 auto;
        display: flex;
        align-items: center;
        padding-top: clamp(8px, 1.5vw, 16px);
        padding-bottom: clamp(8px, 1.5vw, 16px);
      }

      .contact-end .contact-footer {
        background: transparent;
        border-top: none;
        margin-top: auto;
        padding-top: clamp(12px, 1.5vw, 20px);
        padding-bottom: clamp(28px, 3.5vw, 48px);
      }

      @media (max-width: 768px) {
        .fold-shell:not(.projects-shell),
        .quiz-shell,
        .contact-end {
          min-height: auto !important;
          height: auto !important;
          margin-top: 0 !important;
          overflow: visible !important;
        }

        .fold-shell:not(.projects-shell) + .fold-shell:not(.projects-shell) {
          margin-top: 0 !important;
        }

        .fold-shell:not(.projects-shell) .fold-panel,
        .quiz-shell .fold-panel,
        .contact-end .fold-panel {
          position: relative !important;
          top: auto !important;
          min-height: auto !important;
          height: auto !important;
          display: block;
          overflow: visible !important;
          overflow-x: hidden !important;
          overscroll-behavior-y: auto;
          -webkit-overflow-scrolling: auto;
        }

        #processo {
          min-height: auto !important;
          height: auto !important;
          margin-top: 0 !important;
          overflow: visible !important;
          padding-bottom: 0 !important;
        }

        #processo .fold-panel {
          position: relative !important;
          top: auto !important;
          min-height: auto !important;
          height: auto !important;
          display: block;
          overflow: visible !important;
          overflow-x: hidden !important;
          padding-top: 56px;
          padding-bottom: 24px;
        }

        #processo .process-grid {
          grid-template-columns: 1fr;
          gap: 16px;
          margin-bottom: 0;
        }

        .projects-shell {
          min-height: 200svh;
          margin-top: 0 !important;
        }

        .projects-panel {
          position: sticky !important;
          top: 0 !important;
          min-height: 100svh !important;
          height: 100svh !important;
          display: flex;
          align-items: flex-start !important;
          justify-content: flex-start !important;
          overflow-y: hidden !important;
          overflow-x: hidden !important;
          overscroll-behavior-y: auto;
          -webkit-overflow-scrolling: auto;
        }

        .projects-viewport {
          min-height: 100svh;
          overflow: hidden;
        }

        #projetos .projects-stage {
          padding-top: 12px;
          padding-bottom: 16px;
        }

        .projects-track {
          flex-direction: row;
          height: 100%;
          gap: 16px;
        }

        .project-slide {
          width: 100svw;
        }

        .quiz-shell .fold-panel {
          padding-top: 56px;
          padding-bottom: 96px;
        }

        .quiz-stage {
          align-items: start;
        }

        .contact-end .fold-panel {
          justify-content: flex-start;
          padding-top: 64px;
          padding-bottom: 56px;
        }

        .contact-end .contact-hero {
          padding-top: 0;
          padding-bottom: 32px;
          margin-bottom: 12px;
        }

        .contact-end .contact-footer {
          margin-top: 12px;
          padding-top: 24px;
          padding-bottom: 16px;
        }
      }
