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

html{scroll-behavior:smooth}

body{
  background:var(--black);color:var(--white);
  font-family:'Inter',sans-serif;line-height:1.5;
  overflow-x:hidden;-webkit-font-smoothing:antialiased;
}

::selection{background:var(--g4);color:#000}

::-webkit-scrollbar{width:0}

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

.mono{font-family:'JetBrains Mono',monospace;letter-spacing:.16em;text-transform:uppercase}

.wrap{max-width:1320px;margin:0 auto;padding:0 clamp(20px,4vw,56px)}

.grain{position:fixed;inset:0;z-index:90;pointer-events:none;opacity:.05;mix-blend-mode:overlay}
.grain svg{width:100%;height:100%}

.hud{position:fixed;inset:0;z-index:80;pointer-events:none}

.tick.tl{top:16px;left:16px;border-top:1.5px solid;border-left:1.5px solid}

.tick.tr{top:16px;right:16px;border-top:1.5px solid;border-right:1.5px solid}

.tick.bl{bottom:54px;left:16px;border-bottom:1.5px solid;border-left:1.5px solid}

.tick.br{bottom:54px;right:16px;border-bottom:1.5px solid;border-right:1.5px solid}

.rec{width:7px;height:7px;border-radius:50%;background:#ff3b3b;box-shadow:0 0 8px #ff3b3b;animation:blink 1.4s steps(2) infinite}

@keyframes blink{0%,49%{opacity:1}50%,100%{opacity:.15}}

.scrub{position:fixed;left:0;right:0;bottom:0;z-index:81;height:42px;
  background:linear-gradient(0deg,rgba(10,10,10,.96),rgba(10,10,10,.5));
  border-top:1px solid var(--line);display:flex;align-items:center;
  padding:0 42px;gap:18px;backdrop-filter:blur(8px)}

.scrub .stage{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--grey)}

.track{flex:1;height:2px;background:#242426;position:relative;border-radius:2px}

.track .fill{position:absolute;left:0;top:0;height:100%;width:0;background:var(--spectrum);border-radius:2px}

.track .head{position:absolute;top:50%;width:9px;height:9px;border-radius:50%;background:#fff;transform:translate(-50%,-50%);box-shadow:0 0 10px 2px rgba(255,255,255,.5);left:0}

.scrub .total{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.1em;color:var(--faint)}

.brand{display:flex;align-items:center;gap:11px}

.mark{width:30px;height:30px;border-radius:7px;background:var(--spectrum);position:relative;flex:none}

.mark::after{content:"TX";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:12px;color:#000;letter-spacing:-.04em}

.brand b{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:16px;letter-spacing:-.02em}

.navlinks{display:flex;gap:34px}

.navlinks a{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--grey);transition:.2s}

.navcta{display:flex;align-items:center;gap:14px}

.btn{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  padding:11px 20px;border-radius:100px;cursor:pointer;border:1px solid transparent;transition:.2s;display:inline-flex;align-items:center;gap:9px}

.btn-ghost{border-color:#2a2a2c;color:var(--grey);background:transparent}

.btn-ghost:hover{border-color:#fff;color:#fff}

.btn-grad{background:var(--spectrum);color:#000;font-weight:700}

.reveal.in{opacity:1;transform:none}

.navlinks a.active{color:#fff}
.fgrid .col h6{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--faint);margin-bottom:18px}
.fgrid .col a{display:block;color:var(--grey);font-size:13px;margin-bottom:11px;transition:.2s}
.fgrid .col a:hover{color:#fff}

.brand-logo{height:26px;width:auto;display:block}
footer .brand-logo{height:30px}

:root{
  --black:#0A0A0A; --panel:#101011; --line:#1c1c1e;
  --white:#fff; --grey:#8A8A8A; --faint:#5A5A5A; --cream:#F4F4F2;
  --g1:#DACCFA; --g2:#7F95F8; --g3:#78C7EF; --g4:#A1EB1A; --g5:#A1EB1A;
  --spectrum:linear-gradient(115deg,var(--g1),var(--g2),var(--g3),var(--g4));
  --hud:11px;
}
.display{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;letter-spacing:-.03em;line-height:.9}
.h2{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;letter-spacing:-.025em;line-height:1;font-size:clamp(2rem,4vw,3.3rem)}

nav{position:fixed;top:0;left:0;right:0;z-index:70;display:flex;align-items:center;justify-content:space-between;padding:26px clamp(40px,5vw,70px);transition:.3s}
nav.solid{background:rgba(10,10,10,.8);backdrop-filter:blur(16px);padding-top:18px;padding-bottom:18px}

.kicker{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--faint);margin-bottom:22px;display:flex;align-items:center;gap:12px}
.kicker::before{content:"";width:26px;height:1px;background:var(--g4)}

.phead{padding:clamp(150px,22vh,240px) 0 clamp(40px,7vh,80px)}

.phead h1{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;letter-spacing:-.035em;line-height:.92;font-size:clamp(2.8rem,8vw,6rem)}
.phead p{margin-top:24px;max-width:46ch;color:var(--grey);font-size:16px;line-height:1.6}

footer{border-top:1px solid var(--line);padding:70px 0 100px;position:relative}
.fgrid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px}
.fbrand p{color:var(--faint);font-size:13px;max-width:30ch;margin-top:16px;line-height:1.6}
.fend{display:flex;justify-content:space-between;align-items:center;margin-top:60px;padding-top:26px;border-top:1px solid var(--line);flex-wrap:wrap;gap:14px}
.fend .mono{font-size:10px;color:var(--faint)}

footer{background:#0B0B0C;border-top:0;padding:76px 0 110px;position:relative;overflow:hidden}
footer::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:var(--spectrum)}
footer::after{content:"";position:absolute;left:50%;top:0;transform:translateX(-50%);width:72%;height:240px;
  background:radial-gradient(60% 100% at 50% 0%,rgba(161,235,26,.06),transparent 70%);pointer-events:none}
footer .wrap{position:relative;z-index:1}
footer .fbrand p{color:#fff;font-family:'Bricolage Grotesque',sans-serif;font-weight:800;text-transform:uppercase;
  font-size:clamp(1.5rem,2.6vw,2.3rem);line-height:1.02;letter-spacing:-.02em;max-width:15ch;margin-top:20px}
footer .fgrid .col h6{color:var(--faint)}
footer .fgrid .col a{color:var(--grey);font-weight:500}
footer .fgrid .col a:hover{color:#A1EB1A}
footer .fend{border-top:1px solid var(--line);margin-top:50px;padding-top:22px}
footer .fend .mono{color:var(--faint)}

.reveal{opacity:0;transform:translateY(26px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}

@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}
@media(max-width:860px){.fgrid{grid-template-columns:1fr 1fr}}
.navlinks a:hover{color:#fff}

.navtoggle{display:none;width:42px;height:42px;flex:none;border:1px solid #2a2a2c;border-radius:9px;
  background:transparent;cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:5px}
.navtoggle span{display:block;width:18px;height:1.5px;background:#fff;border-radius:2px;transition:.3s}
.navmenu{display:contents}
@media(max-width:1024px){
  .navtoggle{display:flex}
  nav.open{background:rgba(10,10,10,.97);backdrop-filter:blur(18px)}
  .navmenu{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;
    background:rgba(10,10,10,.97);backdrop-filter:blur(18px);border-bottom:1px solid var(--line);
    padding:10px clamp(20px,5vw,40px) 24px}
  nav.open .navmenu{display:flex}
  .navmenu .navlinks{display:flex;flex-direction:column;align-items:stretch;gap:0}
  .navmenu .navlinks a{padding:15px 2px;font-size:12px;border-bottom:1px solid var(--line)}
  .navmenu .navcta{display:flex;gap:12px;margin-top:18px}
  .navmenu .navcta .btn{flex:1;justify-content:center;padding:13px 16px}
  nav.open .navtoggle span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
  nav.open .navtoggle span:nth-child(2){opacity:0}
  nav.open .navtoggle span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
}

.closing{position:relative;text-align:center;padding:clamp(110px,18vh,200px) 0;overflow:hidden;border-top:1px solid var(--line)}
.closing .glow{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:120%;height:60%;background:var(--spectrum);filter:blur(150px);opacity:.15;border-radius:50%}
.closing h2{position:relative;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;letter-spacing:-.025em;line-height:1;font-size:clamp(2rem,4vw,3.3rem)}
.closing .line{width:120px;height:1px;background:var(--spectrum);margin:32px auto}
.closing .btn{padding:16px 30px;font-size:12px}

.phead,.searchhero{position:relative;overflow:hidden}
.phead::before,.searchhero::before{content:"";position:absolute;left:50%;top:-8%;transform:translateX(-50%);
  width:82%;height:440px;background:var(--spectrum);filter:blur(170px);opacity:.13;pointer-events:none}
.phead>.wrap,.phead>.narrow,.searchhero>.wrap{position:relative;z-index:1}

@media(max-width:720px){nav{padding:18px 20px}nav.solid{padding-top:14px;padding-bottom:14px}}
@media(max-width:560px){.fgrid{grid-template-columns:1fr;gap:30px}}
@media(max-width:720px){
  .phead{padding:clamp(104px,17vh,150px) 0 clamp(28px,5vh,60px)}
  .closing{padding:clamp(70px,12vh,200px) 0}
}