:root{--black:#0B0B0B;--char:#1A1A1A;--lime:#A3FF12;--white:#FAFAFA;--muted:#aaa}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:"Inter",Arial,sans-serif;background:var(--black);color:var(--white);line-height:1.5}a{color:inherit;text-decoration:none}.wrap{max-width:1180px;margin:auto;padding:0 28px}.nav{height:78px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #222}.brand{display:flex;align-items:center}.brand img{display:block;width:230px;height:auto}.links{display:flex;gap:28px;align-items:center;font-size:14px}.btn{display:inline-block;background:var(--lime);color:#080808;padding:14px 22px;border-radius:999px;font-weight:500;letter-spacing:.01em}.hero{min-height:680px;display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:50px}.eyebrow{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:#d8d8d8}.hero h1{font-family:"IBM Plex Sans","Inter",sans-serif;font-size:clamp(54px,7vw,94px);font-weight:600;line-height:1.02;letter-spacing:-.055em;margin:18px 0;padding-bottom:.08em}.section h2,.card h3{font-family:"Manrope","Inter",sans-serif}.lime{color:var(--lime)}.lead{max-width:670px;font-size:20px;color:#d2d2d2}.hero-art{height:420px;border:1px solid #2b2b2b;border-radius:24px;position:relative;overflow:hidden;background:radial-gradient(circle at 65% 45%,#a3ff1228,transparent 30%),linear-gradient(145deg,#171717,#050505)}.hero-art:before{content:'';position:absolute;inset:15% 7%;background:url('assets/123-symbol-master-white.png') center/contain no-repeat;opacity:.98;z-index:2}.hero-art:after{content:'';position:absolute;inset:0;background:radial-gradient(circle at 68% 42%,rgba(163,255,18,.13),transparent 22%);z-index:1;pointer-events:none}.section{padding:100px 0;border-top:1px solid #242424}.light{background:var(--white);color:#111}.kicker{font-size:12px;letter-spacing:.18em;text-transform:uppercase}.section h2{font-size:clamp(38px,5vw,66px);line-height:1.02;letter-spacing:-.035em;margin:14px 0 44px}.grid4,.grid3{display:grid;gap:18px}.grid4{grid-template-columns:repeat(4,1fr)}.grid3{grid-template-columns:repeat(3,1fr)}.card{border:1px solid #ddd;padding:28px;min-height:220px}.darkcard{border-color:#303030;background:#111}.num{font-size:32px;color:var(--lime);font-weight:500}.card h3{font-size:22px;margin:14px 0 8px}.card p,.copy{color:#666}.darkcard p,.dark .copy{color:#bdbdbd}.way{background:linear-gradient(120deg,#090909,#151515)}.split{display:grid;grid-template-columns:.8fr 1.2fr;gap:80px;align-items:start}.cap{background:#0e0e0e}.tag{display:inline-block;border:1px solid #333;border-radius:99px;padding:8px 12px;margin:5px 5px 0 0;font-size:13px}.global{background:var(--white);color:#111}.global .copy{color:#555}.cta{text-align:center;padding:120px 0}.cta h2{margin-bottom:28px}.footer{border-top:1px solid #222;padding:42px 0;color:#aaa;font-size:13px}.footerrow{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap}.footer strong{color:#fff}.mobile{display:none}@media(max-width:850px){.links a:not(.btn){display:none}.hero{grid-template-columns:1fr;min-height:auto;padding:80px 0}.hero-art{height:300px}.grid4,.grid3,.split{grid-template-columns:1fr}.section{padding:72px 0}.hero h1{font-family:"IBM Plex Sans","Inter",sans-serif;font-size:58px;line-height:1.04;letter-spacing:-.045em}.section h2,.card h3{font-family:"Manrope","Inter",sans-serif}.lead{font-size:18px}}

/* Motion layer */
body{overflow-x:hidden}.nav{position:relative;z-index:20}.nav:before{content:"";position:fixed;left:0;top:0;height:2px;width:var(--scroll,0%);background:var(--lime);box-shadow:0 0 20px #a3ff12;z-index:99}.hero{position:relative}.hero:before{content:"";position:absolute;inset:-20% -10%;background:radial-gradient(circle at var(--mx,70%) var(--my,35%),rgba(163,255,18,.11),transparent 22%);pointer-events:none}.hero>div:first-child{position:relative;z-index:2}.hero h1 .line{display:block;overflow:visible;padding-bottom:.06em;margin-bottom:-.03em}.hero h1 .line>span{display:block;transform:translateY(115%);animation:heroIn .9s cubic-bezier(.16,1,.3,1) forwards}.hero h1 .line:nth-child(2)>span{animation-delay:.12s}.hero .lead,.hero .copy,.hero .btn{opacity:0;transform:translateY(18px);animation:fadeUp .8s .45s forwards}.hero .copy{animation-delay:.56s}.hero p:last-child .btn{animation-delay:.68s}.hero-art{transform:perspective(1000px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .18s ease-out;box-shadow:0 30px 100px rgba(0,0,0,.4)}.hero-art:after{animation:pulse 3.2s ease-in-out infinite}.hero-art canvas{position:absolute;inset:0;width:100%;height:100%;opacity:1;z-index:3;pointer-events:none;filter:drop-shadow(0 0 3px rgba(163,255,18,.28))}.reveal{opacity:0;transform:translateY(36px);transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1)}.reveal.on{opacity:1;transform:none}.card{position:relative;overflow:hidden;transition:transform .35s cubic-bezier(.16,1,.3,1),border-color .35s,box-shadow .35s}.card:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at var(--cx,50%) var(--cy,50%),rgba(163,255,18,.14),transparent 35%);opacity:0;transition:opacity .25s;pointer-events:none}.card:hover{transform:translateY(-7px);border-color:#a3ff1266;box-shadow:0 24px 60px rgba(0,0,0,.12)}.darkcard:hover{box-shadow:0 24px 70px rgba(0,0,0,.5)}.card:hover:before{opacity:1}.way .grid3{position:relative}.way .grid3:before{content:"";position:absolute;height:1px;left:8%;right:8%;top:-22px;background:linear-gradient(90deg,transparent,var(--lime),transparent);transform:scaleX(var(--way,0));transform-origin:left;transition:transform .15s linear}.btn{transition:transform .2s,box-shadow .25s}.btn:hover{transform:translateY(-2px) scale(1.02);box-shadow:0 0 0 6px rgba(163,255,18,.08),0 10px 35px rgba(163,255,18,.18)}.lime{text-shadow:0 0 28px rgba(163,255,18,.12)}.global{position:relative;overflow:hidden}.global:after{content:"";position:absolute;width:420px;height:420px;border:1px solid #1112;border-radius:50%;right:-100px;top:-90px;box-shadow:0 0 0 45px #1111,0 0 0 90px #1111;pointer-events:none}.cta{position:relative;overflow:hidden}.cta:before{content:"123";position:absolute;font-size:min(38vw,560px);font-weight:900;letter-spacing:-.1em;color:#ffffff06;left:50%;top:50%;transform:translate(-52%,-50%);pointer-events:none}.cta .wrap{position:relative;z-index:2}.cursor-glow{position:fixed;width:380px;height:380px;border-radius:50%;background:radial-gradient(circle,rgba(163,255,18,.075),transparent 65%);pointer-events:none;z-index:1;transform:translate(-50%,-50%);mix-blend-mode:screen}.scrollcue{position:absolute;left:28px;bottom:22px;font-size:10px;letter-spacing:.2em;color:#777;writing-mode:vertical-rl}.scrollcue:after{content:"";display:block;width:1px;height:42px;background:linear-gradient(var(--lime),transparent);margin:10px auto;animation:scrollLine 1.7s infinite}.nav a:not(.btn){position:relative}.nav a:not(.btn):after{content:"";position:absolute;left:0;bottom:-7px;width:100%;height:1px;background:var(--lime);transform:scaleX(0);transform-origin:right;transition:transform .3s}.nav a:not(.btn):hover:after{transform:scaleX(1);transform-origin:left}@keyframes heroIn{to{transform:none}}@keyframes fadeUp{to{opacity:1;transform:none}}@keyframes pulse{50%{opacity:.55}}@keyframes scrollLine{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
@media(max-width:850px){.cursor-glow,.scrollcue{display:none}.hero-art{transform:none!important}.card:hover{transform:none}.global:after{opacity:.35}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.reveal{opacity:1;transform:none}.hero h1 .line>span{transform:none}.hero .lead,.hero .copy,.hero .btn{opacity:1;transform:none}}

/* Official 123 TECH WORKS typography: Manrope (display), Inter (body/UI). */
.brand-name{font-style:normal;font-weight:600;letter-spacing:.04em;white-space:nowrap}.brand-name .brand-123{color:var(--l)}.brand-name .brand-words{color:inherit}.footer .brand-name .brand-123,.footer .brand-name .brand-words{color:var(--l)}
.menu-toggle{display:none;width:44px;height:44px;border:1px solid #333;border-radius:50%;background:#111;color:#fff;align-items:center;justify-content:center;font-size:0;cursor:pointer}.menu-toggle:before,.menu-toggle:after{content:"";position:absolute;width:18px;height:1px;background:#fff;transition:.25s}.menu-toggle:before{transform:translateY(-4px)}.menu-toggle:after{transform:translateY(4px)}.menu-toggle.open:before{transform:rotate(45deg)}.menu-toggle.open:after{transform:rotate(-45deg)}.menu-toggle{position:relative}.mobile-menu{display:none}.skip{position:fixed;left:12px;top:-60px;background:var(--lime,#A3FF12);color:#080808;padding:10px 14px;z-index:999;border-radius:8px;font-weight:700}.skip:focus{top:12px}
@media(max-width:850px){.nav{height:70px}.menu-toggle{display:flex}.links{display:none!important}.mobile-menu{position:fixed;inset:70px 0 0;background:rgba(11,11,11,.98);backdrop-filter:blur(18px);z-index:90;padding:38px 28px;flex-direction:column;gap:8px}.mobile-menu.open{display:flex}.mobile-menu a{font-family:"Manrope",sans-serif;font-size:clamp(28px,9vw,44px);font-weight:600;padding:12px 0;border-bottom:1px solid #222}.mobile-menu .btn{font-family:Inter,sans-serif;font-size:14px;margin-top:22px;justify-content:center;border:0}.wrap{padding-left:20px;padding-right:20px}.hero h1{overflow-wrap:anywhere}.footerrow{flex-direction:column}.card{min-height:auto}.btn{min-height:48px}}
@media(max-width:480px){.brand img{width:175px!important}.hero h1{font-size:clamp(44px,14vw,62px)!important}.section h2{font-size:clamp(34px,11vw,48px)!important}}
footer .brand-name, footer .brand-name .brand-123, footer .brand-name .brand-words { color:#A3FF12 !important; }
.footerrow{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:30px;
}
.footer-copy{
  text-align:center;
  white-space:nowrap;
}
.footer-tech{
  color:#A3FF12;
  font-weight:600;
  letter-spacing:.04em;
}
.footer-global{
  text-align:right;
  justify-self:end;
}
@media(max-width:850px){
  .footerrow{display:flex;flex-direction:column;align-items:flex-start;}
  .footer-copy{text-align:left;white-space:normal;}
  .footer-global{text-align:left;justify-self:auto;}
}
/* Keep the top navigation visible while scrolling */
.nav{
  position:sticky !important;
  top:0;
  z-index:120;
  background:rgba(11,11,11,.94);
  -webkit-backdrop-filter:blur(16px);
  backdrop-filter:blur(16px);
}

/* Mobile menu starts directly below the sticky header */
@media(max-width:850px){
  .mobile-menu{
    top:70px;
    padding:28px 28px 34px;
  }

  /* Smaller, cleaner navigation typography */
  .mobile-menu a:not(.btn){
    font-size:clamp(30px,8vw,38px);
    line-height:1.12;
    padding:18px 0;
  }

  /* CTA: balanced and centered, no text hugging the left edge */
  .mobile-menu .btn{
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    min-height:58px;
    margin-top:26px;
    padding:14px 30px;
    text-align:center;
    font-size:15px;
    line-height:1.2;
    letter-spacing:.01em;
  }
}

@media(max-width:480px){
  .mobile-menu{
    padding-left:24px;
    padding-right:24px;
  }
  .mobile-menu a:not(.btn){
    font-size:34px;
    padding:17px 0;
  }
  .mobile-menu .btn{
    font-size:14px;
    padding-left:28px;
    padding-right:28px;
  }
}
/* Final mobile navigation fix: fully opaque overlay below sticky header */
@media (max-width:850px){
  .nav{
    position:sticky !important;
    top:0 !important;
    z-index:10000 !important;
    background:#0B0B0B !important;
    -webkit-backdrop-filter:none !important;
    backdrop-filter:none !important;
  }

  .mobile-menu{
    position:fixed !important;
    inset:70px 0 0 0 !important;
    z-index:9999 !important;
    background:#0B0B0B !important;
    background-color:#0B0B0B !important;
    opacity:1 !important;
    -webkit-backdrop-filter:none !important;
    backdrop-filter:none !important;
    padding:28px 24px 40px !important;
    gap:0 !important;
    overflow-y:auto !important;
  }

  .mobile-menu.open{
    display:flex !important;
  }

  .mobile-menu a:not(.btn){
    font-size:clamp(28px,8vw,34px) !important;
    line-height:1.12 !important;
    padding:18px 0 !important;
  }

  .mobile-menu .btn{
    display:flex !important;
    width:100% !important;
    min-height:58px !important;
    margin-top:26px !important;
    padding:14px 28px !important;
    align-items:center !important;
    justify-content:center !important;
    text-align:center !important;
    font-size:14px !important;
    line-height:1.2 !important;
    border-bottom:0 !important;
  }
}
.footer-legal{margin-top:8px;font-size:12px;color:#777}
.footer-legal a{transition:color .2s}
.footer-legal a:hover{color:#A3FF12}
@media(max-width:850px){.footer-legal{margin-top:10px}}
@media (max-width: 760px){
  .mobile-menu > a:not(.cta){
    font-family:"IBM Plex Sans",sans-serif !important;
    font-size:22px !important;
    font-weight:300 !important;
    line-height:1.15 !important;
    letter-spacing:.01em !important;
    padding:17px 0 !important;
  }

  .mobile-menu > a:not(.cta) + a:not(.cta){
    border-top-color:rgba(255,255,255,.08) !important;
  }

  .mobile-menu .cta,
  .mobile-menu a.cta{
    font-family:"IBM Plex Sans",sans-serif !important;
    font-size:13px !important;
    font-weight:400 !important;
    letter-spacing:.055em !important;
    line-height:1 !important;
  }
}