/* Talent — Walliez CS2 entry site. Original layout and motion. */
.tl-body{background:var(--wz-bg);color:var(--wz-text);overflow-x:clip;max-width:100vw}
.tl-body *{min-width:0}
.tl-wrap{max-width:1200px;margin:0 auto;padding:0 32px}
.tl-main{display:block}

/* Header */
.tl-header{max-width:1200px;padding:0 32px;gap:40px}
.tl-nav{display:flex;gap:28px;align-self:stretch}
.tl-nav a{display:flex;align-items:center;font-size:13px;font-weight:700;color:var(--wz-muted);position:relative;transition:color .18s}
.tl-nav a:hover{color:var(--wz-text)}
.tl-nav a:after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--wz-accent);transform:scaleX(0);transform-origin:left;transition:transform .22s ease}
.tl-nav a:hover:after{transform:scaleX(1)}
.tl-join-sm span{margin-left:8px;color:var(--wz-accent)}

/* Hero */
.tl-hero{position:relative;padding:96px 0 72px;border-bottom:1px solid var(--wz-line);overflow:hidden}
.tl-hero-inner{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,480px);gap:40px;align-items:center}
.tl-hero-copy{min-width:0}
.tl-hero-model{position:relative;height:clamp(340px,42vw,540px);display:grid;place-items:center;touch-action:pan-y;-webkit-user-select:none;user-select:none}
.tl-hero-model canvas{width:100%!important;height:100%!important;display:block;cursor:grab;opacity:0}
.tl-hero-model.is-ready canvas{opacity:1;transition:opacity .7s ease}
.tl-hero-model canvas:active{cursor:grabbing}
.tl-model-glow{position:absolute;inset:12%;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--wz-accent) 30%,transparent),transparent 62%);filter:blur(46px);pointer-events:none;opacity:0;transition:opacity 1s ease}
.tl-hero-model.is-ready .tl-model-glow{opacity:1}
.tl-model-hint{position:absolute;bottom:2px;left:50%;transform:translateX(-50%);font-size:9.5px;letter-spacing:1.6px;text-transform:uppercase;color:var(--wz-muted);opacity:0;transition:opacity .8s ease .4s;pointer-events:none;white-space:nowrap}
.tl-hero-model.is-ready .tl-model-hint{opacity:.62}
.tl-hero-glow{position:absolute;top:-260px;right:-140px;width:760px;height:760px;border-radius:50%;background:radial-gradient(circle at center,color-mix(in srgb,var(--wz-accent) 22%,transparent),transparent 66%);filter:blur(24px);pointer-events:none;z-index:0;transform:translate3d(0,0,0)}
.tl-hero-grid{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.5;background-image:linear-gradient(to right,color-mix(in srgb,var(--wz-line) 60%,transparent) 1px,transparent 1px),linear-gradient(to bottom,color-mix(in srgb,var(--wz-line) 60%,transparent) 1px,transparent 1px);background-size:88px 88px;mask-image:radial-gradient(ellipse 80% 60% at 30% 0%,#000 20%,transparent 75%);-webkit-mask-image:radial-gradient(ellipse 80% 60% at 30% 0%,#000 20%,transparent 75%)}
.tl-title{font:600 clamp(48px,7.4vw,104px)/0.96 'Bricolage Grotesque',sans-serif;letter-spacing:-4px;margin:20px 0 0;max-width:14ch}
.tl-title em{font-style:normal;color:var(--wz-accent);display:inline-block}
.tl-lead{max-width:56ch;margin:28px 0 0;font-size:17px;line-height:1.65;color:var(--wz-muted)}
.tl-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:36px}
.tl-btn-lg{min-height:54px;padding:15px 26px;font-size:14px;border-radius:10px}
.tl-cta .wz-button-light:hover{filter:brightness(1.07)}
.tl-ip{display:inline-flex;align-items:center;gap:10px;margin-top:26px;background:transparent;border:1px solid var(--wz-line);border-radius:8px;padding:9px 14px;color:var(--wz-muted);cursor:pointer;transition:border-color .18s,color .18s}
.tl-ip:hover{border-color:var(--wz-muted);color:var(--wz-text)}
.tl-ip code{font:600 13px 'Manrope',sans-serif;letter-spacing:.2px;color:var(--wz-text)}
.tl-ip-dot{width:6px;height:6px;border-radius:50%;background:var(--wz-accent);box-shadow:0 0 0 0 color-mix(in srgb,var(--wz-accent) 50%,transparent);animation:tl-pulse 2.6s infinite}
.tl-ip-hint{font-size:11px;letter-spacing:.4px}
@keyframes tl-pulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--wz-accent) 55%,transparent)}70%{box-shadow:0 0 0 9px transparent}100%{box-shadow:0 0 0 0 transparent}}

