:root{
        --ink:#0E0A07;
        --paper:#FEFEFE;
        --blue:#18498B;
        --blue-2:#2352DE;
        --blue-3:#3372D9;
        --violet:#8669B9;
        --line:rgba(14,10,7,.07);
        --line-2:rgba(14,10,7,.05);
        --muted:rgba(14,10,7,.45);
        --muted-2:rgba(14,10,7,.55);
        --muted-3:rgba(14,10,7,.35);
        --font-sans:'Geist','Aktiv Grotesk Corp','Inter',ui-sans-serif,system-ui,sans-serif;
        --font-serif:'Instrument Serif','Test Söhne Mono',ui-serif,serif;
        --font-mono:'Geist Mono','Test Söhne Mono',ui-monospace,monospace;
      }
      *{box-sizing:border-box}
      html,body{margin:0;padding:0;background:var(--paper);color:var(--ink);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;scroll-behavior:smooth}
      html,body{overflow-x:hidden}
      a{color:inherit;text-decoration:none}
      button{font:inherit;border:0;background:none;color:inherit;cursor:pointer}
      img{display:block;max-width:100%}


      .nav{
        position:fixed;left:50%;top:clamp(20px,2.5vw,32px);transform:translateX(-50%);
        width:clamp(680px,65vw,985px);max-width:calc(100vw - 48px);height:clamp(44px,3.8vw,55px);
        border-radius:12px;
        display:flex;align-items:center;justify-content:space-between;
        padding:0 8px 0 20px;
        z-index:200;
        transition:background-color .4s ease, box-shadow .4s ease, color .4s ease;
      }
      .nav .brand{display:flex;align-items:center;gap:8px;color:#fff}
      .nav .brand svg{height:21px;width:auto;color:#fff;transition:color .4s ease}
      .nav .brand img{height:24px;width:auto;display:block}
      .nav.dark .brand img{filter:invert(1)}
      .nav .links{display:flex;gap:clamp(20px,2.8vw,42px);align-items:center}
      .nav .links a{font-size:clamp(12px,0.95vw,14px);letter-spacing:-0.02em;font-weight:500;color:rgba(254,254,254,.75);transition:color .4s ease}
      .nav .right{display:flex;align-items:center;gap:clamp(12px,1.4vw,20px)}
      .nav .signin{font-size:clamp(12px,0.95vw,14px);letter-spacing:-0.02em;font-weight:500;color:rgba(254,254,254,.85);transition:color .4s ease}
      .nav .cta{
        position:relative;overflow:hidden;
        height:clamp(32px,2.7vw,39px);padding:0 clamp(10px,1.1vw,16px);border-radius:clamp(8px,0.7vw,10px);
        background:#18498B;border:1px solid rgba(255,255,255,.2);
        color:#FEFEFE;font-size:clamp(12px,0.95vw,14px);font-weight:500;letter-spacing:-0.02em;
        box-shadow:inset 0 0 14.1px 2px rgba(255,255,255,.2),
                   0 2px 5px rgba(61,98,147,.2),0 9px 9px rgba(61,98,147,.17),0 19px 12px rgba(61,98,147,.1);
      }
      .nav.dark{
        background:rgba(0,0,0,.04);
        backdrop-filter:blur(10px);
        -webkit-backdrop-filter:blur(10px);
      }
      .nav.dark .brand svg,
      .nav.dark .links a,
      .nav.dark .signin{color:var(--ink)}
      .nav.dark .links a{color:rgba(14,10,7,.65)}
      .nav.glass{
        position:fixed;
        background:rgba(0,0,0,.25);
        box-shadow:inset 0 -4px 22.3px rgba(255,255,255,.15);
        border:1px solid rgba(255,255,255,.08);
        overflow:hidden;
      }
      .nav.glass::before,
      .nav.glass::after{
        content:'';
        position:absolute;
        pointer-events:none;
        z-index:10;
        background:rgba(255,255,255,.7);
        border-radius:2px;
        opacity:0;
      }
      .nav.glass{
        position:fixed;
        background:rgba(0,0,0,.25);
        box-shadow:inset 0 -4px 22.3px rgba(255,255,255,.15);
        border:1px solid rgba(255,255,255,.08);
        overflow:hidden;
      }
      .nav.glass::before,
      .nav.glass::after{
        content:'';
        position:absolute;
        pointer-events:none;
        z-index:10;
        background:linear-gradient(90deg, transparent 0%, rgba(255,255,255,.55) 50%, transparent 100%);
        width:10%;height:1px;
        filter:blur(0.6px);
        opacity:0;
      }
      .nav.glass::before{top:0;left:-10%}
      .nav.glass::after{bottom:0;right:-10%}
      .nav.glass.nav-lines-go::before{animation:none}
      .nav.glass.nav-lines-go::after{animation:none}
      @keyframes navLineTop{
        0%  {left:-10%;opacity:0}
        5%  {opacity:1}
        90% {opacity:.5}
        98% {opacity:0}
        100%{left:110%;opacity:0}
      }
      @keyframes navLineBottom{
        0%  {right:-10%;opacity:0}
        5%  {opacity:1}
        90% {opacity:.5}
        98% {opacity:0}
        100%{right:110%;opacity:0}
      }


      #sections .section{position:relative;min-height:100vh;min-height:100dvh;overflow:clip}
      #sections .section > .sect{min-height:100vh;min-height:100dvh;height:auto}
      #sections .section[data-anchor="engineers"],
      #sections .section[data-anchor="engineers"] > .s2{min-height:0}
      #sections .section[data-anchor="integrations"]{overflow:visible}

      .curtain{
        position:relative;left:0;top:0;
        width:100%;height:100vh;height:100dvh;
        overflow:hidden;color:#fff;perspective:2000px;
        z-index:50;
        background-color:#072049;
        box-shadow:0 24px 60px rgba(8,23,79,.35);
      }
      .curtain__bg{
        position:absolute;inset:0;z-index:0;
        background-image:
          radial-gradient(60% 80% at 50% 30%, rgba(140,180,235,.55) 0%, rgba(24,73,139,0) 70%),
          url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='60' height='100' preserveAspectRatio='none'><defs><linearGradient id='g' x1='0' x2='1' y1='0' y2='0'><stop offset='0' stop-color='%23041737'/><stop offset='0.20' stop-color='%23082558'/><stop offset='0.40' stop-color='%231e4d99'/><stop offset='0.50' stop-color='%234a82d0'/><stop offset='0.60' stop-color='%231e4d99'/><stop offset='0.80' stop-color='%23082558'/><stop offset='1' stop-color='%23041737'/></linearGradient></defs><rect width='60' height='100' fill='url(%23g)'/></svg>");
        background-size: auto, 30px 100%;
        background-repeat: no-repeat, repeat;
      }
      .curtain__video{
        position:absolute;inset:0;width:100%;height:100%;
        object-fit:cover;object-position:center;
        pointer-events:none;
        z-index:1;
        filter:brightness(1.28) saturate(1.38) contrast(1.08);
      }
      .curtain__tint{
        position:absolute;inset:0;z-index:2;pointer-events:none;
        background:
          radial-gradient(60% 70% at 58% 30%,rgba(74,130,208,.24) 0%,rgba(7,32,73,0) 68%);
        mix-blend-mode:screen;
      }
      .curtain__overlay{
        position:absolute;inset:0;
        background:
          linear-gradient(90deg,rgba(1,13,43,.28) 0%,rgba(1,16,49,.2) 38%,rgba(2,18,54,.06) 62%,transparent 80%),
          radial-gradient(120% 72% at 50% 0%,transparent 58%,rgba(1,11,38,.28) 100%),
          linear-gradient(180deg,transparent 62%,rgba(1,12,42,.38) 100%);
        pointer-events:none;
      }

      @keyframes scrollDown{
        0%{transform:translate(-50%,0);opacity:1}
        70%{transform:translate(-50%,14px);opacity:0}
        100%{transform:translate(-50%,14px);opacity:0}
      }
      .curtain__edge{
        position:absolute;left:0;right:0;bottom:-2px;height:14px;
        background:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.45) 100%);
        pointer-events:none;
      }

      .curtain__overlay{z-index:3}

      .hero{
        position:absolute;left:0;right:0;top:0;
        display:flex;flex-direction:column;align-items:center;
        text-align:center;
        padding-top:160px;
        color:#fff;
        z-index:6;
      }
      .hero .pill{
        display:inline-flex;align-items:center;gap:clamp(4px,0.4vw,6px);
        padding:clamp(4px,0.4vw,6px) clamp(10px,1vw,14px) clamp(4px,0.4vw,6px) clamp(4px,0.4vw,6px);border-radius:100px;
        background:rgba(255,255,255,.01);
        border:1px solid rgba(255,255,255,.15);
        box-shadow:inset 0 0 11.9px rgba(255,255,255,.3);
        position:relative;overflow:hidden;
      }
      .hero .pill::before,
      .hero .pill::after{
        content:'';
        position:absolute;pointer-events:none;
        background:linear-gradient(90deg, transparent 0%, rgba(255,255,255,.6) 50%, transparent 100%);
        height:1px;width:10%;
        filter:blur(0.5px);opacity:0;
      }
      .hero .pill::before{top:0;left:-10%}
      .hero .pill::after{bottom:0;right:-10%}
      .hero .pill.intro-pill-in{
        animation:introBounceIn .55s cubic-bezier(.22,.61,.36,1) forwards;
      }
      .hero .pill.intro-pill-in::before{animation:none}
      .hero .pill.intro-pill-in::after{animation:none}
      @keyframes pillShimmerTop{
        0%  {left:-10%;opacity:0}
        5%  {opacity:.9}
        90% {opacity:.5}
        97% {opacity:0}
        100%{left:110%;opacity:0}
      }
      @keyframes pillShimmerBottom{
        0%  {right:-10%;opacity:0}
        5%  {opacity:.9}
        90% {opacity:.5}
        97% {opacity:0}
        100%{right:110%;opacity:0}
      }
      @keyframes pillBorderGlow{
        0%, 100% {
          border-color: rgba(255,255,255,.15);
          box-shadow: inset 0 0 11.9px rgba(255,255,255,.3), 0 0 0 0 rgba(255,255,255,0);
        }
        50% {
          border-color: rgba(255,255,255,.5);
          box-shadow: inset 0 0 16px rgba(255,255,255,.45), 0 0 28px 4px rgba(140,180,235,.2);
        }
      }
      .hero .pill .new{
        display:flex;justify-content:center;align-items:center;gap:clamp(6px,0.7vw,10px);
        padding:clamp(4px,0.4vw,6px) clamp(6px,0.55vw,8px);border-radius:100px;background:#2352DE;
        color:rgba(254,254,254,.9);font-size:clamp(8px,0.7vw,10px);letter-spacing:.2em;font-weight:700;
      }
      .hero .pill .label{font-size:clamp(11px,0.95vw,14px);letter-spacing:-0.03em;color:rgba(255,255,255,.8);font-weight:500}
      .hero h1{
        margin:clamp(-30px,-2.8vw,-40px) auto 0;
        text-align:center;
        font-size:clamp(48px,5.8vw,82px);
        letter-spacing:-0.055em;line-height:1.05;font-weight:500;
        color:#fff;
        text-align:center;
        width:fit-content;
      }
      .hero h1 .line{display:block;white-space:nowrap;text-align:center}
      .hero h1 .it{
        font-family:inherit;font-style:normal;font-weight:600;
        letter-spacing:inherit;color:#b7e9ff;
      }
      .hero p.sub{
        margin:clamp(-35px,-3.2vw,-47px) auto 0;
        width:min(576px,88vw);max-width:min(576px,88vw);
        color:rgba(255,255,255,.90);
        text-align:center;
        font-family:"Aktiv Grotesk Corp","Geist",ui-sans-serif,sans-serif;
        font-size:clamp(13px,1.2vw,17px);
        font-style:normal;
        font-weight:500;
        line-height:135%;
        letter-spacing:-0.03em;
        color:rgba(255,255,255,.9);
      }
      .hero .ctas{display:flex;gap:clamp(12px,1.4vw,20px);margin-top:clamp(12px,1.4vw,20px);justify-content:center;align-items:center}
      .hero .ctas .btn{
        height:clamp(36px,3.2vw,46px);padding:0 clamp(10px,1.1vw,16px);border-radius:clamp(10px,1vw,14px);font-size:clamp(13px,1.1vw,16px);font-weight:500;letter-spacing:-0.04em;
        display:inline-flex;align-items:center;justify-content:center;gap:10px;
        color:rgb(254,254,254);
        cursor:pointer;
        transform:scale(0);
        transform-origin:center center;
        will-change:transform;
      }
      .hero .ctas .btn.primary{
        width:clamp(170px,15.5vw,223px);
        background:rgb(24,73,139);border:1px solid rgba(255,255,255,.3);
        box-shadow:inset 0 0 8px 6px rgba(255,255,255,.2),
                   0 2px 5px rgba(61,98,147,.2),0 9px 9px rgba(61,98,147,.17),0 19px 12px rgba(61,98,147,.1);
      }
      .hero .ctas .btn.ghost{
        width:auto;
        min-width:clamp(130px,11vw,150px);
        padding-inline:clamp(14px,1.4vw,20px);
        white-space:nowrap;
        background:rgba(255,255,255,.2);
        border:1px solid rgba(255,255,255,.15);
      }


      .spacer{height:100vh}
      main.below{position:relative;z-index:1;background:var(--paper)}
      #sections{position:relative;width:100%;z-index:1}


      .sect{
        position:relative;width:100%;
        background:var(--paper);
        overflow:hidden;
      }
      .sect-inner{
        max-width:1264px;margin:0 auto;padding:160px 64px 100px;
        position:relative;
      }
      .eyebrow{
        display:inline-flex;align-items:center;gap:8px;
        font-size:10px;letter-spacing:.1em;font-weight:700;color:rgba(14,10,7,.55);
      }
      .eyebrow .sq{width:8px;height:8px;border-radius:2px;background:rgba(14,10,7,.55)}

      .s2{padding-top:clamp(40px,5vh,64px);padding-bottom:0;display:flex;flex-direction:column;justify-content:center;overflow:hidden;background:var(--paper)}
      .s2-inner{
        max-width:1264px;margin:0 auto;padding:clamp(52px,6.5vh,72px) clamp(32px,5vw,64px) clamp(56px,7vh,80px);
        position:relative;
        min-height:0;
        height:auto;
        display:flex;flex-direction:column;justify-content:center;
      }
      .s2 .grid{display:grid;grid-template-columns:clamp(80px,16vw,200px) 1fr clamp(80px,16vw,200px);gap:clamp(20px,4vw,48px);align-items:start;position:relative}
      .s2 .reveal{will-change:filter,opacity}
      .s2 h2{
        font-size:clamp(28px,2.8vw,42px);letter-spacing:-0.05em;font-weight:500;line-height:1.05;
        margin:0;color:var(--ink);
      }
      .s2 .lede{
        font-size:clamp(18px,1.8vw,24px);letter-spacing:-0.04em;line-height:1.15;font-weight:700;
        color:rgba(14,10,7,.45);margin:36px 0 0;max-width:582px;
      }
      .s2 .ovals{
        position:absolute;left:0;right:0;top:clamp(120px,20vh,200px);height:clamp(160px,22vh,260px);
        pointer-events:none;display:flex;justify-content:center;gap:0;
      }
      .s2 .ovals .o{
        width:clamp(260px,35vw,470px);height:clamp(140px,18vw,255px);border-radius:300px;border:1.5px solid rgba(14,10,7,.05);
        margin-left:clamp(-150px,-10vw,-80px);
      }
      .s2 .ovals .o:first-child{margin-left:clamp(-220px,-15vw,-120px)}
      .s2 .ovals .o:nth-child(2){border-radius:0;border:1.5px solid rgba(14,10,7,.05);}
      .s2 .bottom{
        margin-top:clamp(18px,2.5vh,28px);display:grid;grid-template-columns:clamp(80px,16vw,200px) 1fr auto;gap:clamp(20px,4vw,48px);align-items:start;
      }
      .s2 .bottom .left{max-width:330px;grid-column:2}
      .s2 .meet{
        display:inline-flex;align-items:center;gap:8px;height:clamp(38px,4vw,46px);padding:0 clamp(10px,1.5vw,16px);
        border-radius:14px;background:rgba(0,0,0,.07);color:var(--ink);font-size:clamp(13px,1.2vw,16px);letter-spacing:-0.03em;font-weight:500;
      }
      .s2 .meet svg{width:clamp(14px,1.4vw,18px);height:clamp(14px,1.4vw,18px)}
      .s2 .stats{display:flex;gap:clamp(6px,.8vw,10px);margin-right:clamp(-300px,calc((100vw - 1264px) / -2),0px);justify-self:end}
      .s2 .stats .stat{
        width:clamp(80px,9vw,120px);height:clamp(80px,9vw,120px);border-radius:clamp(16px,2vw,24px);padding:clamp(8px,1vw,14px);display:flex;flex-direction:column;justify-content:space-between;
      }
      .s2 .stats .stat.violet{background:rgba(134,105,185,.02);border:1px solid rgba(134,105,185,.2);box-shadow:inset 0 0 11.2px 5px rgba(134,105,185,.04)}
      .s2 .stats .stat.blue{background:rgba(37,91,243,.02);border:1px solid rgba(37,91,243,.2);box-shadow:inset 0 0 11.2px 5px rgba(37,91,243,.04)}
      .s2 .stats .v{font-family:var(--font-mono);font-size:clamp(18px,1.8vw,24px);letter-spacing:-0.06em;line-height:1}
      .s2 .stats .l{font-size:clamp(8px,.8vw,10px);letter-spacing:.1em;font-weight:700;line-height:1.2}
      .s2 .stats .violet .v{color:#8669B9}
      .s2 .stats .violet .l{color:rgba(134,105,185,.7)}
      .s2 .stats .blue .v{color:#2552DE}
      .s2 .stats .blue .l{color:rgba(37,91,243,.7)}


      .s2 .grid > div:first-child .eyebrow,
      .s2 .bottom .left .meet,
      .s2 .stats .stat{
        opacity:0;transform:translateY(22px);will-change:transform,opacity;
      }
      .s2 .bottom .left .meet,
      .s2 .stats .stat{transform:scale(0);transform-origin:center center}
      .s2-in .grid > div:first-child .eyebrow{animation:s2FadeUp .7s cubic-bezier(.22,.61,.36,1) .05s forwards}

      .s2 .grid h2 .ch{
        display:inline-block;opacity:0;
        transform:translateY(.9em) rotateX(-70deg) scale(.9);
        transform-origin:50% 100%;
        filter:blur(14px);
        will-change:transform,opacity,filter;
      }
      .s2 .grid h2 .ch.sp{width:.28em}
      .s2 .grid h2{opacity:0}
      .s2-in .grid h2{opacity:1}
      .s2-in .grid h2 .ch{
        animation:introLetterUp .9s cubic-bezier(.22,.61,.36,1) both;
        animation-delay:calc(.1s + var(--i, 0) * 38ms);
      }
      .s2 .lede .sub-line{display:block;opacity:0;transform:translateY(18px);will-change:transform,opacity}
      .s2-in .lede .sub-line.in{animation:introSubLine .7s cubic-bezier(.22,.61,.36,1) forwards}
      .s2-in .bottom .left .meet{animation:s2MeetPop 1.1s cubic-bezier(.22,.61,.36,1) 1.15s forwards}
      .s2-in .stats .stat.violet{animation:s2BtnPop 1.1s cubic-bezier(.22,.61,.36,1) 1.35s forwards}
      .s2-in .stats .stat.blue{animation:s2BtnPop 1.1s cubic-bezier(.22,.61,.36,1) 1.65s forwards}
      @keyframes s2FadeUp{
        0%  {opacity:0;transform:translateY(22px)}
        100%{opacity:1;transform:translateY(0)}
      }
      @keyframes s2BtnPop{
        0%  {opacity:0;transform:scale(0)}
        40% {opacity:1}
        60% {transform:scale(1.2)}
        100%{opacity:1;transform:scale(1)}
      }
      @keyframes s2MeetPop{
        0%  {opacity:0;transform:scale(0)}
        40% {opacity:1}
        65% {transform:scale(1.1)}
        85% {transform:scale(0.95)}
        100%{opacity:1;transform:scale(1)}
      }


      .stripes{
        position:relative;width:100%;height:80px;overflow:hidden;
        background:linear-gradient(90deg,#5B36C8 0%, #3D24D3 40%, #2352DE 75%, #18498B 100%);
      }
      .stripes::before{
        content:"";position:absolute;inset:0;
        background:repeating-linear-gradient(90deg,
          rgba(0,0,0,0) 0,
          rgba(0,0,0,0) 12px,
          rgba(0,0,0,.32) 14px,
          rgba(0,0,0,.32) 18px,
          rgba(255,255,255,.18) 19px,
          rgba(255,255,255,.18) 20px,
          rgba(0,0,0,0) 22px,
          rgba(0,0,0,0) 28px
        );
      }


      .s3{position:relative;background:var(--paper);overflow:hidden}
      .s3-grid-lines{
        position:absolute;left:50%;top:0;transform:translateX(-50%);
        width:1064px;height:100%;display:flex;justify-content:space-between;pointer-events:none;
      }
      .s3-grid-lines i{width:1px;background:repeating-linear-gradient(180deg, rgba(14,10,7,.12) 0 4px, transparent 4px 8px);height:100%}
      .s3-inner{max-width:1500px;margin:0 auto;padding:clamp(96px,16.8vh,176px) clamp(20px,3vw,40px) 0;position:relative}
      .s3-head{text-align:center;max-width:626px;margin:0 auto clamp(12px,1.8vh,20px);position:relative}
      .s3-head .eyebrow{justify-content:center;margin-bottom:clamp(10px,2.3vh,24px)}
      .s3-head h2{
        font-size:clamp(36px,3.8vw,56px);letter-spacing:-0.06em;line-height:1;font-weight:500;margin:0 0 clamp(8px,1.5vh,16px);color:var(--ink);text-wrap:pretty;
      }
      .s3-head h2 .it{font-family:inherit;font-style:normal;font-weight:600;letter-spacing:inherit;color:#18498B}
      .s3-head p{font-size:clamp(12px,0.95vw,14px);line-height:1.35;letter-spacing:-0.02em;color:rgba(14,10,7,.65);margin:0 auto;max-width:448px}


      .s3 .s3-head h2{opacity:0;filter:blur(18px);transform:scale(0.96)}
      .s3 .s3-head p .sub-line{display:block;opacity:0;transform:translateY(18px);will-change:transform,opacity}
      .s3-in .s3-head h2{opacity:1 !important;filter:none !important;transform:none !important;animation:none !important}
      .s3 .s3-head h2 .ch{
        opacity:0;display:inline-block;transform:translateY(.9em) rotateX(-70deg) scale(.9);
        filter:blur(14px);transform-origin:center bottom;will-change:transform,opacity,filter;
      }
      .s3 .s3-head h2 .ch.sp{width:.28em}
      .s3-in .s3-head h2 .ch{
        animation:introLetterUp .45s cubic-bezier(.22,.61,.36,1) both;
        animation-delay:calc(.05s + var(--i, 0) * 19ms);
      }
      .s3-in .s3-head p .sub-line.in{animation:introSubLine .35s cubic-bezier(.22,.61,.36,1) forwards}
      .s3-head .corner{
        position:absolute;top:90px;font-size:10px;letter-spacing:.1em;font-weight:700;color:rgba(14,10,7,.2);
      }
      .s3-head .corner.l{left:-180px;text-align:left}
      .s3-head .corner.r{right:-180px;text-align:left}


      .s3 .s3-head .corner.l .ch{
        display:inline-block;opacity:0;transform:translateX(10px);
      }
      .s3 .s3-head .corner.l .ch.sp{width:.3em}
      .s3-in .s3-head .corner.l .ch{
        animation:cornerLetterIn .35s cubic-bezier(.22,.61,.36,1) both;
        animation-delay:calc(var(--i, 0) * 120ms);
      }
      .s3 .s3-head .corner.r .ch{
        display:inline-block;opacity:0;transform:translateX(-10px);
      }
      .s3 .s3-head .corner.r .ch.sp{width:.3em}
      .s3-in .s3-head .corner.r .ch{
        animation:cornerLetterInL .35s cubic-bezier(.22,.61,.36,1) both;
        animation-delay:calc(var(--i, 0) * 120ms);
      }
      @keyframes cornerLetterIn{
        from{opacity:0;transform:translateX(10px)}
        to{opacity:1;transform:translateX(0)}
      }
      @keyframes cornerLetterInL{
        from{opacity:0;transform:translateX(-10px)}
        to{opacity:1;transform:translateX(0)}
      }


      .card3{
        opacity:0;
        transform:translateY(60px);
        will-change:transform,opacity;
      }
      @keyframes s3CardUp{
        0%  {opacity:0;transform:translateY(60px)}
        100%{opacity:1;transform:translateY(0)}
      }
      .s3-cards-in .card3.a{animation:s3CardUp .8s cubic-bezier(.22,.61,.36,1) 0s forwards}
      .s3-cards-in .card3.b{animation:s3CardUp .8s cubic-bezier(.22,.61,.36,1) .25s forwards}
      @keyframes s3CardUpPop{
        0%  {opacity:0;transform:translateY(60px) scale(.95)}
        70% {opacity:1;transform:translateY(0) scale(1.1)}
        100%{opacity:1;transform:translateY(0) scale(1)}
      }
      .s3-cards-in .card3.c{animation:s3CardUpPop 1s cubic-bezier(.22,.61,.36,1) .5s forwards}


      .s3 .card3.a .conn{
        opacity:0;transform:scale(0);border-radius:50%;
        will-change:transform,opacity,border-radius;
      }

      .s3 .card3.a .stamp,
      .s3 .card3.b .stamp{
        opacity:0;transform:translateY(20px);
        will-change:transform,opacity;
      }

      .s3 #insightCard{
        opacity:0;transform:scale(0);border-radius:50%;
        will-change:transform,opacity,border-radius;
      }

      .s3 .card3.b .saving{
        opacity:0;transform:translateY(20px);
        will-change:transform,opacity;
      }
      @keyframes s3CircleReveal{
        0%  {opacity:0;transform:scale(0);border-radius:50%}
        40% {opacity:1}
        75% {opacity:1;transform:scale(1.1);border-radius:24px}
        100%{opacity:1;transform:scale(1);border-radius:24px}
      }
      @keyframes s3ConnReveal{
        0%  {opacity:0;transform:scale(0);border-radius:50%}
        40% {opacity:1}
        65% {opacity:1;transform:scale(1.1);border-radius:24px}
        85% {opacity:1;transform:scale(0.9);border-radius:24px}
        100%{opacity:1;transform:scale(1);border-radius:24px}
      }
      @keyframes s3StampUp{
        0%  {opacity:0;transform:translateY(20px)}
        100%{opacity:1;transform:translateY(0)}
      }
      @keyframes s3SavingUp{
        0%  {opacity:0;transform:translateY(20px)}
        100%{opacity:1;transform:translateY(0)}
      }
      .conn.s3-reveal{animation:s3ConnReveal .8s cubic-bezier(.22,.61,.36,1) forwards}
      .stamp.s3-reveal{animation:s3StampUp .5s cubic-bezier(.22,.61,.36,1) forwards}
      #insightCard.s3-reveal{animation:s3ConnReveal .85s cubic-bezier(.22,.61,.36,1) forwards}
      .saving.s3-reveal{animation:s3SavingUp .5s cubic-bezier(.22,.61,.36,1) forwards}


      .s3 .card3.c .runway{
        opacity:0;transform:scale(0);border-radius:50%;
        transform-origin:center center;
        will-change:transform,opacity,border-radius;
      }
      .s3 .card3.c .runway.s3-reveal{animation:s3ConnReveal .85s cubic-bezier(.22,.61,.36,1) forwards}

      .s3 .card3.c .stamp{
        opacity:0;transform:translateY(20px);
        will-change:transform,opacity;
      }

      .s3 .chart .badge{opacity:0;transform:translateX(-50%)}
      .s3 .chart-dot{
        position:absolute;
        width:10px;height:10px;
        border-radius:50%;
        background:#fff;
        box-shadow:0 0 6px rgba(255,255,255,.5);
        opacity:0;
        z-index:2;
        transform:translate(-50%,-50%);
        pointer-events:none;
      }

      .cards3{
        display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:clamp(10px,1.5vh,16px);
        zoom:1;
      }
      .card3{
        position:relative;height:552px;border-radius:16px;overflow:hidden;color:#fff;
        display:flex;flex-direction:column;justify-content:flex-start;
        padding:134px 74px 0;
      }
      .card3.b,.card3.c{padding-top:59px}
      .card3 .stamp{
        position:absolute;left:0;right:0;bottom:24px;text-align:center;
        font-size:10px;letter-spacing:.1em;font-weight:700;color:rgba(255,255,255,.75);
      }
      .card3.a{background:url('/assets/card-a-bg.png') center/cover}
      .card3.b{background:url('/assets/card-b-bg.png') center/cover}
      .card3.c{background:url('/assets/card-c-bg.png') center/cover}


      .conn-list{display:flex;flex-direction:column;gap:10px}
      .conn{
        border-radius:24px;background:rgba(97,147,221,0.2);
        height:88px;padding:10px 20px 10px 10px;
        display:flex;align-items:center;gap:16px;
        position:relative;
        isolation:isolate;
      }
      .conn .badge{
        width:68px;height:68px;border-radius:16px;flex-shrink:0;
        display:grid;place-items:center;overflow:hidden;
      }
      .conn .badge.ios{background:#2563eb;color:#fff;font-weight:700;font-size:18px;letter-spacing:-0.03em}
      .conn .badge.cli{background:#0f172a;color:#fff;font-weight:700;font-size:18px;letter-spacing:-0.03em}
      .conn .badge.codex{background:#fff}
      .conn .badge.codex svg{width:36px;height:36px;color:#0E0A07}
      .conn .badge.mic{background:#2563eb;color:#fff}
      .conn .badge.mic svg{width:30px;height:30px}
      .conn .badge.repo{background:#0f172a;color:#fff}
      .conn .badge.repo svg{width:30px;height:30px}
      .conn .badge.logo{background:#fff;padding:14px}
      .conn .badge.logo img{width:100%;height:100%;object-fit:contain;display:block}
      .conn .wave{display:flex;align-items:flex-end;gap:3px;height:30px;flex-shrink:0}
      .conn .wave i{
        width:3px;border-radius:3px;background:rgba(255,255,255,.92);
        height:35%;transform-origin:bottom;animation:connWave 1.1s ease-in-out infinite;
      }
      .conn .wave i:nth-child(1){animation-delay:0s}
      .conn .wave i:nth-child(2){animation-delay:.18s}
      .conn .wave i:nth-child(3){animation-delay:.36s}
      .conn .wave i:nth-child(4){animation-delay:.12s}
      .conn .wave i:nth-child(5){animation-delay:.3s}
      @keyframes connWave{
        0%,100%{transform:scaleY(.35)}
        50%{transform:scaleY(1)}
      }
      .conn .meta{flex:1;min-width:0}
      .conn .kicker{font-size:13px;letter-spacing:-0.02em;color:rgba(255,255,255,.85);margin-bottom:4px;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
      .conn .name{font-size:20px;letter-spacing:-0.04em;font-weight:500;line-height:1.1;color:#fff;white-space:nowrap}
      .conn .live-pill{font-size:11px;letter-spacing:.1em;font-weight:700;padding:6px 8px;border-radius:100px;background:rgb(35,82,222);color:rgba(254,254,254,.95);white-space:nowrap;flex-shrink:0}


      .insight-card{
        border-radius:24px;background:rgba(97,147,221,.2);
        padding:12px;display:flex;flex-direction:column;gap:12px;
        flex:0 0 378px;
        position:relative;
        isolation:isolate;
      }

      .bb-wrap{
        pointer-events:none;
        position:absolute;inset:0;
        border-radius:inherit;
        padding:var(--bb-ring, 2px);
        box-sizing:border-box;
        -webkit-mask:
          linear-gradient(#000 0 0) content-box,
          linear-gradient(#000 0 0);
                mask:
          linear-gradient(#000 0 0) content-box,
          linear-gradient(#000 0 0);
        -webkit-mask-composite:xor;
                mask-composite:exclude;
        z-index:0;
      }
      .bb-beam{
        position:absolute;
        aspect-ratio:1;
        width:var(--bb-size, 140px);
        background:radial-gradient(circle at center,
          rgba(255,255,255,1)  0%,
          rgba(255,255,255,.7) 6%,
          rgba(255,255,255,.3) 18%,
          rgba(255,255,255,.1) 32%,
          rgba(255,255,255,0)  50%);
        filter:blur(0.6px);
        offset-path:rect(0 auto auto 0 round var(--bb-radius, 24px));
        offset-distance:0%;
        offset-rotate:0deg;
        animation:bb-travel 6s linear infinite;
      }
      .bb-beam-2{animation-delay:-3s}


      .conn .bb-beam{opacity:.5}
      .conn-list .conn:nth-child(1) .bb-beam-1{animation-delay:-0.5s}
      .conn-list .conn:nth-child(1) .bb-beam-2{animation-delay:-3.5s}
      .conn-list .conn:nth-child(2) .bb-beam-1{animation-delay:-2.5s}
      .conn-list .conn:nth-child(2) .bb-beam-2{animation-delay:-5.5s}
      .conn-list .conn:nth-child(3) .bb-beam-1{animation-delay:-4.5s}
      .conn-list .conn:nth-child(3) .bb-beam-2{animation-delay:-1.5s}
      :where(.insight-card, .conn, .runway, .nav, .nav .cta, .hero .ctas .btn, .hero .pill) > *:not(.bb-wrap){position:relative;z-index:1}


      .nav            { --bb-radius: 12px;  --bb-size: 100px; --bb-ring: 1px; isolation:isolate; }
      .nav .cta       { --bb-radius: 10px;  --bb-size: 60px;  --bb-ring: 1px; isolation:isolate; }
      .hero .ctas .btn{ --bb-radius: 14px;  --bb-size: 80px;  --bb-ring: 1px; isolation:isolate; position:relative; overflow:hidden; }
      .hero .pill     { --bb-radius: 100px; --bb-size: 80px;  --bb-ring: 1px; isolation:isolate; }
      .insight-card   { --bb-size: 300px; }
      .runway         { --bb-size: 300px; }
      .conn           { --bb-size: 200px; }
      @keyframes bb-travel{
        to{offset-distance:100%}
      }
      .insight-head{display:flex;align-items:center;gap:10px}
      .insight-head .ic{width:42px;height:42px;border-radius:10px;background:#fff;display:grid;place-items:center;color:#2352DE}
      .insight-head .ic svg{width:24px;height:24px}
      .insight-head .k{font-size:10px;letter-spacing:.1em;font-weight:700;color:rgba(255,255,255,.75)}
      .insight-head .t{font-size:17px;letter-spacing:-0.04em;font-weight:500;color:#fff;margin-top:4px}
      .insight-msg{font-size:24px;letter-spacing:-0.05em;line-height:1.1;font-weight:500;color:rgba(255,255,255,.95);text-wrap:pretty;padding:6px 4px 0}
      .anomaly{
        align-self:flex-start;display:inline-flex;align-items:center;gap:6px;
        padding:6px 14px 6px 6px;border-radius:100px;background:#E62A2A;color:#fff;
      }
      .anomaly i{width:22px;height:22px;border-radius:50%;background:#fff;color:#E62A2A;display:grid;place-items:center}
      .anomaly i svg{width:12px;height:12px}
      .anomaly span{font-size:14px;letter-spacing:-0.03em;font-weight:500}
      .saving{
        border-radius:24px;background:rgba(255,255,255,.2);
        padding:14px;
      }
      .saving .lbl{font-size:14px;color:rgba(255,255,255,.85);letter-spacing:-0.02em;font-weight:500}
      .saving .v{font-family:var(--font-mono);font-size:32px;letter-spacing:-0.06em;color:#fff;line-height:1;margin-top:6px}
      .saving .v em{font-family:var(--font-sans);font-style:normal;font-weight:500;color:#fff}
      .saving .cmd{
        font-family:var(--font-mono);font-size:14px;letter-spacing:-0.02em;color:#fff;
        background:rgba(8,15,40,.38);border-radius:12px;padding:12px 14px;
        white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
      }
      .saving .cmd .prompt{color:rgba(255,255,255,.5);margin-right:7px}
      .approve-row{display:flex;gap:8px;margin-top:10px}
      .appr{
        flex:1;border:none;border-radius:12px;padding:12px 0;
        font-family:var(--font-sans);font-size:15px;font-weight:600;letter-spacing:-0.02em;
        cursor:pointer;transition:transform .15s ease, background .15s ease;
      }
      .appr.ok{background:#fff;color:#1338b9}
      .appr.deny{background:rgba(255,255,255,.16);color:#fff}
      .appr:hover{transform:translateY(-1px)}
      .appr.ok:hover{background:rgba(255,255,255,.92)}
      .appr.deny:hover{background:rgba(255,255,255,.24)}


      .runway{
        border-radius:24px;background:rgba(97,147,221,.2);
        padding:12px;display:flex;flex-direction:column;gap:12px;
        flex:0 0 378px;
        position:relative;
        isolation:isolate;
      }
      .runway-head{display:flex;align-items:center;gap:10px}
      .runway-head .ic{width:42px;height:42px;border-radius:10px;background:#fff;display:grid;place-items:center}
      .runway-head .ic svg{width:24px;height:24px;color:#2352DE}
      .chart{position:relative;height:148px;margin:6px 0 0}
      .chart svg{width:100%;height:100%;display:block}
      .chart .badge{
        position:absolute;left:30%;top:0;background:#fff;color:rgba(14,10,7,.75);
        border-radius:32px;padding:6px 12px;font-size:9px;font-weight:700;letter-spacing:.06em;
        box-shadow:0 4px 12px rgba(0,0,0,.18);
        white-space:nowrap;
      }
      .chart .badge::after{
        display:none;
      }
      .chart .axis{display:flex;justify-content:space-between;font-size:10px;font-weight:700;letter-spacing:.1em;color:rgba(255,255,255,.75);margin-top:6px}
      .runway-foot{border-radius:24px;background:rgba(255,255,255,.2);padding:14px}
      .runway-foot .v{font-size:28px;letter-spacing:-0.05em;font-weight:500;color:#fff}
      .runway-foot .d{font-size:14px;letter-spacing:-0.02em;color:rgba(255,255,255,.85);margin-top:4px}
      .diff{
        background:rgba(8,15,40,.32);border-radius:16px;padding:12px;
        font-family:var(--font-mono);font-size:12.5px;line-height:1.95;
        height:152px;overflow:hidden;
      }
      .diff-file{
        display:flex;align-items:center;gap:8px;font-size:11px;letter-spacing:-0.01em;
        color:rgba(255,255,255,.78);margin-bottom:8px;
      }
      .diff-file .dot{width:8px;height:8px;border-radius:50%;background:#34d399;flex-shrink:0}
      .diff-file .diff-stat{margin-left:auto;display:flex;gap:8px;font-size:11px}
      .diff-file .diff-stat .plus{color:#6ee7b7;font-style:normal}
      .diff-file .diff-stat .minus{color:#fca5a5;font-style:normal}
      .dline{
        display:flex;gap:8px;border-radius:7px;padding:0 8px;
        white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
      }
      .dline > span{opacity:.55;width:8px;flex-shrink:0}
      .dline.add{background:rgba(52,211,153,.18);color:#bbf7d0}
      .dline.rm{background:rgba(248,113,113,.16);color:#fecaca}
      .dline.ctx{color:rgba(255,255,255,.62)}

      .s3 .card3.c .diff > *{opacity:0;transform:translateX(-8px);will-change:opacity,transform}
      @keyframes s3DiffIn{to{opacity:1;transform:translateX(0)}}
      .s3 .card3.c .runway.s3-reveal .diff > *{animation:s3DiffIn .45s cubic-bezier(.22,.61,.36,1) forwards}
      .s3 .card3.c .runway.s3-reveal .diff > *:nth-child(1){animation-delay:.15s}
      .s3 .card3.c .runway.s3-reveal .diff > *:nth-child(2){animation-delay:.3s}
      .s3 .card3.c .runway.s3-reveal .diff > *:nth-child(3){animation-delay:.45s}
      .s3 .card3.c .runway.s3-reveal .diff > *:nth-child(4){animation-delay:.6s}
      .s3 .card3.c .runway.s3-reveal .diff > *:nth-child(5){animation-delay:.75s}


      .s4 .tile.openbase{ opacity:0; transform: scale(0) translateY(30px); }
      .s4 .openbase-label .n,
      .s4 .openbase-label .k{ opacity:0; transform: translateY(20px); }


      .s4 .s4-bottom .eyebrow{opacity:0;transform:translateY(20px);will-change:opacity,transform}
      .s4 .sync-stamp{opacity:0;transform:translateX(-50%) translateY(20px);will-change:opacity,transform}
      .s4 .s4-bottom h2 .ch{
        opacity:0;display:inline-block;transform:translateY(.9em) rotateX(-70deg) scale(.9);
        filter:blur(14px);transform-origin:center bottom;will-change:transform,opacity,filter;
      }
      .s4 .s4-bottom h2 .ch.sp{width:.28em}
      .s4 .int-pill{opacity:0;transform:scale(0);will-change:opacity,transform}
      .s4 .filter-list{opacity:0;transform:translateX(120%);will-change:opacity,transform}
      @keyframes s4PillPop{
        0%  {opacity:0;transform:scale(0)}
        40% {opacity:1}
        70% {transform:scale(1.1)}
        100%{opacity:1;transform:scale(1)}
      }


      .s4{position:relative;background:var(--paper);overflow:visible;min-height:100vh}
      .s4-inner{max-width:1440px;margin:0 auto;padding:clamp(90px,13vh,140px) clamp(24px,3vw,40px) clamp(36px,5.5vh,80px);position:relative;height:100%;min-height:min(980px,calc(100vh - 10px))}
      .s4-grid-lines{
        position:absolute;left:50%;top:0;transform:translateX(-50%);
        width:1064px;height:100%;display:flex;justify-content:space-between;pointer-events:none;
      }
      .s4-grid-lines i{width:1px;background:repeating-linear-gradient(180deg, rgba(14,10,7,.08) 0 4px, transparent 4px 8px);height:100%}
      .s4-horiz{
        position:absolute;left:0;right:0;top:50%;height:1px;
        background:repeating-linear-gradient(90deg, rgba(14,10,7,.12) 0 6px, transparent 6px 10px);
      }
      .orbit{
        position:relative;
        width:min(760px, 76vw, calc(100vh - 180px));
        aspect-ratio:1/1;height:auto;margin:clamp(-72px,-5vh,-34px) auto 0;
        --tile-w: clamp(60px, min(9vw, calc((100vh - 180px) * 0.14), 96px), 96px);
        --tile-h: clamp(72px, min(10vw,  calc((100vh - 180px) * 0.165), 112px), 112px);
        --openbase: clamp(70px, min(10vw, calc((100vh - 180px) * 0.16), 118px), 118px);
      }
      .orbit-ring{
        position:absolute;inset:0;
        transform-origin:50% 50%;
      }
      .tile{
        width:var(--tile-w);height:var(--tile-h);
        border-radius:calc(var(--tile-w) * 0.31);
        display:grid;place-items:center;color:#fff;font-weight:700;letter-spacing:-0.04em;
        font-size:calc(var(--tile-w) * 0.18);
        box-shadow:0 18px 38px rgba(0,0,0,.10), inset 0 -10px 30px rgba(0,0,0,.08);
        border:1px solid rgba(14,10,7,.13);
      }
      .orbit-ring .tile{
        position:absolute;top:50%;left:50%;
        margin:calc(var(--tile-h) / -2) 0 0 calc(var(--tile-w) / -2);
        --rot:0deg;
        transform-origin:50% 50%;
        will-change:transform;
      }

      .orbit-ring .tile > *{
        display:inline-flex;align-items:center;justify-content:center;
        transform:rotate(calc(var(--rot) * -1));
        transform-origin:50% 50%;
      }
      .tile.empty{
        background:#fff;border:1px solid rgba(14,10,7,.08);
        box-shadow:0 6px 14px rgba(14,10,7,.04);
        color:#0f172a;
      }
      .tile.logo{
        background:#fff;border:1px solid rgba(14,10,7,.08);
        box-shadow:0 14px 30px rgba(14,10,7,.08), 0 3px 8px rgba(14,10,7,.05), inset 0 -8px 22px rgba(14,10,7,.03);
      }
      .tile.logo.dark{
        border:1px solid rgba(255,255,255,.08);
        box-shadow:0 18px 38px rgba(0,0,0,.22), inset 0 -10px 30px rgba(0,0,0,.18);
      }
      .orbit-ring .tile.logo img{
        width:calc(var(--tile-w) * 0.46);height:auto;display:block;pointer-events:none;
      }
      .tile.logo.more span{
        font-size:calc(var(--tile-w) * 0.17);font-weight:600;letter-spacing:-0.04em;color:#0f172a;
      }
      .tile.openbase{
        position:absolute;top:50%;left:50%;
        width:var(--openbase);height:var(--openbase);
        margin:calc(var(--openbase) / -2) 0 0 calc(var(--openbase) / -2);
        border-radius:clamp(20px,3.4vw,32px);
        padding:clamp(24px, calc(var(--openbase) * 0.24), 38px) clamp(22px, calc(var(--openbase) * 0.23), 36px);box-sizing:border-box;
        gap:10px;flex-direction:column;
        background:linear-gradient(145deg, #0f172a 0%, #172554 52%, #0e7490 100%);
        box-shadow:inset 0 0 13.3px rgba(255,255,255,.6), 0 24px 44px rgba(8,23,79,.20);
        border:1px solid rgba(14,10,7,.04);
        display:flex;align-items:center;justify-content:center;color:#fff;
        z-index:3;
      }

      .orbit-ring .tile svg{
        width:calc(var(--tile-w) * 0.33);
        height:auto;
        max-width:100%;
      }
      .tile.openbase img{width:min(74px, calc(var(--openbase) * 0.54));height:auto}
      .openbase-label{
        position:absolute;left:50%;top:50%;
        transform:translate(-50%, calc(var(--openbase)/2 + 14px));
        text-align:center;color:var(--ink);
        z-index:3;pointer-events:none;opacity:0;
      }
      .openbase-label .n{font-size:clamp(18px,1.7vw,24px);letter-spacing:-0.05em;font-weight:500}
      .openbase-label .k{font-size:clamp(8px,0.62vw,9px);letter-spacing:.09em;font-weight:700;color:rgba(14,10,7,.4);margin-top:clamp(3px,0.45vw,6px);white-space:nowrap}


      .orbit-ring .g1{ --rot: -45.659deg }
      .orbit-ring .g2{ --rot: -0.991deg }
      .orbit-ring .g3{ --rot: 43.025deg }
      .orbit-ring .g4{ --rot: 90.926deg }
      .orbit-ring .g6{ --rot: 134.422deg }
      .orbit-ring .g7{ --rot: -137.702deg }
      .orbit-ring .g8{ --rot: -0.991deg }
      .orbit-ring .g9{ --rot: 87.815deg }

      .s4-bottom{
        position:absolute;left:clamp(24px,3vw,40px);bottom:clamp(56px,8vh,96px);max-width:560px;
      }
      .s4-bottom .eyebrow{margin-bottom:clamp(14px,1.8vw,24px)}
      .s4-bottom h2{
        font-size:clamp(42px,4vw,66px);letter-spacing:-0.05em;line-height:1;font-weight:500;margin:0;color:var(--ink);text-wrap:pretty;
      }
      .s4-bottom h2 .it{font-family:inherit;font-style:normal;font-weight:600;letter-spacing:inherit;color:#18498B}

      .filter-list{
        position:absolute;right:clamp(6px,1vw,10px);top:clamp(120px,18vh,220px);width:clamp(140px,13vw,180px);height:clamp(200px,28vh,280px);
        padding:0;overflow:hidden;pointer-events:auto;
        cursor:pointer;
        mask-image:linear-gradient(180deg, transparent 0%, rgba(0,0,0,.05) 8%, #000 25%, #000 75%, rgba(0,0,0,.05) 92%, transparent 100%);
        -webkit-mask-image:linear-gradient(180deg, transparent 0%, rgba(0,0,0,.05) 8%, #000 25%, #000 75%, rgba(0,0,0,.05) 92%, transparent 100%);
      }
      .filter-list button{
        position:absolute;right:0;top:0;
        padding:clamp(6px,0.7vw,10px) clamp(12px,1.2vw,18px);border-radius:clamp(8px,0.85vw,12px);background:rgba(14,10,7,.03);border:1px solid rgba(14,10,7,.06);
        font-size:clamp(12px,1.05vw,15px);letter-spacing:-0.025em;font-weight:500;
        white-space:nowrap;
        transform-origin:right center;
        will-change:transform,opacity,color,background;
      }
      .filter-list button.active{background:#fff;color:rgb(14,10,7);box-shadow:0 6px 18px rgba(14,10,7,.08);border-color:rgba(14,10,7,.12)}

      .int-pill{
        position:absolute;right:clamp(24px,3vw,40px);bottom:clamp(28px,5vh,60px);
        background:rgba(14,10,7,.04);backdrop-filter:blur(3px);
        border-radius:100px;padding:clamp(3px,0.3vw,4px) clamp(10px,1.1vw,16px) clamp(3px,0.3vw,4px) clamp(3px,0.3vw,4px);height:clamp(40px,3.5vw,50px);
        display:flex;align-items:center;gap:clamp(6px,0.7vw,10px);
      }
      .int-pill .av{display:flex;gap:clamp(3px,0.3vw,4px)}
      .int-pill .av i{width:clamp(32px,2.9vw,42px);height:clamp(32px,2.9vw,42px);border-radius:50%;background:#fff;display:grid;place-items:center;color:var(--ink)}
      .int-pill .av i svg{width:clamp(14px,1.2vw,18px);height:clamp(14px,1.2vw,18px)}
      .int-pill .meta .t{font-size:clamp(12px,1.05vw,15px);letter-spacing:-0.03em;color:var(--ink);font-weight:500;line-height:1}
      .int-pill .meta .s{font-size:clamp(7px,0.65vw,9px);letter-spacing:.1em;font-weight:700;color:rgba(14,10,7,.4);margin-top:clamp(3px,0.4vw,6px)}

      .sync-stamp{
        position:absolute;left:50%;bottom:clamp(14px,2.5vh,30px);transform:translateX(-50%);
        font-size:clamp(8px,0.7vw,10px);letter-spacing:.1em;font-weight:700;color:rgba(14,10,7,.35);
      }


      /* Anchors reused as buttons must not underline and should center like buttons. */
      .nav a.cta{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
      .hero .ctas a.btn{text-decoration:none}
      .s2 a.meet{text-decoration:none}

      /* Site footer — ordinary document content after the full-screen product sections. */
      .site-footer{
        position:relative;overflow:hidden;color:#fff;
        padding:clamp(72px,9vh,110px) clamp(24px,5vw,64px) clamp(28px,4vh,40px);
        background:
          linear-gradient(115deg, #072049, #041737 48%, #1e4d99),
          linear-gradient(180deg, rgba(51,114,217,.10), transparent 46%);
        border-top:1px solid rgba(51,114,217,.22);
      }
      .footer-grid{
        position:absolute;inset:-18%;pointer-events:none;z-index:0;
        background-image:
          linear-gradient(to right,  rgba(51,114,217,.26) 1px, transparent 1px),
          linear-gradient(to bottom, rgba(51,114,217,.26) 1px, transparent 1px);
        background-size:42px 42px;
        opacity:.6;
        transform:perspective(1000px) rotateX(68deg) translateY(-6%);
        transform-origin:center top;
        -webkit-mask-image:radial-gradient(circle at 50% 42%, #000 35%, transparent 80%);
        mask-image:radial-gradient(circle at 50% 42%, #000 35%, transparent 80%);
        animation:footer-grid-drift 18s linear infinite;
      }
      @keyframes footer-grid-drift{
        from{transform:perspective(1000px) rotateX(68deg) translate3d(0,-6%,0)}
        to{transform:perspective(1000px) rotateX(68deg) translate3d(-44px,10%,0)}
      }
      @media (prefers-reduced-motion: reduce){
        html,body{scroll-behavior:auto}
        .footer-grid{animation:none}
      }
      .footer-inner{position:relative;z-index:1;width:100%;max-width:1264px;margin:0 auto}
      .footer-top{
        display:flex;flex-wrap:wrap;gap:32px;align-items:flex-end;justify-content:space-between;
        padding-bottom:clamp(40px,6vh,64px);border-bottom:1px solid rgba(255,255,255,.12);
      }
      .footer-top h3{
        font-size:clamp(28px,3.2vw,46px);letter-spacing:-0.05em;font-weight:500;line-height:1.05;margin:0;max-width:560px;
      }
      .footer-top h3 .it{font-family:inherit;font-style:normal;font-weight:600;letter-spacing:inherit;color:#b7e9ff}
      .footer-cta{
        display:inline-flex;align-items:center;gap:8px;flex-shrink:0;
        height:44px;padding:0 20px;border-radius:12px;text-decoration:none;
        background:#2352DE;color:#fff;font-size:15px;font-weight:500;letter-spacing:-0.02em;
        border:1px solid rgba(255,255,255,.22);
        box-shadow:inset 0 0 14px 2px rgba(255,255,255,.14),0 8px 22px rgba(8,23,79,.45);
        transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
      }
      .footer-cta:hover{transform:translateY(-1px);background:#2b5bea;box-shadow:inset 0 0 14px 2px rgba(255,255,255,.18),0 12px 28px rgba(8,23,79,.55)}
      .footer-cta svg{width:18px;height:18px}
      .footer-columns{
        display:grid;grid-template-columns:repeat(3,minmax(120px,1fr));gap:40px;
        padding:clamp(40px,6vh,64px) 0;
      }
      .footer-col h6{font-size:10px;letter-spacing:.1em;font-weight:700;color:rgba(255,255,255,.45);margin:0 0 14px;text-transform:uppercase}
      .footer-col a{display:block;padding:6px 0;color:rgba(255,255,255,.8);font-size:14px;letter-spacing:-0.02em;text-decoration:none;transition:color .15s ease}
      .footer-col a:hover{color:#fff}
      .footer-bottom{
        padding-top:24px;border-top:1px solid rgba(255,255,255,.1);
        display:flex;justify-content:space-between;align-items:center;gap:20px;
        font-size:12px;color:rgba(255,255,255,.5);letter-spacing:-0.01em;
      }
      .footer-mark{height:22px;width:auto;opacity:.7}
      @media (max-width:720px){
        .footer-columns{grid-template-columns:repeat(2,1fr);gap:28px}
        .footer-bottom{flex-direction:column;align-items:flex-start;gap:14px}
      }


      #nav{opacity:0}
      .curtain__hero-logo{
        position:absolute;top:28px;left:50%;transform:translateX(-50%);
        z-index:10;display:flex;align-items:center;gap:8px;
        background:rgba(14,10,7,.55);border-radius:12px;
        padding:10px 18px;
        opacity:0;pointer-events:none;
      }
      .curtain__hero-logo svg{height:21px;width:auto;color:#fff}
      .curtain__hero-logo img{height:24px;width:auto}
      .hero .pill{opacity:0}
      .hero h1{opacity:0;filter:blur(18px);transform:scale(0.96)}
      .hero p.sub{opacity:1}
      .hero p.sub .sub-line{display:block;opacity:0;transform:translateY(18px);will-change:transform,opacity}
      .hero p.sub .sub-line.in{animation:introSubLine .25s cubic-bezier(.22,.61,.36,1) forwards}
      .hero .ctas{opacity:0;transform:translateY(12px)}
      .nav .links{overflow:hidden;padding:2px 0}
      .nav .links a{opacity:0;transform:translateY(14px);display:inline-block}
      .nav .right .signin{opacity:0;transform:translateX(24px)}
      .nav .right .cta{opacity:0;transform-origin:center center}
      .nav .brand{opacity:0}


      .intro-logo-in{animation:introLogoIn .48s cubic-bezier(.25,.8,.25,1) forwards}
      .intro-logo-out{animation:introLogoOut .32s ease-in forwards}
      .intro-nav-in{animation:introNavIn .55s cubic-bezier(.4,0,.2,1) forwards}
      .intro-brand-in{animation:introBrandUp .38s cubic-bezier(.4,0,.2,1) forwards}

      .intro-link-in{animation:introLinkUp .32s cubic-bezier(.4,0,.2,1) forwards}

      .intro-signin-in{animation:introSignIn .38s cubic-bezier(.4,0,.2,1) forwards}

      .intro-cta-expand{animation:introCtaExpand .7s cubic-bezier(.4,0,.2,1) forwards}
      .intro-pill-in{animation:introBounceIn .55s cubic-bezier(.22,.61,.36,1) forwards}

      .hero h1 .ch{
        display:inline-block;
        opacity:0;
        transform:translateY(.9em) rotateX(-70deg) scale(.9);
        transform-origin:50% 100%;
        filter:blur(14px);
        will-change:transform,opacity,filter;
      }
      .hero h1 .ch.sp{width:.28em}
      .intro-h1-in{opacity:1 !important;filter:none !important;transform:none !important;animation:none !important}
      .intro-h1-in .ch{
        animation:introLetterUp .3s cubic-bezier(.22,.61,.36,1) both;
        animation-delay:calc(var(--i, 0) * 11ms);
      }
      @keyframes introLetterUp{
        0%  {opacity:0;filter:blur(14px);transform:translateY(.9em) rotateX(-70deg) scale(.9)}
        55% {opacity:1;filter:blur(3px);transform:translateY(.08em) rotateX(-8deg) scale(1)}
        100%{opacity:1;filter:blur(0);transform:translateY(0) rotateX(0) scale(1)}
      }
      @keyframes introSubLine{
        0%  {opacity:0;transform:translateY(18px)}
        100%{opacity:1;transform:translateY(0)}
      }
      .intro-btns-in{opacity:1 !important;transform:none !important}
      .intro-btns-in .btn.primary{
        animation:introBtnPop .35s cubic-bezier(.22,.61,.36,1) forwards;
      }
      .intro-btns-in .btn.ghost{
        animation:introBounceIn .55s cubic-bezier(.22,.61,.36,1) .08s forwards;
      }
      @keyframes introBounceIn{
        0%  {opacity:0;transform:scale(0)}
        40% {opacity:1}
        65% {transform:scale(1.1)}
        85% {transform:scale(0.95)}
        100%{opacity:1;transform:scale(1)}
      }
      @keyframes introBtnPop{
        0%  {transform:scale(0)}
        60% {transform:scale(1.2)}
        100%{transform:scale(1)}
      }
      @keyframes introLogoIn{
        0%{opacity:0;transform:translateX(-50%) scale(.75)}
        100%{opacity:1;transform:translateX(-50%) scale(1)}
      }
      @keyframes introLogoOut{
        0%{opacity:1;transform:translateX(-50%) scale(1)}
        100%{opacity:0;transform:translateX(-50%) scale(.92)}
      }
      @keyframes introNavIn{
        0%{opacity:0;clip-path:inset(0 47% 0 47% round 12px)}
        40%{opacity:1}
        100%{opacity:1;clip-path:inset(0 0% 0 0% round 12px)}
      }
      @keyframes introBrandUp{
        0%{opacity:0;transform:translateY(8px)}
        100%{opacity:1;transform:translateY(0)}
      }
      @keyframes introLinkUp{
        0%{opacity:0;transform:translateY(14px)}
        100%{opacity:1;transform:translateY(0)}
      }
      @keyframes introSignIn{
        0%{opacity:0;transform:translateX(24px)}
        100%{opacity:1;transform:translateX(0)}
      }
      @keyframes introCtaExpand{
        0%  {opacity:0;transform:scale(0.6)}
        30% {opacity:1;transform:scale(1.2)}
        65% {transform:scale(1.2)}
        80% {transform:scale(0.9)}
        90% {transform:scale(0.9)}
        100%{opacity:1;transform:scale(1)}
      }
      @keyframes introFadeUp{
        0%{opacity:0;transform:translateY(8px)}
        100%{opacity:1;transform:translateY(0)}
      }
      @keyframes introH1{
        0%  {opacity:0;filter:blur(28px);transform:scale(.96) translateX(-24px) skewX(-6deg);letter-spacing:.12em}
        25% {opacity:.45;filter:blur(18px);transform:scale(.975) translateX(-14px) skewX(-4deg);letter-spacing:.08em}
        55% {opacity:.85;filter:blur(8px);transform:scale(.99) translateX(-4px) skewX(-1.5deg);letter-spacing:.03em}
        80% {opacity:1;filter:blur(2px);transform:scale(1) translateX(0) skewX(0);letter-spacing:0}
        100%{opacity:1;filter:blur(0);transform:scale(1) translateX(0) skewX(0);letter-spacing:normal}
      }
      @keyframes introSub{
        0%  {opacity:0;filter:blur(22px);transform:translateY(8px) scale(.97) skewX(-5deg)}
        30% {opacity:.4;filter:blur(14px);transform:translateY(5px) scale(.98) skewX(-3deg)}
        65% {opacity:.85;filter:blur(5px);transform:translateY(2px) scale(.995) skewX(-1deg)}
        100%{opacity:1;filter:blur(0);transform:translateY(0) scale(1) skewX(0)}
      }
      #nav.intro-done{opacity:1}
      #nav.intro-done .brand{opacity:1}
      #nav.intro-done .links a{opacity:1;transform:none}
      #nav.intro-done .right .signin{opacity:1;transform:none}
      #nav.intro-done .right .cta{opacity:1;transform:none}


      .hero{padding-top:clamp(100px,13vh,160px)}
      .hero h1{font-size:clamp(42px,5.5vw,82px)}
      .hero p.sub{width:min(576px,88vw);max-width:min(576px,88vw)}


      .nav__burger{display:none}
      @media (min-width:901px){
        .nav__drawer{display:none!important}
      }


      @media (max-width:1200px){
        .s2-inner{padding:clamp(40px,6vh,80px) clamp(24px,4vw,48px) clamp(30px,4vh,60px)}
        .s4-inner{padding-top:clamp(80px,12vh,100px)}
        .orbit{width:min(700px,74vw,calc(100vh - 220px));margin-top:clamp(-56px,-4vh,-28px)}
        .s4-bottom{position:static;margin-top:12px}
        .s4-bottom .eyebrow{margin-bottom:10px}
        .s4-bottom h2{font-size:clamp(38px,4vw,48px)}
        .filter-list,.int-pill,.sync-stamp{display:none}
        .s3-head .corner{display:none}
      }


      @media (max-width: 1400px) { .cards3{ zoom: 0.92 } }
      @media (max-width: 1200px) { .cards3{ zoom: 0.82 } }
      @media (max-width: 1100px) { .cards3{ zoom: 0.76 } }


      @media (max-height: 800px) {
        .s3-inner{ padding-top: clamp(90px, 12.5vh, 100px) }
      }


      @media (max-height: 1000px) { .cards3{ zoom: 0.95 } }
      @media (max-height: 940px)  { .cards3{ zoom: 0.9 } }
      @media (max-height: 860px)  { .cards3{ zoom: 0.85 } }
      @media (max-height: 800px)  { .cards3{ zoom: 0.78 } }
      @media (max-height: 760px)  { .cards3{ zoom: 0.72 } }
      @media (max-height: 720px)  { .cards3{ zoom: 0.65 } }
      @media (max-height: 680px)  { .cards3{ zoom: 0.59 } }
      @media (max-height: 640px)  { .cards3{ zoom: 0.54 } }


      /* ===== Responsive: phones & small tablets (natural scroll mode) ===== */
      @media (max-width:900px){
        .nav{width:calc(100vw - 24px);max-width:none;height:52px;padding:0 8px 0 16px}
        /* .nav.glass sets position:relative (harmless on desktop where the body
           never scrolls, but in flow on mobile it pushes the curtain down and
           leaves a white strip) — keep the nav fixed in natural scroll mode */
        .nav.glass,
        .nav.dark{position:fixed;left:50%;transform:translateX(-50%)}
        .nav .links,
        .nav .right .signin{display:none}
        .nav__burger{
          display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
          width:38px;height:38px;border-radius:10px;
        }
        .nav__burger span{display:block;width:18px;height:2px;border-radius:2px;background:#fff;transition:background .4s ease}
        .nav.dark .nav__burger span{background:var(--ink)}

        .nav__drawer{
          position:fixed;inset:0;z-index:300;
          display:flex;flex-direction:column;justify-content:center;gap:14px;
          padding:0 36px;background:rgba(14,10,7,.97);color:#fff;
          transform:translateX(100%);transition:transform .32s cubic-bezier(.2,.7,.2,1);
        }
        .nav__drawer.open{transform:translateX(0)}
        .nav__drawer a{font-size:30px;letter-spacing:-0.04em;font-weight:500;color:#fff;padding:6px 0}
        .nav__drawer .drawer-close{
          position:absolute;top:22px;right:22px;width:40px;height:40px;
          font-size:20px;color:#fff;background:rgba(255,255,255,.08);border-radius:50%;
        }

        .curtain{height:100vh;height:100svh}
        .hero{padding-top:clamp(90px,14vh,130px);padding-left:16px;padding-right:16px}
        .hero h1{font-size:clamp(20px,6.9vw,42px)!important;letter-spacing:-0.045em!important;line-height:1.12!important}
        .hero h1 .line{white-space:nowrap}
        .hero h1 .line2{width:auto!important}
        .hero p.sub{margin-top:14px;width:min(440px,90vw);max-width:min(440px,90vw)}
        .hero .ctas{margin-top:18px;flex-wrap:wrap;padding:0 8px}
        .hero .ctas .btn{white-space:nowrap}
        .hero .ctas .btn.primary{width:auto}

        #sections .section{min-height:0;overflow:visible}

        /* consistent mobile section rhythm on an 8pt scale:
           72px top + 48px bottom = ~120px between section contents
           (sections size to content, no forced 100vh) */
        .s2{padding-top:0}
        .s2-inner{height:auto;min-height:0;padding:72px 20px 48px}
        .s2 .grid{grid-template-columns:1fr;gap:22px}
        .s2 .bottom{grid-template-columns:1fr;gap:32px;margin-top:18px}
        .s2 .bottom .left{grid-column:auto}
        .s2 .stats{justify-self:stretch;margin-right:0;width:100%;gap:12px}
        .s2 .stats .stat{
          flex:1 1 0;width:auto;height:auto;aspect-ratio:1;max-width:190px;
          border-radius:24px;padding:16px;
        }
        .s2 .stats .v{font-size:clamp(24px,8vw,34px)}
        .s2 .stats .l{font-size:clamp(9px,2.8vw,12px)}
        .s2 .ovals{top:90px}

        .s3-inner{padding:72px 16px 48px}
        .s3-head .corner{display:none}
        .cards3{grid-template-columns:1fr;zoom:1;gap:16px}
        .card3{height:auto;min-height:470px;padding:56px 22px 70px}
        .card3.b,.card3.c{padding-top:56px}
        .insight-card,.runway{flex:initial}

        #sections .section > .s4{min-height:0;height:auto}
        .s4-inner{min-height:0;padding:72px 16px 40px}
        .orbit{
          width:min(92vw,430px);
          --tile-w:clamp(48px,13.5vw,66px);
          --tile-h:clamp(56px,15.5vw,76px);
          --openbase:clamp(58px,15vw,78px);
        }
        .openbase-label{transform:translate(-50%, calc(var(--openbase)/2 + 6px))}
        .openbase-label .k{display:none}
        .orbit-ring .tile{font-size:calc(var(--tile-w) * 0.22)!important}
        .s4-bottom{position:static;margin-top:clamp(56px,14vw,84px);max-width:none}
        .filter-list,.int-pill,.sync-stamp{display:none}
      }

      /* ===== Hero: single iPhone product story ===== */
      .nav{width:clamp(720px,64vw,940px)}
      .nav .links{gap:clamp(24px,3.2vw,48px)}
      .nav .links a:hover,
      .nav .signin:hover{color:#fff}
      .nav.dark .links a:hover,
      .nav.dark .signin:hover{color:var(--ink)}
      .nav a:focus-visible,
      .nav__drawer a:focus-visible{outline:2px solid #8eb8ff;outline-offset:3px}

      .hero{inset:0;display:block;padding:0;text-align:left}
      .hero__copy{
        position:absolute;left:max(48px,calc((100vw - 1224px)/2));top:50%;
        width:min(610px,44vw);transform:translateY(-46%);
      }
      .hero .pill{
        margin:0;background:rgba(2,18,56,.2);
        box-shadow:inset 0 0 12px rgba(255,255,255,.2),0 8px 30px rgba(1,12,40,.1);
      }
      .hero h1{
        margin:22px 0 0!important;width:auto!important;
        font-size:clamp(46px,4.65vw,70px)!important;
        line-height:1.01!important;letter-spacing:-.057em!important;text-align:left!important;
        text-shadow:0 3px 20px rgba(0,9,35,.35);
      }
      .hero h1 .line{text-align:left}
      .hero h1 .line2{width:auto!important;font-weight:400;line-height:1.02;letter-spacing:-.035em}
      .hero p.sub{
        margin:24px 0 0;width:min(550px,42vw);max-width:550px;
        text-align:left;font-size:clamp(14px,1.15vw,17px);
        text-shadow:0 2px 14px rgba(0,9,35,.34);
      }
      .hero .ctas{justify-content:flex-start;margin-top:24px}

      .device-stage{
        --phone-w:min(390px,calc((100vh - 140px)/2.025));
        position:absolute;
        right:calc((100vw - max(48px,calc((100vw - 1224px)/2)) - min(610px,44vw) - var(--phone-w))/2);
        top:calc(50% + 40px);
        width:var(--phone-w);height:calc(var(--phone-w) * 2.025);
        transform:translateY(-50%);z-index:5;opacity:0;
        pointer-events:none;
      }
      .device-aura{
        position:absolute;inset:4% -12% -2% -24%;border-radius:48%;
        background:radial-gradient(circle at 58% 44%,rgba(149,219,255,.42),rgba(62,133,218,.13) 45%,transparent 72%);
        filter:blur(34px);opacity:.82;
      }

      .iphone{
        position:absolute;inset:0;z-index:2;opacity:0;
        transform:translate3d(34px,42px,0) scale(.94);
        transform-origin:60% 50%;
      }
      .iphone-frame{
        position:relative;width:100%;height:100%;padding:7px;
        border-radius:calc(var(--phone-w) * .153);
        background:
          linear-gradient(112deg,#4b535c 0%,#dce1e4 4%,#8b949d 8%,#20262d 15%,#090c10 48%,#303740 84%,#aeb6bd 92%,#eef1f2 96%,#5a626b 100%);
        box-shadow:
          0 44px 88px rgba(0,12,45,.42),0 16px 32px rgba(0,13,48,.24),
          inset 0 0 0 1px rgba(255,255,255,.72),inset 0 0 0 2px rgba(4,7,11,.9);
      }
      .iphone-frame::before{
        content:"";position:absolute;inset:3px;border-radius:calc(var(--phone-w) * .145);
        box-shadow:inset 0 0 0 1px rgba(255,255,255,.2);pointer-events:none;
      }
      .iphone-side{
        position:absolute;z-index:5;
        background:linear-gradient(180deg,#8d969e,#171c22 22%,#242a31 78%,#8b949c);
        box-shadow:inset 0 0 0 1px rgba(255,255,255,.2);
      }
      .iphone-side--mute{left:-3px;top:17%;width:4px;height:5.5%;border-radius:3px 0 0 3px}
      .iphone-side--volume-up{left:-3px;top:25%;width:4px;height:9%;border-radius:3px 0 0 3px}
      .iphone-side--volume-down{left:-3px;top:35.5%;width:4px;height:9%;border-radius:3px 0 0 3px}
      .iphone-side--power{right:-3px;top:27%;width:4px;height:15%;border-radius:0 3px 3px 0}

      .iphone-screen{
        position:relative;width:100%;height:100%;overflow:hidden;
        border-radius:calc(var(--phone-w) * .132);
        background:
          radial-gradient(90% 44% at 50% 0%,rgba(224,240,255,.9),transparent 72%),
          linear-gradient(180deg,#f9fbfd 0%,#f4f8fb 50%,#edf4f9 100%);
        color:#0d1723;font-family:-apple-system,BlinkMacSystemFont,"Geist",system-ui,sans-serif;
        font-size:calc(var(--phone-w) * .0325);
        box-shadow:inset 0 0 0 1px rgba(0,0,0,.24),inset 0 1px rgba(255,255,255,.9);
      }
      .ios-status{
        position:relative;height:6.3%;padding:0 7.5%;display:flex;align-items:center;justify-content:space-between;
        font-size:.86em;font-weight:650;z-index:4;
      }
      .dynamic-island{
        position:absolute;left:50%;top:15%;transform:translateX(-50%);
        width:30%;height:54%;border-radius:100px;background:#080b0f;
        box-shadow:inset 0 -1px rgba(255,255,255,.08);
      }
      .dynamic-island i{
        position:absolute;right:9%;top:50%;width:5px;height:5px;transform:translateY(-50%);
        border-radius:50%;background:#08182b;box-shadow:inset 0 0 2px #1f4e80;
      }
      .ios-signals{display:flex;align-items:center;gap:.28em}
      .ios-signals svg{width:1.18em;height:auto}
      .ios-battery{position:relative;width:1.45em;height:.72em;border:1px solid currentColor;border-radius:.22em}
      .ios-battery::after{
        content:"";position:absolute;right:-.2em;top:26%;width:.12em;height:48%;
        border-radius:0 .1em .1em 0;background:currentColor;
      }
      .ios-battery i{position:absolute;inset:1px 2px 1px 1px;border-radius:.1em;background:currentColor}

      .ios-navbar{
        height:7.6%;padding:0 5.8%;display:flex;align-items:center;justify-content:space-between;
        box-shadow:inset 0 -1px rgba(17,26,38,.055);
      }
      .ios-app-id{display:flex;align-items:center;gap:.72em}
      .ios-app-id img{width:2.65em;height:2.65em;border-radius:.74em;box-shadow:0 6px 14px rgba(25,59,107,.12)}
      .ios-app-id>div{display:flex;flex-direction:column;gap:.12em}
      .ios-app-id span{font-size:.58em;line-height:1;letter-spacing:.15em;font-weight:760;color:rgba(13,23,35,.38)}
      .ios-app-id strong{font-size:1.03em;letter-spacing:-.035em;font-weight:650}
      .ios-live-status{
        display:flex;align-items:center;gap:.52em;padding:.7em .9em;border-radius:99em;
        background:rgba(42,131,225,.07);color:#2877c8;font-size:.67em;font-weight:680;
      }
      .ios-live-status i{
        width:.62em;height:.62em;border-radius:50%;background:#4fd5ed;
        box-shadow:0 0 0 3px rgba(79,213,237,.14);
      }

      .ios-content{
        height:82.1%;padding:3.8% 6% 5.2%;display:flex;flex-direction:column;
      }
      .mac-connection{
        display:flex;align-items:center;gap:.72em;padding:.7em .2em 1.2em;
        border-bottom:1px solid rgba(19,41,67,.055);
      }
      .mac-connection-icon{
        width:2.2em;height:2.2em;border-radius:.68em;background:rgba(43,121,202,.075);
        color:#337fc8;display:grid;place-items:center;flex:0 0 auto;
      }
      .mac-connection-icon svg{
        width:1.22em;height:1.22em;stroke:currentColor;stroke-width:1.5;
        stroke-linecap:round;stroke-linejoin:round;
      }
      .mac-connection>span:nth-child(2){display:flex;flex-direction:column;gap:.14em}
      .mac-connection strong{font-size:.72em;letter-spacing:-.02em}
      .mac-connection small{font-size:.59em;color:rgba(13,23,35,.4)}
      .mac-connection>i{
        margin-left:auto;width:.58em;height:.58em;border-radius:50%;background:#43c9dc;
        box-shadow:0 0 0 4px rgba(67,201,220,.11);
      }

      .voice-session{display:flex;flex-direction:column;align-items:center;padding-top:7.5%}
      .voice-blob{
        position:relative;width:49%;aspect-ratio:.96;display:grid;place-items:center;
      }
      .voice-blob-glow{
        position:absolute;inset:-26%;border-radius:50%;
        background:radial-gradient(circle,rgba(83,224,245,.34) 0%,rgba(73,177,240,.15) 42%,transparent 72%);
        filter:blur(8px);
      }
      .voice-blob-core{
        position:relative;width:100%;height:100%;
        border-radius:46% 54% 58% 42% / 44% 48% 52% 56%;
        background:
          radial-gradient(circle at 30% 24%,rgba(190,255,247,.72),transparent 31%),
          linear-gradient(145deg,#83f0e9 0%,#56dbf2 44%,#5bc5ff 100%);
        box-shadow:
          0 22px 44px rgba(43,170,223,.24),0 0 34px rgba(78,225,241,.24),
          inset 0 2px 4px rgba(255,255,255,.6),inset 0 -12px 24px rgba(39,150,222,.1);
        animation:voiceBlobBreathe 4.8s cubic-bezier(.45,0,.25,1) infinite;
      }
      @keyframes voiceBlobBreathe{
        0%,100%{
          transform:scale(1) rotate(-.8deg);
          border-radius:46% 54% 58% 42% / 44% 48% 52% 56%;
        }
        50%{
          transform:scale(1.025) rotate(.8deg);
          border-radius:54% 46% 43% 57% / 50% 56% 44% 50%;
        }
      }
      @keyframes voiceBlobTalk{
        0%,100%{transform:scale(.98) rotate(-1.2deg);border-radius:46% 54% 58% 42% / 44% 48% 52% 56%}
        35%{transform:scale(1.045) rotate(.6deg);border-radius:53% 47% 45% 55% / 51% 56% 44% 49%}
        68%{transform:scale(1.012) rotate(1.1deg);border-radius:49% 51% 55% 45% / 47% 45% 55% 53%}
      }
      @keyframes voiceGlowTalk{
        0%,100%{transform:scale(.9);opacity:.5}
        50%{transform:scale(1.12);opacity:1}
      }
      .demo-speaking .voice-blob-core{animation:voiceBlobTalk 1.18s cubic-bezier(.45,0,.2,1) infinite}
      .demo-speaking .voice-blob-glow{animation:voiceGlowTalk 1.18s cubic-bezier(.45,0,.2,1) infinite}
      .demo-running .voice-blob-core{animation-duration:2.4s}
      .demo-complete .voice-blob-core{
        animation:none;transform:scale(1);
        box-shadow:0 22px 44px rgba(43,170,223,.2),0 0 38px rgba(85,231,214,.3),inset 0 2px 4px rgba(255,255,255,.65);
      }
      .voice-session h3{margin:5.2% 0 0;font-size:1.48em;font-weight:690;letter-spacing:-.05em}
      .voice-session>p{
        margin:1.5% 0 0;max-width:82%;text-align:center;
        font-size:.66em;line-height:1.4;color:rgba(13,23,35,.43);
      }

      .ios-command-card{
        margin-top:5.8%;padding:4% 4.4%;border-radius:1.2em;
        background:linear-gradient(145deg,rgba(255,255,255,.84),rgba(246,252,255,.64));
        box-shadow:0 12px 28px rgba(58,109,151,.055),inset 0 0 0 1px rgba(69,132,179,.075);
        transition:opacity .35s ease,transform .45s cubic-bezier(.2,.82,.2,1);
      }
      .command-card-head{display:flex;align-items:center;justify-content:space-between}
      .command-card-head span{
        display:flex;align-items:center;gap:.55em;font-size:.52em;font-weight:760;letter-spacing:.14em;color:#2684c5;
      }
      .command-card-head span i{width:.62em;height:.62em;border-radius:50%;background:#54dcea;box-shadow:0 0 0 3px rgba(84,220,234,.12)}
      .command-card-head time{font-family:var(--font-mono);font-size:.52em;color:rgba(13,23,35,.3)}
      .ios-command-card p{
        min-height:1.3em;margin:2.4% 0 0;font-family:var(--font-sans);
        font-size:.96em;line-height:1.32;letter-spacing:-.03em;font-weight:500;
      }
      .typing-caret{display:inline-block;width:1px;height:.88em;margin-left:.12em;vertical-align:-.05em;background:#39a9d4;opacity:0}
      .demo-speaking .typing-caret{animation:typingCaret .72s steps(1,end) infinite}
      @keyframes typingCaret{0%,48%{opacity:1}49%,100%{opacity:0}}

      .ios-assistant-message{
        display:flex;align-items:flex-start;gap:.75em;max-height:0;margin-top:0;overflow:hidden;
        opacity:0;transform:translateY(9px);
        transition:max-height .55s cubic-bezier(.2,.82,.2,1),margin .45s ease,opacity .38s ease,transform .5s cubic-bezier(.2,.82,.2,1);
      }
      .assistant-avatar{width:2.3em;height:2.3em;border-radius:.72em;overflow:hidden;flex:0 0 auto;box-shadow:0 6px 14px rgba(25,59,107,.12)}
      .assistant-avatar img{display:block;width:100%;height:100%;object-fit:cover}
      .assistant-copy{flex:1;padding:3.6% 4%;border-radius:1.05em;background:linear-gradient(145deg,rgba(245,255,255,.88),rgba(232,249,253,.7));box-shadow:inset 0 0 0 1px rgba(68,171,194,.09)}
      .assistant-copy>div{display:flex;align-items:center;justify-content:space-between}
      .assistant-copy strong{font-size:.65em;letter-spacing:-.015em}
      .assistant-copy time{font-size:.49em;color:rgba(13,23,35,.32)}
      .assistant-copy p{margin:2.5% 0 0;font-size:.64em;line-height:1.42;color:rgba(13,23,35,.66)}
      .assistant-copy p b{font-weight:720;color:#0d6e82}
      .demo-complete .ios-assistant-message,
      .demo-reduced .ios-assistant-message{max-height:9em;margin-top:3.5%;opacity:1;transform:none}

      .ios-demo-bottom{position:relative;min-height:20%;margin-top:auto}

      .ios-approval-sheet{
        position:absolute;left:0;right:0;bottom:0;padding:4.4%;border-radius:1.4em;
        overflow:hidden;background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(238,250,255,.9));
        box-shadow:0 18px 40px rgba(43,111,158,.12),inset 0 0 0 1px rgba(86,177,213,.12),inset 0 1px rgba(255,255,255,.92);
        transition:opacity .38s ease,transform .52s cubic-bezier(.2,.82,.2,1);
      }
      .approval-request-view{transition:opacity .25s ease,transform .35s ease}
      .approval-copy{display:flex;align-items:center;justify-content:space-between;gap:1em}
      .approval-copy span{font-size:.49em;font-weight:780;letter-spacing:.14em;color:#2789c8}
      .approval-copy strong{font-size:.83em;letter-spacing:-.025em}
      .ios-approval-sheet code{
        display:block;margin-top:2.8%;padding:.68em .8em;border-radius:.62em;
        background:rgba(225,239,246,.68);color:rgba(13,23,35,.5);
        font-family:var(--font-mono);font-size:.61em;
      }
      .approval-actions{display:grid;grid-template-columns:1fr 1.35fr;gap:.65em;margin-top:3.2%}
      .approval-actions>span{
        position:relative;height:2.8em;border-radius:.82em;
        font-size:.69em;font-weight:680;display:grid;place-items:center;overflow:hidden;
      }
      .approval-review{background:rgba(232,241,246,.72);color:#536574;box-shadow:inset 0 0 0 1px rgba(71,119,149,.06)}
      .approval-actions .approval-primary{
        color:#075374;background:linear-gradient(135deg,#d9fcff 0%,#8eeaff 46%,#a8dfff 100%);
        box-shadow:0 10px 24px rgba(61,194,229,.24),inset 0 0 0 1px rgba(255,255,255,.82),inset 0 -5px 12px rgba(61,169,222,.08);
      }
      .approval-primary b{position:relative;z-index:2;font:inherit;letter-spacing:-.01em}
      .approval-primary i{position:absolute;top:-40%;bottom:-40%;left:-55%;width:45%;transform:skewX(-22deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.8),transparent)}
      .demo-approval .approval-primary i{animation:approvalShine 2.2s ease-in-out infinite}
      .demo-approving .approval-primary{animation:demoApprovePress .68s cubic-bezier(.2,.82,.2,1) both}
      .demo-approving .approval-primary i{animation:approvalShine .68s ease-out both}
      @keyframes approvalShine{0%{left:-55%;opacity:0}20%{opacity:1}62%,100%{left:125%;opacity:0}}
      @keyframes demoApprovePress{0%,100%{transform:scale(1)}42%{transform:scale(.94);box-shadow:0 4px 12px rgba(61,194,229,.18),inset 0 0 0 1px rgba(255,255,255,.9)}72%{transform:scale(1.025)}}

      .approval-running-view{position:absolute;inset:0;padding:4.4%;opacity:0;transform:translateY(8px);transition:opacity .28s ease,transform .38s ease}
      .running-head{display:flex;align-items:center;gap:.78em}
      .running-spinner{width:2.25em;height:2.25em;border-radius:50%;border:1.5px solid rgba(55,172,214,.2);border-top-color:#4ed4e8;flex:0 0 auto;animation:runningSpin .9s linear infinite}
      .running-head>div{display:flex;flex-direction:column;gap:.16em}
      .running-head>div span{font-size:.48em;font-weight:780;letter-spacing:.14em;color:#2a91c8}
      .running-head strong{font-size:.79em;letter-spacing:-.025em}
      .running-head small{margin-left:auto;font-size:.53em;color:rgba(13,23,35,.36)}
      .running-progress{height:.42em;margin-top:4%;border-radius:99em;overflow:hidden;background:rgba(72,147,184,.1)}
      .running-progress i{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#75e7eb,#60c9f2);box-shadow:0 0 12px rgba(91,213,235,.42)}
      .running-meta{display:flex;align-items:center;justify-content:space-between;margin-top:3%}
      .running-meta code{margin:0;padding:0;background:none!important;font-size:.55em}
      .running-meta span{font-size:.53em;color:rgba(13,23,35,.38)}
      .demo-running .approval-request-view{opacity:0;transform:translateY(-7px)}
      .demo-running .approval-running-view{opacity:1;transform:none}
      .demo-running .running-progress i{animation:testProgress 2.05s cubic-bezier(.2,.78,.2,1) forwards}
      @keyframes runningSpin{to{transform:rotate(360deg)}}
      @keyframes testProgress{0%{width:4%}65%{width:76%}100%{width:100%}}

      .ios-tests-passed{
        position:absolute;left:0;right:0;bottom:0;padding:4.5%;border-radius:1.4em;
        opacity:0;transform:translateY(14px) scale(.98);
        background:linear-gradient(145deg,rgba(248,255,255,.97),rgba(226,250,250,.91));
        box-shadow:0 18px 40px rgba(40,145,160,.12),inset 0 0 0 1px rgba(80,206,205,.14),inset 0 1px rgba(255,255,255,.96);
        transition:opacity .4s ease,transform .55s cubic-bezier(.2,.86,.2,1);
      }
      .tests-passed-head{display:flex;align-items:center;gap:.72em}
      .tests-passed-check{width:2.25em;height:2.25em;border-radius:.72em;display:grid;place-items:center;flex:0 0 auto;background:linear-gradient(145deg,#bff8f0,#83e5df);color:#0b746f;box-shadow:0 7px 16px rgba(78,202,194,.2)}
      .tests-passed-check svg{width:1.22em;height:1.22em;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
      .tests-passed-head>div{display:flex;flex-direction:column;gap:.15em}
      .tests-passed-head>div span{font-size:.48em;font-weight:780;letter-spacing:.14em;color:#198e8a}
      .tests-passed-head strong{font-size:.82em;letter-spacing:-.025em}
      .tests-passed-head small{margin-left:auto;font-size:.52em;font-weight:680;color:#16827d}
      .tests-passed-meta{display:flex;align-items:center;justify-content:space-between;margin-top:3.5%;padding-top:3%;border-top:1px solid rgba(55,137,149,.08)}
      .tests-passed-meta code{font-family:var(--font-mono);font-size:.53em;color:rgba(13,23,35,.44)}
      .tests-passed-meta span{font-size:.52em;font-weight:620;color:rgba(13,23,35,.42)}

      .demo-active .ios-approval-sheet{opacity:0;transform:translateY(16px) scale(.985)}
      .demo-active.demo-approval .ios-approval-sheet,
      .demo-active.demo-approving .ios-approval-sheet,
      .demo-active.demo-running .ios-approval-sheet{opacity:1;transform:none}
      .demo-active.demo-complete .ios-approval-sheet{opacity:0;transform:translateY(12px) scale(.985)}
      .demo-active.demo-passed .ios-tests-passed,
      .demo-active.demo-complete .ios-tests-passed,
      .demo-reduced .ios-tests-passed{opacity:1;transform:none}
      .demo-resetting .ios-command-card{opacity:0;transform:translateY(-6px)}
      .demo-reduced .ios-approval-sheet{opacity:0}
      .ios-home-indicator{
        position:absolute;bottom:.75%;left:50%;width:34%;height:.55%;
        border-radius:20px;background:#10161e;transform:translateX(-50%);
      }

      .device-stage.intro-phone-in{opacity:1}
      .device-stage.intro-phone-in .iphone{
        animation:phoneSettle 1.25s cubic-bezier(.16,.86,.2,1) .08s forwards;
      }
      @keyframes phoneSettle{
        to{opacity:1;transform:translate3d(0,0,0) scale(1)}
      }

      @media (max-width:1179px){
        .hero__copy{left:48px;width:49vw}
        .hero h1{font-size:clamp(42px,5vw,56px)!important}
        .device-stage{right:calc((100vw - 48px - 49vw - var(--phone-w))/2)}
      }

      @media (max-width:900px){
        .nav{width:calc(100vw - 24px)}
        .curtain{height:max(1120px,132svh)}
        .curtain__overlay{
          background:
            linear-gradient(180deg,rgba(1,14,44,.26) 0%,rgba(2,18,54,.12) 55%,rgba(1,12,42,.3) 100%),
            radial-gradient(100% 55% at 50% 0%,transparent 38%,rgba(1,11,38,.14) 100%);
        }
        .hero{padding:0}
        .hero__copy{left:16px;right:16px;top:104px;width:auto;transform:none;text-align:center}
        .hero .pill{margin-inline:auto}
        .hero h1{
          margin-top:18px!important;font-size:clamp(29px,8.2vw,42px)!important;
          line-height:1.03!important;text-align:center!important;
        }
        .hero h1 .line{text-align:center}
        .hero p.sub{margin:17px auto 0;width:min(460px,92vw);max-width:460px;text-align:center}
        .hero .ctas{justify-content:center;margin-top:19px;flex-wrap:nowrap}
        .hero .ctas .btn{height:42px;font-size:13px}
        .device-stage{
          --phone-w:min(312px,80vw);
          left:50%;right:auto;top:420px;
          width:var(--phone-w);height:calc(var(--phone-w) * 2.025);
          transform:translateX(-50%);
        }
      }

      @media (max-width:600px){
        .curtain{height:max(1080px,132svh)}
        .hero__copy{top:96px}
        .hero h1{font-size:clamp(27px,7.8vw,34px)!important}
        .hero p.sub{font-size:13px;line-height:1.35}
        .hero p.sub .sub-line{display:inline}
        .hero .ctas{gap:8px;padding:0}
        .hero .ctas .btn{padding-inline:12px!important;min-width:0!important;font-size:12px}
        .device-stage{top:410px}
      }

      @media (max-width:380px){
        .hero .pill .label{font-size:10px}
        .hero .ctas .btn{font-size:11px;padding-inline:10px!important}
        .device-stage{top:400px}
      }

      @media (prefers-reduced-motion:reduce){
        .device-stage{opacity:1}
        .iphone{opacity:1;transform:none;animation:none!important}
        .voice-blob-core,.voice-blob-glow,.typing-caret,.approval-primary i,
        .approval-primary,.running-spinner,.running-progress i{animation:none!important}
        .ios-command-card,.ios-assistant-message,.ios-approval-sheet,.ios-tests-passed,
        .approval-request-view,.approval-running-view{transition:none!important}
      }

      /* ===== Beta-first acquisition control ===== */
      .sr-only{
        position:absolute!important;width:1px!important;height:1px!important;padding:0!important;
        margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;
        white-space:nowrap!important;border:0!important;
      }
      .hero .beta-cta-slot{
        display:block;width:min(420px,calc(100vw - 32px));max-width:100%;padding:0;
        text-align:left;overflow:visible;
      }
      .beta-signup{width:100%}
      .beta-signup form{width:100%;margin:0}
      .beta-signup__shell{
        position:relative;width:min(223px,100%);height:48px;overflow:hidden;
        border:1px solid rgba(255,255,255,.38);border-radius:16px;
        background:
          linear-gradient(105deg,rgba(255,255,255,.26),rgba(255,255,255,.10)),
          rgba(5,27,70,.25);
        box-shadow:
          inset 0 1px 0 rgba(255,255,255,.34),
          inset 0 -10px 26px rgba(46,117,205,.12),
          0 10px 32px rgba(0,12,40,.22);
        backdrop-filter:blur(22px) saturate(165%);
        -webkit-backdrop-filter:blur(22px) saturate(165%);
        transition:width 280ms cubic-bezier(.2,.75,.25,1),box-shadow 280ms ease,background 280ms ease;
      }
      .beta-signup.is-expanded .beta-signup__shell{
        width:100%;
        background:
          linear-gradient(105deg,rgba(255,255,255,.36),rgba(255,255,255,.15)),
          rgba(5,27,70,.3);
        box-shadow:
          inset 0 1px 0 rgba(255,255,255,.48),
          inset 0 -10px 28px rgba(74,146,226,.14),
          0 14px 38px rgba(0,12,40,.26);
      }
      .beta-signup__shell::before{
        content:"";position:absolute;inset:1px;border-radius:14px;pointer-events:none;
        background:linear-gradient(110deg,rgba(255,255,255,.13),transparent 36%,rgba(166,218,255,.08));
      }
      .beta-signup__shell input[type="email"]{
        position:absolute;left:0;top:0;width:calc(100% - 128px);height:100%;
        padding:0 10px 0 18px;border:0;outline:0;background:transparent;color:#fff;
        font:500 14px/1 var(--font-sans);letter-spacing:-.025em;
        opacity:0;transform:translateX(-12px);pointer-events:none;
        transition:opacity 180ms ease 70ms,transform 280ms cubic-bezier(.2,.75,.25,1);
      }
      .beta-signup__shell input[type="email"]::placeholder{color:rgba(255,255,255,.64)}
      .beta-signup.is-expanded .beta-signup__shell input[type="email"]{
        opacity:1;transform:none;pointer-events:auto;
      }
      .beta-signup__shell:focus-within{
        border-color:rgba(174,219,255,.9);
        box-shadow:
          0 0 0 3px rgba(84,161,255,.25),
          inset 0 1px 0 rgba(255,255,255,.48),
          0 14px 38px rgba(0,12,40,.28);
      }
      .hero .ctas .beta-signup__button.btn.primary,
      .hero .ctas .beta-signup__open.btn.primary{
        position:absolute;right:4px;top:4px;width:calc(100% - 8px)!important;height:40px;
        min-width:0!important;padding:0 16px!important;border-radius:12px;
        gap:8px;white-space:nowrap;z-index:2;
        transition:width 280ms cubic-bezier(.2,.75,.25,1),background 180ms ease,box-shadow 180ms ease;
      }
      .hero .ctas .beta-signup__open.btn.primary{
        position:relative;right:auto;top:auto;width:min(223px,100%)!important
      }
      .beta-signup.is-expanded .beta-signup__button.btn.primary{width:124px!important}
      .beta-signup__button svg,.beta-signup__open svg{width:16px;height:16px;flex:0 0 auto;stroke-width:1.8}
      .beta-signup__button:disabled{cursor:wait}
      .beta-signup__spinner{
        width:14px;height:14px;border:1.5px solid rgba(255,255,255,.4);
        border-top-color:#fff;border-radius:50%;animation:betaSpin .7s linear infinite;
      }
      @keyframes betaSpin{to{transform:rotate(360deg)}}
      .beta-signup__disclosure{
        width:100%;margin:9px 0 0;color:rgba(255,255,255,.66);
        font:500 10.5px/1.4 var(--font-sans);letter-spacing:-.01em;text-shadow:0 1px 8px rgba(0,8,30,.3);
      }
      .beta-signup__disclosure a{
        color:rgba(255,255,255,.86);text-decoration:underline;text-underline-offset:2px;
      }
      .beta-signup__status{
        min-height:17px;margin:3px 0 0;color:rgba(255,255,255,.8);
        font:600 11px/1.4 var(--font-sans);
      }
      .beta-signup__status--error{color:#ffd0d0}
      .beta-signup__status--success{color:#c5ffd9}
      .beta-signup__honeypot{
        position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;
        overflow:hidden!important;
      }
      .beta-signup--unlocked{position:relative}
      @media (max-width:900px){
        .hero .beta-cta-slot{margin-inline:auto;text-align:left}
        .beta-signup__disclosure,.beta-signup__status{text-align:center}
      }
      @media (max-width:420px){
        .hero .beta-cta-slot{width:calc(100vw - 32px)}
        .beta-signup__shell{height:46px}
        .hero .ctas .beta-signup__button.btn.primary,
        .hero .ctas .beta-signup__open.btn.primary{height:38px;font-size:12px!important}
        .beta-signup.is-expanded .beta-signup__button.btn.primary{width:112px!important}
        .beta-signup__shell input[type="email"]{width:calc(100% - 114px);padding-left:15px;font-size:13px}
        .beta-signup__disclosure{font-size:10px}
      }
      @media (prefers-reduced-motion:reduce){
        .beta-signup__shell,.beta-signup__shell input[type="email"],
        .hero .ctas .beta-signup__button.btn.primary{transition:none!important}
        .beta-signup__spinner{animation-duration:1.4s}
      }