@font-face {
        font-family: "Aeonik Local";
        src: url("assets/aeonik-medium.woff2") format("woff2");
        font-display: swap;
        font-weight: 500;
      }

      @font-face {
        font-family: "Dawn Alibaba PuHuiTi";
        src: url("assets/dawn-alibaba-puhuiti-heavy.woff2?v=20260804-213445") format("woff2");
        font-display: swap;
        font-style: normal;
        font-weight: 900;
      }

      @font-face {
        font-family: "Dawn PingFang SC Light";
        src: url("assets/dawn-pingfang-sc-light.woff2?v=20260804-213445") format("woff2");
        font-display: swap;
        font-style: normal;
        font-weight: 300;
      }

      :root {
        --font-title: "Dawn Alibaba PuHuiTi", "Alibaba PuHuiTi", "PingFang SC", "Microsoft YaHei", sans-serif;
        --font-copy: "Dawn PingFang SC Light", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
        --night: #020817;
        --night-raised: #06142c;
        --night-soft: #092449;
        --ink: #f3f8ff;
        --soft-ink: rgba(220, 238, 255, 0.76);
        --muted: rgba(175, 208, 240, 0.58);
        --violet: #2f8cff;
        --violet-bright: #a9e3ff;
        --violet-deep: #075bc8;
        --lavender: #eaf6ff;
        --ring: rgba(112, 199, 255, 0.3);
        --panel: rgba(3, 17, 43, 0.56);
        --panel-strong: rgba(2, 10, 28, 0.8);
        --line: rgba(175, 221, 255, 0.2);
        --line-soft: rgba(175, 221, 255, 0.1);
        --glass: linear-gradient(135deg, rgba(82, 182, 255, 0.19), rgba(255, 255, 255, 0.055) 21%, rgba(5, 42, 96, 0.3) 69%, rgba(139, 221, 255, 0.15));
        --shadow: 0 28px 84px rgba(0, 0, 0, 0.44);
        --content-width: min(1120px, calc(100vw - 48px));
      }

      * {
        box-sizing: border-box;
      }

      html {
        min-width: 320px;
        background: var(--night);
        scroll-behavior: smooth;
        scrollbar-width: none;
      }

      html::-webkit-scrollbar,
      body::-webkit-scrollbar {
        display: none;
      }

      body {
        min-width: 320px;
        min-height: 100vh;
        margin: 0;
        overflow-x: clip;
        color: var(--ink);
        background:
          radial-gradient(70% 30% at 50% 20%, rgba(18, 111, 235, 0.1), transparent 72%),
          radial-gradient(60% 16% at 50% 56%, rgba(7, 76, 184, 0.12), transparent 76%),
          var(--night);
        font-family: var(--font-copy);
        font-weight: 300;
        font-synthesis: none;
        text-rendering: optimizeLegibility;
        -webkit-font-smoothing: antialiased;
      }

      h1,
      h2,
      h3,
      h4,
      h5,
      h6 {
        font-family: var(--font-title);
        font-weight: 900;
        font-synthesis: none;
      }

      body::before,
      body::after {
        position: fixed;
        z-index: -2;
        inset: 0;
        pointer-events: none;
        content: "";
      }

      body::before {
        opacity: 0.42;
        background-image:
          radial-gradient(circle at 11% 24%, rgba(245, 240, 255, 0.9) 0 1px, transparent 1.5px),
          radial-gradient(circle at 87% 19%, rgba(197, 232, 255, 0.8) 0 1px, transparent 1.6px),
          radial-gradient(circle at 77% 72%, rgba(255, 255, 255, 0.6) 0 1px, transparent 1.3px),
          radial-gradient(circle at 18% 80%, rgba(207, 233, 255, 0.65) 0 1px, transparent 1.5px);
        background-size: 283px 287px, 397px 401px, 347px 353px, 459px 463px;
      }

      body::after {
        z-index: -1;
        opacity: 0.12;
        background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");
      }

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

      button,
      a {
        -webkit-tap-highlight-color: transparent;
      }

      a:focus-visible,
      button:focus-visible {
        outline: 2px solid #a9e3ff;
        outline-offset: 4px;
      }

      .skip-link {
        position: fixed;
        z-index: 100;
        top: 12px;
        left: 12px;
        transform: translateY(-180%);
        border-radius: 10px;
        padding: 10px 14px;
        color: #021a3b;
        background: #cceeff;
        transition: transform 150ms ease;
      }

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

      .dawn-hero {
        position: relative;
        min-height: 1180px;
        overflow: hidden;
        isolation: isolate;
        padding: 0;
        background:
          radial-gradient(67% 45% at 50% 72%, rgba(10, 97, 213, 0.17), transparent 72%),
          radial-gradient(38% 72% at 50% 24%, rgba(41, 139, 255, 0.09), transparent 100%),
          #020817;
      }

      .dawn-hero::before {
        position: absolute;
        z-index: -4;
        inset: 0;
        opacity: 0.68;
        background:
          linear-gradient(90deg, transparent 49.94%, rgba(76, 170, 255, 0.023) 50%, transparent 50.06%),
          linear-gradient(transparent 49.94%, rgba(76, 170, 255, 0.017) 50%, transparent 50.06%);
        background-size: 160px 160px;
        content: "";
        mask-image: radial-gradient(ellipse at 50% 45%, #000 4%, transparent 73%);
      }

      .dawn-hero::after {
        position: absolute;
        z-index: 4;
        right: 0;
        bottom: 0;
        left: 0;
        height: 290px;
        pointer-events: none;
        background: linear-gradient(180deg, transparent, rgba(2, 8, 23, 0.38));
        content: "";
      }

      .ambient-stars {
        position: absolute;
        z-index: -2;
        inset: 0;
        pointer-events: none;
      }

      .hero-stage {
        position: relative;
        --black-hole-line-y: clamp(490px, calc(414.75px + 10.44vw), 545px);
        --preview-width: min(1000px, calc(100vw - 64px));
        min-height: 1180px;
        padding-top: 124px;
      }

      .ambient-star {
        position: absolute;
        width: 2px;
        height: 2px;
        border-radius: 50%;
        background: #f5fbff;
        box-shadow: 0 0 8px rgba(211, 239, 255, 0.86);
      }

      /* Restored first-screen black-hole layer and its original motion system. */
      .hero-black-hole {
        position: absolute;
        z-index: 4;
        top: clamp(201px, calc(125.75px + 10.44vw), 256px);
        left: 50%;
        width: 1028px;
        height: 578px;
        transform: translateX(-50%);
        pointer-events: none;
        -webkit-mask-image: radial-gradient(50% 50% at 50% 50%, #fff 60.94%, transparent 100%);
        -webkit-mask-size: cover;
        mask-image: radial-gradient(50% 50% at 50% 50%, #fff 60.94%, transparent 100%);
        mask-size: cover;
        background:
          radial-gradient(ellipse 22% 36% at 50% 55%, rgba(37, 151, 255, 0.7), rgba(13, 82, 213, 0.2) 46%, transparent 74%),
          radial-gradient(ellipse 55% 32% at 50% 55%, rgba(19, 108, 255, 0.12), transparent 72%);
      }

      .black-hole-poster,
      .black-hole-poster img {
        position: absolute;
        inset: 0;
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
      }

      .black-hole-poster {
        z-index: 0;
        overflow: hidden;
      }

      .black-hole-poster img {
        will-change: auto;
      }

      /* Keep the focal point visibly alive while a constrained network buffers video. */
      .hero-black-hole-visible:not(.is-video-ready) .black-hole-poster img {
        animation: black-hole-poster-standby 2.8s ease-in-out infinite alternate;
      }

      @keyframes black-hole-poster-standby {
        from { transform: scale(1); }
        to { transform: scale(1.035); }
      }

      .black-hole-poster img {
        filter: hue-rotate(-48deg) saturate(1.1) brightness(.94);
      }

      .lazy-video {
        position: absolute;
        z-index: 1;
        inset: 0;
        opacity: 0;
        transition: opacity 320ms cubic-bezier(.2, .7, .2, 1);
      }

      .hero-black-hole.is-video-ready .lazy-video {
        opacity: 1;
      }

      .lazy-video video {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
        filter: hue-rotate(-48deg) saturate(1.1) brightness(.94);
      }

      .hero-black-hole-stars {
        position: absolute;
        z-index: 1;
        top: 50%;
        left: 50%;
        width: 700px;
        height: 700px;
        transform: translate3d(-50%, -50%, 0);
        pointer-events: none;
        -webkit-mask-image: radial-gradient(50% 50% at 50% 50%, transparent 27.08%, #d9d9d9 47.92%, rgba(217, 217, 217, 0.8) 75%, transparent 100%);
        -webkit-mask-size: cover;
        mask-image: radial-gradient(50% 50% at 50% 50%, transparent 27.08%, #d9d9d9 47.92%, rgba(217, 217, 217, 0.8) 75%, transparent 100%);
        mask-size: cover;
      }

      .hero-black-hole-visible .hero-black-hole-stars {
        animation: hero-stars-rotate 70s linear infinite;
      }

      .black-hole-star {
        position: absolute;
        width: 2px;
        height: 2px;
        border-radius: 5px;
        background: rgba(255, 255, 255, 0);
      }

      .hero-black-hole-visible .black-hole-star {
        animation: hero-star-twinkle var(--duration) linear infinite;
        animation-delay: var(--delay);
      }

      .black-hole-star:nth-child(3n) {
        opacity: 0.5;
      }

      .hero-black-hole-circles {
        display: none;
      }

      @keyframes hero-stars-rotate {
        from { transform: translate3d(-50%, -50%, 0) rotate(0deg); }
        to { transform: translate3d(-50%, -50%, 0) rotate(-360deg); }
      }

      @keyframes hero-star-twinkle {
        0% {
          transform: scale(0.72);
          opacity: 0.18;
          background: rgba(255, 255, 255, 0.52);
        }
        52% { opacity: 0.88; background: #fff; }
        100% {
          transform: scale(1.18);
          opacity: 0.34;
          background: #fff;
        }
      }

      @keyframes black-hole-orbit-turn {
        from { transform: rotate(0deg); }
        to { transform: rotate(360deg); }
      }

      @media (min-width: 1249px) {
        .dawn-hero,
        .hero-stage {
          min-height: 1200px;
        }

        .hero-stage {
          --black-hole-line-y: clamp(592px, calc(372px + 17.6vw), 638px);
        }

        .hero-black-hole {
          top: clamp(187px, calc(-33px + 17.6vw), 233px);
          width: 1440px;
          height: 810px;
        }

        .hero-black-hole-circles {
          position: absolute;
          z-index: 2;
          top: 50%;
          left: 50%;
          display: block;
          width: 808px;
          height: 808px;
          margin-top: -12px;
          transform: translate(-50%, -50%);
          pointer-events: none;
        }

        .orbit-mask {
          position: absolute;
          top: 50%;
          left: 50%;
          width: 100%;
          height: 100%;
          transform: translate(-50%, -50%);
          -webkit-mask-image: linear-gradient(180deg, rgba(112, 199, 255, 0.6) 9.41%, transparent 29.79%);
          mask-image: linear-gradient(180deg, rgba(112, 199, 255, 0.6) 9.41%, transparent 29.79%);
        }

        .orbit-mask:nth-child(2) {
          width: 608px;
          height: 608px;
          opacity: 0.6;
        }

        .orbit-mask:nth-child(3) {
          width: 416px;
          height: 416px;
        }

        .hero-black-hole-circles .orbit {
          position: relative;
          top: 4px;
          width: 100%;
          height: 100%;
          transform: none;
          border: 1px solid var(--ring);
          border-radius: 50%;
          background: rgba(112, 199, 255, 0.04);
          box-shadow: none;
          animation: none;
        }

        .hero-black-hole-visible .hero-black-hole-circles .orbit {
          animation: black-hole-orbit-turn 100s linear infinite;
        }

        .hero-black-hole-visible .orbit-mask:nth-child(2) .orbit {
          animation-direction: reverse;
        }

        .hero-black-hole-visible .orbit-mask:nth-child(3) .orbit {
          animation: none;
        }

        .hero-black-hole-circles .orbit::before,
        .hero-black-hole-circles .orbit::after {
          position: absolute;
          top: 50%;
          width: 6px;
          height: 6px;
          border: 1px solid rgba(112, 199, 255, 0.3);
          border-radius: 50%;
          background: rgba(112, 199, 255, 0.01);
          box-shadow: 0 0 16px rgba(112, 199, 255, 0.28);
          content: "";
        }

        .hero-black-hole-circles .orbit::before { left: -4px; }
        .hero-black-hole-circles .orbit::after { right: -4px; }
      }

      @media (min-width: 721px) and (max-width: 1248px) {
        .dawn-hero,
        .hero-stage {
          min-height: min(1054px, calc(421px + 59.4375vw));
        }
      }

      .hero-content {
        position: relative;
        z-index: 6;
        width: 100%;
        padding: 0 20px;
        text-align: center;
      }

      .hero-heading-lockup {
        position: relative;
        isolation: isolate;
        display: inline-flex;
        max-width: 100%;
        flex-direction: column;
        align-items: center;
      }

      .hero-heading-lockup::before {
        position: absolute;
        z-index: 0;
        top: -58px;
        left: 36%;
        width: 78%;
        height: 170px;
        pointer-events: none;
        background: radial-gradient(ellipse 62% 58% at 13% 50%, rgba(225, 248, 255, 0.14) 0%, rgba(101, 180, 246, 0.08) 34%, rgba(34, 91, 176, 0.03) 58%, transparent 78%);
        filter: blur(24px);
        opacity: 0.78;
        content: "";
      }

      .hero-heading-lockup::after {
        content: none;
      }

      .hero-heading-lockup > .hero-badge,
      .hero-heading-lockup > .hero-title {
        position: relative;
        z-index: 1;
      }

      .hero-badge {
        position: relative;
        isolation: isolate;
        display: flex;
        width: var(--hero-primary-line-width, max-content);
        max-width: none;
        align-items: center;
        margin: 0 0 18px;
        overflow: visible;
        border: 1px solid transparent;
        border-radius: 99px;
        padding: 0.45em 1.35em 0.45em 0.58em;
        background:
          radial-gradient(ellipse 31% 220% at 49% 50%, rgba(233, 249, 255, 0.24) 0%, rgba(136, 204, 244, 0.145) 30%, rgba(61, 131, 196, 0.052) 61%, transparent 82%) padding-box,
          linear-gradient(180deg, rgba(218, 242, 255, 0.1), rgba(93, 159, 225, 0.028) 34%, rgba(1, 10, 27, 0.25) 100%) padding-box,
          linear-gradient(90deg, rgba(2, 10, 24, 0.84), rgba(4, 16, 35, 0.76) 34%, rgba(8, 27, 53, 0.68) 52%, rgba(3, 15, 34, 0.78) 82%, rgba(2, 9, 23, 0.84)) padding-box;
        box-shadow:
          inset 0 1px rgba(226, 247, 255, 0.16),
          inset 0 -1px rgba(112, 190, 255, 0.13),
          inset 0 0 24px rgba(68, 151, 255, 0.065),
          0 10px 30px rgba(0, 0, 0, 0.22),
          0 0 24px rgba(35, 132, 255, 0.055);
        color: #eaf6ff;
        font-family: var(--font-copy);
        font-size: clamp(14px, 1.25vw, 18px);
        font-weight: 300;
        line-height: 1.45;
        text-shadow: 0 0 14px rgba(181, 230, 255, 0.12);
        white-space: nowrap;
        backdrop-filter: blur(16px) saturate(1.18);
        -webkit-backdrop-filter: blur(16px) saturate(1.18);
      }

      .hero-badge::before {
        position: absolute;
        z-index: -1;
        inset: 1px;
        border-radius: inherit;
        pointer-events: none;
        background:
          radial-gradient(ellipse 30% 190% at 49% 50%, rgba(231, 249, 255, 0.2) 0%, rgba(137, 205, 244, 0.115) 32%, rgba(64, 132, 196, 0.04) 62%, transparent 82%),
          linear-gradient(180deg, rgba(255, 255, 255, 0.065), transparent 34%, rgba(1, 8, 22, 0.12));
        filter: blur(2.5px);
        opacity: 0.86;
        content: "";
      }

      .hero-badge::after {
        position: absolute;
        z-index: 2;
        inset: 0;
        border: 1px solid transparent;
        border-radius: inherit;
        pointer-events: none;
        background: linear-gradient(90deg, rgba(153, 211, 247, 0.18), rgba(91, 167, 237, 0.12) 30%, rgba(224, 250, 255, 0.38) 47%, rgba(99, 179, 243, 0.16) 67%, rgba(133, 205, 248, 0.18)) border-box;
        filter: drop-shadow(0 0 4px rgba(100, 194, 255, 0.07));
        content: "";
        -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
        -webkit-mask-composite: xor;
        mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
        mask-composite: exclude;
      }

      .badge-logo-mark {
        position: relative;
        z-index: 3;
        display: inline-flex;
        width: 1.35em;
        height: 1.35em;
        flex: 0 0 1.35em;
        align-items: center;
        justify-content: center;
        margin-right: 0.22em;
      }

      .badge-logo-mark img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: contain;
      }

      .hero-badge-copy {
        position: relative;
        z-index: 3;
      }

      .hero-badge-copy:last-child {
        text-shadow: 0 0 12px rgba(205, 241, 255, 0.23);
      }

      .badge-light-slit {
        position: relative;
        z-index: 1;
        width: 2px;
        height: 1.7em;
        flex: 0 0 2px;
        align-self: center;
        margin: 0 0.48em 0 0.42em;
        border-radius: 999px;
        pointer-events: none;
        background: linear-gradient(180deg, transparent 0%, #caa8ff 13%, #fff 42%, #f8f0ff 58%, #b982ff 87%, transparent 100%);
        box-shadow:
          0 0 2px rgba(255, 255, 255, 1),
          0 0 7px rgba(239, 218, 255, 0.98),
          0 0 17px rgba(181, 111, 255, 0.78),
          0 0 34px rgba(118, 59, 241, 0.46);
        mix-blend-mode: normal;
      }

      .badge-light-slit::before {
        position: absolute;
        z-index: 0;
        top: 50%;
        left: 100%;
        width: clamp(320px, 30vw, 400px);
        height: clamp(190px, 20vw, 250px);
        pointer-events: none;
        background: conic-gradient(
          from 68deg at 0% 50%,
          transparent 0deg,
          rgba(113, 47, 255, 0.14) 4deg,
          rgba(150, 80, 255, 0.62) 13deg,
          rgba(213, 161, 255, 0.86) 22deg,
          rgba(150, 80, 255, 0.6) 31deg,
          rgba(113, 47, 255, 0.12) 40deg,
          transparent 44deg
        );
        filter: blur(21px) saturate(1.2);
        opacity: 0.96;
        transform: translate3d(-1px, -50%, 0);
        transform-origin: left center;
        -webkit-mask-image: linear-gradient(90deg, #000 0 16%, rgba(0, 0, 0, 0.88) 38%, rgba(0, 0, 0, 0.42) 70%, transparent 100%);
        mask-image: linear-gradient(90deg, #000 0 16%, rgba(0, 0, 0, 0.88) 38%, rgba(0, 0, 0, 0.42) 70%, transparent 100%);
        mix-blend-mode: normal;
        content: "";
      }

      .badge-light-slit::after {
        position: absolute;
        z-index: 1;
        top: 50%;
        left: 100%;
        width: clamp(210px, 21vw, 290px);
        height: clamp(90px, 11vw, 130px);
        pointer-events: none;
        background: conic-gradient(
          from 76deg at 0% 50%,
          transparent 0deg,
          rgba(231, 204, 255, 0.18) 3deg,
          rgba(255, 255, 255, 0.96) 10deg,
          rgba(225, 185, 255, 0.88) 14deg,
          rgba(170, 95, 255, 0.5) 21deg,
          rgba(111, 48, 242, 0.08) 29deg,
          transparent 33deg
        );
        filter: blur(7px) saturate(1.18);
        opacity: 0.96;
        transform: translate3d(-1px, -50%, 0);
        transform-origin: left center;
        -webkit-mask-image: linear-gradient(90deg, #000 0 14%, rgba(0, 0, 0, 0.96) 38%, rgba(0, 0, 0, 0.58) 66%, rgba(0, 0, 0, 0.18) 84%, transparent 100%);
        mask-image: linear-gradient(90deg, #000 0 14%, rgba(0, 0, 0, 0.96) 38%, rgba(0, 0, 0, 0.58) 66%, rgba(0, 0, 0, 0.18) 84%, transparent 100%);
        mix-blend-mode: normal;
        content: "";
      }

      .hero-title {
        display: flex;
        width: max-content;
        max-width: none;
        flex-direction: column;
        align-items: center;
        margin: 0 0 17px;
        color: transparent;
        background: linear-gradient(180deg, #fff 0%, rgba(255, 255, 255, 0.68) 100%);
        background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        font-family: var(--font-title);
        font-size: clamp(46px, 5.3vw, 80px);
        font-weight: 900;
        letter-spacing: -0.055em;
        line-height: 1.14;
      }

      .hero-title span {
        display: block;
        width: max-content;
        white-space: nowrap;
      }

      .hero-title .mobile-break {
        display: none;
      }

      .hero-description {
        max-width: 510px;
        margin: 0 auto;
        color: var(--soft-ink);
        font-family: var(--font-copy);
        font-size: clamp(16px, 1.45vw, 21px);
        font-weight: 300;
        line-height: 1.6;
        text-shadow: 0 2px 18px rgba(3, 0, 20, 0.92);
      }

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

      .product-preview {
        position: relative;
        z-index: 7;
        isolation: isolate;
        width: min(1050px, calc(100vw - 48px));
        margin: 112px auto 0;
        color: #f3f8ff;
        text-align: left;
      }

      .product-preview::before {
        position: absolute;
        z-index: -1;
        top: 7%;
        right: 12%;
        left: 12%;
        height: 69%;
        border-radius: 50%;
        background: radial-gradient(ellipse, rgba(31, 143, 255, 0.43), rgba(31, 143, 255, 0.12) 42%, transparent 72%);
        content: "";
        filter: blur(29px);
      }

      .product-preview-shell {
        position: relative;
        overflow: hidden;
        border: 1px solid rgba(185, 226, 255, 0.31);
        border-radius: 27px 27px 0 0;
        padding: 8px;
        background: var(--glass);
        box-shadow: 0 34px 84px rgba(0, 0, 0, 0.43), inset 0 1px 0 rgba(255, 255, 255, 0.25);
        backdrop-filter: blur(18px) saturate(1.16);
        -webkit-backdrop-filter: blur(18px) saturate(1.16);
      }

      .product-preview-shell::before {
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        height: 110px;
        pointer-events: none;
        background: linear-gradient(180deg, rgba(255, 255, 255, 0.1), transparent);
        content: "";
      }

      /* 主业务窗口保持实底；外壳保留半透明材质，并由毛玻璃托住。 */
      .product-preview-shell.is-shell-transparent {
        isolation: isolate;
        background:
          linear-gradient(135deg, rgba(8, 60, 130, 0.54), rgba(2, 17, 49, 0.64) 52%, rgba(5, 47, 111, 0.58));
        box-shadow:
          0 28px 76px rgba(0, 0, 0, 0.32),
          inset 0 1px 0 rgba(255, 255, 255, 0.23),
          inset 0 0 0 1px rgba(139, 221, 255, 0.08);
        backdrop-filter: blur(24px) saturate(1.24) brightness(0.78);
        -webkit-backdrop-filter: blur(24px) saturate(1.24) brightness(0.78);
      }

      .product-preview-shell.is-shell-transparent::before {
        z-index: 0;
        inset: 0;
        height: auto;
        opacity: 1;
        background:
          radial-gradient(72% 44% at 50% 0%, rgba(98, 194, 255, 0.22), transparent 72%),
          linear-gradient(180deg, rgba(255, 255, 255, 0.11), rgba(18, 114, 228, 0.04) 48%, transparent);
      }

      .product-preview-shell.is-shell-transparent .actual-app-frame {
        z-index: 1;
        border-color: rgba(185, 226, 255, 0.38);
        background:
          radial-gradient(58% 72% at 22% 18%, rgba(98, 194, 255, 0.22), transparent 68%),
          radial-gradient(42% 52% at 82% 12%, rgba(36, 143, 255, 0.2), transparent 70%),
          linear-gradient(138deg, rgba(7, 48, 111, 0.58), rgba(2, 14, 43, 0.48) 64%, rgba(5, 43, 101, 0.54));
        box-shadow:
          inset 0 1px 0 rgba(255, 255, 255, 0.22),
          inset 0 0 42px rgba(31, 143, 255, 0.1),
          0 16px 48px rgba(1, 7, 21, 0.26);
        backdrop-filter: blur(18px) saturate(1.18) brightness(0.82);
        -webkit-backdrop-filter: blur(18px) saturate(1.18) brightness(0.82);
      }

      .product-preview-shell.is-shell-transparent .actual-app-frame img {
        position: relative;
        z-index: 1;
        opacity: 1;
        filter: hue-rotate(-48deg) saturate(1.04) contrast(1.01) brightness(.98);
      }

      .product-preview-shell.is-shell-transparent .actual-app-frame::after {
        background: linear-gradient(135deg, rgba(117, 207, 255, 0.05), transparent 42%, rgba(6, 81, 190, 0.07));
      }

      .product-label {
        position: absolute;
        z-index: 3;
        top: 20px;
        right: 20px;
        border: 1px solid rgba(206, 239, 255, 0.39);
        border-radius: 99px;
        padding: 6px 10px;
        color: rgba(242, 250, 255, 0.95);
        background: rgba(3, 24, 60, 0.56);
        box-shadow: inset 0 1px rgba(255, 255, 255, 0.12);
        font-size: 11px;
        letter-spacing: 0.04em;
        backdrop-filter: blur(8px);
        -webkit-backdrop-filter: blur(8px);
      }

      .actual-app-frame {
        position: relative;
        overflow: hidden;
        aspect-ratio: 2440 / 1346;
        border: 1px solid rgba(255, 255, 255, 0.36);
        border-radius: 19px 19px 0 0;
        background: rgba(3, 31, 76, 0.26);
        box-shadow: inset 0 1px rgba(255, 255, 255, 0.46), 0 16px 48px rgba(1, 9, 30, 0.24);
      }

      .actual-app-frame img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center bottom;
        opacity: 0.93;
        filter: hue-rotate(-48deg) saturate(1.04) contrast(1.01) brightness(.98);
      }

      .actual-app-frame picture {
        display: block;
        width: 100%;
        height: 100%;
      }

      .actual-app-frame::after {
        position: absolute;
        z-index: 2;
        inset: 0;
        pointer-events: none;
        background: linear-gradient(135deg, rgba(31, 143, 255, 0.15), transparent 39%, rgba(5, 83, 196, 0.1));
        content: "";
      }

      .hero-story {
        position: relative;
        z-index: 2;
        overflow: hidden;
      }

      .hero-story::before {
        position: absolute;
        inset: 0;
        pointer-events: none;
        background: radial-gradient(48% 38% at 72% 22%, rgba(20, 110, 232, 0.12), transparent 72%);
        content: "";
      }

      .hero-story-inner {
        --story-copy-width: 565px;
        --timeline-axis-offset: 90px;
        position: relative;
        width: var(--content-width);
        min-height: 585px;
        margin: 0 auto;
        padding: 64px 0 128px;
      }

      .hero-story-copy {
        position: relative;
        z-index: 1;
        width: min(var(--story-copy-width), 100%);
        margin-left: auto;
      }

      .hero-story-title {
        margin: 0;
        color: #f8fbff;
        font-family: var(--font-title);
        font-size: clamp(35px, 3.3vw, 48px);
        font-weight: 900;
        letter-spacing: -0.052em;
        line-height: 1.52;
        text-wrap: balance;
      }

      .hero-story-title span,
      .hero-story-copy p span {
        display: block;
      }

      .hero-story-copy p {
        margin: 20px 0 0;
        color: rgba(233, 243, 255, 0.84);
        font-family: var(--font-copy);
        font-size: clamp(18px, 1.6vw, 24px);
        font-weight: 300;
        letter-spacing: -0.02em;
        line-height: 1.78;
      }

      .story-timeline {
        position: relative;
        width: calc(100% - var(--story-copy-width));
        min-height: 272px;
        margin-top: 46px;
      }

      .story-timeline::before {
        position: absolute;
        top: 0;
        right: 0;
        left: var(--timeline-axis-offset);
        height: 1px;
        background: linear-gradient(90deg, rgba(23, 126, 255, 0.14), rgba(70, 165, 255, 0.72) 58%, rgba(178, 224, 255, 0.42));
        content: "";
      }

      .story-timeline::after {
        position: absolute;
        top: 0;
        bottom: 0;
        left: var(--timeline-axis-offset);
        width: 1px;
        background: linear-gradient(180deg, rgba(71, 163, 255, 0.8), rgba(31, 133, 255, 0.24) 82%, transparent);
        box-shadow: 0 0 16px rgba(31, 137, 255, 0.28);
        content: "";
      }

      .story-timeline-list {
        position: relative;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 24px 38px;
        margin: 0;
        padding: 35px 0 8px calc(var(--timeline-axis-offset) + 31px);
        list-style: none;
      }

      .story-timeline-item {
        position: relative;
        min-width: 0;
      }

      .story-timeline-item::before {
        position: absolute;
        top: 0.56em;
        left: -35px;
        width: 7px;
        height: 7px;
        border: 1px solid rgba(210, 239, 255, 0.88);
        border-radius: 50%;
        background: #177eff;
        box-shadow: 0 0 0 5px rgba(23, 126, 255, 0.13), 0 0 16px rgba(52, 151, 255, 0.9);
        content: "";
      }

      .story-timeline-item time {
        display: block;
        color: #d9efff;
        font-family: var(--font-title);
        font-size: 15px;
        font-weight: 900;
        letter-spacing: 0.03em;
      }

      .story-timeline-item span {
        display: block;
        margin-top: 5px;
        color: rgba(203, 229, 252, 0.71);
        font-family: var(--font-copy);
        font-size: 13px;
        font-weight: 300;
        line-height: 1.5;
      }

      .founder-intro {
        position: relative;
        z-index: 1;
      }

      .founder-intro-inner {
        position: relative;
        z-index: 1;
        display: grid;
        grid-template-columns: minmax(390px, 0.9fr) minmax(460px, 1.1fr);
        width: var(--content-width);
        align-items: start;
        gap: clamp(48px, 7vw, 96px);
        margin: 0 auto;
        padding: 0 0 clamp(112px, 12vw, 176px);
      }

      .founder-portrait {
        position: relative;
        width: 100%;
        margin: 0;
      }

      .founder-portrait-frame {
        --portrait-panel-bottom: 18%;
        --portrait-scrim-bottom: 26%;
        position: relative;
        isolation: isolate;
        aspect-ratio: 4 / 5;
        overflow: hidden;
        border: 1px solid rgba(119, 188, 255, 0.34);
        border-radius: 24px;
        background: linear-gradient(145deg, rgba(6, 21, 45, 0.98), rgba(2, 8, 23, 0.99));
        box-shadow:
          0 22px 48px rgba(0, 0, 0, 0.28),
          0 19px 40px rgba(19, 112, 255, 0.18);
      }

      .founder-portrait-frame img {
        position: absolute;
        z-index: 1;
        inset: 0;
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center bottom;
      }

      .founder-portrait-frame .founder-glasses-optics {
        z-index: 3;
        pointer-events: none;
      }

      .founder-portrait-frame::after {
        position: absolute;
        z-index: 4;
        inset: calc(100% - var(--portrait-scrim-bottom)) 0 0;
        pointer-events: none;
        background:
          linear-gradient(180deg, transparent, rgba(2, 8, 23, 0.3) 36%, rgba(2, 8, 23, 0.9) 100%),
          linear-gradient(90deg, rgba(2, 8, 23, 0.34), transparent 72%);
        content: "";
      }

      .founder-metrics {
        position: absolute;
        z-index: 5;
        right: 28px;
        bottom: 28px;
        left: 28px;
        display: grid;
        gap: 14px;
        margin: 0;
      }

      .founder-metric-title {
        display: block;
        color: #f8fbff;
        font-family: var(--font-title);
        font-size: clamp(24px, 2.2vw, 34px);
        font-weight: 900;
        letter-spacing: -0.045em;
        line-height: 1.16;
      }

      .founder-metric-detail {
        display: block;
        margin-top: 5px;
        color: rgba(230, 241, 255, 0.8);
        font-family: var(--font-copy);
        font-size: clamp(11px, 0.9vw, 14px);
        font-weight: 300;
        letter-spacing: -0.02em;
        line-height: 1.48;
      }

      .founder-copy {
        width: min(100%, 565px);
        justify-self: end;
      }

      .founder-copy-title {
        margin: 0;
        color: #f8fbff;
        font-family: var(--font-title);
        font-size: clamp(34px, 3.3vw, 50px);
        font-weight: 900;
        letter-spacing: -0.068em;
        line-height: 1.34;
        text-wrap: balance;
      }

      .founder-copy-title span {
        display: block;
      }

      .founder-copy-questions {
        display: grid;
        gap: 0;
        margin: clamp(24px, 2.25vw, 30px) 0 0;
        padding: 0;
      }

      .founder-copy-question {
        position: relative;
        display: grid;
        grid-template-columns: clamp(29px, 2.5vw, 36px) minmax(0, 1fr);
        column-gap: clamp(10px, 1.15vw, 15px);
        row-gap: 4px;
        padding: clamp(14px, 1.4vw, 18px) 0;
      }

      .founder-copy-question:first-child {
        padding-top: 0;
      }

      .founder-copy-question + .founder-copy-question {
        border-top: 1px solid rgba(150, 208, 255, 0.13);
      }

      .founder-copy-question::before {
        grid-column: 1;
        grid-row: 1;
        align-self: start;
        margin-top: 0.3em;
        color: rgba(117, 194, 255, 0.68);
        content: attr(data-index);
        font-family: var(--font-copy);
        font-size: clamp(10px, 0.78vw, 12px);
        font-weight: 300;
        letter-spacing: 0.08em;
        line-height: 1.2;
      }

      .founder-copy-question-title {
        grid-column: 2;
        margin: 0;
        color: #f8fbff;
        font-family: var(--font-title);
        font-size: clamp(21px, 1.85vw, 26px);
        font-weight: 900;
        letter-spacing: -0.06em;
        line-height: 1.3;
        text-wrap: balance;
      }

      .founder-copy-question-detail {
        grid-column: 2;
        margin: 0;
        color: rgba(218, 237, 255, 0.76);
        font-family: var(--font-copy);
        font-size: clamp(16px, 1.3vw, 19px);
        font-weight: 300;
        letter-spacing: -0.02em;
        line-height: 1.66;
      }

      .founder-copy-summary {
        margin: 0;
        border-top: 1px solid rgba(150, 208, 255, 0.18);
        padding-top: clamp(16px, 1.5vw, 20px);
        color: rgba(195, 222, 247, 0.68);
        font-family: var(--font-copy);
        font-size: clamp(15px, 1.15vw, 17px);
        font-weight: 300;
        letter-spacing: -0.02em;
        line-height: 1.7;
      }

      .founder-transitions-section {
        position: relative;
        z-index: 1;
      }

      .founder-transitions-inner {
        position: relative;
        z-index: 1;
        width: var(--content-width);
        margin: 0 auto;
        padding: 0 0 clamp(64px, 6vw, 88px);
      }

      .founder-transitions {
        margin: 0;
      }

      .founder-transitions-bridge {
        margin: 0;
        color: #f8fbff;
        font-family: var(--font-title);
        font-size: clamp(30px, 2.7vw, 40px);
        font-weight: 900;
        letter-spacing: -0.068em;
        line-height: 1.3;
        text-align: center;
        text-wrap: balance;
      }

      .founder-transitions-title {
        margin: clamp(9px, 1vw, 13px) 0 0;
        color: rgba(218, 237, 255, 0.72);
        font-family: var(--font-title);
        font-size: clamp(20px, 1.75vw, 27px);
        font-weight: 900;
        letter-spacing: -0.055em;
        line-height: 1.42;
        text-align: center;
        text-wrap: balance;
      }

      .founder-transition-list {
        display: grid;
        width: min(100%, 960px);
        gap: 12px;
        margin: clamp(24px, 2.5vw, 34px) auto 0;
        padding: 0;
        list-style: none;
      }

      .founder-transition-card,
      .ai-system-item,
      .founder-portrait-panel {
        position: relative;
        isolation: isolate;
        overflow: hidden;
        border: 1px solid transparent;
        border-radius: 24px;
        padding: clamp(18px, 1.8vw, 22px) clamp(18px, 1.8vw, 22px) clamp(17px, 1.7vw, 20px);
        background:
          radial-gradient(118% 92% at 50% 116%, rgba(83, 170, 255, 0.78) 0%, rgba(39, 123, 246, 0.34) 16%, transparent 46%) padding-box,
          radial-gradient(118% 136% at 70% -35%, rgba(53, 128, 244, 0.46) 0%, rgba(22, 78, 166, 0.22) 38%, transparent 68%) padding-box,
          linear-gradient(180deg, rgba(223, 244, 255, 0.085), transparent 17%) padding-box,
          linear-gradient(145deg, rgba(10, 29, 59, 0.975), rgba(3, 15, 36, 0.985) 62%, rgba(8, 32, 69, 0.97)) padding-box,
          linear-gradient(180deg, rgba(119, 188, 255, 0.58), rgba(59, 130, 226, 0.24) 58%, rgba(112, 187, 235, 0.28)) border-box;
        box-shadow:
          0 22px 48px rgba(0, 0, 0, 0.28),
          0 19px 40px rgba(19, 112, 255, 0.18),
          inset 0 1px rgba(225, 246, 255, 0.15),
          inset 0 -30px 36px rgba(42, 142, 255, 0.36),
          inset 0 -3px 6px rgba(183, 241, 255, 0.94);
        text-align: left;
      }

      .founder-portrait-frame > .founder-portrait-panel {
        position: absolute;
        z-index: 0;
        inset: 0 0 var(--portrait-panel-bottom);
        display: block;
        padding: 0;
        pointer-events: none;
        background:
          radial-gradient(88% 38% at 50% 102%, rgba(223, 248, 255, 0.9) 0%, rgba(108, 199, 255, 0.68) 18%, rgba(44, 144, 255, 0.38) 45%, transparent 76%) padding-box,
          radial-gradient(124% 104% at 50% 106%, rgba(73, 170, 255, 0.9) 0%, rgba(31, 119, 246, 0.54) 23%, rgba(12, 65, 165, 0.22) 48%, transparent 68%) padding-box,
          radial-gradient(118% 136% at 70% -35%, rgba(53, 128, 244, 0.5) 0%, rgba(22, 78, 166, 0.24) 38%, transparent 68%) padding-box,
          linear-gradient(180deg, rgba(223, 244, 255, 0.11), transparent 17%) padding-box,
          linear-gradient(145deg, rgba(10, 29, 59, 0.98), rgba(3, 15, 36, 0.99) 62%, rgba(8, 32, 69, 0.98)) padding-box,
          linear-gradient(180deg, rgba(149, 211, 255, 0.72), rgba(59, 130, 226, 0.3) 58%, rgba(169, 226, 255, 0.68)) border-box;
        box-shadow:
          0 22px 48px rgba(0, 0, 0, 0.28),
          0 22px 52px rgba(27, 132, 255, 0.32),
          inset 0 1px rgba(237, 250, 255, 0.24),
          inset 0 -44px 56px rgba(42, 151, 255, 0.54),
          inset 0 -3px 8px rgba(205, 247, 255, 0.98);
      }

      .founder-transition-card::before,
      .ai-system-item::before,
      .founder-portrait-panel::before {
        position: absolute;
        z-index: 0;
        inset: 39% 0 0;
        pointer-events: none;
        background:
          linear-gradient(rgba(102, 176, 255, 0.1) 1px, transparent 1px),
          linear-gradient(90deg, rgba(102, 176, 255, 0.1) 1px, transparent 1px);
        background-size: 29px 24px;
        mask-image: linear-gradient(180deg, transparent, rgba(0, 0, 0, 0.5) 25%, #000 78%);
        -webkit-mask-image: linear-gradient(180deg, transparent, rgba(0, 0, 0, 0.5) 25%, #000 78%);
        opacity: 0.82;
        content: "";
      }

      .founder-transition-card h3,
      .ai-system-item h3 {
        position: relative;
        z-index: 1;
        margin: 0;
        padding-right: 0;
        color: #f6fbff;
        font-family: var(--font-title);
        font-size: clamp(18px, 1.45vw, 21px);
        font-weight: 900;
        letter-spacing: -0.06em;
        line-height: 1.3;
      }

      .founder-transition-card p,
      .ai-system-item p {
        position: relative;
        z-index: 1;
        margin: 8px 0 0;
        color: rgba(218, 237, 255, 0.77);
        font-family: var(--font-copy);
        font-size: clamp(13px, 0.95vw, 14px);
        font-weight: 300;
        letter-spacing: -0.035em;
        line-height: 1.62;
      }

      .ai-shift {
        position: relative;
        z-index: 1;
      }

      .ai-shift-inner {
        position: relative;
        z-index: 1;
        width: var(--content-width);
        margin: 0 auto;
        padding: 0 0 clamp(48px, 5vw, 72px);
        text-align: center;
      }

      .ai-shift-title {
        max-width: 1120px;
        margin: 0 auto;
        color: #f8fbff;
        font-family: var(--font-title);
        font-size: clamp(36px, 4vw, 58px);
        font-weight: 900;
        letter-spacing: -0.052em;
        line-height: 1.32;
        text-wrap: balance;
      }

      .ai-shift-stages {
        margin: clamp(30px, 3.2vw, 48px) auto 0;
        color: rgba(226, 240, 255, 0.86);
        font-family: var(--font-copy);
        font-size: clamp(18px, 1.55vw, 23px);
        font-weight: 300;
        letter-spacing: -0.02em;
        line-height: 1.78;
      }

      .ai-shift-stages span {
        display: block;
      }

      .ai-system-grid {
        display: grid;
        width: min(100%, 420px);
        grid-template-columns: repeat(3, minmax(0, 1fr));
        grid-auto-rows: 1fr;
        gap: 10px;
        margin: clamp(30px, 3.6vw, 46px) auto 0;
        padding: 0;
        list-style: none;
        text-align: left;
      }

      .ai-system-item {
        min-width: 0;
      }

      .ai-system-item h3 {
        padding-right: 0;
      }

      .system-loop-section {
        position: relative;
        z-index: 1;
        overflow: hidden;
        overflow: clip;
        border-top: 1px solid rgba(150, 208, 255, 0.1);
        padding: clamp(72px, 7.2vw, 104px) 0 clamp(104px, 10vw, 152px);
      }

      .system-loop-section::before,
      .system-loop-section::after {
        position: absolute;
        z-index: 0;
        pointer-events: none;
        content: "";
      }

      .system-loop-section::before {
        inset: 0;
        background:
          radial-gradient(52% 26% at 22% 32%, rgba(22, 104, 226, 0.16), transparent 72%),
          radial-gradient(46% 20% at 78% 76%, rgba(26, 130, 255, 0.09), transparent 76%),
          linear-gradient(180deg, rgba(3, 13, 32, 0.06), rgba(1, 7, 21, 0.44));
      }

      .system-loop-section::after {
        inset: 42% 0 0;
        opacity: 0.28;
        background-image:
          linear-gradient(rgba(92, 164, 236, 0.055) 1px, transparent 1px),
          linear-gradient(90deg, rgba(92, 164, 236, 0.055) 1px, transparent 1px);
        background-size: 42px 36px;
        mask-image: linear-gradient(180deg, transparent, #000 30%, transparent 92%);
        -webkit-mask-image: linear-gradient(180deg, transparent, #000 30%, transparent 92%);
      }

      .system-loop-inner {
        position: relative;
        z-index: 1;
        width: var(--content-width);
        margin: 0 auto;
      }

      .system-loop-heading {
        max-width: 960px;
        margin: 0 auto;
        text-align: center;
      }

      .system-loop-eyebrow {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        margin: 0 0 18px;
        color: rgba(173, 220, 255, 0.68);
        font-family: "Aeonik Local", var(--font-copy);
        font-size: 11px;
        font-weight: 500;
        letter-spacing: 0.18em;
        line-height: 1;
        text-transform: uppercase;
      }

      .system-loop-eyebrow::before {
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: #72caff;
        box-shadow: 0 0 14px rgba(79, 178, 255, 0.86);
        content: "";
      }

      .system-loop-title {
        margin: 0;
        color: #f8fbff;
        font-family: var(--font-title);
        font-size: clamp(34px, 4vw, 58px);
        font-weight: 900;
        letter-spacing: -0.06em;
        line-height: 1.25;
        text-wrap: balance;
      }

      .system-loop-subtitle {
        max-width: 860px;
        margin: clamp(22px, 2.3vw, 32px) auto 0;
        color: rgba(218, 237, 255, 0.74);
        font-family: var(--font-copy);
        font-size: clamp(16px, 1.35vw, 20px);
        font-weight: 300;
        letter-spacing: -0.025em;
        line-height: 1.75;
      }

      .system-offer-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        align-items: stretch;
        gap: clamp(14px, 1.8vw, 24px);
        margin: clamp(44px, 5.2vw, 72px) 0 0;
        padding: 0;
        list-style: none;
      }

      .system-offer-card {
        position: relative;
        isolation: isolate;
        display: flex;
        min-width: 0;
        flex-direction: column;
        overflow: hidden;
        border: 1px solid rgba(129, 190, 246, 0.28);
        border-radius: 26px;
        padding: clamp(24px, 2.7vw, 34px);
        background:
          radial-gradient(112% 58% at 24% 0%, rgba(43, 135, 250, 0.2), transparent 60%),
          linear-gradient(145deg, rgba(11, 31, 61, 0.96), rgba(3, 14, 34, 0.98) 66%, rgba(5, 26, 57, 0.97));
        box-shadow:
          0 24px 56px rgba(0, 0, 0, 0.26),
          inset 0 1px rgba(225, 246, 255, 0.1);
      }

      .system-offer-card::before {
        position: absolute;
        z-index: 0;
        right: -18%;
        bottom: -32%;
        left: -18%;
        height: 50%;
        opacity: 0.65;
        background-image:
          linear-gradient(rgba(102, 176, 255, 0.075) 1px, transparent 1px),
          linear-gradient(90deg, rgba(102, 176, 255, 0.075) 1px, transparent 1px);
        background-size: 28px 24px;
        content: "";
      }

      .system-offer-card > * {
        position: relative;
        z-index: 1;
      }

      .system-offer-index {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        color: rgba(108, 191, 255, 0.82);
        font-family: "Aeonik Local", var(--font-copy);
        font-size: 11px;
        font-weight: 500;
        letter-spacing: 0.16em;
        line-height: 1;
      }

      .system-offer-index::after {
        width: 28px;
        height: 1px;
        background: linear-gradient(90deg, rgba(117, 207, 255, 0.8), transparent);
        box-shadow: 0 0 8px rgba(60, 164, 255, 0.34);
        content: "";
      }

      .system-offer-card h3 {
        margin: 20px 0 0;
        color: #f7fbff;
        font-family: var(--font-title);
        font-size: clamp(23px, 2vw, 30px);
        font-weight: 900;
        letter-spacing: -0.055em;
        line-height: 1.28;
        text-wrap: balance;
      }

      .system-offer-card-title {
        display: grid;
        gap: 7px;
      }

      .system-offer-card-name {
        display: block;
        font-size: clamp(31px, 2.65vw, 40px);
        line-height: 1.08;
      }

      .system-offer-card-pain,
      .system-offer-card-tagline {
        display: block;
        font-size: inherit;
        line-height: 1.28;
      }

      .system-offer-lead {
        margin: 14px 0 0;
        color: rgba(208, 234, 255, 0.9);
        font-family: var(--font-title);
        font-size: clamp(15px, 1.14vw, 17px);
        font-weight: 900;
        letter-spacing: -0.035em;
        line-height: 1.55;
      }

      .system-offer-list {
        display: grid;
        gap: 11px;
        margin: 24px 0 0;
        border-top: 1px solid rgba(150, 208, 255, 0.14);
        padding: 20px 0 0;
        list-style: none;
      }

      .system-offer-media {
        box-sizing: border-box;
        width: 100%;
        aspect-ratio: 5 / 2;
        margin: 20px 0 0;
        border: 1px solid rgba(144, 210, 255, 0.15);
        border-radius: 12px;
        padding: 6px;
        overflow: hidden;
        background: rgba(5, 25, 56, 0.48);
        box-shadow: inset 0 1px rgba(225, 246, 255, 0.05);
      }

      .system-offer-media img {
        display: block;
        width: 100%;
        height: 100%;
        border-radius: 7px;
        object-fit: cover;
        box-shadow: 0 6px 14px rgba(0, 0, 0, 0.24);
      }

      .system-course-cover-wall,
      .system-knowledge-screen-wall {
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        grid-template-rows: repeat(2, minmax(0, 1fr));
        gap: 6px;
      }

      .system-knowledge-screen-wall img {
        grid-row: span 2;
        object-position: center;
      }

      .system-system-preview-wall {
        display: flex;
        align-items: stretch;
        justify-content: center;
        background: #090d16;
      }

      .system-system-preview-wall img {
        object-fit: contain;
        object-position: center;
      }

      .system-offer-list li {
        position: relative;
        padding-left: 20px;
        color: rgba(218, 237, 255, 0.74);
        font-family: var(--font-copy);
        font-size: clamp(13px, 1vw, 15px);
        font-weight: 300;
        letter-spacing: -0.018em;
        line-height: 1.7;
      }

      .system-offer-list li::before {
        position: absolute;
        top: 0.45em;
        left: 0;
        width: 13px;
        height: 13px;
        background: linear-gradient(145deg, #ffb12b 0%, #f7ffff 17%, #75f7ff 37%, #19ccef 63%, #2b64ff 100%);
        filter:
          drop-shadow(0 0 5px rgba(47, 211, 255, 0.72))
          drop-shadow(0 0 12px rgba(43, 102, 255, 0.32));
        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M32 0C35.9 20.1 43.9 28.1 64 32C43.9 35.9 35.9 43.9 32 64C28.1 43.9 20.1 35.9 0 32C20.1 28.1 28.1 20.1 32 0Z'/%3E%3C/svg%3E") center / contain no-repeat;
        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M32 0C35.9 20.1 43.9 28.1 64 32C43.9 35.9 35.9 43.9 32 64C28.1 43.9 20.1 35.9 0 32C20.1 28.1 28.1 20.1 32 0Z'/%3E%3C/svg%3E") center / contain no-repeat;
        content: "";
      }

      /* Keep the three system parts side by side until the phone breakpoint. */
      @media (max-width: 720px) {
        .system-offer-grid {
          grid-template-columns: 1fr;
          gap: 14px;
          margin-top: 38px;
        }

        .system-offer-card {
          border-radius: 22px;
          padding: 23px 20px;
        }

        .system-offer-card h3 {
          margin-top: 16px;
          font-size: clamp(22px, 6.4vw, 26px);
        }

        .system-offer-card-title {
          gap: 5px;
        }

        .system-offer-card-name {
          font-size: clamp(29px, 8.4vw, 34px);
        }

        .system-offer-lead {
          margin-top: 11px;
          font-size: 15px;
        }

        .system-offer-list {
          gap: 9px;
          margin-top: 18px;
          padding-top: 16px;
        }

        .system-offer-media {
          gap: 5px;
          margin-top: 16px;
          border-radius: 11px;
          padding: 5px;
        }

        .system-offer-list li {
          font-size: 14px;
          line-height: 1.68;
        }
      }

      .system-loop-layout {
        display: grid;
        gap: 32px;
        margin-top: clamp(54px, 6vw, 82px);
      }

      .system-loop-map {
        position: relative;
        isolation: isolate;
        min-width: 0;
        overflow: hidden;
        margin: 0;
        border: 1px solid rgba(129, 190, 246, 0.28);
        border-radius: 28px;
        padding: clamp(24px, 3vw, 34px);
        background:
          radial-gradient(112% 74% at 48% 108%, rgba(43, 135, 250, 0.22), transparent 55%),
          linear-gradient(145deg, rgba(11, 31, 61, 0.96), rgba(3, 14, 34, 0.98) 64%, rgba(5, 26, 57, 0.97));
        box-shadow:
          0 26px 60px rgba(0, 0, 0, 0.28),
          0 18px 42px rgba(13, 99, 219, 0.12),
          inset 0 1px rgba(225, 246, 255, 0.1);
      }

      .system-loop-map::before {
        position: absolute;
        z-index: 0;
        inset: 38% 0 0;
        opacity: 0.6;
        background-image:
          linear-gradient(rgba(102, 176, 255, 0.08) 1px, transparent 1px),
          linear-gradient(90deg, rgba(102, 176, 255, 0.08) 1px, transparent 1px);
        background-size: 29px 24px;
        mask-image: linear-gradient(180deg, transparent, #000 38%, #000 100%);
        -webkit-mask-image: linear-gradient(180deg, transparent, #000 38%, #000 100%);
        content: "";
      }

      .system-loop-map > * {
        position: relative;
        z-index: 1;
      }

      .system-loop-map-head {
        display: flex;
        align-items: baseline;
        justify-content: space-between;
        gap: 18px;
        border-bottom: 1px solid rgba(150, 208, 255, 0.13);
        padding-bottom: 20px;
      }

      .system-loop-map-head strong {
        color: #f7fbff;
        font-family: var(--font-title);
        font-size: clamp(23px, 2vw, 28px);
        font-weight: 900;
        letter-spacing: -0.055em;
        line-height: 1.2;
      }

      .system-loop-map-head span {
        color: rgba(150, 205, 250, 0.45);
        font-family: "Aeonik Local", var(--font-copy);
        font-size: 9px;
        font-weight: 500;
        letter-spacing: 0.16em;
        line-height: 1;
      }

      .system-loop-steps {
        position: relative;
        display: grid;
        gap: 14px;
        margin: 26px 0 0;
        padding: 0;
        list-style: none;
      }

      .system-loop-steps::before {
        position: absolute;
        top: 21px;
        bottom: 21px;
        left: 20px;
        width: 1px;
        background: linear-gradient(180deg, rgba(95, 186, 255, 0.22), rgba(105, 205, 255, 0.76), rgba(95, 186, 255, 0.22));
        box-shadow: 0 0 14px rgba(36, 136, 255, 0.2);
        content: "";
      }

      .system-loop-step {
        position: relative;
        display: grid;
        min-height: 48px;
        grid-template-columns: 40px minmax(0, 1fr);
        align-items: center;
        gap: 15px;
      }

      .system-loop-step-index {
        position: relative;
        z-index: 1;
        display: grid;
        width: 40px;
        height: 40px;
        place-items: center;
        border: 1px solid rgba(145, 206, 255, 0.3);
        border-radius: 50%;
        color: rgba(202, 233, 255, 0.78);
        background: rgba(6, 28, 62, 0.94);
        box-shadow: 0 0 18px rgba(23, 118, 255, 0.14), inset 0 1px rgba(255, 255, 255, 0.08);
        font-family: "Aeonik Local", var(--font-copy);
        font-size: 10px;
        font-weight: 500;
        letter-spacing: 0.08em;
      }

      .system-loop-step:last-child .system-loop-step-index {
        color: #dff6ff;
        border-color: rgba(164, 226, 255, 0.58);
        background: linear-gradient(145deg, rgba(25, 102, 204, 0.82), rgba(7, 45, 103, 0.94));
        box-shadow: 0 0 24px rgba(41, 149, 255, 0.32), inset 0 1px rgba(255, 255, 255, 0.14);
      }

      .system-loop-step strong {
        display: block;
        color: rgba(239, 248, 255, 0.94);
        font-family: var(--font-title);
        font-size: clamp(18px, 1.5vw, 21px);
        font-weight: 900;
        letter-spacing: -0.045em;
        line-height: 1.25;
      }

      .system-loop-map-note {
        display: grid;
        grid-template-columns: 32px minmax(0, 1fr);
        align-items: center;
        gap: 11px;
        margin: 24px 0 0;
        border-top: 1px solid rgba(150, 208, 255, 0.12);
        padding-top: 18px;
        color: rgba(190, 222, 250, 0.52);
        font-family: var(--font-copy);
        font-size: 12px;
        font-weight: 300;
        letter-spacing: -0.015em;
        line-height: 1.65;
      }

      .system-loop-map-note::before {
        display: grid;
        width: 32px;
        height: 32px;
        place-items: center;
        border: 1px solid rgba(146, 212, 255, 0.28);
        border-radius: 50%;
        color: #9edfff;
        background: rgba(20, 91, 179, 0.14);
        box-shadow: 0 0 18px rgba(48, 150, 255, 0.16), inset 0 1px rgba(255, 255, 255, 0.08);
        content: "↺";
        font-family: "Aeonik Local", var(--font-copy);
        font-size: 17px;
        line-height: 1;
      }

      .system-loop-modules {
        margin: 0;
        border-top: 1px solid rgba(150, 208, 255, 0.2);
        border-bottom: 1px solid rgba(150, 208, 255, 0.2);
        padding: 0;
        list-style: none;
      }

      .system-loop-module-item + .system-loop-module-item {
        border-top: 1px solid rgba(150, 208, 255, 0.14);
      }

      .system-loop-module {
        position: relative;
        display: grid;
        grid-template-columns: 40px minmax(0, 1fr);
        gap: clamp(14px, 2vw, 24px);
        padding: clamp(28px, 3.4vw, 44px) 0;
      }

      .system-loop-module::before {
        position: absolute;
        inset: 0;
        opacity: 0;
        pointer-events: none;
        background: linear-gradient(90deg, rgba(18, 90, 186, 0.08), transparent 72%);
        transition: opacity 180ms ease;
        content: "";
      }

      .system-loop-module:hover::before {
        opacity: 1;
      }

      .system-loop-module-number {
        position: relative;
        z-index: 1;
        color: rgba(94, 181, 255, 0.74);
        font-family: "Aeonik Local", var(--font-copy);
        font-size: 12px;
        font-weight: 500;
        letter-spacing: 0.14em;
        line-height: 1.5;
      }

      .system-loop-module-content {
        position: relative;
        z-index: 1;
        min-width: 0;
      }

      .system-loop-module-head h3 {
        margin: 0;
        color: #f7fbff;
        font-family: var(--font-title);
        font-size: clamp(24px, 2.2vw, 31px);
        font-weight: 900;
        letter-spacing: -0.06em;
        line-height: 1.24;
        overflow-wrap: break-word;
      }

      .system-loop-module-head p {
        margin: 9px 0 0;
        color: rgba(177, 217, 251, 0.68);
        font-family: var(--font-copy);
        font-size: clamp(14px, 1.1vw, 16px);
        font-weight: 300;
        letter-spacing: -0.025em;
        line-height: 1.55;
      }

      .system-loop-module-copy {
        min-width: 0;
        margin-top: 22px;
        color: rgba(214, 234, 252, 0.74);
        font-family: var(--font-copy);
        font-size: clamp(14px, 1.05vw, 16px);
        font-weight: 300;
        letter-spacing: -0.02em;
        line-height: 1.72;
        overflow-wrap: break-word;
      }

      .system-loop-module-copy > p {
        margin: 0;
      }

      .system-loop-module-copy > p + p {
        margin-top: 5px;
      }

      .system-loop-module-list {
        display: grid;
        gap: 8px 20px;
        margin: 15px 0 0;
        padding: 0;
        list-style: none;
      }

      .system-loop-module-list li {
        position: relative;
        padding-left: 16px;
        color: rgba(224, 240, 255, 0.82);
        line-height: 1.55;
      }

      .system-loop-module-list li::before {
        position: absolute;
        top: 0.72em;
        left: 0;
        width: 5px;
        height: 5px;
        border: 1px solid rgba(141, 215, 255, 0.8);
        transform: rotate(45deg);
        content: "";
      }

      .system-loop-module-action {
        margin-top: 14px !important;
      }

      .system-loop-module-outcome {
        display: flex;
        align-items: flex-start;
        gap: 11px;
        margin: 18px 0 0;
        color: #eef9ff;
        font-family: var(--font-title);
        font-size: clamp(16px, 1.3vw, 19px);
        font-weight: 900;
        letter-spacing: -0.04em;
        line-height: 1.45;
      }

      .system-loop-module-outcome::before {
        flex: 0 0 auto;
        width: 18px;
        height: 1px;
        margin-top: 0.72em;
        background: linear-gradient(90deg, #79d2ff, transparent);
        box-shadow: 0 0 8px rgba(60, 164, 255, 0.45);
        content: "";
      }

      .system-loop-summary {
        position: relative;
        max-width: 980px;
        margin: clamp(48px, 5vw, 72px) auto 0;
        border-top: 1px solid rgba(150, 208, 255, 0.2);
        border-bottom: 1px solid rgba(150, 208, 255, 0.2);
        padding: clamp(20px, 2.4vw, 28px) clamp(18px, 3vw, 38px);
        color: rgba(228, 242, 255, 0.82);
        background: linear-gradient(90deg, transparent, rgba(17, 75, 153, 0.1) 22%, rgba(17, 75, 153, 0.1) 78%, transparent);
        font-family: var(--font-copy);
        font-size: clamp(16px, 1.4vw, 21px);
        font-weight: 300;
        letter-spacing: -0.025em;
        line-height: 1.7;
        text-align: center;
        text-wrap: balance;
      }

      .system-loop-summary em {
        color: #f8fbff;
        font-family: var(--font-title);
        font-style: normal;
        font-weight: 900;
      }

      @media (min-width: 721px) {
        .system-loop-module-list {
          grid-template-columns: repeat(2, minmax(0, 1fr));
        }
      }

      @media (min-width: 721px) and (max-width: 980px) {
        .system-loop-map {
          padding: 28px;
        }

        .system-loop-steps {
          grid-template-columns: repeat(5, minmax(0, 1fr));
          gap: 8px;
        }

        .system-loop-steps::before {
          top: 20px;
          right: 8%;
          bottom: auto;
          left: 8%;
          width: auto;
          height: 1px;
        }

        .system-loop-step {
          min-height: 0;
          grid-template-columns: 1fr;
          justify-items: center;
          gap: 10px;
          text-align: center;
        }

        .system-loop-step strong {
          font-size: 16px;
        }

        .system-loop-map-note {
          width: fit-content;
          margin-right: auto;
          margin-left: auto;
          text-align: left;
        }
      }

      @media (min-width: 981px) {
        .system-loop-layout {
          grid-template-columns: minmax(280px, 0.72fr) minmax(0, 1.8fr);
          align-items: start;
          gap: clamp(52px, 6vw, 86px);
        }

        .system-loop-map {
          position: sticky;
          top: 92px;
        }

        .system-loop-module-content {
          display: grid;
          grid-template-columns: minmax(210px, 0.76fr) minmax(0, 1.24fr);
          align-items: start;
          gap: clamp(28px, 3vw, 44px);
        }

        .system-loop-module-copy {
          margin-top: 0;
        }
      }

      @media (max-width: 720px) {
        .system-loop-section {
          padding: 76px 0 96px;
        }

        .system-loop-heading {
          max-width: 100%;
        }

        .system-loop-eyebrow {
          margin-bottom: 14px;
          font-size: 9px;
          letter-spacing: 0.14em;
        }

        .system-loop-title {
          font-size: clamp(28px, 8.2vw, 34px);
          line-height: 1.3;
        }

        .system-loop-subtitle {
          margin-top: 18px;
          font-size: 15px;
          line-height: 1.72;
        }

        .system-loop-layout {
          gap: 28px;
          margin-top: 38px;
        }

        .system-loop-map {
          border-radius: 22px;
          padding: 20px;
        }

        .system-loop-map-head {
          gap: 12px;
          padding-bottom: 16px;
        }

        .system-loop-map-head strong {
          font-size: 22px;
        }

        .system-loop-map-head span {
          font-size: 8px;
          letter-spacing: 0.12em;
        }

        .system-loop-steps {
          gap: 10px;
          margin-top: 20px;
        }

        .system-loop-steps::before {
          top: 20px;
          bottom: 20px;
          left: 18px;
        }

        .system-loop-step {
          min-height: 44px;
          grid-template-columns: 36px minmax(0, 1fr);
          gap: 12px;
        }

        .system-loop-step-index {
          width: 36px;
          height: 36px;
          font-size: 9px;
        }

        .system-loop-step strong {
          font-size: 18px;
        }

        .system-loop-module {
          grid-template-columns: 30px minmax(0, 1fr);
          gap: 10px;
          padding: 26px 0;
        }

        .system-loop-module-number {
          font-size: 10px;
        }

        .system-loop-module-head h3 {
          font-size: clamp(21px, 6.4vw, 25px);
          line-height: 1.3;
        }

        .system-loop-module-head p {
          margin-top: 7px;
          font-size: 14px;
        }

        .system-loop-module-copy {
          margin-top: 18px;
          font-size: 14px;
        }

        .system-loop-module-list {
          gap: 6px;
          margin-top: 12px;
        }

        .system-loop-module-outcome {
          gap: 8px;
          margin-top: 16px;
          font-size: 16px;
        }

        .system-loop-module-outcome::before {
          width: 13px;
        }

        .system-loop-summary {
          margin-top: 40px;
          padding: 19px 10px;
          font-size: 15px;
          line-height: 1.72;
        }
      }

      @media (min-width: 641px) {
        .ai-system-grid {
          width: min(100%, 830px);
          grid-template-columns: repeat(6, minmax(0, 1fr));
          gap: 12px;
        }
      }

      @media (min-width: 721px) and (max-width: 980px) {
        .hero-story-inner {
          display: grid;
          grid-template-columns: minmax(260px, 0.92fr) minmax(380px, 1.08fr);
          column-gap: clamp(24px, 3vw, 30px);
          width: var(--content-width);
          min-height: 0;
          align-items: start;
          padding: 64px 0 104px;
        }

        .hero-story-copy {
          grid-column: 2;
          grid-row: 1;
          width: 100%;
          margin: 0;
          text-align: left;
        }

        .hero-story-title {
          font-size: clamp(30px, 3.6vw, 35px);
          line-height: 1.52;
        }

        .hero-story-copy p {
          margin-top: 18px;
          font-size: clamp(15px, 1.84vw, 18px);
          line-height: 1.78;
        }

        .story-timeline {
          grid-column: 1;
          grid-row: 1;
          align-self: stretch;
          display: flex;
          flex-direction: column;
          width: 100%;
          min-height: 0;
          margin: 0;
        }

        .story-timeline::before {
          display: none;
        }

        .story-timeline::after {
          top: 0;
          right: 0;
          bottom: 0;
          left: auto;
        }

        .story-timeline-list {
          display: flex;
          flex-direction: column;
          flex: 1;
          justify-content: space-between;
          min-height: 0;
          gap: 0;
          padding: 0 27px 0 0;
          text-align: right;
        }

        .story-timeline-item {
          display: grid;
          min-width: 0;
          grid-template-columns: minmax(0, 1fr) max-content;
          align-items: baseline;
          column-gap: clamp(8px, 1vw, 10px);
        }

        .story-timeline-item::before {
          top: 0.56em;
          right: -30px;
          left: auto;
        }

        .story-timeline-item time,
        .story-timeline-item span {
          min-width: 0;
          text-align: right;
        }

        .story-timeline-item time {
          grid-column: 2;
          grid-row: 1;
          font-size: clamp(13px, 1.5vw, 15px);
          line-height: 1;
          white-space: nowrap;
        }

        .story-timeline-item span {
          grid-column: 1;
          grid-row: 1;
          margin-top: 0;
          font-size: clamp(11px, 1.3vw, 13px);
          line-height: 1.35;
          white-space: normal;
          overflow-wrap: break-word;
          word-break: normal;
        }
      }

      @media (min-width: 981px) {
        .hero-story-inner {
          --story-copy-width: clamp(470px, 47vw, 565px);
          display: grid;
          grid-template-columns: minmax(0, 1fr) minmax(0, var(--story-copy-width));
          column-gap: clamp(40px, 4.5vw, 72px);
          min-height: 0;
          align-items: start;
        }

        .hero-story-copy {
          grid-column: 2;
          grid-row: 1;
          width: 100%;
          margin-left: 0;
        }

        .story-timeline {
          grid-column: 1;
          grid-row: 1;
          align-self: stretch;
          display: flex;
          flex-direction: column;
          width: 100%;
          min-height: 0;
          margin-top: 0;
        }

        .story-timeline::before {
          display: none;
        }

        .story-timeline::after {
          top: 0;
          right: 0;
          bottom: 0;
          left: auto;
        }

        .story-timeline-list {
          display: flex;
          flex-direction: column;
          flex: 1;
          justify-content: space-between;
          min-height: 0;
          padding: 0 31px 0 0;
          text-align: right;
        }

        .story-timeline-item::before {
          right: -34px;
          left: auto;
        }

        .story-timeline-item {
          display: grid;
          grid-template-columns: minmax(0, 1fr) max-content;
          align-items: baseline;
          column-gap: clamp(10px, 1vw, 16px);
        }

        .story-timeline-item time {
          grid-column: 2;
          grid-row: 1;
          line-height: 1;
        }

        .story-timeline-item span {
          grid-column: 1;
          grid-row: 1;
          margin-top: 0;
          line-height: 1.35;
          white-space: nowrap;
        }

        .story-timeline-item time,
        .story-timeline-item span {
          text-align: right;
        }

        .founder-intro-inner {
          grid-template-columns: minmax(340px, 0.75fr) minmax(0, 1.25fr);
          gap: clamp(32px, 3.5vw, 56px);
          align-items: center;
          padding-bottom: clamp(80px, 8vw, 112px);
        }

        .founder-portrait {
          width: clamp(340px, 26vw, 360px);
          justify-self: center;
        }

        .founder-metrics {
          right: 18px;
          bottom: 18px;
          left: 18px;
          gap: 8px;
        }

        .founder-metric-title {
          font-size: clamp(18px, 1.35vw, 22px);
        }

        .founder-metric-detail {
          margin-top: 3px;
          font-size: clamp(9px, 0.7vw, 11px);
          line-height: 1.45;
        }

        .founder-copy {
          width: min(100%, 728px);
          justify-self: start;
          min-height: 0;
        }

        .founder-copy-title {
          font-size: clamp(31px, 2.8vw, 42px);
          line-height: 1.27;
        }

        .founder-copy-questions {
          margin-top: clamp(22px, 2vw, 28px);
        }

        .founder-copy-question {
          padding: clamp(14px, 1.4vw, 18px) 0;
        }

        .founder-copy-question-detail {
          font-size: clamp(16px, 1.3vw, 19px);
          line-height: 1.66;
        }

        .founder-copy-summary {
          padding-top: clamp(16px, 1.5vw, 20px);
          font-size: clamp(15px, 1.15vw, 17px);
        }

        .founder-transitions-inner {
          padding-bottom: clamp(64px, 6vw, 88px);
        }

        .founder-transitions-bridge {
          font-size: clamp(31px, 2.8vw, 42px);
          line-height: 1.25;
          text-align: center;
        }

        .founder-transitions-title {
          margin-top: clamp(9px, 1vw, 13px);
          font-size: clamp(20px, 1.75vw, 27px);
          line-height: 1.42;
          text-align: center;
        }

        .founder-transition-list {
          width: min(100%, 960px);
          grid-template-columns: repeat(3, minmax(0, 1fr));
          grid-auto-rows: 1fr;
          align-items: stretch;
          gap: clamp(14px, 1.4vw, 18px);
          margin: clamp(24px, 2.4vw, 32px) auto 0;
        }

        .founder-transition-card,
        .ai-system-item {
          min-height: 0;
          height: auto;
          border-radius: 24px;
          padding: 16px 18px 15px;
        }

        .ai-system-item {
          padding: 15px 13px 14px;
        }

        .founder-transition-card h3,
        .ai-system-item h3 {
          font-size: clamp(18px, 1.4vw, 21px);
          line-height: 1.3;
        }

        .ai-system-item h3 {
          font-size: clamp(17px, 1.35vw, 20px);
        }

        .founder-transition-card p,
        .ai-system-item p {
          margin-top: 7px;
          font-size: clamp(13px, 0.95vw, 14px);
          line-height: 1.58;
        }

        .ai-system-item p {
          margin-top: 8px;
          font-size: clamp(12.5px, 0.94vw, 14px);
        }

        .ai-system-grid {
          width: min(100%, 830px);
          grid-template-columns: repeat(6, minmax(0, 1fr));
          gap: 12px;
        }
      }

      @media (max-width: 980px) {
        .founder-intro-inner {
          grid-template-columns: minmax(0, 0.78fr) minmax(0, 1.22fr);
          width: calc(100vw - 32px);
          gap: clamp(12px, 3vw, 28px);
          align-items: center;
          padding-bottom: 96px;
        }

        .founder-portrait {
          width: 100%;
          min-width: 0;
          justify-self: stretch;
          container-type: inline-size;
        }

        .founder-metrics {
          right: clamp(8px, 5cqi, 18px);
          bottom: clamp(8px, 5cqi, 18px);
          left: clamp(8px, 5cqi, 18px);
          gap: clamp(3px, 3.5cqi, 12px);
        }

        .founder-metric-title {
          font-size: clamp(8px, 8cqi, 22px);
          line-height: 1.16;
        }

        .founder-metric-detail {
          margin-top: clamp(1px, 1.5cqi, 4px);
          font-size: clamp(5px, 3.6cqi, 11px);
          line-height: 1.42;
        }

        .founder-copy {
          width: 100%;
          min-width: 0;
          justify-self: stretch;
          container-type: inline-size;
          text-align: left;
        }

        .founder-copy-question {
          grid-template-columns: 1fr;
          row-gap: 4px;
        }

        .founder-copy-question::before {
          display: none;
        }

        .founder-copy-question-title,
        .founder-copy-question-detail {
          grid-column: 1;
        }

        .founder-transition-list {
          max-width: 560px;
          margin-right: auto;
          margin-left: auto;
        }
      }

      .section-nav-wrap {
        position: relative;
        z-index: 12;
        min-height: 76px;
        background: linear-gradient(180deg, rgba(2, 8, 23, 0.08), rgba(2, 8, 23, 0.78));
      }

      .section-nav {
        position: sticky;
        z-index: 22;
        top: 11px;
        display: flex;
        width: var(--content-width);
        min-height: 56px;
        align-items: center;
        justify-content: space-between;
        gap: 20px;
        margin: 0 auto;
        border: 1px solid rgba(175, 221, 255, 0.15);
        border-radius: 17px;
        padding: 7px 12px 7px 18px;
        background: rgba(2, 14, 37, 0.62);
        box-shadow: 0 12px 36px rgba(0, 0, 0, 0.17), inset 0 1px rgba(255, 255, 255, 0.065);
        backdrop-filter: blur(18px) saturate(1.12);
        -webkit-backdrop-filter: blur(18px) saturate(1.12);
      }

      .site-mark {
        display: inline-flex;
        min-width: max-content;
        align-items: center;
        gap: 9px;
        color: #eaf6ff;
        font-size: 14px;
        font-weight: 600;
      }

      .site-mark::before {
        display: grid;
        width: 23px;
        height: 23px;
        place-items: center;
        border: 1px solid rgba(151, 216, 255, 0.56);
        border-radius: 50%;
        color: #cceeff;
        background: radial-gradient(circle, rgba(103, 196, 255, 0.48) 0 14%, transparent 16%), rgba(16, 106, 220, 0.17);
        box-shadow: 0 0 18px rgba(31, 143, 255, 0.3);
        content: "✦";
        font-size: 11px;
      }

      .section-nav-links {
        display: flex;
        align-items: center;
        gap: 3px;
      }

      .section-nav-links a {
        border-radius: 10px;
        padding: 9px 11px;
        color: rgba(222, 241, 255, 0.7);
        font-size: 13px;
        white-space: nowrap;
        transition: color 180ms ease, background-color 180ms ease;
      }

      .section-nav-links a:hover {
        color: #fff;
        background: rgba(86, 179, 255, 0.12);
      }

      .section-nav-links .nav-action {
        border: 1px solid rgba(139, 221, 255, 0.44);
        color: #eaf6ff;
        background: linear-gradient(135deg, rgba(38, 139, 255, 0.52), rgba(8, 83, 196, 0.44));
        box-shadow: inset 0 1px rgba(255, 255, 255, 0.18);
      }

      .content-shell {
        position: relative;
        overflow: hidden;
      }

      .content-shell::before {
        position: absolute;
        z-index: -1;
        top: 4%;
        right: -24%;
        width: min(780px, 85vw);
        height: min(780px, 85vw);
        border: 1px solid rgba(83, 177, 255, 0.08);
        border-radius: 50%;
        box-shadow: 0 0 120px rgba(14, 106, 229, 0.1), inset 0 0 90px rgba(27, 130, 255, 0.05);
        content: "";
      }

      .content-width {
        width: var(--content-width);
        margin: 0 auto;
      }

      .section {
        position: relative;
        padding: 118px 0;
      }

      .section-kicker {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        margin: 0 0 17px;
        color: rgba(193, 228, 255, 0.77);
        font-size: 12px;
        letter-spacing: 0.11em;
      }

      .section-kicker span {
        display: grid;
        width: 28px;
        height: 28px;
        place-items: center;
        border: 1px solid rgba(126, 205, 255, 0.48);
        border-radius: 50%;
        color: #d6f2ff;
        font-size: 10px;
        letter-spacing: 0;
        box-shadow: 0 0 16px rgba(31, 143, 255, 0.17);
      }

      .section-heading {
        max-width: 770px;
      }

      .section-heading h2,
      .community-content h2 {
        margin: 0;
        color: transparent;
        background: linear-gradient(180deg, #fff 0%, rgba(215, 241, 255, 0.72) 100%);
        background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        font-size: clamp(34px, 4.2vw, 58px);
        font-weight: 500;
        letter-spacing: -0.055em;
        line-height: 1.2;
      }

      .section-heading h2 strong {
        color: transparent;
        font-weight: inherit;
        background: linear-gradient(100deg, #fff, #c5edff 62%, #5aafff);
        background-clip: text;
        -webkit-background-clip: text;
      }

      .section-heading > p:last-child {
        max-width: 650px;
        margin: 18px 0 0;
        color: var(--soft-ink);
        font-size: 16px;
        line-height: 1.78;
      }

      .system-layout {
        display: grid;
        margin-top: 48px;
        grid-template-columns: 1.08fr 0.92fr;
        gap: 15px;
      }

      .glass-card {
        border: 1px solid var(--line);
        border-radius: 23px;
        background: var(--glass);
        box-shadow: var(--shadow), inset 0 1px rgba(255, 255, 255, 0.11);
        backdrop-filter: blur(16px) saturate(1.12);
        -webkit-backdrop-filter: blur(16px) saturate(1.12);
      }

      .system-card {
        position: relative;
        min-height: 330px;
        overflow: hidden;
        padding: clamp(27px, 4vw, 47px);
      }

      .system-card::after {
        position: absolute;
        top: -134px;
        right: -113px;
        width: 300px;
        height: 300px;
        border: 1px solid rgba(139, 221, 255, 0.23);
        border-radius: 50%;
        box-shadow: inset 0 0 56px rgba(20, 119, 245, 0.19), 0 0 60px rgba(15, 109, 228, 0.12);
        content: "";
      }

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

      .system-card h3 {
        max-width: 580px;
        margin: 0 0 14px;
        color: #f3f8ff;
        font-size: clamp(22px, 2.3vw, 29px);
        font-weight: 500;
        letter-spacing: -0.035em;
        line-height: 1.38;
      }

      .system-card p {
        max-width: 560px;
        margin: 0 0 25px;
        color: rgba(213, 235, 255, 0.69);
        font-size: 15px;
        line-height: 1.82;
      }

      .system-tags {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin: 0;
        padding: 0;
        list-style: none;
      }

      .system-tags li {
        border: 1px solid rgba(165, 218, 255, 0.26);
        border-radius: 999px;
        padding: 7px 11px;
        color: rgba(226, 244, 255, 0.86);
        background: rgba(31, 143, 255, 0.11);
        font-size: 12px;
      }

      .decision-rail {
        position: relative;
        display: grid;
        padding: 11px 20px;
      }

      .decision-rail::before {
        position: absolute;
        top: 52px;
        bottom: 52px;
        left: 33px;
        width: 1px;
        background: linear-gradient(#8fd3ff, rgba(28, 127, 242, 0.08));
        content: "";
      }

      .rail-item {
        position: relative;
        display: grid;
        min-height: 102px;
        align-items: center;
        grid-template-columns: 37px 1fr;
        gap: 11px;
      }

      .rail-number {
        z-index: 1;
        display: grid;
        width: 25px;
        height: 25px;
        place-items: center;
        border: 1px solid rgba(195, 232, 255, 0.65);
        border-radius: 50%;
        color: #e4f5ff;
        background: #041c45;
        box-shadow: 0 0 15px rgba(35, 139, 255, 0.3);
        font-size: 10px;
      }

      .rail-item h3 {
        margin: 0 0 5px;
        color: #eaf6ff;
        font-size: 15px;
        font-weight: 500;
      }

      .rail-item p {
        margin: 0;
        color: rgba(207, 231, 250, 0.6);
        font-size: 12px;
        line-height: 1.55;
      }

      .roadmap-section {
        padding-top: 136px;
      }

      .roadmap-section::before {
        position: absolute;
        z-index: -1;
        top: 7%;
        left: 50%;
        width: min(850px, 90vw);
        height: 480px;
        transform: translateX(-50%);
        border-radius: 50%;
        background: radial-gradient(ellipse, rgba(15, 111, 235, 0.17), transparent 69%);
        content: "";
        filter: blur(10px);
      }

      .roadmap-grid {
        position: relative;
        display: grid;
        margin-top: 48px;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 13px;
      }

      .roadmap-grid::before {
        position: absolute;
        top: -21px;
        right: 4%;
        left: 4%;
        height: 1px;
        background: linear-gradient(90deg, transparent, rgba(141, 219, 255, 0.75), rgba(30, 137, 255, 0.72), transparent);
        content: "";
      }

      .stage-card {
        position: relative;
        min-height: 244px;
        overflow: hidden;
        border: 1px solid var(--line);
        border-radius: 19px;
        padding: 23px 22px;
        background: linear-gradient(145deg, rgba(3, 29, 72, 0.63), rgba(1, 10, 31, 0.75));
        box-shadow: inset 0 1px rgba(255, 255, 255, 0.07);
        transition: transform 180ms ease, border-color 180ms ease, background-color 180ms ease;
      }

      @media (hover: hover) and (pointer: fine) {
        .stage-card:hover {
          z-index: 1;
          transform: translateY(-5px);
          border-color: rgba(151, 216, 255, 0.47);
          background: linear-gradient(145deg, rgba(5, 46, 105, 0.76), rgba(2, 14, 43, 0.85));
          box-shadow: 0 18px 46px rgba(0, 0, 0, 0.29), inset 0 1px rgba(255, 255, 255, 0.09);
        }
      }

      .stage-card::after {
        position: absolute;
        top: -42px;
        right: -43px;
        width: 112px;
        height: 112px;
        border: 1px solid rgba(165, 218, 255, 0.18);
        border-radius: 50%;
        background: radial-gradient(circle, rgba(68, 167, 255, 0.25), transparent 64%);
        box-shadow: 0 0 26px rgba(20, 119, 245, 0.12);
        content: "";
      }

      .stage-time {
        display: flex;
        align-items: center;
        gap: 8px;
        margin: 0 0 17px;
        color: rgba(185, 226, 255, 0.8);
        font-size: 12px;
      }

      .stage-time::before {
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: #74c8ff;
        box-shadow: 0 0 12px #4aa8ff;
        content: "";
      }

      .stage-card h3 {
        margin: 0 0 12px;
        color: #f3f8ff;
        font-size: 22px;
        font-weight: 500;
        letter-spacing: -0.04em;
      }

      .stage-card ul {
        display: grid;
        gap: 7px;
        margin: 0;
        padding: 0;
        color: rgba(207, 231, 250, 0.64);
        font-size: 13px;
        line-height: 1.5;
        list-style: none;
      }

      .stage-card li {
        position: relative;
        padding-left: 12px;
      }

      .stage-card li::before {
        position: absolute;
        top: 0.58em;
        left: 0;
        width: 4px;
        height: 4px;
        border-radius: 50%;
        background: rgba(139, 221, 255, 0.9);
        content: "";
      }

      .path-sentence {
        display: flex;
        min-height: 92px;
        align-items: center;
        justify-content: space-between;
        gap: 26px;
        margin-top: 18px;
        border: 1px solid rgba(139, 221, 255, 0.22);
        border-radius: 18px;
        padding: 20px 24px;
        background: linear-gradient(100deg, rgba(21, 124, 245, 0.18), rgba(185, 230, 255, 0.06));
        box-shadow: inset 0 1px rgba(255, 255, 255, 0.06);
      }

      .path-sentence p {
        margin: 0;
        color: rgba(222, 241, 255, 0.82);
        font-size: 15px;
        line-height: 1.67;
      }

      .path-sentence span {
        min-width: max-content;
        color: rgba(169, 217, 255, 0.72);
        font-size: 12px;
      }

      .benefits-section {
        padding-top: 139px;
      }

      .benefit-grid {
        display: grid;
        margin-top: 46px;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 12px;
      }

      .benefit-card {
        position: relative;
        min-height: 190px;
        overflow: hidden;
        border: 1px solid var(--line-soft);
        border-radius: 17px;
        padding: 20px;
        background: rgba(2, 17, 43, 0.52);
        box-shadow: inset 0 1px rgba(255, 255, 255, 0.045);
        transition: transform 180ms ease, border-color 180ms ease, background-color 180ms ease;
      }

      @media (hover: hover) and (pointer: fine) {
        .benefit-card:hover {
          transform: translateY(-4px);
          border-color: rgba(151, 216, 255, 0.36);
          background: rgba(4, 31, 76, 0.67);
        }
      }

      .benefit-number {
        display: block;
        margin-bottom: 35px;
        color: rgba(139, 221, 255, 0.67);
        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
        font-size: 11px;
        letter-spacing: 0.07em;
      }

      .benefit-card h3 {
        margin: 0 0 8px;
        color: #eaf6ff;
        font-size: 16px;
        font-weight: 500;
      }

      .benefit-card p {
        margin: 0;
        color: rgba(207, 231, 250, 0.59);
        font-size: 12px;
        line-height: 1.65;
      }

      .community-section {
        padding-bottom: 138px;
      }

      .community-panel {
        position: relative;
        overflow: hidden;
        margin-top: 44px;
        border: 1px solid rgba(175, 221, 255, 0.23);
        border-radius: 30px;
        padding: clamp(30px, 6vw, 70px);
        background:
          radial-gradient(circle at 74% 45%, rgba(20, 126, 255, 0.27), transparent 25%),
          radial-gradient(circle at 75% 59%, rgba(112, 203, 255, 0.17), transparent 31%),
          linear-gradient(135deg, rgba(3, 28, 70, 0.88), rgba(1, 10, 31, 0.9));
        box-shadow: var(--shadow), inset 0 1px rgba(255, 255, 255, 0.09);
      }

      .community-panel::before,
      .community-panel::after {
        position: absolute;
        top: 50%;
        right: -7%;
        width: min(44vw, 470px);
        aspect-ratio: 1;
        transform: translateY(-50%);
        border: 1px solid rgba(151, 216, 255, 0.28);
        border-radius: 50%;
        box-shadow: 0 0 72px rgba(20, 119, 245, 0.2), inset 0 0 70px rgba(31, 143, 255, 0.11);
        content: "";
      }

      .community-panel::after {
        top: 50%;
        right: 6%;
        width: min(31vw, 335px);
        opacity: 0.7;
      }

      .community-content {
        position: relative;
        z-index: 1;
        max-width: 680px;
      }

      .community-content h2 {
        max-width: 625px;
        margin: 0 0 19px;
      }

      .community-content > p:not(.section-kicker) {
        max-width: 525px;
        margin: 0 0 27px;
        color: rgba(219, 239, 255, 0.71);
        font-size: 16px;
        line-height: 1.75;
      }

      .community-notes {
        display: flex;
        flex-wrap: wrap;
        gap: 9px;
        margin: 0 0 32px;
        padding: 0;
        list-style: none;
      }

      .community-notes li {
        border: 1px solid rgba(181, 225, 255, 0.22);
        border-radius: 999px;
        padding: 8px 12px;
        color: rgba(226, 244, 255, 0.88);
        background: rgba(2, 14, 37, 0.4);
        font-size: 12px;
      }

      .community-notes li::before {
        margin-right: 6px;
        color: #8fd3ff;
        content: "✦";
      }

      .action-row {
        display: flex;
        flex-wrap: wrap;
        gap: 11px;
      }

      .button {
        display: inline-flex;
        min-height: 48px;
        align-items: center;
        justify-content: center;
        border: 1px solid transparent;
        border-radius: 999px;
        padding: 0 19px;
        font-size: 14px;
        font-weight: 500;
        transition: transform 180ms ease, border-color 180ms ease, background-color 180ms ease, box-shadow 180ms ease;
      }

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

      .button-primary {
        color: #fff;
        background: linear-gradient(135deg, #48a9ff, #0a72dc 68%, #075bc8);
        box-shadow: 0 10px 28px rgba(8, 102, 221, 0.34), inset 0 1px rgba(255, 255, 255, 0.32);
      }

      .button-secondary {
        border-color: rgba(195, 232, 255, 0.25);
        color: rgba(236, 248, 255, 0.9);
        background: rgba(255, 255, 255, 0.04);
      }

      .button-secondary:hover {
        border-color: rgba(139, 221, 255, 0.52);
        background: rgba(42, 143, 255, 0.13);
      }

      .site-footer {
        border-top: 1px solid rgba(175, 221, 255, 0.1);
        padding: 29px 0 max(34px, env(safe-area-inset-bottom));
        color: rgba(198, 225, 248, 0.51);
        background: rgba(1, 7, 21, 0.55);
      }

      .footer-inner {
        display: grid;
        width: var(--content-width);
        gap: 8px;
        margin: 0 auto;
        font-size: 12px;
        line-height: 1.7;
      }

      .footer-inner a {
        color: rgba(201, 231, 255, 0.72);
      }

      .footer-inner a:hover {
        color: #d9f3ff;
      }

      .test-note {
        display: inline-flex;
        width: max-content;
        align-items: center;
        gap: 7px;
        color: rgba(169, 217, 255, 0.64);
        font-size: 11px;
      }

      .test-note::before {
        width: 5px;
        height: 5px;
        border-radius: 50%;
        background: #5ab5ff;
        box-shadow: 0 0 9px #5ab5ff;
        content: "";
      }

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

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

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

      @media (min-width: 721px) and (max-width: 960px) {
        .hero-badge {
          padding: 0.46em 1em 0.46em 0.54em;
          font-size: 13px;
        }

        .badge-logo-mark {
          width: 1.35em;
          height: 1.35em;
          flex-basis: 1.35em;
        }
      }

      @media (max-width: 720px) {
        :root {
          --content-width: calc(100vw - 32px);
        }

        .dawn-hero {
          --hero-scale: 0.7625;
          --hero-stage-height: 534px;
          height: var(--hero-stage-height);
          min-height: var(--hero-stage-height);
          padding: 0;
        }

        /*
         * The whole first screen uses one fixed design canvas on small
         * devices. JavaScript updates --hero-scale from the available width,
         * so copy, black-hole animation and product preview stay in lockstep.
         */
        .hero-stage {
          position: absolute;
          z-index: 5;
          top: 0;
          left: 50%;
          width: 480px;
          height: 700px;
          min-height: 0;
          --black-hole-line-y: 434px;
          --preview-width: 438px;
          padding-top: 112px;
          transform: translateX(-50%) scale(var(--hero-scale));
          transform-origin: top center;
        }

        .hero-black-hole {
          top: 242.5px;
          width: 680px;
          height: 383px;
          transform: translateX(-50%);
        }

        .hero-black-hole-stars {
          display: none;
        }

        .hero-content {
          width: 480px;
          padding: 0 12px;
        }

        .hero-heading-lockup {
          max-width: 456px;
        }

        .hero-badge {
          max-width: none;
          padding: 0.46em 1em 0.46em 0.54em;
          font-size: 13px;
        }

        .badge-logo-mark {
          width: 1.35em;
          height: 1.35em;
          flex-basis: 1.35em;
        }

        .hero-title {
          max-width: none;
          font-size: 46px;
          line-height: 1.12;
        }

        .hero-title span {
          white-space: nowrap;
        }

        .hero-title .mobile-break {
          display: inline;
        }

        .hero-description {
          max-width: 430px;
          font-size: 16px;
          line-height: 1.58;
        }

        .product-preview {
          width: 456px;
          margin-top: 82px;
        }

        .hero-story-inner {
          --story-copy-width: 100%;
          --timeline-axis-offset: 7px;
          width: calc(100vw - 48px);
          min-height: 0;
          padding: 48px 0 82px;
        }

        .hero-story-copy {
          width: 100%;
        }

        .hero-story-title {
          font-size: clamp(27px, 7.2vw, 31px);
          line-height: 1.28;
        }

        .hero-story-copy p {
          margin-top: 17px;
          font-size: 16px;
          line-height: 1.72;
        }

        .story-timeline {
          width: 100%;
          min-height: 0;
          margin-top: 45px;
        }

        .story-timeline::before {
          display: none;
        }

        .story-timeline-list {
          grid-template-columns: 1fr;
          gap: 23px;
          padding: 0 0 1px 31px;
        }

        .story-timeline-item::before {
          left: -28px;
        }

        .founder-intro-inner {
          gap: clamp(10px, 3vw, 18px);
          padding-bottom: 82px;
        }

        .founder-portrait {
          width: 100%;
          min-width: 0;
          justify-self: stretch;
          container-type: inline-size;
        }

        .founder-portrait-frame {
          border-radius: 18px;
        }

        .founder-metrics {
          position: absolute;
          right: clamp(8px, 5cqi, 18px);
          bottom: clamp(8px, 5cqi, 18px);
          left: clamp(8px, 5cqi, 18px);
          display: grid;
          gap: clamp(3px, 3.5cqi, 12px);
          margin: 0;
          border: 0;
          border-radius: 0;
          padding: 0;
          background: none;
          text-align: left;
        }

        .founder-metric-title {
          font-size: clamp(8px, 8cqi, 22px);
          line-height: 1.16;
        }

        .founder-metric-detail {
          margin-top: clamp(1px, 1.5cqi, 4px);
          font-size: clamp(5px, 3.6cqi, 11px);
          line-height: 1.42;
        }

        .founder-copy-title {
          font-size: clamp(9px, 8cqi, 32px);
          line-height: 1.26;
        }

        .founder-copy-questions {
          margin-top: clamp(7px, 7cqi, 24px);
        }

        .founder-copy-question {
          row-gap: 4px;
          padding: clamp(5px, 4.8cqi, 16px) 0;
        }

        .founder-copy-question-title {
          font-size: clamp(8px, 6cqi, 23px);
          line-height: 1.32;
        }

        .founder-copy-question-detail {
          font-size: clamp(6px, 4cqi, 15px);
          line-height: 1.58;
        }

        .founder-copy-summary {
          padding-top: clamp(5px, 5cqi, 17px);
          font-size: clamp(6px, 4cqi, 15px);
          line-height: 1.58;
        }

        /* Keep the compact side-by-side phone layout focused on the three questions. */
        .founder-copy-question-detail,
        .founder-copy-summary {
          display: none;
        }

        .founder-transitions-inner {
          width: calc(100vw - 48px);
          padding-bottom: 72px;
        }

        .founder-transitions-bridge {
          font-size: clamp(25px, 7.1vw, 32px);
          line-height: 1.3;
        }

        .founder-transitions-title {
          margin-top: 10px;
          font-size: clamp(18px, 5vw, 22px);
          line-height: 1.45;
        }

        .founder-transition-list {
          gap: 14px;
          margin-top: 22px;
        }

        .founder-transition-card,
        .ai-system-item,
        .founder-portrait-panel {
          border-radius: 18px;
          padding: 18px 18px 19px;
          box-shadow:
            0 16px 34px rgba(0, 0, 0, 0.24),
            0 14px 30px rgba(19, 112, 255, 0.14),
            inset 0 1px rgba(225, 246, 255, 0.12),
            inset 0 -24px 30px rgba(42, 142, 255, 0.3),
            inset 0 -2px 5px rgba(183, 241, 255, 0.82);
        }

        .founder-portrait-panel {
          padding: 0;
        }

        .founder-transition-card::before,
        .ai-system-item::before,
        .founder-portrait-panel::before {
          inset: 41% 0 0;
          background-size: 25px 21px;
          opacity: 0.68;
        }

        .founder-transition-card h3,
        .ai-system-item h3 {
          padding-right: 0;
          font-size: 19px;
          line-height: 1.32;
        }

        .ai-system-item h3 {
          padding-right: 0;
        }

        .founder-transition-card p,
        .ai-system-item p {
          margin-top: 7px;
          font-size: 13.5px;
          line-height: 1.62;
        }

        .ai-system-grid {
          width: min(100%, 420px);
          grid-template-columns: repeat(3, minmax(0, 1fr));
          gap: clamp(8px, 2vw, 12px);
        }

        .ai-system-item {
          border-radius: 16px;
          padding: clamp(10px, 3vw, 14px) clamp(8px, 2.5vw, 12px);
        }

        .ai-system-item h3 {
          font-size: clamp(14px, 4.5vw, 18px);
          line-height: 1.25;
        }

        .ai-system-item p {
          margin-top: 6px;
          font-size: clamp(10px, 3.2vw, 12px);
          line-height: 1.45;
        }

        .ai-shift-inner {
          width: calc(100vw - 48px);
          padding-bottom: 56px;
        }

        .ai-shift-title {
          font-size: clamp(29px, 7.4vw, 34px);
          line-height: 1.34;
        }

        .ai-shift-stages {
          margin-top: 25px;
          font-size: 16px;
          line-height: 1.72;
        }

        .product-preview-shell {
          border-radius: 24px 24px 0 0;
          padding: 7px;
        }

        .product-label {
          top: 15px;
          right: 15px;
        }

        .actual-app-frame {
          aspect-ratio: 2440 / 1430;
          border-radius: 17px 17px 0 0;
        }

        .actual-app-frame img {
          object-fit: contain;
          object-position: center;
        }

        .section-nav-wrap {
          min-height: 71px;
        }

        .section-nav {
          top: 8px;
          width: calc(100vw - 20px);
          min-height: 53px;
          gap: 9px;
          border-radius: 15px;
          padding: 7px 9px 7px 14px;
        }

        .section-nav-links {
          max-width: calc(100vw - 120px);
          overflow-x: auto;
          scrollbar-width: none;
        }

        .section-nav-links::-webkit-scrollbar {
          display: none;
        }

        .section-nav-links a {
          padding: 8px 10px;
          font-size: 12px;
        }

        .section-nav-links .nav-action {
          display: none;
        }

        .section {
          padding: 79px 0;
        }

        .roadmap-section,
        .benefits-section {
          padding-top: 90px;
        }

        .section-heading h2,
        .community-content h2 {
          font-size: clamp(30px, 8.9vw, 42px);
          line-height: 1.25;
        }

        .section-heading > p:last-child {
          margin-top: 15px;
          font-size: 14px;
          line-height: 1.74;
        }

        .system-layout {
          margin-top: 31px;
          gap: 11px;
        }

        .system-card {
          min-height: 0;
          padding: 24px 20px;
        }

        .system-card h3 {
          font-size: 21px;
        }

        .system-card p {
          margin-bottom: 19px;
          font-size: 14px;
        }

        .decision-rail {
          padding: 9px 15px;
        }

        .decision-rail::before {
          left: 27px;
        }

        .rail-item {
          min-height: 81px;
          grid-template-columns: 31px 1fr;
          gap: 9px;
        }

        .roadmap-grid {
          margin-top: 35px;
          grid-template-columns: 1fr;
          gap: 10px;
        }

        .roadmap-grid::before {
          top: -15px;
          right: 0;
          left: 0;
        }

        .stage-card {
          min-height: 0;
          padding: 20px 18px;
        }

        .stage-time {
          margin-bottom: 11px;
        }

        .stage-card h3 {
          margin-bottom: 10px;
          font-size: 20px;
        }

        .stage-card ul {
          gap: 5px;
          font-size: 12px;
        }

        .path-sentence {
          display: grid;
          gap: 11px;
          margin-top: 12px;
          padding: 18px;
        }

        .path-sentence p {
          font-size: 14px;
        }

        .benefit-grid {
          margin-top: 32px;
          grid-template-columns: 1fr;
          gap: 9px;
        }

        .benefit-card {
          display: grid;
          min-height: 0;
          grid-template-columns: 42px 1fr;
          column-gap: 12px;
          padding: 17px;
        }

        .benefit-number {
          grid-row: span 2;
          margin: 2px 0 0;
        }

        .benefit-card h3 {
          margin: 0 0 6px;
          font-size: 15px;
        }

        .community-section {
          padding-bottom: 78px;
        }

        .community-panel {
          margin-top: 31px;
          border-radius: 22px;
          padding: 30px 21px;
        }

        .community-panel::before {
          top: auto;
          right: -24%;
          bottom: -20%;
          width: 80vw;
          transform: none;
        }

        .community-panel::after {
          display: none;
        }

        .community-content > p:not(.section-kicker) {
          margin-bottom: 22px;
          font-size: 14px;
        }

        .community-notes {
          gap: 7px;
          margin-bottom: 25px;
        }

        .community-notes li {
          padding: 7px 10px;
          font-size: 11px;
        }

        .action-row {
          display: grid;
          grid-template-columns: 1fr;
        }

        .button {
          width: 100%;
        }

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

        .footer-inner {
          gap: 7px;
          font-size: 11px;
        }
      }

      .official-anchor-bridge {
        display: none;
      }

      body.logic-flow-page {
        min-height: 0;
        padding-bottom: 0;
      }

      body > .site-footer {
        display: block;
      }

      /* Screen 5: solution selection */
      .solution-choice-section {
        position: relative;
        isolation: isolate;
        overflow: hidden;
        border-top: 1px solid rgba(139, 205, 255, 0.12);
        padding: clamp(94px, 10vw, 154px) 0 clamp(104px, 10.6vw, 164px);
        background:
          radial-gradient(68% 34% at 50% 2%, rgba(35, 132, 255, 0.15), transparent 70%),
          radial-gradient(34% 30% at 1% 72%, rgba(26, 87, 183, 0.12), transparent 76%),
          linear-gradient(180deg, #020918 0%, #020c20 58%, #020817 100%);
      }

      .solution-choice-section::before,
      .solution-choice-section::after {
        position: absolute;
        z-index: -1;
        pointer-events: none;
        content: "";
      }

      .solution-choice-section::before {
        inset: 12% -16% auto;
        height: min(26vw, 420px);
        opacity: 0.54;
        background-image:
          linear-gradient(rgba(127, 194, 255, 0.05) 1px, transparent 1px),
          linear-gradient(90deg, rgba(127, 194, 255, 0.05) 1px, transparent 1px);
        background-size: 44px 44px;
        mask-image: linear-gradient(90deg, transparent, #000 20%, #000 80%, transparent);
        -webkit-mask-image: linear-gradient(90deg, transparent, #000 20%, #000 80%, transparent);
      }

      .solution-choice-section::after {
        top: 18%;
        left: 50%;
        width: min(66vw, 950px);
        aspect-ratio: 1;
        border: 1px solid rgba(107, 183, 255, 0.1);
        border-radius: 50%;
        transform: translateX(-50%);
        box-shadow: 0 0 150px rgba(16, 106, 246, 0.12), inset 0 0 100px rgba(16, 106, 246, 0.05);
      }

      .solution-choice-inner,
      .trust-close-inner {
        position: relative;
        width: var(--content-width);
        margin: 0 auto;
      }

      .solution-section-heading,
      .trust-section-heading {
        max-width: 920px;
        margin: 0 auto;
        text-align: center;
      }

      .solution-eyebrow,
      .trust-eyebrow {
        display: inline-flex;
        align-items: center;
        gap: 9px;
        margin: 0 0 17px;
        color: rgba(170, 219, 255, 0.76);
        font-family: "Aeonik Local", var(--font-copy);
        font-size: 11px;
        font-weight: 500;
        letter-spacing: 0.16em;
        line-height: 1;
        text-transform: uppercase;
      }

      .solution-eyebrow::before,
      .trust-eyebrow::before {
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: #8ed8ff;
        box-shadow: 0 0 15px rgba(103, 198, 255, 0.9);
        content: "";
      }

      .solution-section-heading h2,
      .trust-section-heading h2,
      .trust-case-heading h3,
      .trust-final-cta h2 {
        margin: 0;
        color: #f7fbff;
        font-family: var(--font-title);
        font-weight: 900;
        letter-spacing: -0.065em;
        text-wrap: balance;
      }

      .solution-section-heading h2,
      .trust-section-heading h2 {
        font-size: clamp(36px, 4.3vw, 62px);
        line-height: 1.2;
      }

      .solution-section-heading > p:last-child,
      .trust-section-heading > p:last-child {
        max-width: 780px;
        margin: clamp(20px, 2.2vw, 30px) auto 0;
        color: rgba(217, 236, 255, 0.76);
        font-family: var(--font-copy);
        font-size: clamp(16px, 1.34vw, 20px);
        font-weight: 300;
        letter-spacing: -0.022em;
        line-height: 1.76;
        text-wrap: balance;
      }

      .solution-choice-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        align-items: stretch;
        gap: clamp(14px, 1.8vw, 24px);
        margin: clamp(48px, 5.2vw, 72px) 0 0;
        padding: 0;
        list-style: none;
      }

      .solution-choice-card {
        position: relative;
        isolation: isolate;
        display: flex;
        min-width: 0;
        min-height: 100%;
        flex-direction: column;
        overflow: hidden;
        border: 1px solid rgba(133, 194, 248, 0.22);
        border-radius: 26px;
        padding: clamp(25px, 2.5vw, 34px);
        background:
          radial-gradient(114% 66% at 12% -12%, rgba(46, 129, 239, 0.18), transparent 58%),
          linear-gradient(145deg, rgba(10, 29, 59, 0.92), rgba(2, 13, 33, 0.95) 68%, rgba(3, 21, 47, 0.94));
        box-shadow: inset 0 1px rgba(225, 245, 255, 0.08), 0 22px 54px rgba(0, 0, 0, 0.25);
      }

      .solution-choice-card::after {
        position: absolute;
        z-index: -1;
        right: -14%;
        bottom: -24%;
        left: -14%;
        height: 43%;
        opacity: 0.56;
        background-image:
          linear-gradient(rgba(107, 180, 255, 0.06) 1px, transparent 1px),
          linear-gradient(90deg, rgba(107, 180, 255, 0.06) 1px, transparent 1px);
        background-size: 28px 24px;
        content: "";
      }

      .solution-choice-card.is-recommended {
        border-color: rgba(170, 223, 255, 0.62);
        background:
          radial-gradient(120% 72% at 15% -10%, rgba(50, 151, 255, 0.28), transparent 58%),
          linear-gradient(145deg, rgba(10, 38, 77, 0.96), rgba(2, 15, 38, 0.97) 68%, rgba(4, 26, 58, 0.97));
        box-shadow: inset 0 1px rgba(231, 248, 255, 0.18), 0 25px 62px rgba(0, 0, 0, 0.29), 0 0 0 1px rgba(83, 173, 255, 0.08), 0 0 44px rgba(40, 137, 255, 0.12);
      }

      .solution-choice-card > * {
        position: relative;
        z-index: 1;
      }

      .solution-choice-topline {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 14px;
      }

      .solution-choice-mode {
        color: rgba(162, 216, 255, 0.84);
        font-family: "Aeonik Local", var(--font-copy);
        font-size: 11px;
        font-weight: 500;
        letter-spacing: 0.16em;
        line-height: 1.2;
      }

      .solution-choice-recommendation {
        border: 1px solid rgba(186, 228, 255, 0.28);
        border-radius: 999px;
        padding: 6px 9px;
        color: rgba(232, 248, 255, 0.86);
        background: rgba(105, 185, 255, 0.1);
        font-family: var(--font-copy);
        font-size: 10px;
        letter-spacing: 0.04em;
        line-height: 1;
        white-space: nowrap;
      }

      .solution-choice-product {
        margin: 0;
        color: #f7fbff;
        font-family: var(--font-title);
        font-size: clamp(26px, 2.15vw, 33px);
        font-weight: 900;
        letter-spacing: -0.06em;
        line-height: 1.22;
        text-wrap: balance;
      }

      .solution-choice-product-price {
        display: block;
        margin: 11px 0 0;
        color: rgba(201, 177, 255, 0.9);
        font-family: "Aeonik Local", var(--font-copy);
        font-size: clamp(16px, 1.15vw, 19px);
        font-weight: 500;
        letter-spacing: -0.025em;
        line-height: 1.2;
        white-space: nowrap;
      }

      .solution-choice-price {
        display: flex;
        align-items: baseline;
        gap: 8px;
        margin: 15px 0 0;
        color: rgba(188, 222, 248, 0.78);
        font-family: var(--font-copy);
        font-size: 13px;
        letter-spacing: 0.01em;
        line-height: 1.3;
      }

      .solution-choice-price strong {
        color: rgba(238, 248, 255, 0.95);
        font-family: "Aeonik Local", var(--font-copy);
        font-size: clamp(18px, 1.7vw, 23px);
        font-weight: 500;
        letter-spacing: -0.04em;
      }

      .solution-choice-fit-label,
      .solution-choice-benefits-title {
        margin: 28px 0 0;
        color: rgba(150, 208, 255, 0.7);
        font-family: "Aeonik Local", var(--font-copy);
        font-size: 10px;
        font-weight: 500;
        letter-spacing: 0.14em;
        line-height: 1.2;
        text-transform: uppercase;
      }

      .solution-choice-fit {
        margin: 9px 0 0;
        color: rgba(224, 239, 255, 0.84);
        font-family: var(--font-copy);
        font-size: 15px;
        font-weight: 300;
        letter-spacing: -0.018em;
        line-height: 1.68;
      }

      .solution-choice-benefits {
        display: grid;
        gap: 9px;
        margin: 13px 0 0;
        padding: 0;
        list-style: none;
      }

      .solution-choice-benefits li {
        position: relative;
        padding-left: 15px;
        color: rgba(208, 229, 248, 0.74);
        font-family: var(--font-copy);
        font-size: 13px;
        font-weight: 300;
        letter-spacing: -0.015em;
        line-height: 1.45;
      }

      .solution-choice-benefits li::before {
        position: absolute;
        top: 0.56em;
        left: 1px;
        width: 5px;
        height: 5px;
        border-radius: 50%;
        background: #8bd6ff;
        box-shadow: 0 0 9px rgba(104, 202, 255, 0.74);
        content: "";
      }

      .solution-choice-action,
      .trust-action {
        display: inline-flex;
        min-height: 48px;
        align-items: center;
        justify-content: center;
        border: 1px solid rgba(166, 219, 255, 0.35);
        border-radius: 999px;
        padding: 13px 20px;
        color: #eef9ff;
        background: rgba(91, 173, 250, 0.11);
        box-shadow: inset 0 1px rgba(255, 255, 255, 0.11);
        font-family: var(--font-copy);
        font-size: 14px;
        font-weight: 400;
        letter-spacing: -0.015em;
        line-height: 1;
        text-decoration: none;
        transition: transform 180ms ease, border-color 180ms ease, background 180ms ease, box-shadow 180ms ease;
      }

      .solution-choice-action {
        width: 100%;
        margin-top: auto;
        padding-top: 14px;
        padding-bottom: 14px;
      }

      .solution-choice-action:hover,
      .solution-choice-action:focus-visible,
      .trust-action:hover,
      .trust-action:focus-visible {
        border-color: rgba(211, 240, 255, 0.76);
        background: rgba(73, 164, 252, 0.2);
        box-shadow: inset 0 1px rgba(255, 255, 255, 0.18), 0 8px 26px rgba(14, 112, 242, 0.2);
        outline: none;
        transform: translateY(-2px);
      }

      .solution-choice-benefits + .solution-choice-action {
        margin-top: 28px;
      }

      .solution-choice-consult {
        appearance: none;
        cursor: pointer;
      }

      .solution-choice-closing {
        max-width: 720px;
        margin: clamp(42px, 4.8vw, 66px) auto 0;
        color: rgba(208, 230, 250, 0.72);
        font-family: var(--font-copy);
        font-size: clamp(15px, 1.2vw, 18px);
        font-weight: 300;
        letter-spacing: -0.02em;
        line-height: 1.75;
        text-align: center;
        text-wrap: balance;
      }

      .solution-consult-dialog {
        width: min(calc(100vw - 36px), 430px);
        border: 1px solid rgba(165, 219, 255, 0.38);
        border-radius: 24px;
        padding: 0;
        color: #edf8ff;
        background: linear-gradient(145deg, rgba(10, 36, 74, 0.99), rgba(2, 13, 33, 0.99));
        box-shadow: 0 28px 80px rgba(0, 0, 0, 0.56), inset 0 1px rgba(255, 255, 255, 0.12);
      }

      .solution-consult-dialog::backdrop {
        background: rgba(0, 5, 16, 0.72);
        backdrop-filter: blur(7px);
      }

      .solution-consult-dialog-inner {
        position: relative;
        padding: 30px;
      }

      .solution-consult-dialog-close {
        position: absolute;
        top: 13px;
        right: 13px;
        display: inline-grid;
        width: 32px;
        height: 32px;
        place-items: center;
        border: 0;
        border-radius: 50%;
        color: rgba(230, 245, 255, 0.82);
        background: rgba(147, 206, 255, 0.1);
        cursor: pointer;
        font-size: 19px;
        line-height: 1;
      }

      .solution-consult-dialog h2 {
        margin: 0;
        color: #f8fcff;
        font-family: var(--font-title);
        font-size: 28px;
        font-weight: 900;
        letter-spacing: -0.055em;
        line-height: 1.24;
      }

      .solution-consult-dialog p {
        margin: 14px 0 0;
        color: rgba(213, 235, 255, 0.76);
        font-family: var(--font-copy);
        font-size: 15px;
        font-weight: 300;
        line-height: 1.7;
      }

      .solution-consult-dialog .solution-choice-action {
        margin-top: 23px;
      }

      .solution-consult-dialog-status {
        min-height: 1.55em;
        margin-top: 13px !important;
        color: rgba(158, 220, 255, 0.93) !important;
        font-size: 13px !important;
      }

      /* Screen 6: trust, common starting points and the final call to action. */
      .trust-close-section {
        position: relative;
        isolation: isolate;
        overflow: hidden;
        border-top: 1px solid rgba(136, 203, 255, 0.11);
        padding: clamp(100px, 10.5vw, 164px) 0 clamp(74px, 8vw, 112px);
        background:
          radial-gradient(72% 36% at 50% 8%, rgba(37, 135, 255, 0.17), transparent 68%),
          radial-gradient(35% 22% at 100% 54%, rgba(54, 114, 255, 0.09), transparent 75%),
          linear-gradient(180deg, #020817 0%, #020b1d 44%, #010713 100%);
      }

      .trust-close-section::before {
        position: absolute;
        z-index: -1;
        top: 12%;
        left: 50%;
        width: min(1180px, 92vw);
        height: min(1180px, 92vw);
        border: 1px solid rgba(128, 198, 255, 0.07);
        border-radius: 50%;
        box-shadow: 0 0 160px rgba(17, 105, 248, 0.12), inset 0 0 105px rgba(31, 123, 255, 0.04);
        content: "";
        transform: translateX(-50%);
      }

      .trust-fact-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: clamp(12px, 1.7vw, 22px);
        margin: clamp(42px, 4.8vw, 66px) 0 0;
      }

      .trust-fact {
        min-width: 0;
        border-top: 1px solid rgba(152, 209, 255, 0.28);
        padding: clamp(20px, 2.2vw, 29px) clamp(2px, 0.4vw, 7px) 5px;
      }

      .trust-fact dt {
        color: #f3faff;
        font-family: var(--font-title);
        font-size: clamp(29px, 3.05vw, 43px);
        font-weight: 900;
        letter-spacing: -0.065em;
        line-height: 1.16;
      }

      .trust-fact dd {
        margin: 13px 0 0;
        color: rgba(210, 232, 251, 0.72);
        font-family: var(--font-copy);
        font-size: 14px;
        font-weight: 300;
        letter-spacing: -0.015em;
        line-height: 1.67;
      }

      .trust-case-section {
        margin-top: clamp(94px, 10vw, 148px);
      }

      .trust-case-heading {
        max-width: 750px;
      }

      .trust-case-heading .trust-eyebrow {
        margin-bottom: 16px;
      }

      .trust-case-heading h3 {
        font-size: clamp(30px, 3.45vw, 48px);
        line-height: 1.28;
      }

      .trust-case-note {
        margin: 17px 0 0;
        color: rgba(186, 217, 242, 0.62);
        font-family: var(--font-copy);
        font-size: 13px;
        font-weight: 300;
        line-height: 1.65;
      }

      .trust-case-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: clamp(14px, 1.8vw, 24px);
        margin: clamp(35px, 4vw, 55px) 0 0;
        padding: 0;
        list-style: none;
      }

      .trust-case {
        min-width: 0;
        border: 1px solid rgba(128, 194, 247, 0.2);
        border-radius: 22px;
        padding: clamp(22px, 2.35vw, 31px);
        background: rgba(5, 22, 48, 0.5);
        box-shadow: inset 0 1px rgba(235, 249, 255, 0.06);
      }

      .trust-case-index {
        display: inline-flex;
        align-items: center;
        gap: 9px;
        color: rgba(157, 213, 255, 0.77);
        font-family: "Aeonik Local", var(--font-copy);
        font-size: 10px;
        font-weight: 500;
        letter-spacing: 0.15em;
        line-height: 1;
      }

      .trust-case-index::after {
        width: 24px;
        height: 1px;
        background: linear-gradient(90deg, rgba(130, 208, 255, 0.72), transparent);
        content: "";
      }

      .trust-case-stage {
        margin: 24px 0 0;
      }

      .trust-case-stage + .trust-case-stage {
        border-top: 1px solid rgba(132, 191, 240, 0.14);
        padding-top: 19px;
      }

      .trust-case-stage-label {
        margin: 0;
        color: rgba(145, 204, 249, 0.67);
        font-family: "Aeonik Local", var(--font-copy);
        font-size: 10px;
        font-weight: 500;
        letter-spacing: 0.13em;
        line-height: 1.2;
        text-transform: uppercase;
      }

      .trust-case-stage-copy {
        margin: 8px 0 0;
        color: rgba(229, 241, 254, 0.84);
        font-family: var(--font-copy);
        font-size: 15px;
        font-weight: 300;
        letter-spacing: -0.018em;
        line-height: 1.64;
      }

      .trust-case-path {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 6px;
        margin: 10px 0 0;
      }

      .trust-case-path span {
        border: 1px solid rgba(149, 209, 255, 0.18);
        border-radius: 999px;
        padding: 5px 8px;
        color: rgba(194, 229, 255, 0.78);
        background: rgba(74, 157, 239, 0.08);
        font-family: var(--font-copy);
        font-size: 11px;
        line-height: 1;
        white-space: nowrap;
      }

      .trust-final-cta {
        position: relative;
        isolation: isolate;
        overflow: hidden;
        margin-top: clamp(90px, 10vw, 148px);
        border: 1px solid rgba(165, 220, 255, 0.35);
        border-radius: clamp(27px, 3.4vw, 43px);
        padding: clamp(48px, 7vw, 88px) clamp(22px, 6vw, 76px);
        text-align: center;
        background:
          radial-gradient(44% 96% at 50% 0%, rgba(50, 150, 255, 0.31), transparent 74%),
          linear-gradient(145deg, rgba(9, 45, 94, 0.92), rgba(2, 15, 39, 0.97) 68%, rgba(4, 29, 64, 0.94));
        box-shadow: inset 0 1px rgba(240, 251, 255, 0.16), 0 26px 78px rgba(0, 0, 0, 0.38), 0 0 85px rgba(23, 126, 255, 0.12);
      }

      .trust-final-cta::before {
        position: absolute;
        z-index: -1;
        top: -70%;
        left: 50%;
        width: min(620px, 88vw);
        aspect-ratio: 1;
        border: 1px solid rgba(176, 226, 255, 0.18);
        border-radius: 50%;
        box-shadow: 0 0 84px rgba(31, 139, 255, 0.27);
        content: "";
        transform: translateX(-50%);
      }

      .trust-final-cta h2 {
        font-size: clamp(36px, 4.4vw, 62px);
        line-height: 1.18;
      }

      .trust-final-cta p {
        max-width: 590px;
        margin: 21px auto 0;
        color: rgba(220, 240, 255, 0.8);
        font-family: var(--font-copy);
        font-size: clamp(16px, 1.35vw, 20px);
        font-weight: 300;
        letter-spacing: -0.02em;
        line-height: 1.72;
      }

      .trust-action-row {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 12px;
        margin-top: clamp(31px, 3.4vw, 42px);
      }

      .trust-action {
        min-width: min(100%, 210px);
      }

      .trust-action-primary {
        border-color: rgba(202, 237, 255, 0.78);
        color: #031327 !important;
        background: linear-gradient(135deg, #dcf5ff, #83d0ff);
        box-shadow: inset 0 1px rgba(255, 255, 255, 0.72), 0 9px 28px rgba(60, 169, 255, 0.26);
        font-weight: 500;
      }

      .trust-action-primary:hover,
      .trust-action-primary:focus-visible {
        border-color: #eefaff;
        background: linear-gradient(135deg, #f4fcff, #9bdbff);
        box-shadow: inset 0 1px rgba(255, 255, 255, 0.86), 0 12px 34px rgba(60, 169, 255, 0.35);
      }

      .trust-action-secondary {
        background: rgba(4, 26, 58, 0.48);
      }

      @media (max-width: 980px) {
        .trust-fact-grid {
          gap: 13px;
        }
      }

      @media (max-width: 720px) {
        .solution-choice-section,
        .trust-close-section {
          padding-top: 84px;
        }

        .solution-choice-inner,
        .trust-close-inner {
          width: calc(100vw - 32px);
        }

        .solution-choice-section::after {
          width: 104vw;
        }

        .solution-section-heading h2,
        .trust-section-heading h2 {
          font-size: clamp(32px, 9.1vw, 43px);
        }

        .solution-section-heading > p:last-child,
        .trust-section-heading > p:last-child {
          font-size: 15px;
          line-height: 1.7;
        }

        .solution-choice-grid,
        .trust-fact-grid,
        .trust-case-grid {
          grid-template-columns: 1fr;
        }

        .solution-choice-grid > li:last-child,
        .trust-case-grid > li:last-child {
          width: 100%;
          justify-self: stretch;
        }

        .solution-choice-card {
          border-radius: 22px;
          padding: 24px 21px;
        }

        .solution-choice-product {
          font-size: 28px;
        }

        .solution-choice-fit-label,
        .solution-choice-benefits-title {
          margin-top: 24px;
        }

        .solution-choice-benefits li {
          font-size: 13px;
        }

        .solution-choice-closing {
          margin-top: 37px;
          font-size: 15px;
        }

        .trust-fact-grid {
          gap: 0;
          margin-top: 36px;
        }

        .trust-fact {
          padding: 23px 0 20px;
        }

        .trust-fact dt {
          font-size: 34px;
        }

        .trust-case-section {
          margin-top: 76px;
        }

        .trust-case-heading h3 {
          font-size: 31px;
        }

        .trust-case-grid {
          gap: 12px;
          margin-top: 31px;
        }

        .trust-case {
          border-radius: 19px;
          padding: 21px 19px;
        }

        .trust-final-cta {
          margin-top: 76px;
          border-radius: 27px;
          padding: 47px 19px;
        }

        .trust-final-cta h2 {
          font-size: clamp(33px, 9vw, 43px);
        }

        .trust-final-cta p {
          margin-top: 18px;
          font-size: 15px;
          line-height: 1.68;
        }

        .trust-action-row {
          display: grid;
          grid-template-columns: 1fr;
          gap: 10px;
          margin-top: 29px;
        }

        .trust-action {
          width: 100%;
          min-width: 0;
        }

        .solution-consult-dialog-inner {
          padding: 29px 23px 24px;
        }
      }

      @media (prefers-reduced-motion: reduce) {
        .hero-black-hole .lazy-video {
          display: none;
        }

        .black-hole-poster img {
          animation: none !important;
        }

        *,
        *::before,
        *::after {
          scroll-behavior: auto !important;
          transition-duration: 0.01ms !important;
          animation-duration: 0.01ms !important;
          animation-iteration-count: 1 !important;
        }
      }

      :root {
        color-scheme: dark;
        --night: #0a0a09;
        --night-raised: #11110f;
        --night-soft: #171715;
        --ink: #f2f0e9;
        --soft-ink: rgba(242, 240, 233, 0.72);
        --muted: rgba(167, 163, 154, 0.68);
        --violet: #c8c4ba;
        --violet-bright: #efede6;
        --violet-deep: #706e67;
        --lavender: #efede6;
        --ring: rgba(242, 240, 233, 0.2);
        --panel: rgba(23, 23, 21, 0.72);
        --panel-strong: rgba(17, 17, 15, 0.88);
        --line: rgba(242, 240, 233, 0.14);
        --line-soft: rgba(242, 240, 233, 0.08);
        --glass: linear-gradient(145deg, rgba(29, 29, 26, 0.92), rgba(17, 17, 15, 0.94));
        --shadow: 0 28px 84px rgba(0, 0, 0, 0.46);
      }

      html {
        background: var(--night);
      }

      body {
        color: var(--ink);
        background:
          radial-gradient(72% 32% at 50% -8%, rgba(242, 240, 233, 0.065), transparent 70%),
          radial-gradient(48% 28% at 8% 54%, rgba(242, 240, 233, 0.028), transparent 76%),
          var(--night);
      }

      body::before {
        opacity: 0.14;
        background-image:
          radial-gradient(circle at 11% 24%, rgba(242, 240, 233, 0.72) 0 1px, transparent 1.5px),
          radial-gradient(circle at 87% 19%, rgba(242, 240, 233, 0.54) 0 1px, transparent 1.6px),
          radial-gradient(circle at 77% 72%, rgba(242, 240, 233, 0.42) 0 1px, transparent 1.3px),
          radial-gradient(circle at 18% 80%, rgba(242, 240, 233, 0.48) 0 1px, transparent 1.5px);
      }

      body::after {
        opacity: 0.075;
      }

      a:focus-visible,
      button:focus-visible {
        outline-color: #efede6;
      }

      .skip-link {
        color: #11110f;
        background: #efede6;
      }

      /* Fixed navigation is injected by nav.js; this late page style keeps it neutral. */
      .dawn-experiment-navbar {
        color: var(--ink);
        background: linear-gradient(180deg, rgba(10, 10, 9, 0.94), rgba(10, 10, 9, 0.42) 72%, transparent);
      }

      .dawn-experiment-navbar.scrolled,
      .dawn-experiment-navbar.is-menu-open {
        background: rgba(17, 17, 15, 0.9);
        border-bottom-color: var(--line);
        box-shadow: 0 12px 38px rgba(0, 0, 0, 0.32), inset 0 -1px rgba(242, 240, 233, 0.045);
        backdrop-filter: blur(20px) saturate(105%);
        -webkit-backdrop-filter: blur(20px) saturate(105%);
      }

      .dawn-experiment-navbar .nav-logo-img {
        filter: brightness(0) invert(1) sepia(0.08) saturate(0.55);
      }

      .dawn-experiment-navbar .nav-link {
        color: rgba(242, 240, 233, 0.76);
      }

      .dawn-experiment-navbar .nav-link::before {
        background: linear-gradient(90deg, transparent, #efede6, transparent);
        box-shadow: none;
      }

      .dawn-experiment-navbar .nav-link:hover,
      .dawn-experiment-navbar .nav-item.is-open > .nav-link,
      .dawn-experiment-navbar .nav-item.is-hover-open > .nav-link {
        color: #fffdf7;
        text-shadow: none;
      }

      .dawn-experiment-navbar .nav-dropdown {
        border-color: var(--line);
        background: rgba(23, 23, 21, 0.96);
        box-shadow: 0 18px 42px rgba(0, 0, 0, 0.38), inset 0 1px rgba(242, 240, 233, 0.08);
        backdrop-filter: blur(20px) saturate(105%);
        -webkit-backdrop-filter: blur(20px) saturate(105%);
      }

      .dawn-experiment-navbar .nav-dropdown-item {
        color: rgba(242, 240, 233, 0.7);
      }

      .dawn-experiment-navbar .nav-dropdown-item:hover,
      .dawn-experiment-navbar .nav-dropdown-item:focus-visible {
        color: #fffdf7;
        background: rgba(242, 240, 233, 0.09);
      }

      .dawn-experiment-navbar .nav-search-icon,
      .dawn-experiment-navbar .nav-search-icon::after {
        border-color: rgba(242, 240, 233, 0.66);
      }

      .dawn-experiment-navbar .nav-search-icon::after {
        border-top-color: rgba(242, 240, 233, 0.66);
      }

      .dawn-experiment-navbar .nav-search-input {
        color: var(--ink);
      }

      .dawn-experiment-navbar .nav-search-input::placeholder {
        color: rgba(242, 240, 233, 0.4);
      }

      .dawn-experiment-navbar .nav-link:focus-visible,
      .dawn-experiment-navbar .nav-mobile-toggle:focus-visible {
        outline-color: #efede6;
      }

      @media (max-width: 720px) {
        .dawn-experiment-navbar .navbar-links {
          border-color: var(--line);
          background: rgba(23, 23, 21, 0.98);
          box-shadow: 0 18px 42px rgba(0, 0, 0, 0.4), inset 0 1px rgba(242, 240, 233, 0.07);
        }
      }

      /* First screen: retain the orbit and layout, remove the cyan treatment. */
      .dawn-hero {
        background:
          radial-gradient(64% 42% at 50% 70%, rgba(242, 240, 233, 0.055), transparent 72%),
          radial-gradient(38% 66% at 50% 23%, rgba(242, 240, 233, 0.03), transparent 100%),
          var(--night);
      }

      .dawn-hero::before {
        opacity: 0.28;
        background:
          linear-gradient(90deg, transparent 49.94%, rgba(242, 240, 233, 0.018) 50%, transparent 50.06%),
          linear-gradient(transparent 49.94%, rgba(242, 240, 233, 0.012) 50%, transparent 50.06%);
      }

      .dawn-hero::after {
        background: linear-gradient(180deg, transparent, rgba(10, 10, 9, 0.48));
      }

      .ambient-star {
        background: rgba(242, 240, 233, 0.84);
        box-shadow: 0 0 8px rgba(242, 240, 233, 0.24);
      }

      .hero-black-hole {
        background:
          radial-gradient(ellipse 22% 36% at 50% 55%, rgba(242, 240, 233, 0.24), rgba(112, 110, 103, 0.08) 46%, transparent 74%),
          radial-gradient(ellipse 55% 32% at 50% 55%, rgba(242, 240, 233, 0.035), transparent 72%);
      }

      .black-hole-poster img,
      .lazy-video video {
        filter: grayscale(1) sepia(0.05) saturate(0.38) contrast(1.02) brightness(0.72);
      }

      .hero-black-hole-circles .orbit {
        background: rgba(242, 240, 233, 0.018);
      }

      .hero-black-hole-circles .orbit::before,
      .hero-black-hole-circles .orbit::after {
        border-color: rgba(242, 240, 233, 0.22);
        background: rgba(242, 240, 233, 0.02);
        box-shadow: 0 0 16px rgba(242, 240, 233, 0.12);
      }

      .hero-heading-lockup::before {
        background: radial-gradient(ellipse 62% 58% at 13% 50%, rgba(242, 240, 233, 0.1) 0%, rgba(200, 196, 186, 0.045) 34%, transparent 70%);
      }

      .hero-badge {
        border-color: rgba(242, 240, 233, 0.15);
        background:
          radial-gradient(ellipse 31% 220% at 49% 50%, rgba(242, 240, 233, 0.1) 0%, transparent 62%),
          linear-gradient(145deg, rgba(29, 29, 26, 0.88), rgba(17, 17, 15, 0.9));
        box-shadow: inset 0 1px rgba(242, 240, 233, 0.11), 0 10px 30px rgba(0, 0, 0, 0.23);
        color: #efede6;
        text-shadow: none;
        backdrop-filter: blur(16px) saturate(105%);
        -webkit-backdrop-filter: blur(16px) saturate(105%);
      }

      .hero-badge::before {
        background: radial-gradient(ellipse 32% 190% at 49% 50%, rgba(242, 240, 233, 0.09), transparent 68%);
        opacity: 0.68;
      }

      .hero-badge::after {
        background: linear-gradient(90deg, rgba(242, 240, 233, 0.12), rgba(242, 240, 233, 0.045) 30%, rgba(242, 240, 233, 0.22) 47%, rgba(242, 240, 233, 0.07) 67%, rgba(242, 240, 233, 0.12)) border-box;
        filter: none;
      }

      .badge-logo-mark,
      .hero-badge-copy:last-child {
        color: #efede6;
        text-shadow: none;
      }

      .badge-light-slit {
        background: linear-gradient(180deg, transparent 0, #efede6 16%, #c8c4ba 42%, #fffdf7 58%, #a7a39a 84%, transparent 100%);
        box-shadow: 0 0 3px rgba(242, 240, 233, 0.46), 0 0 12px rgba(242, 240, 233, 0.14);
      }

      .hero-title {
        background: linear-gradient(180deg, #fffdf7 0%, rgba(239, 237, 230, 0.7) 100%);
        background-clip: text;
        -webkit-background-clip: text;
      }

      .hero-description {
        color: var(--soft-ink);
      }

      .product-preview::before {
        background: radial-gradient(ellipse, rgba(242, 240, 233, 0.12), rgba(242, 240, 233, 0.025) 42%, transparent 72%);
      }

      .product-preview-shell,
      .product-preview-shell.is-shell-transparent {
        border-color: rgba(242, 240, 233, 0.18);
        background: var(--glass);
        box-shadow: 0 34px 84px rgba(0, 0, 0, 0.43), inset 0 1px rgba(242, 240, 233, 0.16);
        backdrop-filter: blur(18px) saturate(105%);
        -webkit-backdrop-filter: blur(18px) saturate(105%);
      }

      .product-preview-shell.is-shell-transparent::before,
      .product-preview-shell.is-shell-transparent .actual-app-frame,
      .actual-app-frame {
        border-color: rgba(242, 240, 233, 0.18);
        background: rgba(17, 17, 15, 0.58);
        box-shadow: inset 0 1px rgba(242, 240, 233, 0.12), 0 16px 48px rgba(0, 0, 0, 0.26);
      }

      .product-preview-shell.is-shell-transparent .actual-app-frame img,
      .actual-app-frame img {
        filter: none;
      }

      .actual-app-frame::after,
      .product-preview-shell.is-shell-transparent .actual-app-frame::after {
        background: linear-gradient(135deg, rgba(242, 240, 233, 0.045), transparent 42%, rgba(242, 240, 233, 0.025));
      }

      /* Story, founder and timeline. */
      .hero-story::before {
        background: radial-gradient(48% 38% at 72% 22%, rgba(242, 240, 233, 0.04), transparent 72%);
      }

      .hero-story-title,
      .founder-copy-title,
      .founder-copy-question-title,
      .founder-transitions-bridge,
      .ai-shift-title {
        color: var(--ink);
      }

      .hero-story-copy p,
      .founder-copy-question-detail,
      .founder-copy-summary,
      .founder-transitions-title,
      .ai-shift-stages {
        color: rgba(242, 240, 233, 0.72);
      }

      .story-timeline::before {
        background: linear-gradient(90deg, rgba(242, 240, 233, 0.06), rgba(242, 240, 233, 0.48) 58%, rgba(242, 240, 233, 0.22));
      }

      .story-timeline::after {
        background: linear-gradient(180deg, rgba(242, 240, 233, 0.54), rgba(242, 240, 233, 0.12) 82%, transparent);
        box-shadow: none;
      }

      .story-timeline-item::before {
        border-color: rgba(242, 240, 233, 0.72);
        background: #c8c4ba;
        box-shadow: 0 0 0 5px rgba(242, 240, 233, 0.07), 0 0 12px rgba(242, 240, 233, 0.2);
      }

      .story-timeline-item time {
        color: #efede6;
      }

      .story-timeline-item span {
        color: rgba(242, 240, 233, 0.62);
      }

      .founder-portrait-frame {
        border-color: rgba(242, 240, 233, 0.19);
        background: linear-gradient(145deg, #171715, #0a0a09);
        box-shadow: 0 22px 48px rgba(0, 0, 0, 0.32), 0 19px 40px rgba(0, 0, 0, 0.16);
      }

      .founder-portrait-frame::after {
        background:
          linear-gradient(180deg, transparent, rgba(10, 10, 9, 0.3) 36%, rgba(10, 10, 9, 0.92) 100%),
          linear-gradient(90deg, rgba(10, 10, 9, 0.34), transparent 72%);
      }

      .founder-portrait-frame > .founder-portrait-panel {
        border-color: rgba(242, 240, 233, 0.14);
        background:
          radial-gradient(88% 38% at 50% 102%, rgba(242, 240, 233, 0.32) 0%, rgba(167, 163, 154, 0.15) 25%, transparent 70%),
          linear-gradient(145deg, rgba(29, 29, 26, 0.92), rgba(10, 10, 9, 0.96));
        box-shadow: 0 22px 48px rgba(0, 0, 0, 0.28), inset 0 1px rgba(242, 240, 233, 0.12), inset 0 -30px 36px rgba(0, 0, 0, 0.22);
      }

      .founder-transition-card,
      .ai-system-item,
      .founder-portrait-panel {
        border-color: rgba(242, 240, 233, 0.14);
        background: linear-gradient(145deg, rgba(29, 29, 26, 0.94), rgba(17, 17, 15, 0.97));
        box-shadow: 0 22px 48px rgba(0, 0, 0, 0.28), inset 0 1px rgba(242, 240, 233, 0.1);
      }

      .founder-transition-card::before,
      .ai-system-item::before,
      .founder-portrait-panel::before {
        background-image:
          linear-gradient(rgba(242, 240, 233, 0.035) 1px, transparent 1px),
          linear-gradient(90deg, rgba(242, 240, 233, 0.035) 1px, transparent 1px);
        opacity: 0.38;
      }

      .founder-metric-title,
      .founder-copy-question-title,
      .founder-transition-card h3,
      .ai-system-item h3 {
        color: #efede6;
      }

      .founder-metric-detail,
      .founder-transition-card p,
      .ai-system-item p {
        color: rgba(242, 240, 233, 0.7);
      }

      .founder-copy-question + .founder-copy-question,
      .founder-copy-summary {
        border-color: rgba(242, 240, 233, 0.11);
      }

      .founder-copy-question::before {
        color: rgba(200, 196, 186, 0.72);
      }

      /* The original three-card system remains exactly in place, with a quieter material. */
      .system-loop-section {
        border-top-color: rgba(242, 240, 233, 0.1);
      }

      .system-loop-section::before {
        background:
          radial-gradient(52% 26% at 22% 32%, rgba(242, 240, 233, 0.055), transparent 72%),
          radial-gradient(46% 20% at 78% 76%, rgba(242, 240, 233, 0.03), transparent 76%),
          linear-gradient(180deg, rgba(17, 17, 15, 0.08), rgba(10, 10, 9, 0.42));
      }

      .system-loop-section::after {
        opacity: 0.15;
        background-image:
          linear-gradient(rgba(242, 240, 233, 0.035) 1px, transparent 1px),
          linear-gradient(90deg, rgba(242, 240, 233, 0.035) 1px, transparent 1px);
      }

      .system-loop-eyebrow,
      .system-offer-index {
        color: rgba(200, 196, 186, 0.78);
      }

      .system-loop-eyebrow::before {
        background: #c8c4ba;
        box-shadow: 0 0 10px rgba(242, 240, 233, 0.2);
      }

      .system-loop-title,
      .system-offer-card h3 {
        color: #efede6;
      }

      .system-loop-subtitle,
      .system-offer-lead,
      .system-offer-list li {
        color: rgba(242, 240, 233, 0.72);
      }

      .system-offer-card {
        border-color: rgba(242, 240, 233, 0.16);
        background: linear-gradient(145deg, rgba(29, 29, 26, 0.96), rgba(17, 17, 15, 0.98));
        box-shadow: 0 24px 56px rgba(0, 0, 0, 0.28), inset 0 1px rgba(242, 240, 233, 0.09);
      }

      .system-offer-card::before {
        opacity: 0.3;
        background-image:
          linear-gradient(rgba(242, 240, 233, 0.035) 1px, transparent 1px),
          linear-gradient(90deg, rgba(242, 240, 233, 0.035) 1px, transparent 1px);
      }

      .system-offer-index::after {
        background: linear-gradient(90deg, rgba(239, 237, 230, 0.66), transparent);
        box-shadow: none;
      }

      .system-offer-list {
        border-top-color: rgba(242, 240, 233, 0.11);
      }

      .system-offer-media {
        border-color: rgba(242, 240, 233, 0.12);
        background: rgba(10, 10, 9, 0.56);
        box-shadow: inset 0 1px rgba(242, 240, 233, 0.05);
      }

      .system-system-preview-wall {
        background: #0f0f0e;
      }

      .system-offer-list li::before {
        background: #c8c4ba;
        filter: none;
      }

      /* Screen five: retain the selection grid, make the material black and silver. */
      .solution-choice-section {
        border-top-color: rgba(242, 240, 233, 0.1);
        background:
          radial-gradient(68% 34% at 50% 2%, rgba(242, 240, 233, 0.055), transparent 70%),
          radial-gradient(34% 30% at 1% 72%, rgba(242, 240, 233, 0.025), transparent 76%),
          linear-gradient(180deg, #0a0a09 0%, #11110f 58%, #0a0a09 100%);
      }

      .solution-choice-section::before {
        opacity: 0.22;
        background-image:
          linear-gradient(rgba(242, 240, 233, 0.03) 1px, transparent 1px),
          linear-gradient(90deg, rgba(242, 240, 233, 0.03) 1px, transparent 1px);
      }

      .solution-choice-section::after {
        border-color: rgba(242, 240, 233, 0.08);
        box-shadow: 0 0 150px rgba(242, 240, 233, 0.025), inset 0 0 100px rgba(242, 240, 233, 0.012);
      }

      .solution-eyebrow,
      .trust-eyebrow,
      .solution-choice-mode,
      .solution-choice-fit-label,
      .solution-choice-benefits-title {
        color: rgba(200, 196, 186, 0.78);
      }

      .solution-eyebrow::before,
      .trust-eyebrow::before {
        background: #c8c4ba;
        box-shadow: 0 0 10px rgba(242, 240, 233, 0.18);
      }

      .solution-section-heading h2,
      .trust-section-heading h2,
      .trust-case-heading h3,
      .trust-final-cta h2,
      .solution-choice-product {
        color: #efede6;
      }

      .solution-section-heading > p:last-child,
      .trust-section-heading > p:last-child,
      .solution-choice-closing {
        color: rgba(242, 240, 233, 0.7);
      }

      .solution-choice-card {
        border-color: rgba(242, 240, 233, 0.14);
        background: linear-gradient(145deg, rgba(29, 29, 26, 0.95), rgba(17, 17, 15, 0.98));
        box-shadow: inset 0 1px rgba(242, 240, 233, 0.08), 0 22px 54px rgba(0, 0, 0, 0.28);
      }

      .solution-choice-card::after {
        opacity: 0.24;
        background-image:
          linear-gradient(rgba(242, 240, 233, 0.03) 1px, transparent 1px),
          linear-gradient(90deg, rgba(242, 240, 233, 0.03) 1px, transparent 1px);
      }

      .solution-choice-card.is-recommended {
        border-color: rgba(242, 240, 233, 0.3);
        background: linear-gradient(145deg, rgba(36, 36, 32, 0.98), rgba(20, 20, 18, 0.99));
        box-shadow: inset 0 1px rgba(242, 240, 233, 0.14), 0 25px 62px rgba(0, 0, 0, 0.3);
      }

      .solution-choice-recommendation {
        border-color: rgba(242, 240, 233, 0.2);
        color: rgba(242, 240, 233, 0.78);
        background: rgba(242, 240, 233, 0.06);
      }

      .solution-choice-price,
      .solution-choice-fit,
      .solution-choice-benefits li {
        color: rgba(242, 240, 233, 0.72);
      }

      .solution-choice-price strong {
        color: #efede6;
      }

      .solution-choice-benefits li::before {
        background: #c8c4ba;
        box-shadow: none;
      }

      .solution-choice-action,
      .trust-action {
        border-color: rgba(242, 240, 233, 0.23);
        color: #efede6;
        background: rgba(242, 240, 233, 0.055);
        box-shadow: inset 0 1px rgba(242, 240, 233, 0.08);
      }

      .solution-choice-action:hover,
      .solution-choice-action:focus-visible,
      .trust-action:hover,
      .trust-action:focus-visible {
        border-color: rgba(242, 240, 233, 0.48);
        background: rgba(242, 240, 233, 0.11);
        box-shadow: inset 0 1px rgba(242, 240, 233, 0.14), 0 8px 26px rgba(0, 0, 0, 0.18);
      }

      .solution-consult-dialog {
        border-color: rgba(242, 240, 233, 0.2);
        color: #efede6;
        background: linear-gradient(145deg, #1d1d1a, #11110f);
        box-shadow: 0 28px 80px rgba(0, 0, 0, 0.6), inset 0 1px rgba(242, 240, 233, 0.11);
      }

      .solution-consult-dialog::backdrop {
        background: rgba(0, 0, 0, 0.76);
      }

      .solution-consult-dialog-close {
        color: rgba(242, 240, 233, 0.82);
        background: rgba(242, 240, 233, 0.08);
      }

      .solution-consult-dialog h2 {
        color: #efede6;
      }

      .solution-consult-dialog p {
        color: rgba(242, 240, 233, 0.72);
      }

      .solution-consult-dialog-status {
        color: rgba(239, 237, 230, 0.86) !important;
      }

      /* Screen six and the final action. */
      .trust-close-section {
        border-top-color: rgba(242, 240, 233, 0.1);
        background:
          radial-gradient(72% 36% at 50% 8%, rgba(242, 240, 233, 0.055), transparent 68%),
          radial-gradient(35% 22% at 100% 54%, rgba(242, 240, 233, 0.022), transparent 75%),
          linear-gradient(180deg, #0a0a09 0%, #11110f 44%, #0a0a09 100%);
      }

      .trust-close-section::before {
        border-color: rgba(242, 240, 233, 0.055);
        box-shadow: 0 0 160px rgba(242, 240, 233, 0.028), inset 0 0 105px rgba(242, 240, 233, 0.012);
      }

      .trust-fact {
        border-top-color: rgba(242, 240, 233, 0.18);
      }

      .trust-fact dt {
        color: #efede6;
      }

      .trust-fact dd,
      .trust-case-note,
      .trust-case-stage-copy {
        color: rgba(242, 240, 233, 0.7);
      }

      .trust-case {
        border-color: rgba(242, 240, 233, 0.13);
        background: rgba(23, 23, 21, 0.7);
        box-shadow: inset 0 1px rgba(242, 240, 233, 0.06);
      }

      .trust-case-index,
      .trust-case-stage-label {
        color: rgba(200, 196, 186, 0.78);
      }

      .trust-case-index::after {
        background: linear-gradient(90deg, rgba(239, 237, 230, 0.62), transparent);
      }

      .trust-case-stage + .trust-case-stage {
        border-top-color: rgba(242, 240, 233, 0.1);
      }

      .trust-case-path span {
        border-color: rgba(242, 240, 233, 0.14);
        color: rgba(242, 240, 233, 0.72);
        background: rgba(242, 240, 233, 0.045);
      }

      .trust-final-cta {
        border-color: rgba(242, 240, 233, 0.23);
        background:
          radial-gradient(44% 96% at 50% 0%, rgba(242, 240, 233, 0.09), transparent 74%),
          linear-gradient(145deg, rgba(29, 29, 26, 0.98), rgba(17, 17, 15, 0.99));
        box-shadow: inset 0 1px rgba(242, 240, 233, 0.13), 0 26px 78px rgba(0, 0, 0, 0.38);
      }

      .trust-final-cta::before {
        border-color: rgba(242, 240, 233, 0.11);
        box-shadow: 0 0 84px rgba(242, 240, 233, 0.08);
      }

      .trust-final-cta p {
        color: rgba(242, 240, 233, 0.72);
      }

      .trust-action-primary {
        border-color: #efede6;
        color: #11110f !important;
        background: #efede6;
        box-shadow: inset 0 1px rgba(255, 255, 255, 0.7), 0 9px 28px rgba(0, 0, 0, 0.2);
      }

      .trust-action-primary:hover,
      .trust-action-primary:focus-visible {
        border-color: #fffdf7;
        color: #11110f !important;
        background: #fffdf7;
        box-shadow: inset 0 1px rgba(255, 255, 255, 0.82), 0 12px 34px rgba(0, 0, 0, 0.24);
      }

      .trust-action-secondary {
        background: rgba(242, 240, 233, 0.045);
      }

      .site-footer {
        border-top-color: rgba(242, 240, 233, 0.1);
        color: rgba(200, 196, 186, 0.58);
        background: rgba(10, 10, 9, 0.82);
      }

      .footer-inner a {
        color: rgba(239, 237, 230, 0.72);
      }

      .footer-inner a:hover {
        color: #fffdf7;
      }

      .test-note {
        color: rgba(200, 196, 186, 0.72);
      }

      .test-note::before {
        background: #c8c4ba;
        box-shadow: 0 0 8px rgba(242, 240, 233, 0.2);
      }

      /* Reflect-inspired violet translation: colours and material only; the homepage layout stays intact. */
      :root {
        color-scheme: dark;
        --night: #030014;
        --night-raised: #080624;
        --night-soft: #0d0827;
        --ink: #f4f0ff;
        --soft-ink: rgba(239, 237, 253, 0.7);
        --muted: rgba(239, 237, 253, 0.55);
        --violet: #9382ff;
        --violet-bright: #c9b1ff;
        --violet-deep: #712fff;
        --lavender: #f3eeff;
        --ring: rgba(147, 130, 255, 0.3);
        --panel: rgba(10, 6, 36, 0.8);
        --panel-strong: rgba(8, 6, 36, 0.92);
        --line: rgba(243, 238, 255, 0.1);
        --line-soft: rgba(243, 238, 255, 0.055);
        --glass: linear-gradient(145deg, rgba(24, 16, 57, 0.94), rgba(8, 6, 36, 0.98));
        --shadow: 0 28px 84px rgba(3, 0, 20, 0.52);
      }

      html { background: var(--night); }

      body {
        background:
          radial-gradient(72% 32% at 50% -8%, rgba(148, 101, 255, 0.08), transparent 70%),
          radial-gradient(48% 28% at 8% 54%, rgba(147, 130, 255, 0.035), transparent 76%),
          var(--night);
      }

      body::before {
        opacity: 0.1;
        background-image:
          radial-gradient(circle at 11% 24%, rgba(201, 177, 255, 0.72) 0 1px, transparent 1.5px),
          radial-gradient(circle at 87% 19%, rgba(164, 143, 255, 0.54) 0 1px, transparent 1.6px),
          radial-gradient(circle at 77% 72%, rgba(147, 130, 255, 0.42) 0 1px, transparent 1.3px),
          radial-gradient(circle at 18% 80%, rgba(201, 177, 255, 0.48) 0 1px, transparent 1.5px);
      }

      body::after { opacity: 0.06; }

      a:focus-visible,
      button:focus-visible { outline-color: var(--violet); }

      .skip-link {
        color: #030014;
        background: #f4f0ff;
      }

      /* Reflect uses a near-transparent violet header rather than a coloured bar. */
      .dawn-experiment-navbar {
        background: linear-gradient(180deg, rgba(3, 0, 20, 0.88), rgba(3, 0, 20, 0.24) 72%, transparent);
      }

      .dawn-experiment-navbar.scrolled,
      .dawn-experiment-navbar.is-menu-open {
        background: rgba(3, 0, 20, 0.82);
        border-bottom-color: rgba(243, 238, 255, 0.08);
        box-shadow: 0 12px 38px rgba(3, 0, 20, 0.4), inset 0 -1px rgba(255, 255, 255, 0.055);
        backdrop-filter: blur(16px) saturate(105%);
        -webkit-backdrop-filter: blur(16px) saturate(105%);
      }

      .dawn-experiment-navbar .nav-logo-img {
        filter: brightness(0) invert(1) sepia(0.09) saturate(0.5) hue-rotate(220deg);
      }

      .dawn-experiment-navbar .nav-link { color: rgba(244, 240, 255, 0.9); }

      .dawn-experiment-navbar .nav-link::before {
        background: linear-gradient(90deg, transparent, #e59cff, #ba9cff 52%, #9cb2ff, transparent);
      }

      .dawn-experiment-navbar .nav-link:hover,
      .dawn-experiment-navbar .nav-item.is-open > .nav-link,
      .dawn-experiment-navbar .nav-item.is-hover-open > .nav-link { color: #f4f0ff; }

      .dawn-experiment-navbar .nav-dropdown {
        border-color: rgba(243, 238, 255, 0.1);
        background: rgba(8, 4, 31, 0.94);
        box-shadow: 0 18px 42px rgba(3, 0, 20, 0.48), inset 0 1px rgba(255, 255, 255, 0.075);
        backdrop-filter: blur(16px) saturate(105%);
        -webkit-backdrop-filter: blur(16px) saturate(105%);
      }

      .dawn-experiment-navbar .nav-dropdown-item { color: rgba(239, 237, 253, 0.72); }

      .dawn-experiment-navbar .nav-dropdown-item:hover,
      .dawn-experiment-navbar .nav-dropdown-item:focus-visible {
        color: #f4f0ff;
        background: rgba(147, 130, 255, 0.08);
      }

      .dawn-experiment-navbar .nav-search-icon,
      .dawn-experiment-navbar .nav-search-icon::after { border-color: rgba(243, 238, 255, 0.7); }

      .dawn-experiment-navbar .nav-search-icon::after { border-top-color: rgba(243, 238, 255, 0.7); }

      .dawn-experiment-navbar .nav-search-input::placeholder { color: rgba(239, 237, 253, 0.42); }

      .dawn-experiment-navbar .nav-link:focus-visible,
      .dawn-experiment-navbar .nav-mobile-toggle:focus-visible { outline-color: var(--violet); }

      @media (max-width: 720px) {
        .dawn-experiment-navbar .navbar-links {
          border-color: rgba(243, 238, 255, 0.08);
          background: rgba(3, 0, 20, 0.92);
          box-shadow: 0 18px 42px rgba(3, 0, 20, 0.5), inset 0 1px rgba(255, 255, 255, 0.06);
          backdrop-filter: blur(12px);
          -webkit-backdrop-filter: blur(12px);
        }
      }

      /* First screen: violet stays in the surrounding light, never as a solid fill. */
      .dawn-hero {
        background:
          radial-gradient(64% 42% at 50% 70%, rgba(148, 101, 255, 0.09), transparent 72%),
          radial-gradient(38% 66% at 50% 23%, rgba(147, 130, 255, 0.045), transparent 100%),
          var(--night);
      }

      .dawn-hero::before {
        background:
          linear-gradient(90deg, transparent 49.94%, rgba(201, 177, 255, 0.018) 50%, transparent 50.06%),
          linear-gradient(transparent 49.94%, rgba(201, 177, 255, 0.012) 50%, transparent 50.06%);
      }

      .dawn-hero::after { background: linear-gradient(180deg, transparent, rgba(3, 0, 20, 0.58)); }

      .ambient-star {
        background: #c9b1ff;
        box-shadow: 0 0 8px rgba(147, 130, 255, 0.28);
      }

      .hero-black-hole {
        background:
          radial-gradient(ellipse 22% 36% at 50% 55%, rgba(201, 177, 255, 0.24), rgba(113, 47, 255, 0.12) 46%, transparent 74%),
          radial-gradient(ellipse 55% 32% at 50% 55%, rgba(148, 101, 255, 0.055), transparent 72%);
      }

      .hero-black-hole-circles .orbit { background: rgba(147, 130, 255, 0.02); }

      .hero-black-hole-circles .orbit::before,
      .hero-black-hole-circles .orbit::after {
        border-color: rgba(201, 177, 255, 0.22);
        background: rgba(147, 130, 255, 0.018);
        box-shadow: 0 0 16px rgba(113, 47, 255, 0.13);
      }

      .hero-heading-lockup::before {
        background: radial-gradient(ellipse 62% 58% at 13% 50%, rgba(164, 143, 255, 0.12) 0%, rgba(147, 130, 255, 0.05) 34%, transparent 70%);
      }

      .hero-badge {
        border-color: rgba(201, 177, 255, 0.2);
        background:
          radial-gradient(ellipse 31% 220% at 49% 50%, rgba(147, 130, 255, 0.13) 0%, transparent 62%),
          linear-gradient(145deg, rgba(255, 255, 255, 0.035), rgba(18, 10, 50, 0.82));
        box-shadow: inset 0 1px rgba(255, 255, 255, 0.11), 0 10px 30px rgba(3, 0, 20, 0.3);
        color: #f4f0ff;
      }

      .hero-badge::before { background: radial-gradient(ellipse 32% 190% at 49% 50%, rgba(164, 143, 255, 0.12), transparent 68%); }

      .hero-badge::after {
        background: linear-gradient(90deg, rgba(229, 156, 255, 0.16), rgba(186, 156, 255, 0.06) 30%, rgba(156, 178, 255, 0.25) 47%, rgba(186, 156, 255, 0.08) 67%, rgba(229, 156, 255, 0.14)) border-box;
      }

      .badge-logo-mark,
      .hero-badge-copy:last-child { color: #f3eeff; }

      .badge-light-slit {
        background: linear-gradient(180deg, transparent 0%, #caa8ff 13%, #fff 42%, #f8f0ff 58%, #b982ff 87%, transparent 100%);
        box-shadow:
          0 0 2px rgba(255, 255, 255, 1),
          0 0 7px rgba(239, 218, 255, 0.98),
          0 0 17px rgba(181, 111, 255, 0.78),
          0 0 34px rgba(118, 59, 241, 0.46);
      }

      .hero-title {
        background: linear-gradient(180deg, #f4f0ff 0%, rgba(218, 208, 248, 0.72) 100%);
        background-clip: text;
        -webkit-background-clip: text;
      }

      .product-preview::before { background: radial-gradient(ellipse, rgba(164, 143, 255, 0.14), rgba(147, 130, 255, 0.03) 42%, transparent 72%); }

      .product-preview-shell,
      .product-preview-shell.is-shell-transparent {
        border-color: rgba(201, 177, 255, 0.16);
        background: var(--glass);
        box-shadow: 0 34px 84px rgba(3, 0, 20, 0.5), inset 0 1px rgba(255, 255, 255, 0.12);
      }

      .product-preview-shell.is-shell-transparent::before,
      .product-preview-shell.is-shell-transparent .actual-app-frame,
      .actual-app-frame {
        border-color: rgba(201, 177, 255, 0.15);
        background: rgba(8, 4, 31, 0.62);
        box-shadow: inset 0 1px rgba(255, 255, 255, 0.1), 0 16px 48px rgba(3, 0, 20, 0.32);
      }

      .actual-app-frame::after,
      .product-preview-shell.is-shell-transparent .actual-app-frame::after {
        background: linear-gradient(135deg, rgba(201, 177, 255, 0.055), transparent 42%, rgba(147, 130, 255, 0.04));
      }

      /* Story and founder material. */
      .hero-story::before { background: radial-gradient(48% 38% at 72% 22%, rgba(148, 101, 255, 0.06), transparent 72%); }

      .hero-story-copy p,
      .founder-copy-question-detail,
      .founder-copy-summary,
      .founder-transitions-title,
      .ai-shift-stages { color: var(--soft-ink); }

      .story-timeline::before { background: linear-gradient(90deg, rgba(147, 130, 255, 0.06), rgba(201, 177, 255, 0.52) 58%, rgba(156, 178, 255, 0.24)); }

      .story-timeline::after { background: linear-gradient(180deg, rgba(201, 177, 255, 0.56), rgba(147, 130, 255, 0.14) 82%, transparent); }

      .story-timeline-item::before {
        border-color: rgba(201, 177, 255, 0.78);
        background: #9382ff;
        box-shadow: 0 0 0 5px rgba(147, 130, 255, 0.08), 0 0 12px rgba(113, 47, 255, 0.25);
      }

      .story-timeline-item time,
      .founder-metric-title,
      .founder-copy-question-title,
      .founder-transition-card h3,
      .ai-system-item h3 { color: #f4f0ff; }

      .story-timeline-item span,
      .founder-metric-detail,
      .founder-transition-card p,
      .ai-system-item p { color: rgba(239, 237, 253, 0.7); }

      .founder-portrait-frame {
        border-color: rgba(201, 177, 255, 0.16);
        background: linear-gradient(145deg, #0d0827, #030014);
        box-shadow: 0 22px 48px rgba(3, 0, 20, 0.42), 0 19px 40px rgba(3, 0, 20, 0.2);
      }

      .founder-portrait-frame::after {
        background:
          linear-gradient(180deg, transparent, rgba(3, 0, 20, 0.32) 36%, rgba(3, 0, 20, 0.94) 100%),
          linear-gradient(90deg, rgba(3, 0, 20, 0.36), transparent 72%);
      }

      .founder-portrait-frame > .founder-portrait-panel {
        border-color: rgba(201, 177, 255, 0.13);
        background:
          radial-gradient(88% 38% at 50% 102%, rgba(147, 130, 255, 0.22) 0%, rgba(113, 47, 255, 0.1) 25%, transparent 70%),
          linear-gradient(145deg, rgba(24, 16, 57, 0.94), rgba(3, 0, 20, 0.97));
        box-shadow: 0 22px 48px rgba(3, 0, 20, 0.36), inset 0 1px rgba(255, 255, 255, 0.1), inset 0 -30px 36px rgba(3, 0, 20, 0.24);
      }

      .founder-transition-card,
      .ai-system-item,
      .founder-portrait-panel {
        border-color: rgba(201, 177, 255, 0.12);
        background: linear-gradient(145deg, rgba(24, 16, 57, 0.94), rgba(8, 4, 31, 0.97));
        box-shadow: 0 22px 48px rgba(3, 0, 20, 0.34), inset 0 1px rgba(255, 255, 255, 0.08);
      }

      .founder-transition-card::before,
      .ai-system-item::before,
      .founder-portrait-panel::before {
        background-image:
          linear-gradient(rgba(201, 177, 255, 0.026) 1px, transparent 1px),
          linear-gradient(90deg, rgba(201, 177, 255, 0.026) 1px, transparent 1px);
      }

      .founder-copy-question + .founder-copy-question,
      .founder-copy-summary { border-color: rgba(201, 177, 255, 0.1); }

      .founder-copy-question::before { color: rgba(201, 177, 255, 0.74); }

      /* The existing system cards: cool white surfaces floating above a violet-black field. */
      .system-loop-section { border-top-color: rgba(243, 238, 255, 0.08); }

      .system-loop-section::before {
        background:
          radial-gradient(52% 26% at 22% 32%, rgba(148, 101, 255, 0.075), transparent 72%),
          radial-gradient(46% 20% at 78% 76%, rgba(147, 130, 255, 0.04), transparent 76%),
          linear-gradient(180deg, rgba(8, 4, 31, 0.08), rgba(3, 0, 20, 0.44));
      }

      .system-loop-section::after {
        background-image:
          linear-gradient(rgba(201, 177, 255, 0.025) 1px, transparent 1px),
          linear-gradient(90deg, rgba(201, 177, 255, 0.025) 1px, transparent 1px);
      }

      .system-loop-eyebrow,
      .system-offer-index { color: rgba(201, 177, 255, 0.82); }

      .system-loop-eyebrow::before {
        background: linear-gradient(90deg, #e59cff, #ba9cff, #9cb2ff);
        box-shadow: 0 0 10px rgba(147, 130, 255, 0.24);
      }

      .system-loop-title,
      .system-offer-card h3 { color: #f4f0ff; }

      .system-loop-subtitle,
      .system-offer-lead,
      .system-offer-list li { color: var(--soft-ink); }

      .system-offer-card {
        border-color: rgba(243, 238, 255, 0.12);
        background: linear-gradient(145deg, rgba(255, 255, 255, 0.028), rgba(8, 4, 31, 0.95));
        box-shadow: 0 24px 56px rgba(3, 0, 20, 0.38), inset 0 1px rgba(255, 255, 255, 0.085), inset 0 0 0 8px rgba(255, 255, 255, 0.012);
      }

      .system-offer-card::before {
        background-image:
          linear-gradient(rgba(201, 177, 255, 0.024) 1px, transparent 1px),
          linear-gradient(90deg, rgba(201, 177, 255, 0.024) 1px, transparent 1px);
      }

      .system-offer-index::after { background: linear-gradient(90deg, rgba(201, 177, 255, 0.72), transparent); }

      .system-offer-list { border-top-color: rgba(243, 238, 255, 0.09); }

      .system-offer-media {
        border-color: rgba(201, 177, 255, 0.1);
        background: rgba(3, 0, 20, 0.54);
        box-shadow: inset 0 1px rgba(255, 255, 255, 0.045);
      }

      .system-system-preview-wall { background: #06021a; }

      .system-offer-list li::before { background: #9382ff; }

      /* The selection grid and final section retain their existing geometry. */
      .solution-choice-section {
        border-top-color: rgba(243, 238, 255, 0.08);
        background:
          radial-gradient(68% 34% at 50% 2%, rgba(148, 101, 255, 0.09), transparent 70%),
          radial-gradient(34% 30% at 1% 72%, rgba(147, 130, 255, 0.035), transparent 76%),
          linear-gradient(180deg, #030014 0%, #080624 58%, #030014 100%);
      }

      .solution-choice-section::before {
        background-image:
          linear-gradient(rgba(201, 177, 255, 0.022) 1px, transparent 1px),
          linear-gradient(90deg, rgba(201, 177, 255, 0.022) 1px, transparent 1px);
      }

      .solution-choice-section::after {
        border-color: rgba(243, 238, 255, 0.065);
        box-shadow: 0 0 150px rgba(148, 101, 255, 0.05), inset 0 0 100px rgba(147, 130, 255, 0.018);
      }

      .solution-eyebrow,
      .trust-eyebrow,
      .solution-choice-mode,
      .solution-choice-fit-label,
      .solution-choice-benefits-title { color: rgba(201, 177, 255, 0.82); }

      .solution-eyebrow::before,
      .trust-eyebrow::before {
        background: linear-gradient(90deg, #e59cff, #ba9cff, #9cb2ff);
        box-shadow: 0 0 10px rgba(147, 130, 255, 0.22);
      }

      .solution-section-heading h2,
      .trust-section-heading h2,
      .trust-case-heading h3,
      .trust-final-cta h2,
      .solution-choice-product { color: #f4f0ff; }

      .solution-section-heading > p:last-child,
      .trust-section-heading > p:last-child,
      .solution-choice-closing,
      .solution-choice-price,
      .solution-choice-fit,
      .solution-choice-benefits li { color: var(--soft-ink); }

      .solution-choice-card {
        border-color: rgba(243, 238, 255, 0.1);
        background: linear-gradient(145deg, rgba(255, 255, 255, 0.018), rgba(8, 4, 31, 0.96));
        box-shadow: inset 0 1px rgba(255, 255, 255, 0.075), inset 0 0 0 8px rgba(255, 255, 255, 0.01), 0 22px 54px rgba(3, 0, 20, 0.38);
      }

      .solution-choice-card::after {
        background-image:
          linear-gradient(rgba(201, 177, 255, 0.022) 1px, transparent 1px),
          linear-gradient(90deg, rgba(201, 177, 255, 0.022) 1px, transparent 1px);
      }

      .solution-choice-card.is-recommended {
        border-color: rgba(207, 184, 255, 0.32);
        background:
          linear-gradient(180deg, rgba(60, 8, 126, 0), rgba(60, 8, 126, 0.2)),
          rgba(113, 47, 255, 0.07);
        box-shadow: inset 0 0 12px rgba(191, 151, 255, 0.18), inset 0 0 0 8px rgba(255, 255, 255, 0.012), 0 25px 62px rgba(3, 0, 20, 0.42);
      }

      .solution-choice-recommendation {
        border-color: rgba(207, 184, 255, 0.24);
        color: rgba(244, 240, 255, 0.88);
        background: rgba(113, 47, 255, 0.1);
      }

      .solution-choice-price strong { color: #f4f0ff; }

      .solution-choice-benefits li::before {
        background: #9382ff;
        box-shadow: 0 0 8px rgba(113, 47, 255, 0.2);
      }

      .solution-choice-action,
      .trust-action {
        border-color: rgba(243, 238, 255, 0.08);
        color: #f4f0ff;
        background: linear-gradient(180deg, rgba(243, 238, 255, 0), rgba(243, 238, 255, 0.04)), rgba(147, 130, 255, 0.01);
        box-shadow: inset 0 0 12px rgba(255, 255, 255, 0.08);
      }

      .solution-choice-card.is-recommended .solution-choice-action {
        border-color: rgba(207, 184, 255, 0.24);
        background: linear-gradient(180deg, rgba(60, 8, 126, 0), rgba(60, 8, 126, 0.25)), rgba(113, 47, 255, 0.1);
        box-shadow: inset 0 0 12px rgba(191, 151, 255, 0.16);
      }

      .solution-choice-action:hover,
      .solution-choice-action:focus-visible,
      .trust-action:hover,
      .trust-action:focus-visible {
        border-color: rgba(207, 184, 255, 0.32);
        background: linear-gradient(180deg, rgba(60, 8, 126, 0), rgba(60, 8, 126, 0.32)), rgba(113, 47, 255, 0.12);
        box-shadow: inset 0 0 12px rgba(191, 151, 255, 0.24), 0 8px 26px rgba(3, 0, 20, 0.24);
      }

      .solution-consult-dialog {
        border-color: rgba(201, 177, 255, 0.18);
        color: #f4f0ff;
        background: linear-gradient(145deg, #120a32, #030014);
        box-shadow: 0 28px 80px rgba(3, 0, 20, 0.72), inset 0 1px rgba(255, 255, 255, 0.1);
      }

      .solution-consult-dialog::backdrop { background: rgba(3, 0, 20, 0.78); }

      .solution-consult-dialog-close { color: rgba(244, 240, 255, 0.84); background: rgba(147, 130, 255, 0.09); }

      .solution-consult-dialog h2 { color: #f4f0ff; }

      .solution-consult-dialog p { color: var(--soft-ink); }

      .solution-consult-dialog-status { color: rgba(201, 177, 255, 0.92) !important; }

      .trust-close-section {
        border-top-color: rgba(243, 238, 255, 0.08);
        background:
          radial-gradient(72% 36% at 50% 8%, rgba(148, 101, 255, 0.09), transparent 68%),
          radial-gradient(35% 22% at 100% 54%, rgba(147, 130, 255, 0.03), transparent 75%),
          linear-gradient(180deg, #030014 0%, #080624 44%, #030014 100%);
      }

      .trust-close-section::before {
        border-color: rgba(243, 238, 255, 0.05);
        box-shadow: 0 0 160px rgba(148, 101, 255, 0.05), inset 0 0 105px rgba(147, 130, 255, 0.016);
      }

      .trust-fact { border-top-color: rgba(201, 177, 255, 0.16); }

      .trust-fact dt { color: #f4f0ff; }

      .trust-fact dd,
      .trust-case-note,
      .trust-case-stage-copy { color: var(--soft-ink); }

      .trust-case {
        border-color: rgba(243, 238, 255, 0.1);
        background: rgba(255, 255, 255, 0.012);
        box-shadow: inset 0 1px rgba(255, 255, 255, 0.06), inset 0 0 0 8px rgba(255, 255, 255, 0.01);
      }

      .trust-case-index,
      .trust-case-stage-label { color: rgba(201, 177, 255, 0.82); }

      .trust-case-index::after { background: linear-gradient(90deg, rgba(201, 177, 255, 0.7), transparent); }

      .trust-case-stage + .trust-case-stage { border-top-color: rgba(243, 238, 255, 0.08); }

      .trust-case-path span {
        border-color: rgba(201, 177, 255, 0.13);
        color: var(--soft-ink);
        background: rgba(147, 130, 255, 0.04);
      }

      .trust-final-cta {
        border-color: rgba(207, 184, 255, 0.22);
        background:
          radial-gradient(44% 96% at 50% 0%, rgba(148, 101, 255, 0.12), transparent 74%),
          linear-gradient(145deg, rgba(255, 255, 255, 0.025), rgba(8, 4, 31, 0.97));
        box-shadow: inset 0 1px rgba(255, 255, 255, 0.11), inset 0 0 0 8px rgba(255, 255, 255, 0.012), 0 26px 78px rgba(3, 0, 20, 0.46);
      }

      .trust-final-cta::before {
        border-color: rgba(201, 177, 255, 0.1);
        box-shadow: 0 0 84px rgba(147, 130, 255, 0.11);
      }

      .trust-final-cta p { color: var(--soft-ink); }

      .trust-action-primary {
        border-color: rgba(207, 184, 255, 0.32);
        color: #f4f0ff !important;
        background: linear-gradient(180deg, rgba(60, 8, 126, 0), rgba(60, 8, 126, 0.32)), rgba(113, 47, 255, 0.12);
        box-shadow: inset 0 0 12px rgba(191, 151, 255, 0.24), 0 9px 28px rgba(3, 0, 20, 0.26);
      }

      .trust-action-primary:hover,
      .trust-action-primary:focus-visible {
        border-color: rgba(207, 184, 255, 0.42);
        color: #f4f0ff !important;
        background: linear-gradient(180deg, rgba(60, 8, 126, 0), rgba(60, 8, 126, 0.42)), rgba(113, 47, 255, 0.24);
        box-shadow: inset 0 0 12px rgba(191, 151, 255, 0.44), 0 12px 34px rgba(3, 0, 20, 0.3);
      }

      .trust-action-secondary { background: linear-gradient(180deg, rgba(243, 238, 255, 0), rgba(243, 238, 255, 0.04)), rgba(147, 130, 255, 0.01); }

      .site-footer {
        border-top-color: rgba(243, 238, 255, 0.08);
        color: rgba(239, 237, 253, 0.58);
        background: rgba(3, 0, 20, 0.84);
      }

      .footer-inner a { color: rgba(239, 237, 253, 0.74); }

      .footer-inner a:hover { color: #f4f0ff; }

      .test-note { color: rgba(201, 177, 255, 0.74); }

      .test-note::before {
        background: linear-gradient(90deg, #e59cff, #ba9cff, #9cb2ff);
        box-shadow: 0 0 8px rgba(147, 130, 255, 0.24);
      }

      /*
       * Reflect's observable hero system, rebuilt against the existing TAOP1
       * layout: one quiet violet source, the original looping black-hole video,
       * a lightweight star field and three thin lavender orbits. No page geometry is
       * changed here.
       */
      .dawn-hero {
        background: #030014;
      }

      .dawn-hero::before {
        inset: auto;
        top: -173px;
        left: 50%;
        width: 1440px;
        height: 900px;
        opacity: 1;
        transform: translateX(-50%);
        background: radial-gradient(37.74% 81.78% at 50% 26.56%, rgba(148, 101, 255, 0.08) 0%, rgba(3, 0, 20, 0) 100%);
        background-size: auto;
        -webkit-mask-image: none;
        mask-image: none;
      }

      .dawn-hero::after {
        background: transparent;
      }

      .ambient-stars {
        display: none;
      }

      .hero-black-hole {
        background: transparent;
        -webkit-mask-image: radial-gradient(50% 50% at 50% 50%, #fff 60.94%, transparent 100%);
        mask-image: radial-gradient(50% 50% at 50% 50%, #fff 60.94%, transparent 100%);
      }

      .black-hole-poster img,
      .lazy-video video {
        filter: none;
      }

      .lazy-video {
        transition: opacity 0.75s cubic-bezier(0.6, 0.6, 0, 1);
      }

      .hero-black-hole-visible:not(.is-video-ready) .black-hole-poster img {
        animation: none;
      }

      @keyframes taop1-reflect-hero-stars-rotate {
        from { transform: translateZ(0) translate(-50%, -50%) rotate(0deg); }
        to { transform: translateZ(0) translate(-50%, -50%) rotate(-360deg); }
      }

      @keyframes taop1-reflect-hero-star-twinkle {
        0% {
          background: rgba(255, 255, 255, 0.52);
          opacity: 0.18;
          transform: translateZ(0) scale(0.72);
        }
        52% { background: rgb(255, 255, 255); opacity: 0.88; }
        100% {
          background: rgb(255, 255, 255);
          opacity: 0.34;
          transform: translateZ(0) scale(1.18);
        }
      }

      @keyframes taop1-reflect-hero-orbit-rotate {
        from { transform: rotate(0deg); }
        to { transform: rotate(360deg); }
      }

      .hero-black-hole-visible .hero-black-hole-stars {
        animation: taop1-reflect-hero-stars-rotate 70s linear infinite;
      }

      .hero-black-hole-visible .black-hole-star {
        animation-name: taop1-reflect-hero-star-twinkle;
      }

      /* 用遮罩层完成边缘融合，避免在持续播放的视频层上做逐帧 mask 合成。 */
      .hero-black-hole {
        overflow: hidden;
        -webkit-mask-image: none;
        mask-image: none;
      }

      .hero-black-hole::after {
        position: absolute;
        z-index: 3;
        inset: 0;
        pointer-events: none;
        background: radial-gradient(ellipse 58% 58% at 50% 50%, transparent 54%, rgba(3, 0, 20, .34) 76%, #030014 100%);
        content: "";
      }

      .hero-black-hole-stars {
        -webkit-mask-image: none;
        mask-image: none;
      }

      @media (min-width: 1249px) {
        .orbit-mask {
          -webkit-mask-image: linear-gradient(180deg, rgba(186, 156, 255, 0.6) 9.41%, rgba(186, 156, 255, 0) 29.79%);
          mask-image: linear-gradient(180deg, rgba(186, 156, 255, 0.6) 9.41%, rgba(186, 156, 255, 0) 29.79%);
        }

        .hero-black-hole-circles .orbit {
          border: 0;
          background: transparent;
          box-shadow: none;
        }

        .orbit-mask:nth-child(1) .orbit { --orbit-node-position: 14.2%; }
        .orbit-mask:nth-child(2) .orbit { --orbit-node-position: 14.1%; }
        .orbit-mask:nth-child(3) .orbit { --orbit-node-position: 13.8%; }

        .hero-black-hole-circles .orbit::before {
          position: absolute;
          top: 0;
          left: 0;
          width: calc(100% - 2px);
          height: calc(100% - 2px);
          border: 1px solid rgba(186, 156, 255, 0.3);
          border-radius: 50%;
          background: rgba(186, 156, 255, 0.04);
          box-shadow: none;
          content: "";
        }

        .hero-black-hole-circles .orbit::after {
          display: none;
          content: none;
        }

        .orbit-dot {
          position: absolute;
          z-index: 99;
          width: 8px;
          height: 8px;
        }

        .orbit-dot::before {
          display: block;
          width: 6px;
          height: 6px;
          border: 1px solid rgba(186, 156, 255, 0.3);
          border-radius: 50%;
          background: rgba(186, 156, 255, 0.01);
          -webkit-backdrop-filter: blur(10px);
          backdrop-filter: blur(10px);
          content: "";
        }

        .orbit-dot:nth-child(1) {
          top: 50%;
          left: -4px;
          transform: translateY(-50%);
        }

        .orbit-dot:nth-child(2) {
          top: var(--orbit-node-position);
          left: var(--orbit-node-position);
        }

        .orbit-dot:nth-child(3) {
          bottom: var(--orbit-node-position);
          left: var(--orbit-node-position);
        }

        .orbit-dot:nth-child(4) {
          top: -4px;
          left: 50%;
          transform: translateX(-50%);
        }

        .orbit-dot:nth-child(5) {
          bottom: -4px;
          left: 50%;
          transform: translateX(-50%);
        }

        .orbit-dot:nth-child(6) {
          top: var(--orbit-node-position);
          right: var(--orbit-node-position);
        }

        .orbit-dot:nth-child(7) {
          right: var(--orbit-node-position);
          bottom: var(--orbit-node-position);
        }

        .orbit-dot:nth-child(8) {
          top: 50%;
          right: -4px;
          transform: translateY(-50%);
        }

        .hero-black-hole-visible .orbit-mask:nth-child(1) .orbit,
        .hero-black-hole-visible .orbit-mask:nth-child(2) .orbit {
          animation: taop1-reflect-hero-orbit-rotate 100s linear infinite;
        }

        .hero-black-hole-visible .orbit-mask:nth-child(3) .orbit {
          animation: none;
        }
      }

      /* 轻量视频到达前直接显示静帧，不让手机和平板额外维持呼吸动画。 */
      @media (max-width: 1024px) {
        .hero-black-hole:not(.is-video-ready) .black-hole-poster img {
          animation: none;
          will-change: auto;
        }
      }

      /*
       * Reflect's Meetings ornament is a static 1624 × 862 PNG, rendered at
       * 812 × 431 on desktop.  Keep that source behavior: no video, filter,
       * mask or synthetic animation is introduced here.
       */
      .system-loop-section {
        isolation: isolate;
      }

      .system-loop-inner {
        z-index: 2;
      }

      .system-meetings-arc {
        position: absolute;
        z-index: 1;
        /* 调整这一项：数值越负，弧光越往上；越接近 0，弧光越往下。 */
        top: -200px;
        left: 50%;
        width: min(812px, 88vw);
        aspect-ratio: 1624 / 862;
        overflow: hidden;
        pointer-events: none;
        transform: translateX(-50%);
      }

      .system-meetings-arc-image {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
        /* The source PNG has no alpha: screen removes its black field, and the top fades in without a rectangle edge. */
        mix-blend-mode: screen;
        -webkit-mask-image: linear-gradient(180deg, transparent 0%, transparent 15%, rgba(0, 0, 0, 0.22) 25%, rgba(0, 0, 0, 0.78) 34%, #000 44%, #000 100%);
        mask-image: linear-gradient(180deg, transparent 0%, transparent 15%, rgba(0, 0, 0, 0.22) 25%, rgba(0, 0, 0, 0.78) 34%, #000 44%, #000 100%);
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-size: 100% 100%;
        mask-size: 100% 100%;
      }

      /* The photo frame itself is centered; this aligns the right-heavy source face and its optics overlay. */
      @media (min-width: 981px) {
        .founder-portrait-frame > img {
          inset: auto;
          bottom: -1%;
          left: 50%;
          width: 118%;
          height: 118%;
          max-width: none;
          transform: translateX(-57%);
          transform-origin: center bottom;
        }
      }

      /* Four public, source-backed practice facts, then the public client proof. */
      .trust-fact-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
      }

      .trust-customer-proof {
        position: relative;
        z-index: 1;
        margin: clamp(64px, 7vw, 104px) 0 clamp(14px, 2vw, 30px);
      }

      .trust-customer-mount {
        min-height: clamp(12rem, 25vw, 18rem);
      }

      .trust-close-section .home-customer-showcase {
        --customer-logo-left: 50%;
        --customer-logo-width: clamp(560px, 88cqw, 820px);
        position: relative;
        width: min(100%, 920px);
        container-type: inline-size;
        margin: 0 auto;
        overflow: hidden;
      }

      .trust-close-section .home-customer-showcase::before,
      .trust-close-section .home-customer-showcase::after {
        position: absolute;
        z-index: 5;
        top: 0;
        bottom: 0;
        width: clamp(3.2rem, 13%, 7.2rem);
        pointer-events: none;
        content: "";
      }

      .trust-close-section .home-customer-showcase::before {
        left: -2px;
        background: linear-gradient(90deg, #030014 0%, rgba(3, 0, 20, 0.94) 18%, rgba(3, 0, 20, 0.62) 48%, transparent 100%);
      }

      .trust-close-section .home-customer-showcase::after {
        right: -2px;
        background: linear-gradient(270deg, #030014 0%, rgba(3, 0, 20, 0.94) 18%, rgba(3, 0, 20, 0.62) 48%, transparent 100%);
      }

      .trust-close-section .home-customer-logo-zone {
        position: relative;
        z-index: 2;
        left: var(--customer-logo-left);
        width: 100%;
        transform: translateX(-50%);
        text-align: center;
      }

      .trust-close-section .home-love-title {
        position: relative;
        z-index: 2;
        max-width: min(92vw, 58rem);
        margin: 0 auto;
        color: #f4f0ff;
        background: linear-gradient(90deg, #e59cff, #f4f0ff 48%, #9cb2ff);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        font-family: var(--font-title);
        font-size: clamp(1.05rem, 2.5vw, 1.85rem);
        font-weight: 850;
        letter-spacing: 0.02em;
        line-height: 1.16;
        text-align: center;
        text-wrap: balance;
        text-shadow: 0 0 18px rgba(147, 130, 255, 0.2);
      }

      .trust-close-section .home-love-subtitle {
        position: relative;
        z-index: 2;
        max-width: 38rem;
        margin: clamp(0.7rem, 1.7vw, 1.08rem) auto 0;
        color: rgba(239, 237, 253, 0.68);
        font-family: var(--font-copy);
        font-size: clamp(0.96rem, 1.78vw, 1.2rem);
        font-weight: 440;
        line-height: 1.62;
        text-align: center;
      }

      .trust-close-section .home-customer-title,
      .trust-close-section .home-customer-subtitle {
        width: 100%;
        max-width: none;
        padding: 0;
        text-align: center;
      }

      .trust-close-section .home-customer-title {
        font-size: clamp(0.78rem, 3.2cqw, 1.85rem);
        line-height: 1.18;
      }

      .trust-close-section .home-customer-subtitle {
        font-size: clamp(0.58rem, 2.05cqw, 1.2rem);
        line-height: 1.5;
      }

      .trust-close-section .home-customer-logo-wall {
        position: relative;
        z-index: 2;
        left: 50%;
        display: grid;
        gap: clamp(0.26rem, 0.86cqw, 0.54rem);
        width: var(--customer-logo-width);
        margin: clamp(0.78rem, 2.7cqw, 1.45rem) 0 0;
        overflow: hidden;
        isolation: isolate;
        transform: translateX(-50%);
        -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 11%, #000 89%, transparent 100%);
        mask-image: linear-gradient(90deg, transparent 0%, #000 11%, #000 89%, transparent 100%);
      }

      .trust-close-section .home-customer-logo-wall::before,
      .trust-close-section .home-customer-logo-wall::after {
        position: absolute;
        z-index: 3;
        top: 0;
        bottom: 0;
        width: calc(clamp(2.6rem, 11%, 6.8rem) + 10px);
        pointer-events: none;
        content: "";
      }

      .trust-close-section .home-customer-logo-wall::before {
        left: max(-5px, calc((var(--customer-logo-width) - 100cqw) / 2 - 5px));
        background: linear-gradient(90deg, #030014 0%, rgba(3, 0, 20, 0.82) 18%, transparent 100%);
      }

      .trust-close-section .home-customer-logo-wall::after {
        right: max(-5px, calc((var(--customer-logo-width) - 100cqw) / 2 - 5px));
        background: linear-gradient(270deg, #030014 0%, rgba(3, 0, 20, 0.82) 18%, transparent 100%);
      }

      .trust-close-section .home-customer-logo-row {
        position: relative;
        width: 100%;
        max-height: 56px;
        overflow: hidden;
        aspect-ratio: 1985 / 136;
      }

      .trust-close-section .home-customer-logo-track {
        display: flex;
        width: 300%;
        height: 100%;
        animation: taop1-customer-logo-left var(--customer-logo-duration, 30s) linear infinite;
        will-change: transform;
      }

      .trust-close-section .home-customer-logo-row.is-reverse .home-customer-logo-track {
        animation-name: taop1-customer-logo-right;
      }

      .trust-close-section .home-customer-logo-strip {
        flex: 0 0 calc(100% / 3);
        height: 100%;
        background-image: url("image/Worker.webp");
        background-repeat: no-repeat;
        background-size: 100% 600%;
        background-position: center var(--customer-logo-row-position, 0%);
      }

      @keyframes taop1-customer-logo-left {
        from { transform: translateX(0); }
        to { transform: translateX(calc(-100% / 3)); }
      }

      @keyframes taop1-customer-logo-right {
        from { transform: translateX(calc(-100% / 3)); }
        to { transform: translateX(0); }
      }

      .trust-close-section .home-love-wall {
        position: relative;
        isolation: isolate;
        left: 50%;
        width: min(1100px, calc(100vw - clamp(2rem, 8vw, 8rem)));
        margin: clamp(38px, 5vw, 72px) 0 0;
        padding: clamp(0.8rem, 2vw, 1.7rem) 0 clamp(1rem, 2vw, 1.45rem);
        overflow: visible;
        color: #fff;
        transform: translateX(-50%);
        text-align: center;
      }

      .trust-close-section .home-love-cloud {
        position: absolute;
        z-index: 0;
        top: clamp(6.8rem, 13vw, 10.2rem);
        left: 50%;
        width: clamp(17.5rem, 27.8vw, 25rem);
        aspect-ratio: 1;
        opacity: 0.76;
        pointer-events: none;
        transform: translate(-50%, -50%);
      }

      .trust-close-section .home-love-cloud::before,
      .trust-close-section .home-love-cloud::after,
      .trust-close-section .home-love-cloud-core {
        position: absolute;
        top: 50%;
        left: 50%;
        border-radius: 50%;
        pointer-events: none;
        content: "";
      }

      .trust-close-section .home-love-cloud::before {
        width: clamp(280px, 27.8vw, 400px);
        height: clamp(280px, 27.8vw, 400px);
        opacity: 0.78;
        filter: blur(70px);
        background: conic-gradient(#e59cff, #ba9cff 32%, #9cb2ff 57%, #6546d5 75%, #e59cff);
        transform: translate(-50%, -50%);
        animation: taop1-proof-cloud-drift 18s linear infinite;
      }

      .trust-close-section .home-love-cloud::after,
      .trust-close-section .home-love-cloud-core {
        width: clamp(200px, 20.8vw, 300px);
        height: clamp(200px, 20.8vw, 300px);
        background: conic-gradient(#f4f0ff, #9382ff 48%, #e59cff);
        transform: translate(-50%, -50%);
      }

      .trust-close-section .home-love-cloud::after {
        opacity: 0.62;
        filter: blur(32px);
        animation: taop1-proof-cloud-pulse 11s ease-in-out infinite alternate;
      }

      .trust-close-section .home-love-cloud-core {
        opacity: 0.7;
        filter: blur(32px);
        animation: taop1-proof-cloud-core 14s linear infinite reverse;
      }

      .trust-close-section .home-love-wall::after {
        position: absolute;
        z-index: 1;
        inset: 0;
        opacity: 0.34;
        pointer-events: none;
        background:
          radial-gradient(circle at 22% 27%, rgba(255, 255, 255, 0.22) 0 1px, transparent 1.4px),
          radial-gradient(circle at 47% 19%, rgba(229, 156, 255, 0.22) 0 1px, transparent 1.5px),
          radial-gradient(circle at 72% 31%, rgba(156, 178, 255, 0.2) 0 1px, transparent 1.4px),
          radial-gradient(circle at 34% 57%, rgba(186, 156, 255, 0.16) 0 1px, transparent 1.4px),
          radial-gradient(circle at 83% 62%, rgba(255, 255, 255, 0.16) 0 1px, transparent 1.4px);
        content: "";
      }

      .trust-close-section .home-love-grid {
        --home-love-gap: clamp(0.78rem, 1.55vw, 1.18rem);
        position: relative;
        z-index: 2;
        left: 50%;
        display: grid;
        width: 100%;
        margin-top: clamp(2.65rem, 5.2vw, 4.55rem);
        gap: var(--home-love-gap);
        transform: translateX(-50%);
        text-align: left;
        text-shadow: 0 1px 8px rgba(3, 0, 20, 0.28);
        -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, 0.04) 6%, #000 18%, #000 82%, rgba(0, 0, 0, 0.04) 94%, transparent 100%);
        mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, 0.04) 6%, #000 18%, #000 82%, rgba(0, 0, 0, 0.04) 94%, transparent 100%);
      }

      .trust-close-section .home-love-track-row {
        overflow: hidden;
      }

      .trust-close-section .home-love-track {
        --home-love-shift: 1px;
        --home-love-shift-negative: -1px;
        display: flex;
        width: max-content;
        gap: 0;
        animation: taop1-love-marquee var(--home-love-track-duration, 44s) linear infinite;
        will-change: transform;
      }

      .trust-close-section .home-love-track-row.is-reverse .home-love-track {
        margin-left: var(--home-love-shift-negative);
        animation-name: taop1-love-marquee-right;
      }

      .trust-close-section .home-love-card {
        position: relative;
        flex: 0 0 clamp(14rem, 27.3vw, 23.8rem);
        min-height: clamp(6.15rem, 8.6vw, 7.2rem);
        margin-right: var(--home-love-gap);
        padding: clamp(0.62rem, 1.08vw, 0.78rem) clamp(0.78rem, 1.46vw, 1.02rem);
        overflow: hidden;
        border: 1px solid rgba(201, 177, 255, 0.13);
        border-radius: 8px;
        isolation: isolate;
        background:
          radial-gradient(circle at 78% 10%, rgba(186, 156, 255, 0.07), transparent 40%),
          linear-gradient(180deg, rgba(255, 255, 255, 0.028), rgba(255, 255, 255, 0.006)),
          rgba(6, 3, 26, 0.86);
        box-shadow: inset 0 1px rgba(255, 255, 255, 0.05), inset 0 0 0 1px rgba(201, 177, 255, 0.025), 0 16px 42px rgba(3, 0, 20, 0.34);
        backdrop-filter: blur(10px);
      }

      .trust-close-section .home-love-card::before {
        position: absolute;
        z-index: 0;
        right: -18%;
        bottom: -46%;
        width: 52%;
        aspect-ratio: 1;
        border-radius: 50%;
        opacity: 0.35;
        pointer-events: none;
        background: radial-gradient(circle, rgba(186, 156, 255, 0.14), transparent 67%);
        content: "";
      }

      .trust-close-section .home-love-card::after {
        position: absolute;
        z-index: 1;
        inset: 0;
        opacity: 0.5;
        pointer-events: none;
        background:
          linear-gradient(rgba(201, 177, 255, 0.03) 1px, transparent 1px),
          linear-gradient(90deg, rgba(201, 177, 255, 0.024) 1px, transparent 1px),
          radial-gradient(ellipse 76% 86% at 50% 52%, transparent 0%, transparent 48%, rgba(3, 0, 20, 0.34) 76%, rgba(3, 0, 20, 0.84) 100%);
        background-size: clamp(20px, 2.6vw, 32px) clamp(20px, 2.6vw, 32px), clamp(20px, 2.6vw, 32px) clamp(20px, 2.6vw, 32px), 100% 100%;
        content: "";
      }

      .trust-close-section .home-love-card-head,
      .trust-close-section .home-love-copy {
        position: relative;
        z-index: 2;
      }

      .trust-close-section .home-love-name {
        max-width: min(18rem, 100%);
        margin: 0;
        overflow: hidden;
        color: rgba(244, 240, 255, 0.94);
        font-family: var(--font-copy);
        font-size: clamp(0.68rem, 1.14vw, 0.84rem);
        font-weight: 780;
        line-height: 1.2;
        text-overflow: ellipsis;
        white-space: nowrap;
      }

      .trust-close-section .home-love-meta {
        display: flex;
        align-items: center;
        gap: 0.28rem;
        max-width: min(100%, 25rem);
        margin: 0.12rem 0 0;
        overflow: hidden;
        color: rgba(201, 177, 255, 0.72);
        font-family: var(--font-copy);
        font-size: clamp(0.54rem, 0.92vw, 0.64rem);
        font-weight: 620;
        line-height: 1.2;
      }

      .trust-close-section .home-love-product {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
      }

      .trust-close-section .home-love-time {
        flex: 0 0 auto;
        color: rgba(239, 237, 253, 0.48);
        white-space: nowrap;
      }

      .trust-close-section .home-love-copy {
        max-height: 3em;
        margin: clamp(0.44rem, 0.76vw, 0.56rem) 0 0;
        overflow: hidden;
        color: rgba(239, 237, 253, 0.68);
        font-family: var(--font-copy);
        font-size: clamp(0.68rem, 1.08vw, 0.8rem);
        font-weight: 420;
        line-height: 1.5;
        -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 54%, rgba(0, 0, 0, 0.82) 72%, transparent 100%);
        mask-image: linear-gradient(180deg, #000 0%, #000 54%, rgba(0, 0, 0, 0.82) 72%, transparent 100%);
      }

      @keyframes taop1-love-marquee {
        from { transform: translate3d(0, 0, 0); }
        to { transform: translate3d(var(--home-love-shift-negative), 0, 0); }
      }

      @keyframes taop1-love-marquee-right {
        from { transform: translate3d(0, 0, 0); }
        to { transform: translate3d(var(--home-love-shift), 0, 0); }
      }

      @keyframes taop1-proof-cloud-drift {
        from { transform: translate(-50%, -50%) rotate(0); }
        to { transform: translate(-50%, -50%) rotate(360deg); }
      }

      @keyframes taop1-proof-cloud-pulse {
        from { transform: translate(-50%, -50%) scale(0.84); }
        to { transform: translate(-50%, -50%) scale(1.06); }
      }

      @keyframes taop1-proof-cloud-core {
        from { transform: translate(-50%, -50%) rotate(0); }
        to { transform: translate(-50%, -50%) rotate(-360deg); }
      }

      .trust-close-section.is-proof-static .home-customer-logo-track,
      .trust-close-section.is-proof-static .home-love-track,
      .trust-close-section.is-proof-static .home-love-cloud::before,
      .trust-close-section.is-proof-static .home-love-cloud::after,
      .trust-close-section.is-proof-static .home-love-cloud-core {
        animation: none;
      }

      @media (max-width: 980px) {
        .trust-fact-grid {
          grid-template-columns: repeat(2, minmax(0, 1fr));
        }
      }

      @media (min-width: 981px) {
        .trust-fact dt {
          font-size: clamp(25px, 2.15vw, 31px);
          letter-spacing: -0.07em;
        }
      }

      @media (max-width: 923px) {
        .system-meetings-arc {
          /* Keep the same source geometry as desktop so the arc does not
             jump to a different relative position on narrow screens. */
          top: -200px;
          width: 812px;
        }
      }

      @media (max-width: 720px) {
        .trust-fact-grid {
          grid-template-columns: 1fr;
        }

        .trust-customer-proof {
          margin-top: 58px;
        }

        .trust-customer-mount {
          min-height: 11rem;
        }

        .trust-close-section .home-customer-showcase {
          --customer-logo-width: clamp(520px, 148cqw, 640px);
          width: 100%;
        }

        .trust-close-section .home-customer-title {
          font-size: clamp(0.9rem, 4.7vw, 1.18rem);
        }

        .trust-close-section .home-customer-subtitle {
          margin-top: clamp(0.42rem, 1.8vw, 0.58rem);
          font-size: clamp(0.62rem, 3.1vw, 0.78rem);
        }

        .trust-close-section .home-customer-logo-wall {
          gap: clamp(0.24rem, 1.05vw, 0.4rem);
          margin-top: clamp(0.72rem, 3.2vw, 1rem);
        }

        .trust-close-section .home-love-wall {
          width: calc(100vw - 32px);
          margin-top: 34px;
          padding-top: 0.85rem;
          padding-bottom: 2.4rem;
          overflow: hidden;
        }

        .trust-close-section .home-love-cloud {
          top: 4.45rem;
          width: clamp(8.5rem, 37vw, 11.5rem);
          opacity: 0.48;
        }

        .trust-close-section .home-love-cloud::before {
          width: clamp(118px, 38vw, 154px);
          height: clamp(118px, 38vw, 154px);
          filter: blur(36px);
        }

        .trust-close-section .home-love-cloud::after,
        .trust-close-section .home-love-cloud-core {
          width: clamp(88px, 29vw, 118px);
          height: clamp(88px, 29vw, 118px);
          filter: blur(23px);
        }

        .trust-close-section .home-love-title {
          font-size: clamp(1rem, 5.2vw, 1.28rem);
          line-height: 1.18;
        }

        .trust-close-section .home-love-subtitle {
          margin-top: 0.48rem;
          font-size: clamp(0.7rem, 3.35vw, 0.86rem);
          line-height: 1.52;
        }

        .trust-close-section .home-love-grid {
          --home-love-gap: clamp(0.42rem, 2.2vw, 0.62rem);
          --home-love-row-height: clamp(4.35rem, 18vw, 4.95rem);
          grid-auto-rows: var(--home-love-row-height);
          margin-top: clamp(1.25rem, 4.8vw, 1.65rem);
        }

        .trust-close-section .home-love-track-row {
          height: var(--home-love-row-height);
          min-height: 0;
        }

        .trust-close-section .home-love-track {
          height: 100%;
          align-items: stretch;
        }

        .trust-close-section .home-love-card {
          flex-basis: clamp(9.75rem, 48vw, 12.2rem);
          height: 100%;
          min-height: 0;
          padding: clamp(0.42rem, 1.85vw, 0.54rem) clamp(0.48rem, 2vw, 0.6rem);
        }

        .trust-close-section .home-love-name {
          max-width: 100%;
          font-size: clamp(0.58rem, 2.85vw, 0.7rem);
        }

        .trust-close-section .home-love-meta {
          display: none;
        }

        .trust-close-section .home-love-copy {
          max-height: 3.1em;
          margin-top: clamp(0.26rem, 1.1vw, 0.36rem);
          font-size: clamp(0.56rem, 2.72vw, 0.68rem);
          line-height: 1.55;
          -webkit-mask-image: none;
          mask-image: none;
        }
      }

      @media (prefers-reduced-motion: reduce) {
        .trust-close-section .home-customer-logo-track,
        .trust-close-section .home-love-track,
        .trust-close-section .home-love-cloud::before,
        .trust-close-section .home-love-cloud::after,
        .trust-close-section .home-love-cloud-core {
          animation: none;
        }
      }

      /*
       * Final depth pass: deepen the field without dimming the white copy or
       * the original Reflect Meetings arc that sits behind the system title.
       */
      :root {
        --night: #010008;
        --night-raised: #040216;
        --night-soft: #08051d;
        --panel: rgba(5, 2, 20, 0.86);
        --panel-strong: rgba(3, 1, 15, 0.94);
        --glass: linear-gradient(145deg, rgba(16, 9, 42, 0.92), rgba(3, 1, 18, 0.985));
        --shadow: 0 30px 92px rgba(0, 0, 0, 0.66);
      }

      html { background: #010008; }

      body {
        background:
          radial-gradient(72% 32% at 50% -8%, rgba(148, 101, 255, 0.045), transparent 70%),
          radial-gradient(48% 28% at 8% 54%, rgba(147, 130, 255, 0.018), transparent 76%),
          #010008;
      }

      body::before { opacity: 0.065; }
      body::after { opacity: 0.035; }

      .dawn-hero { background: #010008; }

      .dawn-hero::before {
        background: radial-gradient(37.74% 81.78% at 50% 26.56%, rgba(148, 101, 255, 0.055) 0%, rgba(1, 0, 8, 0) 100%);
      }

      /* The arc remains behind the founder content when it crosses this boundary. */
      .hero-story { background: transparent; }

      .founder-intro { z-index: 2; }

      .hero-story::before {
        background: radial-gradient(48% 38% at 72% 22%, rgba(148, 101, 255, 0.038), transparent 72%);
      }

      /* Let the raised arc cross upward without covering the preceding story or spilling sideways. */
      .system-loop-section {
        z-index: 1;
        isolation: auto;
        overflow-x: clip;
        overflow-y: visible;
        border-top-color: transparent;
        background: #010008;
      }

      .system-loop-section::before {
        background:
          radial-gradient(52% 26% at 22% 32%, rgba(148, 101, 255, 0.052), transparent 72%),
          radial-gradient(46% 20% at 78% 76%, rgba(147, 130, 255, 0.022), transparent 76%),
          linear-gradient(180deg, rgba(3, 1, 16, 0.16), rgba(1, 0, 10, 0.78));
      }

      .system-loop-section::after { opacity: 0.68; }

      .solution-choice-section {
        background:
          radial-gradient(68% 34% at 50% 2%, rgba(148, 101, 255, 0.06), transparent 70%),
          radial-gradient(34% 30% at 1% 72%, rgba(147, 130, 255, 0.02), transparent 76%),
          linear-gradient(180deg, #010008 0%, #050118 58%, #010008 100%);
      }

      .trust-close-section {
        background:
          radial-gradient(72% 36% at 50% 8%, rgba(148, 101, 255, 0.06), transparent 68%),
          radial-gradient(35% 22% at 100% 54%, rgba(147, 130, 255, 0.018), transparent 75%),
          linear-gradient(180deg, #010008 0%, #050118 44%, #010008 100%);
      }

      .site-footer { background: rgba(1, 0, 8, 0.94); }

      .founder-transition-card,
      .ai-system-item,
      .system-offer-card {
        border-color: rgba(243, 238, 255, 0.09);
        background: linear-gradient(145deg, rgba(255, 255, 255, 0.018), rgba(4, 1, 21, 0.975));
        box-shadow: 0 24px 56px rgba(0, 0, 0, 0.48), inset 0 1px rgba(255, 255, 255, 0.065), inset 0 0 0 8px rgba(255, 255, 255, 0.007);
      }

      /* Product choices use the same transparent material as the review cards. */
      .solution-choice-card {
        border-radius: 18px;
        border-color: rgba(255, 255, 255, 0.08);
        background: rgba(0, 0, 0, 0.35);
        box-shadow: 0 18px 60px rgba(0, 0, 0, 0.55);
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
      }

      .solution-choice-card::after {
        display: none;
      }

      .solution-choice-card.is-recommended {
        border-color: rgba(255, 255, 255, 0.08);
        background: rgba(0, 0, 0, 0.35);
        box-shadow: 0 18px 60px rgba(0, 0, 0, 0.55);
      }

      .trust-case {
        border-color: rgba(243, 238, 255, 0.085);
        background: linear-gradient(145deg, rgba(255, 255, 255, 0.014), rgba(4, 1, 20, 0.9));
        box-shadow: inset 0 1px rgba(255, 255, 255, 0.045), inset 0 0 0 8px rgba(255, 255, 255, 0.006);
      }

      .trust-final-cta {
        background: radial-gradient(44% 96% at 50% 0%, rgba(148, 101, 255, 0.09), transparent 74%), linear-gradient(145deg, rgba(255, 255, 255, 0.018), rgba(4, 1, 20, 0.985));
      }

      .trust-close-section .home-love-card {
        border-radius: 18px;
        border-color: rgba(255, 255, 255, 0.08);
        background: rgba(0, 0, 0, 0.35);
        box-shadow: none;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        will-change: auto;
      }

      .trust-close-section .home-love-card::before,
      .trust-close-section .home-love-card::after {
        display: none;
      }

      /* Keep the review marquee moving, but make the expensive glow layers static. */
      .trust-close-section .home-love-cloud {
        background: radial-gradient(circle, rgba(239, 229, 255, 0.42) 0%, rgba(171, 126, 255, 0.3) 28%, rgba(101, 70, 213, 0.16) 52%, transparent 72%);
      }

      .trust-close-section .home-love-cloud::before,
      .trust-close-section .home-love-cloud::after,
      .trust-close-section .home-love-cloud-core {
        display: none;
        animation: none;
      }

      .trust-close-section .home-love-grid {
        text-shadow: none;
        -webkit-mask-image: none;
        mask-image: none;
      }

      .trust-close-section .home-love-track-row {
        contain: layout paint;
      }

      .trust-close-section .home-love-track {
        backface-visibility: hidden;
        animation-play-state: paused;
        will-change: auto;
      }

      .trust-close-section.is-proof-visible:not(.is-proof-static) .home-love-track {
        animation-play-state: running;
        will-change: transform;
      }

      .trust-close-section .home-love-copy {
        display: -webkit-box;
        max-height: none;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        -webkit-mask-image: none;
        mask-image: none;
      }

      .trust-close-section .home-customer-logo-track,
      .trust-close-section .home-customer-logo-row.is-reverse .home-customer-logo-track {
        width: 100%;
        animation: none;
        transform: none;
        will-change: auto;
      }

      .trust-close-section .home-customer-logo-strip {
        flex-basis: 100%;
      }

      /* Fine-pointer only: cards respond to a mouse, never latch on a touch screen. */
      @media (hover: hover) and (pointer: fine) {
        .founder-transition-card,
        .ai-system-item,
        .system-offer-card,
        .solution-choice-card,
        .trust-fact,
        .trust-case,
        .trust-final-cta,
        .glass-card.system-card,
        .stage-card,
        .benefit-card {
          transition: transform 220ms cubic-bezier(0.2, 0.7, 0.2, 1), border-color 220ms ease, background 220ms ease, box-shadow 220ms ease;
        }

        .founder-transition-card:hover,
        .ai-system-item:hover,
        .system-offer-card:hover,
        .solution-choice-card:hover,
        .trust-case:hover,
        .trust-final-cta:hover,
        .glass-card.system-card:hover,
        .stage-card:hover,
        .benefit-card:hover {
          z-index: 1;
          transform: translateY(-4px);
          border-color: rgba(207, 184, 255, 0.34);
          box-shadow: 0 28px 66px rgba(0, 0, 0, 0.48), inset 0 1px rgba(255, 255, 255, 0.1), 0 0 0 1px rgba(147, 130, 255, 0.06);
        }

        .trust-fact:hover {
          transform: translateY(-3px);
          border-top-color: rgba(207, 184, 255, 0.48);
          background: linear-gradient(145deg, rgba(255, 255, 255, 0.022), rgba(11, 5, 39, 0.44));
          box-shadow: 0 18px 44px rgba(0, 0, 0, 0.3);
        }

        .trust-close-section .home-love-track-row:hover .home-love-track {
          animation-play-state: paused;
        }

        .system-offer-media img {
          transition: transform 300ms cubic-bezier(0.2, 0.7, 0.2, 1), box-shadow 220ms ease;
        }

        .system-offer-card:hover .system-offer-media img { transform: scale(1.025); }

        .system-offer-card:hover .system-offer-media {
          border-color: rgba(207, 184, 255, 0.24);
        }
      }

      @media (prefers-reduced-motion: reduce) {
        .founder-transition-card,
        .ai-system-item,
        .system-offer-card,
        .solution-choice-card,
        .trust-fact,
        .trust-case,
        .trust-final-cta,
        .trust-close-section .home-love-card,
        .glass-card.system-card,
        .stage-card,
        .benefit-card,
        .system-offer-media img {
          transition: none !important;
        }

        .founder-transition-card:hover,
        .ai-system-item:hover,
        .system-offer-card:hover,
        .solution-choice-card:hover,
        .trust-fact:hover,
        .trust-case:hover,
        .trust-final-cta:hover,
        .trust-close-section .home-love-card:hover,
        .glass-card.system-card:hover,
        .stage-card:hover,
        .benefit-card:hover,
        .system-offer-card:hover .system-offer-media img {
          transform: none;
        }
      }

      /*
       * Reflect's connected stage uses an absolute 806 × 849 visual, a
       * viewport-triggered one-second fade, and three very slow star layers.
       * Keep the visual below our own product heading/cards so it remains
       * decoration rather than a surface that can cover content.
       */
      .solution-choice-section {
        padding-top: 496px;
        border-top-color: transparent;
        background: linear-gradient(180deg, #010008 0%, #010008 9%, #02000f 22%, #030014 36%, #030014 905px, #02000f 1120px, #010008 100%);
      }

      .solution-choice-section::before,
      .solution-choice-section::after {
        display: none;
      }

      .solution-reflect-connected-stage {
        position: absolute;
        z-index: 0;
        inset: 0 0 auto;
        height: 905px;
        overflow: hidden;
        pointer-events: none;
        background: linear-gradient(180deg, #010008 0%, #010008 9%, #02000f 22%, #030014 36%, #030014 100%);
      }

      .solution-reflect-connected-image {
        position: absolute;
        top: 300px;
        left: 50%;
        display: block;
        width: 806px;
        height: 849px;
        max-width: none;
        transform: translateX(-50%);
        opacity: 0;
        transition: opacity 1s cubic-bezier(0.6, 0.6, 0, 1);
      }

      .solution-reflect-connected-image.is-loaded {
        opacity: 1;
      }

      .solution-reflect-rising-stars {
        position: absolute;
        top: 234px;
        left: 50%;
        width: 936px;
        height: 212px;
        overflow: hidden;
        pointer-events: none;
        transform: translateX(-50%);
        opacity: 0.7;
        -webkit-mask-image: linear-gradient(180deg, transparent 0%, rgba(217, 217, 217, 0.8) 25%, #d9d9d9 50%, rgba(217, 217, 217, 0.8) 75%, transparent 100%);
        mask-image: linear-gradient(180deg, transparent 0%, rgba(217, 217, 217, 0.8) 25%, #d9d9d9 50%, rgba(217, 217, 217, 0.8) 75%, transparent 100%);
        -webkit-mask-size: cover;
        mask-size: cover;
      }

      .solution-reflect-rising-stars div {
        position: absolute;
        top: 0;
        left: 0;
        border-radius: 50%;
        background: transparent;
      }

      .solution-reflect-rising-stars div:nth-child(1) {
        width: 2px;
        height: 2px;
        box-shadow: 35px 182px #fff, 116px 40px #fff, 190px 386px #fff, 248px 112px #fff, 338px 310px #fff, 422px 56px #fff, 507px 284px #fff, 621px 138px #fff, 714px 364px #fff, 807px 86px #fff, 891px 244px #fff;
      }

      .solution-reflect-rising-stars div:nth-child(2) {
        width: 1px;
        height: 1px;
        opacity: 0.72;
        box-shadow: 78px 86px #fff, 166px 274px #fff, 292px 22px #fff, 403px 196px #fff, 468px 390px #fff, 558px 74px #fff, 659px 250px #fff, 748px 12px #fff, 844px 356px #fff, 924px 162px #fff;
      }

      .solution-reflect-rising-stars div:nth-child(3) {
        width: 1px;
        height: 1px;
        opacity: 0.5;
        box-shadow: 14px 330px #fff, 132px 158px #fff, 225px 84px #fff, 359px 354px #fff, 455px 124px #fff, 541px 322px #fff, 640px 28px #fff, 731px 194px #fff, 817px 318px #fff, 906px 62px #fff;
      }

      .solution-reflect-connected-stage.is-visible .solution-reflect-rising-stars div:nth-child(1) {
        animation: solutionReflectStarsRise 100s linear infinite;
      }

      .solution-reflect-connected-stage.is-visible .solution-reflect-rising-stars div:nth-child(2) {
        animation: solutionReflectStarsRise 150s linear infinite;
      }

      .solution-reflect-connected-stage.is-visible .solution-reflect-rising-stars div:nth-child(3) {
        animation: solutionReflectStarsRise 200s linear infinite;
      }

      @keyframes solutionReflectStarsRise {
        from { transform: translateY(0); }
        to { transform: translateY(-2000px); }
      }

      .solution-choice-inner {
        z-index: 3;
      }

      @media (prefers-reduced-motion: reduce) {
        .solution-reflect-connected-image {
          transition: none;
        }

        .solution-reflect-connected-stage.is-visible .solution-reflect-rising-stars div {
          animation: none;
        }
      }

      /* Give the complete founder block room before the raised system arc begins. */
      /* Keep the portrait and its three questions side by side whenever a
         desktop viewport has room for the full paired composition. */
      @media (min-width: 981px) {
        .founder-intro-inner {
          /* One centered visual group: portrait + a title-width copy track + a fixed breathing gap. */
          --founder-portrait-track: clamp(340px, 26vw, 360px);
          --founder-copy-track: clamp(400px, 34vw, 520px);
          --founder-pair-gap: clamp(32px, 2.5vw, 40px);
          width: min(
            var(--content-width),
            calc(var(--founder-portrait-track) + var(--founder-copy-track) + var(--founder-pair-gap))
          );
          grid-template-columns: var(--founder-portrait-track) var(--founder-copy-track);
          align-items: stretch;
          gap: var(--founder-pair-gap);
          justify-content: center;
          padding-bottom: clamp(72px, 7vw, 96px);
        }

        .founder-portrait {
          width: 100%;
          height: 100%;
          align-self: stretch;
          justify-self: start;
        }

        .founder-portrait-frame {
          height: 100%;
          aspect-ratio: auto;
        }

        .founder-copy {
          width: 100%;
          min-inline-size: 0;
          max-inline-size: none;
          justify-self: stretch;
        }

        /* Keep both transparent portrait layers fully inside the 4:5 frame. */
        .founder-portrait-frame > img {
          inset: 0;
          width: 100%;
          height: 100%;
          max-width: none;
          object-fit: cover;
          object-position: center bottom;
          transform: none;
          transform-origin: center bottom;
        }
      }

      /* Tablet width still has room for a paired portrait-and-copy composition. */
      @media (min-width: 721px) and (max-width: 980px) {
        .founder-intro-inner {
          width: min(calc(100vw - 48px), 720px);
          grid-template-columns: minmax(250px, .84fr) minmax(0, 1.16fr);
          gap: clamp(18px, 3.2vw, 32px);
          justify-content: center;
          justify-items: stretch;
          align-items: start;
          padding-bottom: 88px;
        }

        .founder-portrait {
          width: 100%;
          justify-self: stretch;
        }

        /* Also neutralize the old desktop zoom while this layout is stacked. */
        .founder-portrait-frame > img {
          inset: 0;
          width: 100%;
          height: 100%;
          max-width: none;
          object-fit: cover;
          object-position: center bottom;
          transform: none;
          transform-origin: center bottom;
        }

        .founder-copy {
          width: 100%;
          min-inline-size: 0;
          max-inline-size: none;
          justify-self: stretch;
          text-align: left;
        }

        .founder-copy-title {
          font-size: clamp(26px, 3.3vw, 36px);
          line-height: 1.29;
        }

        .logic-flow-page .founder-copy-question + .founder-copy-question::after,
        .logic-flow-page .founder-copy-summary::before {
          left: 0;
          transform: none;
        }
      }

      @media (max-width: 720px) {
        .founder-intro-inner {
          width: var(--content-width);
          grid-template-columns: minmax(0, 1fr);
          gap: clamp(28px, 8vw, 36px);
          justify-content: center;
          justify-items: center;
          align-items: start;
          padding-bottom: 72px;
        }

        .founder-portrait {
          width: min(100%, 420px);
          justify-self: center;
        }

        .founder-copy {
          width: 100%;
          min-inline-size: 0;
          max-inline-size: none;
          justify-self: center;
          text-align: center;
        }
      }

      /* On wide screens, dividers should describe the copy instead of filling empty track space. */
      @media (min-width: 721px) {
        .founder-copy {
          --founder-divider-width: min(100%, clamp(280px, 24vw, 360px));
        }

        .founder-copy-question + .founder-copy-question,
        .founder-copy-summary {
          border-top-color: transparent;
        }

        .founder-copy-question + .founder-copy-question::after,
        .founder-copy-summary::before {
          position: absolute;
          top: -1px;
          left: 0;
          display: block;
          width: var(--founder-divider-width);
          height: 1px;
          pointer-events: none;
          background: linear-gradient(90deg, rgba(201, 177, 255, 0.16), rgba(201, 177, 255, 0.1) 54%, transparent);
          content: "";
        }

        .founder-copy-summary {
          position: relative;
        }
      }

      /* Tighten only the seam between the product choice and practice sections. */
      .solution-choice-section {
        padding-bottom: clamp(64px, 5vw, 80px);
      }

      .trust-close-section {
        padding-top: clamp(64px, 5vw, 80px);
        content-visibility: auto;
        contain-intrinsic-size: auto 1050px;
      }

      .trust-love-mount {
        min-height: clamp(430px, 42vw, 560px);
      }

      .trust-close-section.is-review-ready .trust-love-mount {
        min-height: 0;
      }

      /*
       * A native-CSS coordinate field based on the public integration pattern:
       * a 2×2 layout, a quiet grid/axis, pulsing core rings and two line sweeps.
       * It intentionally uses no Reflect branding, source code or image assets.
       */
      .trust-fact-coordinate-stage {
        position: relative;
        isolation: isolate;
        width: min(100%, 984px);
        min-height: 432px;
        margin: clamp(42px, 4.8vw, 60px) auto 0;
        overflow: clip;
        background:
          radial-gradient(40% 64% at 50% 50%, rgba(148, 101, 255, 0.095), transparent 72%),
          radial-gradient(64% 38% at 50% 50%, rgba(62, 33, 168, 0.055), transparent 76%);
      }

      .trust-fact-coordinate-stage::before,
      .trust-fact-coordinate-stage::after {
        position: absolute;
        inset: 0;
        pointer-events: none;
        content: "";
      }

      .trust-fact-coordinate-stage::before {
        z-index: 0;
        opacity: 0.74;
        background-image:
          linear-gradient(rgba(201, 177, 255, 0.04) 1px, transparent 1px),
          linear-gradient(90deg, rgba(201, 177, 255, 0.04) 1px, transparent 1px);
        background-position: 0 0;
        background-size: 32px 32px;
        -webkit-mask-image: radial-gradient(ellipse at center, #000 0%, rgba(0, 0, 0, 0.82) 53%, transparent 88%);
        mask-image: radial-gradient(ellipse at center, #000 0%, rgba(0, 0, 0, 0.82) 53%, transparent 88%);
        animation: trust-coordinate-grid-drift 18s linear infinite paused;
      }

      .trust-fact-coordinate-stage::after {
        z-index: 1;
        background:
          linear-gradient(90deg, transparent calc(50% - 0.5px), rgba(201, 177, 255, 0.18) calc(50% - 0.5px), rgba(201, 177, 255, 0.18) calc(50% + 0.5px), transparent calc(50% + 0.5px)),
          linear-gradient(180deg, transparent calc(50% - 0.5px), rgba(201, 177, 255, 0.15) calc(50% - 0.5px), rgba(201, 177, 255, 0.15) calc(50% + 0.5px), transparent calc(50% + 0.5px));
        -webkit-mask-image: radial-gradient(ellipse at center, #000 0%, rgba(0, 0, 0, 0.8) 62%, transparent 93%);
        mask-image: radial-gradient(ellipse at center, #000 0%, rgba(0, 0, 0, 0.8) 62%, transparent 93%);
      }

      .trust-fact-coordinate-ornament {
        position: absolute;
        z-index: 2;
        inset: 0;
        pointer-events: none;
      }

      .trust-fact-coordinate-core {
        position: absolute;
        top: 50%;
        left: 50%;
        z-index: 2;
        display: grid;
        width: clamp(58px, 6vw, 72px);
        aspect-ratio: 1;
        place-items: center;
        border: 1px solid rgba(218, 205, 255, 0.48);
        border-radius: 50%;
        background:
          radial-gradient(circle at 35% 24%, rgba(255, 255, 255, 0.78), transparent 17%),
          radial-gradient(circle at 50% 55%, rgba(186, 156, 255, 0.93), rgba(77, 42, 192, 0.92) 52%, rgba(17, 6, 65, 0.96) 100%);
        box-shadow: 0 0 24px rgba(148, 101, 255, 0.5), inset 0 0 14px rgba(255, 255, 255, 0.24);
        transform: translate(-50%, -50%);
      }

      .trust-fact-coordinate-core span {
        /* The third wave uses this full square, rather than the text's rectangle. */
        position: relative;
        z-index: 2;
        display: grid;
        inline-size: 100%;
        block-size: 100%;
        place-items: center;
        color: #fff;
        font-family: var(--font-title);
        font-size: clamp(10px, 1.05vw, 12px);
        font-weight: 700;
        letter-spacing: -0.04em;
        line-height: 1;
        text-shadow: 0 1px 8px rgba(15, 3, 54, 0.9);
      }

      .trust-fact-coordinate-core::before,
      .trust-fact-coordinate-core::after,
      .trust-fact-coordinate-core span::before {
        position: absolute;
        inset: -1px;
        border: 1px solid rgba(201, 177, 255, 0.5);
        border-radius: 50%;
        opacity: 0;
        content: "";
        transform: scale(1);
      }

      .trust-fact-coordinate-core::before { animation-delay: 0s; }
      .trust-fact-coordinate-core::after { animation-delay: 1.16s; }
      .trust-fact-coordinate-core span::before { animation-delay: 2.32s; }

      .trust-fact-coordinate-sweeps {
        position: absolute;
        inset: 0;
        z-index: 1;
        overflow: hidden;
        -webkit-mask-image: linear-gradient(180deg, transparent, #000 17%, #000 83%, transparent);
        mask-image: linear-gradient(180deg, transparent, #000 17%, #000 83%, transparent);
      }

      .trust-fact-coordinate-sweeps i {
        position: absolute;
        left: 50%;
        display: block;
        width: 1px;
        height: 52px;
        opacity: 0;
        background: linear-gradient(180deg, transparent, rgba(232, 222, 255, 0.92), transparent);
        box-shadow: 0 0 11px rgba(169, 140, 255, 0.72);
        transform: translateX(-50%);
      }

      .trust-fact-coordinate-sweeps i:first-child { top: calc(50% - 52px); }
      .trust-fact-coordinate-sweeps i:last-child { top: 50%; }

      .trust-fact-coordinate-stage.is-coordinate-visible::before {
        animation-play-state: running;
      }

      .trust-fact-coordinate-stage.is-coordinate-visible .trust-fact-coordinate-core::before,
      .trust-fact-coordinate-stage.is-coordinate-visible .trust-fact-coordinate-core::after,
      .trust-fact-coordinate-stage.is-coordinate-visible .trust-fact-coordinate-core span::before {
        animation: trust-coordinate-wave 3.5s cubic-bezier(0.6, 0.6, 0, 1) infinite;
      }

      .trust-fact-coordinate-stage.is-coordinate-visible .trust-fact-coordinate-core::after {
        animation-delay: 1.16s;
      }

      .trust-fact-coordinate-stage.is-coordinate-visible .trust-fact-coordinate-core span::before {
        animation-delay: 2.32s;
      }

      .trust-fact-coordinate-stage.is-coordinate-visible .trust-fact-coordinate-sweeps i:first-child {
        animation: trust-coordinate-sweep-up 3.5s cubic-bezier(0.6, 0.6, 0, 1) infinite;
      }

      .trust-fact-coordinate-stage.is-coordinate-visible .trust-fact-coordinate-sweeps i:last-child {
        animation: trust-coordinate-sweep-down 3.5s cubic-bezier(0.6, 0.6, 0, 1) 0.5s infinite;
      }

      .trust-fact-coordinate-stage .trust-fact-grid {
        position: relative;
        z-index: 3;
        display: grid;
        min-height: inherit;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: repeat(2, minmax(0, 1fr));
        column-gap: clamp(100px, 15vw, 184px);
        row-gap: clamp(58px, 6vw, 94px);
        margin: 0;
      }

      .trust-fact-coordinate-stage .trust-fact {
        display: flex;
        min-width: 0;
        min-height: 0;
        flex-direction: column;
        justify-content: center;
        border: 0;
        padding: clamp(16px, 2vw, 28px) 0;
        background: transparent;
        box-shadow: none;
      }

      .trust-fact-coordinate-stage .trust-fact:nth-child(odd) {
        align-items: flex-end;
        text-align: right;
      }

      .trust-fact-coordinate-stage .trust-fact:nth-child(even) {
        align-items: flex-start;
        text-align: left;
      }

      .trust-fact-coordinate-stage .trust-fact dt {
        color: #f4f0ff;
        font-size: clamp(31px, 2.65vw, 38px);
        line-height: 1.14;
        text-wrap: balance;
      }

      .trust-fact-coordinate-stage .trust-fact dd {
        inline-size: min(100%, 16em);
        max-width: none;
        margin-top: 11px;
        color: rgba(239, 237, 253, 0.68);
        font-size: clamp(13px, 1.05vw, 15px);
        line-height: 1.62;
      }

      @keyframes trust-coordinate-grid-drift {
        from { background-position: 0 0; }
        to { background-position: 32px 32px; }
      }

      @keyframes trust-coordinate-wave {
        0% { opacity: 0.68; transform: scale(1); }
        100% { opacity: 0; transform: scale(4.7); }
      }

      @keyframes trust-coordinate-sweep-up {
        0%, 12% { opacity: 0; transform: translate(-50%, 0); }
        31% { opacity: 0.92; }
        100% { opacity: 0; transform: translate(-50%, -180px); }
      }

      @keyframes trust-coordinate-sweep-down {
        0%, 12% { opacity: 0; transform: translate(-50%, 0); }
        31% { opacity: 0.92; }
        100% { opacity: 0; transform: translate(-50%, 180px); }
      }

      @media (hover: hover) and (pointer: fine) {
        .trust-fact-coordinate-stage .trust-fact:hover {
          border-color: transparent;
          background: radial-gradient(circle at 50% 50%, rgba(148, 101, 255, 0.09), transparent 68%);
          box-shadow: none;
          transform: translateY(-2px);
        }
      }

      @media (max-width: 720px) {
        /* On the stacked phone layout, keep the question explanations and
           closing sentence available instead of collapsing them away. */
        .founder-copy-question-detail,
        .founder-copy-summary {
          display: block;
        }

        /* The connected-stage artwork remains, but the heading should not
           begin after a half-screen of empty top padding on phones. */
        .solution-choice-section {
          /* Keep the funnel above the copy, but let the first title enter
             short phone viewports instead of pushing it below the fold. */
          padding-top: clamp(300px, 60vw, 320px);
        }

        .solution-reflect-connected-image {
          /* The tip sits closer to the preceding section without lifting the copy. */
          top: 0;
          width: min(480px, 92vw);
          height: auto;
        }

        .solution-reflect-rising-stars {
          top: 178px;
        }

        .solution-choice-section {
          padding-bottom: 64px;
        }

        .trust-close-section {
          padding-top: 64px;
        }

        .trust-fact-coordinate-stage {
          min-height: 0;
          margin-top: 36px;
          padding-top: 280px;
          overflow: visible;
          background: none;
        }

        .trust-fact-coordinate-stage::before,
        .trust-fact-coordinate-stage::after,
        .trust-fact-coordinate-ornament {
          top: 0;
          bottom: auto;
          height: 280px;
        }

        .trust-fact-coordinate-stage .trust-fact-grid {
          min-height: 0;
          grid-template-columns: 1fr;
          grid-template-rows: none;
          gap: 0;
        }

        .trust-fact-coordinate-stage .trust-fact,
        .trust-fact-coordinate-stage .trust-fact:nth-child(odd),
        .trust-fact-coordinate-stage .trust-fact:nth-child(even) {
          align-items: flex-start;
          border-top: 1px solid rgba(201, 177, 255, 0.14);
          padding: 22px 0;
          text-align: left;
        }

        .trust-fact-coordinate-stage .trust-fact dt {
          font-size: clamp(29px, 8vw, 34px);
        }

        .trust-fact-coordinate-stage .trust-fact dd {
          inline-size: min(100%, 32rem);
          max-width: 32rem;
          font-size: 14px;
        }

        .trust-fact-coordinate-core {
          width: 62px;
        }
      }

      @media (prefers-reduced-motion: reduce) {
        .trust-fact-coordinate-stage::before,
        .trust-fact-coordinate-stage .trust-fact-coordinate-core::before,
        .trust-fact-coordinate-stage .trust-fact-coordinate-core::after,
        .trust-fact-coordinate-stage .trust-fact-coordinate-core span::before,
        .trust-fact-coordinate-stage .trust-fact-coordinate-sweeps i {
          animation: none !important;
        }
      }

      .trust-close-section.is-proof-static .trust-fact-coordinate-stage::before,
      .trust-close-section.is-proof-static .trust-fact-coordinate-core::before,
      .trust-close-section.is-proof-static .trust-fact-coordinate-core::after,
      .trust-close-section.is-proof-static .trust-fact-coordinate-core span::before,
      .trust-close-section.is-proof-static .trust-fact-coordinate-sweeps i {
        animation: none !important;
      }

      /* The system label reads as a contained product identity, not a loose line. */
      .logic-flow-page .hero-badge {
        width: max-content;
      }

      .system-loop-eyebrow {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        min-height: 34px;
        margin-bottom: 18px;
        padding: 8px 16px;
        border: 1px solid rgba(201, 177, 255, 0.3);
        border-radius: 999px;
        background: rgba(20, 9, 58, 0.42);
        box-shadow: inset 0 1px rgba(255, 255, 255, 0.08), 0 0 22px rgba(148, 101, 255, 0.1);
        font-family: "Aeonik Local", var(--font-copy);
        font-size: 11px;
        font-weight: 500;
        letter-spacing: 0.18em;
        line-height: 1;
      }

      .founder-copy-summary > span {
        display: block;
      }

      @media (max-width: 720px) {
        .system-loop-eyebrow {
          min-height: 30px;
          margin-bottom: 14px;
          padding: 7px 12px;
          font-size: 9px;
        }
      }

      /* Canonical homepage flow:
       * user problem -> system response -> practice proof -> participation -> action.
       */
      .logic-flow-page #main-content {
        display: flex;
        flex-direction: column;
      }

      .logic-flow-page #main-content > .dawn-hero { order: 1; }
      .logic-flow-page #main-content > .hero-story { order: 2; }
      .logic-flow-page #main-content > .solution-choice-section { order: 3; }
      .logic-flow-page #main-content > .trust-close-section { order: 4; }
      .logic-flow-page #main-content > .logic-flow-final-cta { order: 5; }

      .logic-flow-page .hero-description {
        color: rgba(244, 240, 255, 0.88);
        text-shadow:
          0 1px 2px rgba(1, 0, 8, 0.98),
          0 0 16px rgba(1, 0, 8, 0.82);
      }

      @media (min-width: 721px) {
        .logic-flow-page .system-offer-lead {
          min-block-size: 3.1em;
          text-wrap: balance;
        }
      }

      @media (min-width: 721px) and (max-width: 1248px) {
        .logic-flow-page.hero-compact .dawn-hero,
        .logic-flow-page.hero-compact .hero-stage {
          min-height: clamp(490px, calc(414.75px + 10.44vw), 545px);
        }
      }

      @media (min-width: 1249px) {
        .logic-flow-page.hero-compact .dawn-hero,
        .logic-flow-page.hero-compact .hero-stage {
          min-height: clamp(592px, calc(372px + 17.6vw), 638px);
        }
      }

      @media (max-width: 720px) {
        .logic-flow-page.hero-compact .dawn-hero {
          --hero-stage-height: calc(434px * var(--hero-scale));
        }
      }

      /* Keep the origin timeline beside the opening statement, while avoiding
         repeated proof modules further down the page. */
      .logic-flow-page .founder-metrics,
      .logic-flow-page .trust-final-cta {
        display: none;
      }

      .logic-flow-page .hero-story-inner {
        min-height: 0;
        padding: clamp(72px, 8vw, 112px) 0;
      }

      .logic-flow-page .hero-story-copy {
        width: min(100%, 680px);
        margin-left: 0;
      }

      /* The portrait carries three compact proof points, so the founder story
         has credibility at the moment it introduces the three core questions. */
      .logic-flow-page .founder-portrait {
        display: flex;
        flex-direction: column;
        gap: 14px;
      }

      .logic-flow-page .founder-portrait-frame {
        /* Start the readable lower scrim immediately above the proof copy,
           leaving the founder's face clear and uninterrupted. */
        --portrait-scrim-bottom: 40%;
      }

      /* Keep the paired portrait layers complete inside the equal-height frame.
         The frame still stretches with the copy column; only the artwork scales. */
      .logic-flow-page .founder-portrait-frame > img {
        object-fit: contain;
        object-position: center bottom;
        transform: scale(1.105);
        transform-origin: center bottom;
      }

      .logic-flow-page .founder-portrait-proof {
        position: absolute;
        z-index: 6;
        right: clamp(16px, 5cqi, 22px);
        bottom: clamp(16px, 5cqi, 22px);
        left: clamp(16px, 5cqi, 22px);
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: clamp(10px, 2.6cqi, 14px);
        margin: 0;
        color: #f4f0ff;
        pointer-events: none;
        text-align: left;
      }

      .logic-flow-page .founder-portrait-proof > div {
        min-width: 0;
      }

      .logic-flow-page .founder-portrait-proof strong,
      .logic-flow-page .founder-portrait-proof span {
        display: block;
      }

      .logic-flow-page .founder-portrait-proof strong {
        color: #f4f0ff;
        font-family: var(--font-title);
        font-size: clamp(18px, 1.65vw, 23px);
        font-weight: 900;
        letter-spacing: -0.045em;
        line-height: 1.15;
        text-shadow: 0 2px 12px rgba(3, 0, 20, 0.72);
      }

      .logic-flow-page .founder-portrait-proof span {
        margin-top: 5px;
        color: rgba(239, 237, 253, 0.72);
        font-family: var(--font-copy);
        font-size: clamp(11px, 0.88vw, 13px);
        line-height: 1.42;
        text-shadow: 0 1px 8px rgba(3, 0, 20, 0.72);
      }

      .logic-flow-page .solution-choice-closing {
        display: none;
      }

      /* Large corner numerals echo the reference treatment without adding a
         second row to the card header or competing with the product title. */
      .logic-flow-page .system-offer-card {
        overflow: visible;
      }

      /* The original section used an x-axis clip for its decorative grid.
         That clip also trims the oversized corner numerals at some desktop
         widths, so keep the section itself open and let its backgrounds stay
         contained by their own layers. */
      .logic-flow-page .system-loop-section {
        overflow: visible;
      }

      .logic-flow-page .system-offer-index {
        position: absolute;
        top: clamp(-30px, -2.25vw, -15px);
        /* Anchor the complete paint box to the card's actual top-right corner.
           The box itself retains enough width to keep every stroke visible. */
        right: 0;
        /* Keep the oversized numeral above the card border and background
           layers. The card copy stays visually clear because the numeral
           occupies the opposite corner. */
        z-index: 10;
        display: grid;
        place-items: start center;
        /* A single glyph must keep a complete paint box. The previous
           negative letter-spacing shortened that box, so the transparent
           text / gradient-clip technique left the numeral's right stroke
           literally unpainted even when every ancestor allowed overflow. */
        inline-size: 0.82em;
        overflow: visible;
        white-space: nowrap;
        color: transparent;
        -webkit-text-fill-color: transparent;
        font-family: var(--font-title);
        font-size: clamp(112px, 11vw, 174px);
        font-weight: 900;
        letter-spacing: 0;
        line-height: 0.78;
        text-align: center;
        opacity: 0.82;
        pointer-events: none;
        user-select: none;
        background: linear-gradient(
          180deg,
          rgba(224, 210, 255, 0.98) 0%,
          rgba(185, 145, 255, 0.64) 40%,
          rgba(108, 70, 208, 0.22) 100%
        );
        -webkit-background-clip: text;
        background-clip: text;
        text-shadow: 0 0 30px rgba(148, 101, 255, 0.22);
      }

      .logic-flow-page .system-offer-index::after {
        display: none;
      }

      /* The portrait now carries the founder evidence. This section starts
         directly from the visitor's current stage, then shows real peers. */
      .logic-flow-page .trust-close-inner {
        display: flex;
        flex-direction: column;
      }

      .logic-flow-page .trust-community-proof { order: 2; }

      .logic-flow-page .trust-case-section {
        margin-top: 0;
      }

      .logic-flow-page .logic-flow-trust-stage {
        width: var(--content-width);
        margin: 0 auto;
        padding: 0 0 clamp(136px, 12vw, 156px);
      }

      /* Reuse the public proof modules directly after the participation cards. */
      .logic-flow-page .trust-close-section {
        display: block;
        padding-top: clamp(48px, 5vw, 72px);
        padding-bottom: clamp(76px, 7.5vw, 112px);
      }

      .logic-flow-page .trust-review-proof {
        position: relative;
        z-index: 1;
        margin: 0;
      }

      .logic-flow-page .trust-review-proof + .trust-customer-proof {
        margin-top: clamp(76px, 8vw, 120px);
      }

      /* Three restrained orbit circles replace the former dashboard cards. */
      .logic-flow-page .trust-close-section::before {
        opacity: 0;
      }

      .logic-flow-page .trust-case-heading {
        width: min(100%, 920px);
        max-width: none;
        margin: 0 auto;
        text-align: center;
      }

      .logic-flow-page .trust-case-heading .trust-eyebrow {
        margin-bottom: 18px;
      }

      @media (max-width: 720px) {
        .logic-flow-page .trust-case-heading .trust-eyebrow.system-loop-eyebrow {
          margin-bottom: 14px;
        }
      }

      .logic-flow-page .trust-case-heading h3 {
        font-size: clamp(31px, 2.8vw, 42px);
        letter-spacing: -0.068em;
        line-height: 1.27;
      }

      @media (min-width: 721px) and (max-width: 980px) {
        .logic-flow-page .trust-case-heading h3 {
          font-size: clamp(31px, 3.3vw, 36px);
          line-height: 1.29;
        }
      }

      .logic-flow-page .trust-case-grid {
        position: relative;
        display: grid;
        width: min(100%, 900px);
        isolation: isolate;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        align-items: center;
        gap: clamp(12px, 1.6vw, 22px);
        margin: clamp(62px, 6.4vw, 88px) auto 0;
        overflow: visible;
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
      }

      .logic-flow-page .trust-case-grid::before {
        position: absolute;
        z-index: 0;
        top: 50%;
        right: 16.666%;
        left: 16.666%;
        width: auto;
        height: 1px;
        border-radius: 0;
        background: linear-gradient(90deg, rgba(201, 177, 255, 0.08), rgba(201, 177, 255, 0.38) 14%, rgba(147, 130, 255, 0.22) 50%, rgba(201, 177, 255, 0.38) 86%, rgba(201, 177, 255, 0.08));
        box-shadow: none;
        filter: none;
        opacity: 1;
        content: "";
        transform: none;
        pointer-events: none;
      }

      .logic-flow-page .trust-case {
        --case-accent: 201, 177, 255;
        --case-shift: 0px;
        position: relative;
        z-index: 1;
        display: grid;
        width: clamp(188px, 19vw, 216px);
        min-height: 0;
        aspect-ratio: 1;
        place-items: center;
        justify-self: center;
        overflow: visible;
        border: 1px solid rgba(var(--case-accent), 0.24);
        border-radius: 50%;
        padding: clamp(34px, 3.8vw, 44px) clamp(18px, 1.8vw, 24px);
        background:
          radial-gradient(circle at 1px 50%, rgba(var(--case-accent), 0.85) 0 1.5px, rgba(var(--case-accent), 0.14) 1.8px, transparent 3px),
          radial-gradient(circle at calc(100% - 1px) 50%, rgba(var(--case-accent), 0.85) 0 1.5px, rgba(var(--case-accent), 0.14) 1.8px, transparent 3px),
          #050117;
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.012);
        transform: none;
        transition: background 290ms ease, border-color 290ms ease, box-shadow 290ms ease, transform 290ms cubic-bezier(0.2, 0.72, 0.2, 1);
      }

      .logic-flow-page .trust-case:nth-child(2) {
        --case-accent: 186, 156, 255;
        --case-shift: 0px;
      }

      .logic-flow-page .trust-case:nth-child(3) {
        --case-accent: 171, 173, 255;
      }

      .logic-flow-page .trust-case::before {
        position: absolute;
        z-index: 1;
        inset: -1px;
        display: block;
        border-radius: 50%;
        padding: 1px;
        opacity: 0.82;
        background: conic-gradient(
          from 212deg,
          transparent 0 11%,
          rgba(var(--case-accent), 0.08) 14%,
          rgba(240, 231, 255, 0.72) 19%,
          rgba(var(--case-accent), 0.26) 24%,
          transparent 30% 64%,
          rgba(var(--case-accent), 0.28) 69%,
          transparent 77%
        );
        -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
        -webkit-mask-composite: xor;
        mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
        mask-composite: exclude;
        content: "";
        transition: opacity 260ms ease;
        pointer-events: none;
      }

      .logic-flow-page .trust-case::after {
        position: absolute;
        top: auto;
        bottom: 15%;
        left: 50%;
        width: 24px;
        height: 1px;
        border-radius: 999px;
        opacity: 0.78;
        background: linear-gradient(90deg, transparent, rgba(var(--case-accent), 0.5), transparent);
        box-shadow: none;
        filter: none;
        content: "";
        transform: translateX(-50%);
        transition: opacity 290ms ease, transform 290ms ease;
        pointer-events: none;
      }

      .logic-flow-page .trust-case-index {
        position: absolute;
        z-index: 3;
        top: -13px;
        left: 50%;
        gap: 6px;
        border: 1px solid rgba(var(--case-accent), 0.22);
        border-radius: 999px;
        padding: 6px 9px 5px 10px;
        color: rgba(225, 212, 255, 0.78);
        background: #030014;
        box-shadow: 0 0 0 5px #030014;
        font-size: 9px;
        letter-spacing: 0.18em;
        line-height: 1;
        transform: translateX(-50%);
        transition: color 260ms ease;
      }

      .logic-flow-page .trust-case-index::before {
        display: block;
        width: 3px;
        height: 3px;
        flex: 0 0 3px;
        border-radius: 50%;
        background: rgba(var(--case-accent), 0.9);
        box-shadow: 0 0 5px rgba(var(--case-accent), 0.35);
        content: "";
      }

      .logic-flow-page .trust-case-index::after {
        display: none;
      }

      .logic-flow-page .trust-case-core {
        position: relative;
        z-index: 2;
        display: flex;
        width: 100%;
        min-width: 0;
        box-sizing: border-box;
        flex-direction: column;
        align-items: center;
        justify-self: stretch;
        gap: 7px;
        margin: 0;
        font-family: var(--font-title);
        font-size: clamp(28px, 2.55vw, 35px);
        font-weight: 900;
        letter-spacing: -0.055em;
        line-height: 1.04;
        text-align: center;
        text-wrap: balance;
      }

      .logic-flow-page .trust-case-core span {
        display: block;
        width: 100%;
        color: rgba(244, 240, 255, 0.64);
        font-size: 0.64em;
        font-weight: 600;
        letter-spacing: 0.035em;
        line-height: 1.1;
      }

      .logic-flow-page .trust-case-support {
        display: block;
        width: 100%;
        max-width: 100%;
        color: rgba(201, 177, 255, 0.58);
        font-family: var(--font-title);
        font-size: 0.64em;
        font-weight: 600;
        letter-spacing: 0.035em;
        line-height: 1.1;
        white-space: nowrap;
      }

      .logic-flow-page .trust-case-core strong {
        display: block;
        width: 100%;
        color: #f4f0ff;
        font: inherit;
        font-size: 1em;
        line-height: 0.98;
      }

      @media (hover: hover) and (pointer: fine) {
        .logic-flow-page .trust-case:hover {
          border-color: rgba(var(--case-accent), 0.42);
          box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.018);
          transform: none;
        }

        .logic-flow-page .trust-case:hover::before {
          opacity: 1;
        }

        .logic-flow-page .trust-case:hover::after {
          opacity: 1;
          transform: translateX(-50%);
        }

        .logic-flow-page .trust-case:hover .trust-case-index {
          color: rgba(231, 219, 255, 0.94);
        }
      }

      @media (max-width: 980px) {
        .logic-flow-page .trust-case-grid {
          width: min(100%, 820px);
          grid-template-columns: repeat(3, minmax(0, 1fr));
          gap: clamp(8px, 1.4vw, 12px);
        }

        .logic-flow-page .trust-case {
          --case-shift: 0px;
          width: clamp(180px, 19vw, 208px);
          min-height: 0;
          padding: 34px 16px;
        }

        .logic-flow-page .trust-case:nth-child(2) {
          --case-shift: 0px;
        }

        .logic-flow-page .trust-case:last-child {
          grid-column: auto;
          width: clamp(180px, 19vw, 208px);
        }

        .logic-flow-page .trust-case-core {
          font-size: clamp(25px, 3.6vw, 30px);
        }
      }

      @media (max-width: 720px) {
        .logic-flow-page .trust-case-heading h3 {
          font-size: clamp(14px, 4.7vw, 32px);
          line-height: 1.26;
        }

        .logic-flow-page .trust-case-grid {
          width: 100%;
          grid-template-columns: repeat(3, minmax(0, 1fr));
          gap: 6px;
          margin-top: 38px;
        }

        .logic-flow-page .trust-case {
          width: min(100%, clamp(88px, 27vw, 166px));
          padding: 22px 8px;
        }

        .logic-flow-page .trust-case:last-child {
          grid-column: auto;
          width: min(100%, clamp(88px, 27vw, 166px));
        }

        .logic-flow-page .trust-case-core {
          gap: 3px;
          font-size: clamp(16px, 4.4vw, 22px);
          line-height: 1.06;
        }

        .logic-flow-page .trust-case-support {
          font-size: 0.72em;
          letter-spacing: -0.01em;
        }

        .logic-flow-page .trust-case-index {
          top: -9px;
          gap: 4px;
          padding: 4px 6px 3px;
          box-shadow: 0 0 0 3px #030014;
          font-size: 7px;
        }

        .logic-flow-page .trust-case-core span {
          font-size: 0.72em;
        }

        .logic-flow-page .trust-case::after {
          bottom: 12%;
          width: 14px;
        }
      }

      @media (max-width: 380px) {
        .logic-flow-page .trust-case-core {
          font-size: clamp(15px, 4.5vw, 17px);
        }

        .logic-flow-page .trust-case-core span,
        .logic-flow-page .trust-case-support {
          font-size: 0.66em;
        }
      }

      .logic-flow-page .solution-choice-section {
        padding-bottom: clamp(72px, 8vw, 112px);
      }

      .logic-flow-final-cta {
        --logic-flow-cta-curve-depth: clamp(64px, 6.5vw, 96px);
        position: relative;
        overflow: hidden;
        order: 5;
        padding: calc(var(--logic-flow-cta-curve-depth) + clamp(42px, 4vw, 58px)) 24px 96px;
        border-top: 0;
        background:
          radial-gradient(52% 86% at 50% 0%, rgba(148, 101, 255, 0.16), transparent 76%),
          linear-gradient(180deg, #010008, #05011a 56%, #010008);
        text-align: center;
      }

      .logic-flow-final-cta::before {
        position: absolute;
        inset: 0;
        pointer-events: none;
        background-image:
          linear-gradient(rgba(201, 177, 255, 0.035) 1px, transparent 1px),
          linear-gradient(90deg, rgba(201, 177, 255, 0.035) 1px, transparent 1px);
        background-position: center;
        background-size: 42px 42px;
        -webkit-mask-image: radial-gradient(circle at 50% 36%, #000, transparent 68%);
        mask-image: radial-gradient(circle at 50% 36%, #000, transparent 68%);
        content: "";
      }

      /* Replace the former straight section rule with one continuous valley:
         both edges stay high while the centre falls into the next screen. */
      .logic-flow-final-cta::after {
        position: absolute;
        z-index: 0;
        top: -1px;
        left: 0;
        width: 100%;
        height: var(--logic-flow-cta-curve-depth);
        pointer-events: none;
        background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 100' preserveAspectRatio='none'%3E%3Cpath d='M0 0H1000Q500 200 0 0Z' fill='%23010008'/%3E%3Cpath d='M0 0Q500 200 1000 0' fill='none' stroke='%236f78ff' stroke-opacity='.24' stroke-width='6' vector-effect='non-scaling-stroke'/%3E%3Cpath d='M0 0Q500 200 1000 0' fill='none' stroke='%23c7d8ff' stroke-opacity='.76' stroke-width='1.6' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
        filter: drop-shadow(0 4px 10px rgba(105, 115, 255, 0.28)) drop-shadow(0 14px 30px rgba(148, 101, 255, 0.18));
        content: "";
      }

      .logic-flow-final-cta-inner {
        position: relative;
        z-index: 1;
        width: min(100%, 760px);
        margin: 0 auto;
      }

      .logic-flow-final-cta-badge {
        width: max-content;
        max-width: 100%;
        margin: 0 auto clamp(30px, 3vw, 42px);
      }

      .logic-flow-final-cta h2 {
        margin: 0;
        color: #f4f0ff;
        font-family: var(--font-title);
        font-size: clamp(42px, 5vw, 70px);
        font-weight: 900;
        letter-spacing: -0.066em;
        line-height: 1.12;
      }

      .logic-flow-final-cta-title-line {
        display: block;
        white-space: nowrap;
      }

      .logic-flow-final-cta-subtitle {
        display: block;
        margin: 26px auto 0;
        color: rgba(239, 237, 253, 0.7);
        font-family: var(--font-copy);
        font-size: clamp(16px, 1.6vw, 20px);
        line-height: 1.65;
      }

      .logic-flow-final-cta-actions {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 12px;
        margin-top: 34px;
      }

      @media (max-width: 720px) {
        .logic-flow-page .hero-story-inner {
          width: min(var(--content-width), 420px);
          padding-top: 64px;
          padding-bottom: 64px;
        }

        .logic-flow-page .solution-title-line {
          display: block;
          white-space: nowrap;
        }

        .logic-flow-page .solution-title-comma {
          display: none;
        }

        .logic-flow-page .founder-portrait-proof {
          gap: 11px;
          right: 16px;
          bottom: 16px;
          left: 16px;
        }

        .logic-flow-page .founder-portrait-proof strong {
          font-size: clamp(20px, 5.4vw, 23px);
        }

        .logic-flow-page .founder-portrait-proof span {
          font-size: clamp(11px, 3vw, 13px);
        }

        .logic-flow-page .system-offer-index {
          top: -17px;
          right: 0;
          font-size: clamp(92px, 27vw, 136px);
        }

        .logic-flow-final-cta {
          padding: calc(var(--logic-flow-cta-curve-depth) + 38px) 20px 96px;
        }

        .logic-flow-final-cta-badge {
          margin-bottom: clamp(24px, 7vw, 32px);
          padding: 0.44em 0.8em 0.44em 0.5em;
          font-size: clamp(10px, 3vw, 13px);
        }

        .logic-flow-final-cta h2 {
          font-size: clamp(27px, 8.7vw, 50px);
        }

        .logic-flow-final-cta-actions {
          align-items: stretch;
          flex-direction: column;
          width: min(100%, 210px);
          margin-right: auto;
          margin-left: auto;
        }

        .logic-flow-final-cta-actions .trust-action {
          width: 100%;
        }
      }

      /* Match Reflect's source surface exactly so the non-transparent funnel
         image disappears into the section instead of reading as a rectangle. */
      .logic-flow-page .system-loop-section {
        background: linear-gradient(180deg, #010008 0%, #010008 calc(100% - 180px), #030014 100%);
      }

      .logic-flow-page .system-loop-section::before {
        background:
          linear-gradient(180deg, transparent calc(100% - 180px), #030014 100%),
          radial-gradient(52% 26% at 22% 32%, rgba(148, 101, 255, 0.052), transparent 72%),
          radial-gradient(46% 20% at 78% 76%, rgba(147, 130, 255, 0.022), transparent 76%),
          linear-gradient(180deg, rgba(3, 1, 16, 0.16), rgba(1, 0, 10, 0.78));
      }

      .logic-flow-page .solution-choice-section {
        isolation: auto;
        background: linear-gradient(180deg, #030014 0, #030014 905px, #02000f 1160px, #010008 100%);
        box-shadow: 0 -72px 110px rgba(3, 0, 20, 0.82);
      }

      .logic-flow-page .solution-reflect-connected-stage {
        z-index: 3;
        background: transparent;
      }

      .logic-flow-page .solution-choice-inner {
        z-index: 4;
      }

      /* The heading and the funnel share one visual coordinate system. A soft
         local veil protects the type without flattening the surrounding glow. */
      .logic-flow-page .solution-section-heading {
        position: relative;
        isolation: isolate;
      }

      .logic-flow-page .solution-section-heading::before {
        position: absolute;
        z-index: 0;
        inset: -24px -48px -40px;
        pointer-events: none;
        background: radial-gradient(
          ellipse at 50% 44%,
          rgba(3, 0, 20, 0.66) 0%,
          rgba(3, 0, 20, 0.43) 42%,
          rgba(3, 0, 20, 0.12) 66%,
          transparent 82%
        );
        filter: blur(14px);
        content: "";
      }

      .logic-flow-page .solution-section-heading > * {
        position: relative;
        z-index: 1;
      }

      .logic-flow-page .solution-section-heading h2 {
        text-shadow: 0 2px 16px rgba(3, 0, 20, 0.78), 0 0 30px rgba(3, 0, 20, 0.46);
      }

      .logic-flow-page .solution-section-heading > p:last-child {
        text-shadow: 0 1px 12px rgba(3, 0, 20, 0.88);
      }

      .logic-flow-page .logic-flow-final-cta {
        background:
          radial-gradient(52% 86% at 50% 0%, rgba(148, 101, 255, 0.16), transparent 76%),
          linear-gradient(180deg, #010008, #05011a 56%, #030014);
      }

      .footer-black-hole-stage {
        position: relative;
        width: 100%;
        height: clamp(92px, 14.0625vw, 180px);
        overflow: hidden;
        isolation: isolate;
        background: linear-gradient(180deg, rgba(3, 0, 20, 0), rgba(3, 0, 20, 0.78) 72%, #030014 100%);
      }

      .footer-black-hole-media {
        position: absolute;
        top: 0;
        left: 50%;
        width: clamp(746px, 112.5vw, 1440px);
        aspect-ratio: 16 / 9;
        transform: translateX(-50%);
        opacity: .72;
        -webkit-mask-image: none;
        mask-image: none;
      }

      .footer-black-hole-poster,
      .footer-black-hole-poster img,
      .footer-black-hole-video {
        position: absolute;
        inset: 0;
        display: block;
        width: 100%;
        height: 100%;
      }

      .footer-black-hole-poster {
        transform-origin: 50% 100%;
        animation: none;
        opacity: 1;
        transition: none;
      }

      .footer-black-hole-poster img,
      .footer-black-hole-video {
        object-fit: cover;
      }

      .footer-black-hole-video {
        opacity: 0;
        transition: opacity 700ms ease;
      }

      .footer-black-hole-stage.is-video-ready .footer-black-hole-video {
        opacity: 1;
      }

      .footer-black-hole-stage.is-video-ready .footer-black-hole-poster {
        opacity: 0;
      }

      .footer-black-hole-stars {
        position: absolute;
        z-index: 2;
        inset: 0;
        overflow: hidden;
        pointer-events: none;
        opacity: .58;
        background:
          radial-gradient(circle at 9% 72%, rgba(244, 239, 255, .72) 0 1px, transparent 1.6px),
          radial-gradient(circle at 24% 38%, rgba(194, 159, 255, .62) 0 1px, transparent 1.5px),
          radial-gradient(circle at 43% 78%, rgba(244, 239, 255, .58) 0 1px, transparent 1.5px),
          radial-gradient(circle at 61% 42%, rgba(194, 159, 255, .68) 0 1px, transparent 1.6px),
          radial-gradient(circle at 79% 70%, rgba(244, 239, 255, .64) 0 1px, transparent 1.5px),
          radial-gradient(circle at 92% 32%, rgba(194, 159, 255, .54) 0 1px, transparent 1.5px);
      }

      .footer-black-hole-stars i {
        position: absolute;
        top: var(--star-y);
        left: var(--star-x);
        width: var(--star-size);
        height: var(--star-size);
        border-radius: 50%;
        background: rgba(244, 239, 255, 0.78);
        box-shadow: 0 0 8px rgba(194, 159, 255, 0.62);
        animation: footer-star-pulse 3.6s ease-in-out var(--star-delay) infinite alternate;
      }

      body > .site-footer {
        margin: 0;
        min-height: 0;
        height: fit-content;
        max-height: fit-content;
        block-size: fit-content;
        max-block-size: fit-content;
        flex: none;
        overflow: hidden;
        padding: 26px 24px max(26px, env(safe-area-inset-bottom));
        border-top: 0;
        color: rgba(239, 237, 253, 0.58);
        background: #030014;
        text-align: center;
      }

      body > .site-footer .footer-inner {
        display: grid;
        width: min(100%, 1120px);
        place-items: center;
        margin: 0 auto;
        text-align: center;
      }

      .footer-legal {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 4px 18px;
        font-size: 12px;
        line-height: 1.8;
      }

      .footer-site-links {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 6px 20px;
        margin-bottom: 8px;
        font-size: 12px;
        line-height: 1.8;
      }

      .footer-site-links a {
        text-decoration: none;
      }

      .footer-site-links a:hover {
        text-decoration: underline;
      }

      body > .site-footer a {
        color: rgba(226, 213, 255, 0.76);
      }

      @media (max-width: 720px) {
        .logic-flow-final-cta {
          --logic-flow-cta-curve-depth: 52px;
        }

        .logic-flow-page .solution-choice-section {
          --solution-funnel-grow: clamp(65px, 16.7vw, 84px);
          --solution-art-top: 0px;
          --solution-art-width: min(560px, 108vw);
          --solution-copy-anchor: min(326px, 63vw);
          margin-top: calc(-1 * var(--solution-funnel-grow));
          padding-top: calc(var(--solution-art-top) + var(--solution-copy-anchor));
        }

        .logic-flow-page .solution-reflect-connected-image {
          top: var(--solution-art-top);
          width: var(--solution-art-width);
          height: auto;
        }

        .footer-legal {
          flex-direction: column;
          gap: 2px;
        }
      }

      /* From tablet through wide desktop, lift the complete artwork/content
         group by one continuous rule. The transparent artwork layer may cross
         the previous section, while the section background stays behind it. */
      @media (min-width: 721px) {
        .logic-flow-page .solution-choice-section {
          --solution-funnel-mid-lift: clamp(164px, calc(28vw - 38px), 310px);
          --solution-art-overlap: 60px;
          --solution-art-top: calc(var(--solution-funnel-mid-lift) - var(--solution-art-overlap));
          --solution-art-width: clamp(560px, 67vw, 806px);
          --solution-copy-anchor: clamp(326px, 39vw, 470px);
          margin-top: calc(-1 * var(--solution-funnel-mid-lift));
          padding-top: calc(var(--solution-art-top) + var(--solution-copy-anchor));
        }

        .logic-flow-page .solution-reflect-connected-image {
          top: var(--solution-art-top);
          width: var(--solution-art-width);
          height: auto;
          transform: translateX(-50%);
        }

        .logic-flow-page .solution-reflect-rising-stars {
          top: calc(var(--solution-art-top) - 66px);
        }
      }

      /* Keep the footer black hole visually attached to the CTA: its upper
         glow can rise into the breathing space, while the horizon still
         remains the exact cut line before the legal footer. */
      .logic-flow-page .logic-flow-final-cta {
        padding-bottom: clamp(64px, 6.25vw, 80px);
      }

      .footer-black-hole-stage {
        --footer-hole-overlap: clamp(190px, 18.75vw, 600px);
        --footer-hole-height: clamp(130px, 14.0625vw, 180px);
        height: calc(var(--footer-hole-overlap) + var(--footer-hole-height));
        margin-top: calc(-1 * var(--footer-hole-overlap));
        overflow: hidden;
        -webkit-clip-path: none;
        clip-path: none;
        background-position: center bottom;
        background-size: 100% var(--footer-hole-height);
        background-repeat: no-repeat;
      }

      .footer-black-hole-media {
        top: 0;
        mix-blend-mode: normal;
        -webkit-clip-path: none;
        clip-path: none;
      }

      .footer-black-hole-stars {
        inset: var(--footer-hole-overlap) 0 0;
      }

      @media (max-width: 720px) {
        .logic-flow-page .logic-flow-final-cta {
          padding-bottom: clamp(28px, 5vw, 36px);
        }

        .footer-black-hole-stage {
          --footer-hole-overlap: clamp(108px, 31vw, 132px);
          --footer-hole-height: clamp(82px, 21vw, 108px);
        }
      }

      @media (prefers-reduced-motion: reduce) {
        .footer-black-hole-poster,
        .footer-black-hole-stars i {
          animation: none;
        }
      }

      /* 卡片用稳定的半透明底色表达层级，不再为静态表面长期维持模糊合成层。 */
      :where(
        .founder-transition-card,
        .ai-system-item,
        .system-offer-card,
        .solution-choice-card,
        .trust-fact,
        .trust-case,
        .trust-final-cta,
        .glass-card.system-card,
        .stage-card,
        .benefit-card
      ) {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        will-change: auto;
      }

      @media (max-width: 1024px) {
        :where(
          .founder-transition-card,
          .ai-system-item,
          .system-offer-card,
          .solution-choice-card,
          .trust-case,
          .trust-final-cta,
          .glass-card.system-card,
          .stage-card,
          .benefit-card
        ) {
          background-color: rgba(5, 3, 12, .86);
        }
      }