/* Status */
.tl-status{position:relative;z-index:2;margin-top:56px;border:1px solid var(--wz-line);background:color-mix(in srgb,var(--wz-panel) 88%,transparent);border-radius:14px;padding:24px;backdrop-filter:blur(8px);max-width:640px}
.tl-status-head{display:flex;align-items:center;gap:10px;font-size:12px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;color:var(--wz-muted)}
.tl-status-dot{width:8px;height:8px;border-radius:50%;background:#7f8796;transition:background .3s}
.tl-status.is-online .tl-status-dot{background:#5fd39a;box-shadow:0 0 0 0 rgba(95,211,154,.5);animation:tl-pulse 2.6s infinite}
.tl-status.is-online .tl-status-label{color:var(--wz-text)}
.tl-status-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:20px}
.tl-status-grid div{display:flex;flex-direction:column;gap:6px;min-width:0}
.tl-status-grid span{font-size:10px;letter-spacing:1.4px;text-transform:uppercase;color:var(--wz-muted)}
.tl-status-grid strong{font:600 22px/1.2 'Bricolage Grotesque',sans-serif;letter-spacing:-.6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tl-bar{margin-top:20px;height:4px;border-radius:99px;background:var(--wz-raised);overflow:hidden}
.tl-bar i{display:block;height:100%;background:var(--wz-accent);border-radius:99px;transition:width .7s cubic-bezier(.2,.8,.2,1)}

/* Marquee */
.tl-marquee{overflow:hidden;border-bottom:1px solid var(--wz-line);background:color-mix(in srgb,var(--wz-panel) 55%,transparent);padding:18px 0}
.tl-marquee-track{display:flex;align-items:center;gap:26px;width:max-content;animation:tl-marquee 34s linear infinite}
.tl-marquee-track span{font:600 20px/1 'Bricolage Grotesque',sans-serif;letter-spacing:-.4px;color:var(--wz-muted);white-space:nowrap}
.tl-marquee-track span:nth-child(4n+1){color:var(--wz-text)}
.tl-marquee-track b{color:var(--wz-accent);font-size:18px}
@keyframes tl-marquee{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
.tl-marquee:hover .tl-marquee-track{animation-play-state:paused}

/* Sections */
.tl-section{padding:96px 0;border-bottom:1px solid var(--wz-line)}
.tl-section-alt{background:color-mix(in srgb,var(--wz-panel) 34%,transparent)}
.tl-section-head h2{font:600 clamp(32px,4.4vw,54px)/1.03 'Bricolage Grotesque',sans-serif;letter-spacing:-2px;margin:16px 0 0}
.tl-muted{color:var(--wz-muted);font-size:14px;line-height:1.7;max-width:40ch;margin-top:20px}
.tl-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:56px}
.tl-card{position:relative;border:1px solid var(--wz-line);border-radius:12px;padding:28px;background:var(--wz-panel);transition:border-color .22s,transform .22s cubic-bezier(.2,.8,.2,1),background .22s;will-change:transform}
.tl-card:hover{border-color:var(--wz-muted);background:var(--wz-raised)}
.tl-card-num{font:600 12px 'Manrope',sans-serif;letter-spacing:1.6px;color:var(--wz-accent)}
.tl-card h3{font:600 22px/1.2 'Bricolage Grotesque',sans-serif;letter-spacing:-.6px;margin:18px 0 12px}
.tl-card p{font-size:13.5px;line-height:1.68;color:var(--wz-muted);margin:0}
.tl-card-link{display:inline-block;margin-top:18px;font-size:12px;font-weight:800;color:var(--wz-text)}
.tl-card-link:hover{color:var(--wz-accent)}

/* Steps */
.tl-steps{list-style:none;padding:0;margin:56px 0 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;counter-reset:step}
.tl-steps li{display:flex;gap:18px;border:1px solid var(--wz-line);border-radius:12px;padding:26px;background:var(--wz-bg)}
.tl-steps li>span{flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;border:1px solid var(--wz-line);font:600 15px 'Bricolage Grotesque',sans-serif;color:var(--wz-accent)}
.tl-steps h3{font:600 18px/1.25 'Bricolage Grotesque',sans-serif;margin:4px 0 10px;letter-spacing:-.3px}
.tl-steps p{font-size:13px;line-height:1.65;color:var(--wz-muted);margin:0}
.tl-steps code{font:600 12px 'Manrope',sans-serif;background:var(--wz-raised);border:1px solid var(--wz-line);border-radius:5px;padding:2px 6px;color:var(--wz-text);overflow-wrap:anywhere}
.tl-note{margin-top:32px;font-size:12px;color:var(--wz-muted);max-width:60ch}

/* Split + rules */
.tl-split{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:64px;align-items:start}
.tl-rules{list-style:none;padding:0;margin:0;border-top:1px solid var(--wz-line)}
.tl-rules li{position:relative;padding:20px 0 20px 34px;border-bottom:1px solid var(--wz-line);font-size:14.5px;line-height:1.6;color:var(--wz-text)}
.tl-rules li:before{content:'';position:absolute;left:0;top:29px;width:9px;height:9px;border-radius:2px;background:var(--wz-accent);opacity:.85}

/* Links */
.tl-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:48px}
.tl-link{display:flex;flex-direction:column;border:1px solid var(--wz-line);border-radius:12px;padding:28px;background:var(--wz-bg);transition:border-color .2s,transform .2s}
.tl-link:hover{border-color:var(--wz-accent);transform:translateY(-3px)}
.tl-link span{font:600 26px/1.1 'Bricolage Grotesque',sans-serif;letter-spacing:-.8px}
.tl-link p{font-size:13px;line-height:1.6;color:var(--wz-muted);margin:12px 0 24px}
.tl-link b{margin-top:auto;font-size:12px;font-weight:800;color:var(--wz-accent)}

/* Footer */
.tl-footer{border-top:1px solid var(--wz-line);padding:48px 0;background:var(--wz-bg)}
.tl-footer-inner{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center}
.tl-footer-brand{display:flex;align-items:center;gap:14px}
.tl-footer-brand div{display:flex;flex-direction:column;gap:3px}
.tl-footer-brand strong{font-size:14px}
.tl-footer-brand span{font-size:11px;color:var(--wz-muted)}
.tl-footer nav{display:flex;gap:22px;flex-wrap:wrap}
.tl-footer nav a{font-size:12px;font-weight:700;color:var(--wz-muted)}
.tl-footer nav a:hover{color:var(--wz-text)}
.tl-fine{grid-column:1/-1;margin:8px 0 0;font-size:11px;color:var(--wz-muted);opacity:.75}

/* Motion */
.tl-reveal{opacity:0;transform:translateY(18px);transition:opacity .65s cubic-bezier(.2,.8,.2,1),transform .65s cubic-bezier(.2,.8,.2,1)}
.tl-reveal.is-in{opacity:1;transform:none}

@media (max-width:1000px){
  .tl-wrap,.tl-header{padding-left:24px;padding-right:24px}
  .tl-nav{display:none}
  .tl-join-sm{display:inline-flex}
  .tl-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tl-steps,.tl-links{grid-template-columns:1fr}
  .tl-split{grid-template-columns:1fr;gap:32px}
  .tl-title{letter-spacing:-3px}
  .tl-hero{padding:72px 0 56px}
  .tl-hero-inner{grid-template-columns:1fr;gap:8px}
  .tl-hero-model{height:380px;margin-top:-8px}
}
@media (max-width:760px){
  .tl-wrap,.tl-header{padding-left:18px;padding-right:18px}
  .tl-title{font-size:clamp(40px,12vw,64px);letter-spacing:-2px}
  .tl-lead{font-size:15px}
  .tl-hero{padding:56px 0 44px}
  .tl-cards{grid-template-columns:1fr;margin-top:36px}
  .tl-section{padding:64px 0}
  .tl-status-grid strong{font-size:18px}
  .tl-status-grid{gap:10px}
  .tl-hero-model{height:300px}
  .tl-title{overflow-wrap:anywhere}
  .tl-status{padding:20px}
  .tl-footer-inner{grid-template-columns:1fr;text-align:left}
  .tl-btn-lg{width:100%;justify-content:center}
  .tl-ip{width:100%;justify-content:center}
  .tl-marquee-track span{font-size:17px}
  .tl-ip-hint{display:none}
}
@media (prefers-reduced-motion:reduce){
  .tl-reveal{opacity:1;transform:none}
  .tl-marquee-track{animation:none}
  .tl-ip-dot,.tl-status.is-online .tl-status-dot{animation:none}
}
