/* TECH LOOK (2026-10-16, PREVIEW ONLY): performance-lab / sports-tech skin.
   Deep navy base, TASG gold accent, electric cyan data accent, glass cards, HUD overlays.
   Loads last; overrides tokens from styles.css / vnext.css / sota.css. */
@font-face{font-family:"Space Grotesk";src:url(/public/fonts/space-grotesk-var-latin.woff2) format("woff2");font-weight:300 700;font-style:normal;font-display:swap}
:root{
  --bg:#000000;--bg-2:#0a0a0a;--bg-3:#141414;--ink:#ffffff;--ink-2:#d0d0d0;--muted:#9a9a9a;
  --red:#e10600;--red-2:#ff2a2a;--accent:#e10600;
  --gold:#e10600;--gold-2:#ff2a2a;--cy:#e10600;--cy-2:#ff4a3d;--teal:#e10600;
  --line:rgba(255,255,255,.12);--line-strong:rgba(255,255,255,.24);
  --font-display:"Space Grotesk","Inter","Segoe UI",sans-serif;
  --glass:rgba(18,18,18,.55);--glass-line:rgba(225,6,0,.16);
  --glow:0 20px 60px rgba(0,0,0,.55),0 0 0 1px rgba(225,6,0,.06);
}
html{background:var(--bg)}
body{background:radial-gradient(1200px 700px at 85% -10%,rgba(225,6,0,.10),transparent 60%),radial-gradient(900px 600px at -10% 30%,rgba(225,6,0,.07),transparent 60%),var(--bg);-webkit-font-smoothing:antialiased}
/* fixed animated background canvas + static grid fallback */
#tl-bg{position:fixed;inset:0;z-index:-1;width:100%;height:100%;pointer-events:none;opacity:.75}
body::before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;background-image:linear-gradient(rgba(225,6,0,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(225,6,0,.045) 1px,transparent 1px);background-size:56px 56px;-webkit-mask-image:radial-gradient(ellipse at 50% 30%,#000 30%,transparent 80%);mask-image:radial-gradient(ellipse at 50% 30%,#000 30%,transparent 80%)}
main{position:relative;z-index:0}
::selection{background:rgba(225,6,0,.35);color:#fff}
:focus-visible{outline:2px solid var(--cy);outline-offset:3px}
/* type */
h1,h2,h3,h4,.vx h2,.vx h3,.vx-hero h1,.hx h1{font-family:var(--font-display);letter-spacing:-.02em}
h1{font-weight:700;line-height:.95}
h2{font-weight:700}
h3{font-weight:600;letter-spacing:-.005em}
.page-hero h1{font-size:clamp(2.5rem,7vw,5.6rem);background:linear-gradient(180deg,#fff 30%,#e6e6e6);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none}
.kicker,.vx-kicker,.card-kicker{font-family:var(--font-display);font-weight:600;letter-spacing:.22em;color:var(--cy)}
.kicker::before,.vx-kicker::before{content:"";display:inline-block;width:.45rem;height:.45rem;margin-right:.6rem;border-radius:1px;background:var(--cy);box-shadow:0 0 10px var(--cy);vertical-align:.05em}
.kicker::after{background:linear-gradient(90deg,var(--gold),var(--cy));width:4rem;box-shadow:0 0 12px rgba(225,6,0,.5)}
.card-kicker{font-size:.72rem;text-transform:uppercase;margin:0 0 .6rem}
.lede,.vx-lede{color:var(--ink-2)}
/* header */
.site-header{background:rgba(5,8,15,.72);border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(18px) saturate(140%);backdrop-filter:blur(18px) saturate(140%)}
.site-header::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent,rgba(225,6,0,.6),rgba(225,6,0,.6),transparent)}
.site-nav a{font-family:var(--font-display);letter-spacing:.08em}
@media(min-width:960px){.site-nav a[aria-current="page"]{box-shadow:inset 0 -2px 0 var(--cy);color:#fff}}
/* buttons */
.btn{font-family:var(--font-display);border-radius:10px;letter-spacing:.12em;position:relative;transition:transform .25s var(--ease),box-shadow .25s,background .25s,border-color .25s,color .25s}
.btn-primary,.hx-btn.btn-primary{background:linear-gradient(135deg,#ff3b30,#e10600 55%,#a10000);color:#ffffff;border-color:transparent;box-shadow:0 10px 30px rgba(225,6,0,.28),0 0 0 1px rgba(255,255,255,.18) inset}
.btn-primary:hover,.btn-primary:focus-visible{background:linear-gradient(135deg,#ff4a3d,#ff2a2a 55%,#b00000);color:#000000;box-shadow:0 14px 40px rgba(225,6,0,.45),0 0 24px rgba(225,6,0,.25)}
.btn-ghost{background:rgba(225,6,0,.04);border-color:rgba(225,6,0,.35);color:#ffffff}
.btn-ghost:hover,.btn-ghost:focus-visible{border-color:var(--cy);color:#fff;box-shadow:0 0 0 1px var(--cy) inset,0 0 24px rgba(225,6,0,.35)}
@media (hover:hover) and (prefers-reduced-motion:no-preference){.btn:hover{transform:translateY(-2px)}}
.vx-play span{background:linear-gradient(135deg,#ff3b30,#e10600);color:#ffffff}
.vx-tab[aria-selected="true"]{background:var(--cy);border-color:var(--cy);color:#04121a}
/* sections */
.section,.vx-section{position:relative}
.band,.vx-section.alt{background:linear-gradient(180deg,rgba(7,12,24,.86),rgba(5,9,18,.86));border-block:1px solid var(--line)}
.vx-section{border-top-color:var(--line)}
.asset-band{background:radial-gradient(70% 120% at 100% 0%,rgba(225,6,0,.12),transparent 60%),linear-gradient(180deg,#060b16,#0a0a0a)}
.asset-grid .k{color:var(--gold)}
/* glass cards with glowing gradient edge */
.card,.vx-door,.vx-founder,.asset-grid article,.ht-tile,.re-card,.pillar-card,.vx-tile,.person,.mission-item,.door{position:relative;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.012)),var(--glass);border:1px solid var(--glass-line);border-radius:16px;box-shadow:var(--glow);-webkit-backdrop-filter:blur(12px) saturate(130%);backdrop-filter:blur(12px) saturate(130%)}
.card::before,.vx-door::before,.ht-tile::before,.asset-grid article::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;background:linear-gradient(135deg,rgba(225,6,0,.55),rgba(225,6,0,0) 35%,rgba(225,6,0,0) 65%,rgba(225,6,0,.55));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;opacity:.55;transition:opacity .35s}
@media (hover:hover) and (prefers-reduced-motion:no-preference){
  .card,.ht-tile,.asset-grid article{transition:transform .35s var(--ease),box-shadow .35s}
  .card:hover,.ht-tile:hover,.asset-grid article:hover,.vx-door:hover{transform:translateY(-5px);box-shadow:0 26px 70px rgba(0,0,0,.6),0 0 32px rgba(225,6,0,.16)}
  .card:hover::before,.ht-tile:hover::before,.vx-door:hover::before,.asset-grid article:hover::before{opacity:1}
}
.card h3{font-size:1.25rem}
.card-list.two{grid-template-columns:repeat(auto-fit,minmax(16rem,1fr))}
.mission-item{border-top:1px solid var(--glass-line)}
.ht-stats strong{font-family:var(--font-display);color:#fff;text-shadow:0 0 22px rgba(225,6,0,.35)}
.ht-k,.person .role,.tl dt{color:var(--gold)}
/* forms */
input,select,textarea{background:rgba(5,12,24,.7)!important;border:1px solid var(--line-strong)!important;color:var(--ink)!important;border-radius:10px!important}
input:focus,select:focus,textarea:focus{outline:2px solid var(--cy)!important;border-color:var(--cy)!important;box-shadow:0 0 0 4px rgba(225,6,0,.15)}
.form,.re-form{border-radius:18px}
/* inner hero: art + HUD */
.page-hero{padding:5rem 0 4rem;min-height:min(78vh,44rem);display:flex;align-items:center}
.page-hero>.wrap{position:relative;z-index:2;width:min(100% - 2.5rem,var(--max))}
.page-hero::before{background:radial-gradient(ellipse 60% 80% at 100% 0%,rgba(225,6,0,.16),transparent 55%),linear-gradient(180deg,#000000,#070d1a)}
.tl-hero-art{position:absolute;inset:0;z-index:-1;overflow:hidden}
.tl-hero-art picture,.tl-hero-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tl-hero-art img{opacity:.92}
.tl-hero-art::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,8,15,.96) 0%,rgba(5,8,15,.78) 38%,rgba(5,8,15,.15) 75%,rgba(5,8,15,.05) 100%),linear-gradient(0deg,var(--bg) 0%,transparent 30%)}
.ph-bg::after{background:linear-gradient(90deg,rgba(5,8,15,.96) 0%,rgba(5,8,15,.72) 50%,rgba(5,8,15,.3) 100%),linear-gradient(0deg,var(--bg) 0%,transparent 45%)}
.ph-bg img,.ph-bg video.on{opacity:.5}
.ph-bg .tl-hud,.tl-hero-art .tl-hud{z-index:1}
@media(max-width:760px){
  .page-hero{min-height:auto;padding:3.5rem 0 3rem}
  .tl-hero-art img{opacity:.8;object-position:62% center}
  .tl-hero-art::after{background:linear-gradient(180deg,rgba(5,8,15,.35) 0%,rgba(5,8,15,.78) 55%,var(--bg) 100%)}
}
/* HUD */
.tl-hud{position:absolute;inset:clamp(.8rem,2.4vw,1.8rem);pointer-events:none;color:var(--cy);font:600 .66rem/1 var(--font-display);letter-spacing:.2em;text-transform:uppercase}
.tl-br{position:absolute;width:28px;height:28px;border:2px solid var(--cy);filter:drop-shadow(0 0 6px rgba(225,6,0,.8))}
.tl-br-tl{left:0;top:0;border-right:0;border-bottom:0}.tl-br-tr{right:0;top:0;border-left:0;border-bottom:0}
.tl-br-bl{left:0;bottom:0;border-right:0;border-top:0}.tl-br-br{right:0;bottom:0;border-left:0;border-top:0}
.tl-scan{position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,rgba(225,6,0,.9),transparent);box-shadow:0 0 18px rgba(225,6,0,.8);opacity:.0}
.tl-cross{position:absolute;right:16%;top:28%;width:clamp(70px,9vw,130px);height:auto;fill:none;stroke:var(--cy);stroke-width:1.4;opacity:.8;filter:drop-shadow(0 0 6px rgba(225,6,0,.7))}
.tl-cross .d{stroke-dasharray:4 6;stroke:var(--gold)}
.tl-chips{position:absolute;right:2.4rem;top:1.1rem;display:flex;gap:.5rem;flex-wrap:wrap;justify-content:flex-end}
.tl-chip{display:inline-flex;align-items:center;gap:.45rem;padding:.45rem .65rem;border:1px solid rgba(225,6,0,.45);border-radius:6px;background:rgba(3,12,24,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.tl-chip b{width:6px;height:6px;border-radius:50%;background:#e10600;box-shadow:0 0 8px #e10600}
.tl-meter{position:absolute;right:2.4rem;bottom:1.2rem;display:flex;align-items:center;gap:4px;padding:.45rem .65rem;border:1px solid rgba(225,6,0,.5);border-radius:6px;background:rgba(3,12,24,.55);color:var(--gold)}
.tl-meter span{margin-right:.4rem}.tl-meter i{width:14px;height:8px;background:var(--gold);box-shadow:0 0 6px rgba(225,6,0,.8)}.tl-meter i.off{background:rgba(225,6,0,.2);box-shadow:none}
.tl-ill{position:absolute;left:2.4rem;bottom:1.25rem;color:rgba(234,242,255,.6);font-size:.6rem;letter-spacing:.18em}
@media(max-width:760px){.tl-cross,.tl-meter{display:none}.tl-chips{right:.2rem;top:auto;bottom:.6rem}.tl-ill{left:.4rem;bottom:.8rem}}
@media (prefers-reduced-motion:no-preference){
  .tl-scan{animation:tlScan 5.5s cubic-bezier(.6,0,.4,1) infinite}
  .tl-cross{animation:tlSpin 18s linear infinite;transform-origin:center}
  .tl-chip b{animation:tlBlink 1.6s steps(2) infinite}
}
@keyframes tlScan{0%{top:0;opacity:0}8%{opacity:1}92%{opacity:1}100%{top:100%;opacity:0}}
@keyframes tlSpin{to{transform:rotate(360deg)}}
@keyframes tlBlink{50%{opacity:.25}}
/* home hero: brand art + HUD + glow */
.hx .tl-hud{z-index:1;inset:clamp(1rem,3vw,2.2rem)}
.hx .tl-cross{right:22%;top:30%}
.hx h1{background:linear-gradient(180deg,#fff 35%,#f0f0f0);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none;filter:drop-shadow(0 4px 24px rgba(0,0,0,.55))}
.hx-mark img{filter:drop-shadow(0 0 22px rgba(225,6,0,.45)) drop-shadow(0 0 2px rgba(255,255,255,.35)) drop-shadow(0 8px 18px rgba(0,0,0,.7))}
.hx-btn.btn-primary{box-shadow:0 12px 34px rgba(225,6,0,.38)}
/* illustrated media panels */
.tl-panel{position:relative;border-radius:18px;overflow:hidden;border:1px solid var(--glass-line);box-shadow:var(--glow);aspect-ratio:16/9;background:#050a14}
.tl-panel picture,.tl-panel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tl-panel::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(5,8,15,.55),transparent 45%);pointer-events:none}
.tl-panel .tl-hud{inset:.9rem;z-index:2}
.tl-panel .tl-chips{right:2rem;top:.6rem}
.tl-panel .tl-meter{right:2rem;bottom:.7rem}
.tl-panel .tl-ill{left:2rem;bottom:.8rem}
.tl-split{display:grid;gap:clamp(1.25rem,3vw,2.5rem);align-items:center}
@media(min-width:900px){.tl-split{grid-template-columns:1fr 1.15fr}.tl-split.rev>:first-child{order:2}}
.tl-gallery{display:grid;gap:1rem;grid-template-columns:1fr;margin-top:2rem}
@media(min-width:700px){.tl-gallery{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1100px){.tl-gallery{grid-template-columns:repeat(3,1fr)}}
.tl-gallery figure{margin:0}
.tl-gallery figcaption{margin-top:.7rem;font-size:.9rem;color:var(--ink-2)}
.tl-gallery figcaption b{display:block;font-family:var(--font-display);color:#fff;font-size:1.05rem;letter-spacing:-.005em;margin-bottom:.15rem}
/* the loop band */
.tl-loop{position:relative;padding:clamp(3.5rem,8vw,6rem) 0;border-block:1px solid var(--line);background:radial-gradient(60% 120% at 0% 0%,rgba(225,6,0,.10),transparent 60%),radial-gradient(60% 120% at 100% 100%,rgba(225,6,0,.12),transparent 60%),rgba(5,9,18,.75);overflow:hidden}
.tl-loop h2{font-size:clamp(2rem,5.6vw,4.4rem);margin:0 0 2rem;text-transform:none;background:linear-gradient(90deg,#fff,#ff8a80 60%,#ff3b30);-webkit-background-clip:text;background-clip:text;color:transparent;min-height:1.05em}
.tl-type.typing::after{content:"";display:inline-block;width:.08em;height:.9em;margin-left:.06em;background:var(--cy);vertical-align:-.05em;animation:tlBlink 1s steps(2) infinite}
.tl-steps{list-style:none;margin:0;padding:0;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));counter-reset:none}
.tl-steps li{position:relative;padding:1.4rem 1.3rem 1.3rem;border-radius:16px;background:var(--glass);border:1px solid var(--glass-line);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.tl-steps li::after{content:"";position:absolute;left:1.3rem;right:1.3rem;bottom:0;height:2px;background:linear-gradient(90deg,var(--cy),var(--gold));box-shadow:0 0 12px rgba(225,6,0,.6);transform-origin:left;transform:scaleX(var(--p,1));transition:transform 1.2s var(--ease)}
.tl-n{display:block;font:700 clamp(2.4rem,5vw,3.4rem)/1 var(--font-display);color:transparent;-webkit-text-stroke:1.5px var(--cy);letter-spacing:-.02em;margin-bottom:.5rem;font-variant-numeric:tabular-nums;text-shadow:0 0 24px rgba(225,6,0,.35)}
.tl-steps b{display:block;font:700 1.35rem/1.1 var(--font-display);color:#fff;text-transform:uppercase;letter-spacing:.04em}
.tl-steps em{display:block;font-style:normal;color:var(--ink-2);font-size:.95rem;margin-top:.35rem}
/* reveal */
.js .tl-rv{opacity:0;transform:translateY(18px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.js .tl-rv.in{opacity:1;transform:none}
.js .tl-steps li.tl-rv{--p:0}.js .tl-steps li.tl-rv.in{--p:1}
@media (prefers-reduced-motion:reduce){.js .tl-rv{opacity:1;transform:none;transition:none}.js .tl-steps li.tl-rv{--p:1}}
/* footer */
.site-footer{background:linear-gradient(180deg,rgba(4,7,14,.92),#03060c);border-top:1px solid var(--line)}
.site-footer h2{font-family:var(--font-display)}
.tl-foot-note{margin:.4rem 0 0;font-size:.75rem;color:var(--muted);letter-spacing:.02em}
/* mobile polish */
@media(max-width:760px){
  .tl-loop h2{font-size:clamp(1.9rem,9vw,2.6rem)}
  .cta-row .btn,.vx-ctas .btn{width:100%}
  .card{padding:1.25rem 1.1rem}
}

/* override vnext's !important red on CTAs (gold primary, cyan selected states) */
.btn-primary,.vx-play span,.ax-ask button{background:linear-gradient(135deg,#ff3b30,#e10600 55%,#a10000)!important;border-color:transparent!important;color:#ffffff!important}
.btn-primary:hover,.btn-primary:focus-visible{background:linear-gradient(135deg,#ff4a3d,#ff2a2a 55%,#b00000)!important;color:#000000!important}
.vx-tab[aria-selected="true"],.jx-filters .vx-tab[aria-pressed="true"]{background:var(--cy)!important;border-color:var(--cy)!important;color:#04121a!important}
.ax-launch{background:linear-gradient(135deg,#1a0505,#06131f)!important;border:1px solid rgba(225,6,0,.55)!important;box-shadow:0 12px 34px rgba(225,6,0,.25),0 0 0 1px rgba(255,255,255,.08) inset!important;color:#e9fdff!important}
.ax-launch i::after{border-color:#06131f}
.ax-launch::before{border-color:rgba(225,6,0,.55)!important}
/* 2026-10-16 tl2 (PREVIEW): AI photos + TAP IN logo + TAP IN red accent (TAP IN sections only; gold/cyan stay site-wide) */
:root{--tapin-red:#D02C23;--tapin-red-2:#ff4a3d}
.tl-photo img{filter:saturate(1.05) contrast(1.03)}
.tl-panel .tl-photo~.tl-hud,.tl-hero-art .tl-photo~.tl-hud{opacity:.7}
.tl-panel .tl-photo~.tl-hud .tl-chip{background:rgba(5,10,20,.55);backdrop-filter:blur(4px)}
.tapin-logo{display:block;line-height:0}
.tapin-logo img{display:block;height:auto;max-width:100%;filter:drop-shadow(0 6px 22px rgba(0,0,0,.55))}
.tapin-logo-hero{width:min(380px,62vw);margin:0 0 1.1rem -.4rem}
.tapin-logo-sm{width:min(200px,46vw);margin:0 0 .8rem -.2rem}
.tapin-logo-card{width:min(200px,50vw);margin:0 0 .9rem -.2rem}
.tapin-zone .kicker,.tapin-zone .vx-kicker{color:var(--tapin-red-2)}
.tapin-zone .tl-chip b{background:var(--tapin-red)!important;box-shadow:0 0 10px rgba(208,44,35,.8)!important}
.tapin-zone .btn-primary{background:linear-gradient(135deg,#e5372f,#D02C23 55%,#a81f19)!important;border-color:transparent!important;color:#fff!important;box-shadow:0 10px 30px rgba(208,44,35,.32),0 0 0 1px rgba(255,255,255,.14) inset}
.tapin-zone .btn-primary:hover,.tapin-zone .btn-primary:focus-visible{background:linear-gradient(135deg,#d8312a,#b5221c 55%,#8f1914)!important;color:#fff!important;box-shadow:0 14px 40px rgba(208,44,35,.45)}
.site-nav .nav-tapin a{font-weight:800;font-style:italic;letter-spacing:.06em}
.site-nav .nav-tapin .nav-tap{color:#fff}
.site-nav .nav-tapin .nav-in{color:var(--tapin-red-2)}
@media(min-width:960px){.site-nav .nav-tapin a[aria-current="page"]{box-shadow:inset 0 -2px 0 var(--tapin-red)}}
.site-nav .nav-tapin a::after{background:var(--tapin-red)!important}
.foot-tapin{margin:.9rem 0 .2rem}
.foot-tapin{text-align:center}.foot-tapin a{display:inline-block}.foot-tapin img{width:140px;height:auto;display:block;margin:0 auto}
.tapin-zone .kicker::before,.tapin-zone .vx-kicker::before{background:var(--tapin-red)!important;box-shadow:0 0 8px rgba(208,44,35,.8)!important}