
  :root{
    --bg:#0b0d10;
    --bg-alt:#14171c;
    --surface:#1b1f26;
    --surface-2:#20252c;
    --accent:#ffb020;
    --accent-soft:#ffb02022;
    --accent-2:#38f2c4;
    --accent-2-soft:#38f2c422;
    --text:#ece9e4;
    --muted:#8b909a;
    --muted-dim:#5f636c;
    --border:rgba(255,255,255,0.08);
    --danger:#ff5d5d;
  }

  *{margin:0;padding:0;box-sizing:border-box;}

  html{scroll-behavior:smooth;}

  body{
    background:var(--bg);
    color:var(--text);
    font-family:'Manrope',sans-serif;
    overflow-x:hidden;
    position:relative;
  }

  h1,h2,h3,.display{
    font-family:'Teko',sans-serif;
    font-weight:600;
    letter-spacing:0.01em;
    text-transform:uppercase;
    line-height:0.95;
  }

  .mono{font-family:'JetBrains Mono',monospace;}

  a{color:inherit;text-decoration:none;}

  ::selection{background:var(--accent);color:#0b0d10;}

  /* grain + scanline atmosphere */
  body::before{
    content:"";
    position:fixed;inset:0;
    pointer-events:none;
    z-index:200;
    background-image:
      repeating-linear-gradient(0deg, rgba(255,255,255,0.015) 0px, rgba(255,255,255,0.015) 1px, transparent 1px, transparent 3px);
    mix-blend-mode:overlay;
    opacity:0.5;
  }

  .noise-layer{
    position:fixed;inset:0;z-index:199;pointer-events:none;opacity:0.035;
    background-repeat:repeat;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  }

  /* ---------- cheetah spot motif (signature) ---------- */
  .spots{
    display:inline-flex;
    gap:6px;
    align-items:center;
  }
  .spots span{
    width:6px;height:6px;border-radius:50%;
    background:var(--accent);
    opacity:0.9;
  }
  .spots span:nth-child(2){width:9px;height:9px;opacity:0.7;}
  .spots span:nth-child(3){width:4px;height:4px;opacity:0.5;}
  .spot-rule{
    display:flex;align-items:center;gap:10px;
    color:var(--muted-dim);
  }
  .spot-rule::before, .spot-rule::after{
    content:"";
    height:1px;flex:1;
    background:linear-gradient(90deg, transparent, var(--border), transparent);
  }

  /* ---------- layout helpers ---------- */
  .wrap{max-width:1180px;margin:0 auto;padding:0 32px;}
  section{position:relative;padding:60px 0;}
  .eyebrow{
    font-family:'JetBrains Mono',monospace;
    font-size:12px;
    letter-spacing:0.22em;
    text-transform:uppercase;
    color:var(--accent-2);
    display:flex;align-items:center;gap:10px;
    margin-bottom:18px;
  }
  .eyebrow::before{content:"//";color:var(--muted-dim);}

  .reveal{
    opacity:0;
    transform:translateY(28px);
    transition:opacity 0.8s ease, transform 0.8s cubic-bezier(.2,.8,.2,1);
  }
  .reveal.in{opacity:1;transform:translateY(0);}

  /* ---------- nav ---------- */
  header{
    position:fixed;top:0;left:0;right:0;z-index:100;
    background:rgba(11,13,16,0.7);
    backdrop-filter:blur(14px);
    border-bottom:1px solid var(--border);
  }
  nav{
    max-width:1180px;margin:0 auto;padding:16px 32px;
    display:flex;align-items:center;justify-content:space-between;
  }
  .logo{
    display:flex;align-items:center;gap:10px;
    font-family:'Teko',sans-serif;font-size:26px;font-weight:600;
    letter-spacing:0.02em;
  }
  .logo-mark{
    width:120px;height:auto;border-radius:9px;  
    display:flex;align-items:center;justify-content:center;
    color:#0b0d10;font-weight:800;font-family:'Teko',sans-serif;font-size:20px;

    overflow:hidden;
    padding:2px;
  }
  .logo-mark img{width:100%;height:100%;object-fit:contain;}
  .logo .live-tag{
    font-family:'JetBrains Mono',monospace;
    font-size:10px;letter-spacing:0.15em;
    color:var(--accent-2);
    border:1px solid var(--accent-2);
    padding:2px 6px;border-radius:4px;
    margin-left:4px;
  }
  .nav-links{display:flex;gap:34px;align-items:center;}
  .nav-links a{
    font-size:14px;color:var(--muted);
    font-weight:600;
    transition:color .25s ease;
    position:relative;
  }
  .nav-links a:hover{color:var(--text);}
  .nav-cta{
    background:var(--accent);color:#fff!important ;
    padding:9px 18px;border-radius:8px;
    font-weight:700;font-size:14px;
    box-shadow:0 0 0 0 var(--accent-soft);
    transition:transform .2s ease, box-shadow .3s ease;
  }
  .nav-cta:hover{transform:translateY(-2px);box-shadow:0 8px 24px var(--accent-soft);}
  .burger{display:none;}

  @media (max-width:860px){
    .nav-links{display:none;}
    .burger{display:block;}
  }

  /* ---------- hero ---------- */
  .hero{
    min-height:100vh;
    display:flex;flex-direction:column;justify-content:center;
    padding-top:140px;
    position:relative;
    overflow:hidden;
  }
  .hero-bg{
    position:absolute;inset:0;z-index:0;
    background:
      radial-gradient(700px 500px at 82% 8%, var(--accent-soft), transparent 60%),
      radial-gradient(600px 500px at 8% 90%, var(--accent-2-soft), transparent 60%);
  }
  .hero-grid{
    position:absolute;inset:0;z-index:0;opacity:0.35;
    background-image:
      linear-gradient(var(--border) 1px, transparent 1px),
      linear-gradient(90deg, var(--border) 1px, transparent 1px);
    background-size:64px 64px;
    mask-image:radial-gradient(ellipse 900px 600px at 50% 30%, black 10%, transparent 75%);
  }
  .hero-content{position:relative;z-index:2;}
  .live-badge{
    display:inline-flex;align-items:center;gap:8px;
    font-family:'JetBrains Mono',monospace;
    font-size:12px;letter-spacing:0.14em;
    color:var(--accent-2);
    border:1px solid rgba(56,242,196,0.35);
    background:rgba(56,242,196,0.06);
    padding:7px 14px;border-radius:999px;
    margin-bottom:28px;
  }
  .live-dot{
    width:8px;height:8px;border-radius:50%;
    background:var(--danger);
    box-shadow:0 0 0 0 rgba(255,93,93,0.6);
    animation:pulse-dot 1.6s infinite;
  }
  @keyframes pulse-dot{
    0%{box-shadow:0 0 0 0 rgba(255,93,93,0.55);}
    70%{box-shadow:0 0 0 10px rgba(255,93,93,0);}
    100%{box-shadow:0 0 0 0 rgba(255,93,93,0);}
  }

  .hero h1{
    font-size:clamp(58px, 11vw, 148px);
    color:var(--text);
  }
  .hero h1 .line2{
    color:transparent;
    -webkit-text-stroke:1.5px var(--text);
  }
  .hero h1 .accent-word{
    color:var(--accent);
    -webkit-text-stroke:0;
  }

  .glitch-wrap{position:relative;display:inline-block;}
  .glitch-wrap::before, .glitch-wrap::after{
    content:attr(data-text);
    position:absolute;top:0;left:0;width:100%;
    overflow:hidden;color:var(--accent-2);
    clip-path:inset(0 0 0 0);
  }
  .glitch-wrap::before{animation:glitchTop 4.2s infinite linear; left:2px; color:var(--accent-2); opacity:.6;}
  .glitch-wrap::after{animation:glitchBottom 4.6s infinite linear; left:-2px; color:var(--danger); opacity:.45;}
  @keyframes glitchTop{
    0%,92%,100%{clip-path:inset(0 0 100% 0); transform:translate(0,0);}
    93%{clip-path:inset(10% 0 60% 0); transform:translate(-3px,-1px);}
    95%{clip-path:inset(50% 0 20% 0); transform:translate(3px,1px);}
    97%{clip-path:inset(0 0 100% 0);}
  }
  @keyframes glitchBottom{
    0%,90%,100%{clip-path:inset(100% 0 0 0); transform:translate(0,0);}
    91%{clip-path:inset(70% 0 5% 0); transform:translate(3px,1px);}
    94%{clip-path:inset(20% 0 65% 0); transform:translate(-2px,-1px);}
    96%{clip-path:inset(100% 0 0 0);}
  }

  .hero p.sub{
    font-size:18px;color:var(--muted);
    max-width:560px;margin-top:26px;line-height:1.65;
  }
  .hero-ctas{display:flex;gap:16px;margin-top:40px;flex-wrap:wrap;}
  .btn{
    display:inline-flex;align-items:center;gap:10px;
    padding:14px 26px;border-radius:10px;
    font-weight:700;font-size:15px;
    transition:transform .2s ease, box-shadow .3s ease, background .2s ease;
    border:1px solid transparent;
  }
  .btn-primary{
    background:var(--accent);color:#12100a;
  }
  .btn-primary:hover{transform:translateY(-3px);box-shadow:0 12px 30px var(--accent-soft);}
  .btn-ghost{
    border:1px solid var(--border);color:var(--text);
    background:rgba(255,255,255,0.02);
  }
  .btn-ghost:hover{border-color:var(--accent-2);color:var(--accent-2);transform:translateY(-3px);}

  .hero-social{
    display:flex;gap:14px;margin-top:56px;
  }
  .social-icon{
    width:42px;height:42px;border-radius:10px;
    border:1px solid var(--border);
    display:flex;align-items:center;justify-content:center;
    color:var(--muted);
    transition:all .25s ease;
  }
  .social-icon svg{width:18px;height:18px;}
  .social-icon:hover{
    color:var(--bg);background:var(--accent-2);
    border-color:var(--accent-2);
    transform:translateY(-4px) rotate(-4deg);
  }

  .scroll-cue{
    position:absolute;bottom:36px;left:32px;
    display:flex;align-items:center;gap:10px;
    color:var(--muted-dim);font-family:'JetBrains Mono',monospace;font-size:11px;
    letter-spacing:0.15em;z-index:2;
  }
  .scroll-cue .bar{width:1px;height:34px;background:var(--muted-dim);position:relative;overflow:hidden;}
  .scroll-cue .bar::after{
    content:"";position:absolute;top:-100%;left:0;width:100%;height:100%;
    background:var(--accent-2);
    animation:scrollbar 1.8s infinite ease-in-out;
  }
  @keyframes scrollbar{
    0%{top:-100%;}
    50%{top:0%;}
    100%{top:100%;}
  }

  /* ---------- section shared ---------- */
  .section-head{max-width:640px;margin-bottom:64px;}
  .section-head h2{font-size:clamp(38px,5vw,64px);}
  .section-head p{color:var(--muted);margin-top:16px;font-size:16.5px;line-height:1.7;}

  .bg-alt{background:var(--bg-alt);}

  /* ---------- about ---------- */
  .about-grid{
    display:grid;grid-template-columns:0.9fr 1.1fr;gap:64px;align-items:start;
  }
  .avatar-card{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:20px;
    padding:34px;
    position:relative;
    overflow:hidden;
  }
  .avatar-card::before{
    content:"";position:absolute;inset:0;
    background:conic-gradient(from 0deg, var(--accent-soft), transparent 30%, var(--accent-2-soft), transparent 70%);
    animation:rotateGlow 12s linear infinite;
    opacity:0.6;
  }
  @keyframes rotateGlow{to{transform:rotate(360deg);}}
  .avatar-inner{position:relative;z-index:1;}
  .avatar-ring{
    width:96px;height:96px;border-radius:50%;
    background:linear-gradient(145deg,var(--accent),#8a5308);
    display:flex;align-items:center;justify-content:center;
    font-family:'Teko',sans-serif;font-size:44px;color:#100d09;font-weight:700;
    margin-bottom:22px;
    box-shadow:0 0 0 4px var(--bg), 0 0 0 6px var(--accent);
  }
  .avatar-card h3{font-size:30px;color:var(--text);}
  .avatar-card .tag{
    font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--accent-2);
    letter-spacing:0.1em;margin-top:4px;display:block;
  }
  .avatar-stats{
    display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:28px;
  }
  .avatar-stats div{
    border-top:1px solid var(--border);padding-top:12px;
  }
  .avatar-stats .num{font-family:'Teko',sans-serif;font-size:30px;color:var(--accent);}
  .avatar-stats .lbl{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:0.08em;}

  .about-copy p{color:var(--muted);line-height:1.85;font-size:16px;margin-bottom:20px;}
  .about-copy strong{color:var(--text);}
  .about-copy .highlight{
    color:var(--accent-2);font-weight:700;
  }

  .tag-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px;}
  .tag-pill{
    font-family:'JetBrains Mono',monospace;font-size:12px;
    border:1px solid var(--border);border-radius:999px;
    padding:6px 14px;color:var(--muted);
  }

  /* ---------- timeline (story) ---------- */
  .timeline{
    display:flex;flex-direction:column;gap:0;
    border-left:1px solid var(--border);
    margin-left:14px;
  }
  .t-item{
    position:relative;padding:0 0 56px 44px;
  }
  .t-item:last-child{padding-bottom:0;}
  .t-item::before{
    content:"";position:absolute;left:-6.5px;top:2px;
    width:12px;height:12px;border-radius:50%;
    background:var(--bg);border:2px solid var(--accent);
  }
  .t-item .lvl{
    font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--accent);
    letter-spacing:0.15em;margin-bottom:6px;display:block;
  }
  .t-item h3{font-size:32px;color:var(--text);margin-bottom:10px;}
  .t-item p{color:var(--muted);line-height:1.75;font-size:15.5px;max-width:640px;}

  /* ---------- grind chart (signature) ---------- */
  .grind-section{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:24px;
    padding:56px;
    position:relative;
    overflow:hidden;
  }
  .grind-section::after{
    content:"24H CYCLE";
    position:absolute;right:36px;top:30px;
    font-family:'JetBrains Mono',monospace;
    font-size:12px;color:var(--muted-dim);letter-spacing:0.2em;
  }
  .grind-bar{
    display:flex;width:100%;height:20px;border-radius:999px;overflow:hidden;
    background:var(--bg-alt);margin:34px 0 30px;
    border:1px solid var(--border);
  }
  .grind-seg{
    height:100%;width:0%;
    transition:width 1.4s cubic-bezier(.2,.8,.2,1);
  }
  .seg-travel{background:var(--muted-dim);}
  .seg-work{background:var(--accent-2);}
  .seg-stream{background:var(--accent);}
  .seg-rest{background:#3a3f47;}

  .grind-legend{
    display:grid;grid-template-columns:repeat(4,1fr);gap:20px;
  }
  .grind-legend div{border-top:1px solid var(--border);padding-top:14px;}
  .grind-legend .swatch{width:10px;height:10px;border-radius:3px;display:inline-block;margin-right:8px;}
  .grind-legend .val{
    font-family:'Teko',sans-serif;font-size:40px;color:var(--text);display:block;margin-top:6px;
  }
  .grind-legend .lbl{font-size:12.5px;color:var(--muted);text-transform:uppercase;letter-spacing:0.06em;}

  .grind-quote{
    margin-top:36px;padding-top:30px;border-top:1px dashed var(--border);
    font-family:'Teko',sans-serif;font-size:clamp(24px,3vw,34px);color:var(--muted);
    text-transform:none;letter-spacing:0;
  }
  .grind-quote span{color:var(--accent);}

  @media (max-width:760px){
    .grind-legend{grid-template-columns:1fr 1fr;}
    .about-grid{grid-template-columns:1fr;}
  }

  /* ---------- family section ---------- */
  .family-wrap{
    display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;
  }
  .family-card{
    background:linear-gradient(160deg, var(--surface), var(--surface-2));
    border:1px solid var(--border);border-radius:22px;padding:44px;
    position:relative;
  }
  .cheetah-name{
    font-family:'Teko',sans-serif;font-size:64px;color:var(--accent);
    display:flex;align-items:center;gap:16px;
  }
  .family-card .sub-lbl{
    font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--muted);
    letter-spacing:0.14em;margin-top:6px;display:block;
  }
  .value-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:34px;}
  .value-item{
    border:1px solid var(--border);border-radius:14px;padding:18px;
    transition:border-color .25s ease, transform .25s ease;
  }
  .value-item:hover{border-color:var(--accent-2);transform:translateY(-4px);}
  .value-item h4{font-family:'Teko',sans-serif;font-size:22px;color:var(--text);letter-spacing:0.02em;}
  .value-item p{font-size:13px;color:var(--muted);margin-top:6px;line-height:1.6;text-transform:none;}

  .family-copy p{color:var(--muted);line-height:1.85;font-size:16px;margin-bottom:18px;}
  .family-copy strong{color:var(--text);}

  @media (max-width:900px){
    .family-wrap{grid-template-columns:1fr;}
  }

  /* ---------- FAQ ---------- */
  .faq-list{max-width:820px;}
  .faq-item{
    border-bottom:1px solid var(--border);
  }
  .faq-q{
    display:flex;justify-content:space-between;align-items:center;
    padding:26px 4px;cursor:pointer;
    gap:20px;
  }
  .faq-q h3{
    font-family:'Manrope',sans-serif;text-transform:none;font-weight:700;
    font-size:18px;color:var(--text);letter-spacing:0;
  }
  .faq-index{
    font-family:'JetBrains Mono',monospace;color:var(--muted-dim);font-size:13px;min-width:34px;
  }
  .faq-icon{
    width:26px;height:26px;border-radius:50%;
    border:1px solid var(--border);
    display:flex;align-items:center;justify-content:center;
    position:relative;flex-shrink:0;
    transition:transform .3s ease, border-color .3s ease;
  }
  .faq-icon::before,.faq-icon::after{
    content:"";position:absolute;background:var(--muted);
  }
  .faq-icon::before{width:10px;height:1.5px;}
  .faq-icon::after{width:1.5px;height:10px;transition:transform .3s ease;}
  .faq-item.open .faq-icon::after{transform:rotate(90deg);}
  .faq-item.open .faq-icon{border-color:var(--accent-2);transform:rotate(180deg);}
  .faq-a{
    max-height:0;overflow:hidden;
    transition:max-height .4s ease, padding .4s ease;
  }
  .faq-a p{
    color:var(--muted);font-size:15px;line-height:1.75;padding:0 4px 26px 54px;max-width:680px;
  }
  .faq-item.open .faq-a{max-height:240px;}

  /* ---------- footer / CTA ---------- */
  .cta-band{
    text-align:center;padding:100px 0;position:relative;
    background:
      radial-gradient(600px 300px at 50% 100%, var(--accent-2-soft), transparent 70%);
  }
  .cta-band h2{font-size:clamp(42px,7vw,88px);}
  .cta-band p{color:var(--muted);max-width:520px;margin:18px auto 36px;}
  .cta-row{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;}

  footer{
    border-top:1px solid var(--border);
    padding:48px 0 32px;
  }
  .foot-row{
    display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:24px;
  }
  .foot-brand{display:flex;align-items:center;gap:10px;}
  .foot-links{display:flex;gap:14px;}
  .foot-note{
    font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--muted-dim);
    margin-top:28px;text-align:center;letter-spacing:0.04em;
  }

  @media(max-width:640px){
    section{padding:80px 0;}
    .wrap{padding:0 20px;}
    .foot-row{flex-direction:column;text-align:center;}
  }
  /* Past Live Streams section */
  .streams-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:28px;
    margin-top:20px;
  }
  @media (max-width: 900px){
    .streams-grid{ grid-template-columns:1fr; }
  }
  .stream-card{
    position:relative;
    border-radius:16px;
    padding:10px;
    background:rgba(255,255,255,0.03);
    border:1px solid rgba(255,255,255,0.08);
    transition:transform .35s ease, border-color .35s ease, box-shadow .35s ease;
  }
  .stream-card:hover{
    transform:translateY(-6px);
    border-color:var(--accent, #ff2e4d);
    box-shadow:0 20px 40px -20px rgba(0,0,0,0.6);
  }
  .stream-frame{
    position:relative;
    width:100%;
    padding-bottom:56.25%; /* 16:9 */
    height:0;
    overflow:hidden;
    border-radius:10px;
    background:#000;
  }
  .stream-frame iframe{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    border:0;
    border-radius:10px;
  }
  .stream-label{
    display:flex;
    align-items:center;
    gap:8px;
    margin-top:14px;
    padding:0 4px 4px;
    color:var(--muted, #9aa0a6);
    font-family:'JetBrains Mono', monospace;
    font-size:12px;
    letter-spacing:.04em;
    text-transform:uppercase;
  }
  .stream-label .live-dot{
    width:7px;
    height:7px;
    border-radius:50%;
    background:var(--accent, #ff2e4d);
    display:inline-block;
  }
  
