/*
Theme Name: THYLA Official
Theme URI: https://thylaofficial.com/
Author: THYLA
Description: Custom WordPress theme converted from the current THYLA official one-page website.
Version: 1.0.0
Text Domain: thyla
*/


    :root{
      --bg:#05060a;
      --bg-soft:#0a0c12;
      --text:#f5f7fb;
      --muted:#8e95a7;
      --line:rgba(255,255,255,.12);
      --magenta:#ff2abf;
      --purple:#9a4dff;
      --cyan:#2ce8ff;
      --max:1320px;
      --header-h:82px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      color:var(--text);
      background:
        radial-gradient(circle at 20% 0%, rgba(255,42,191,.06), transparent 28rem),
        radial-gradient(circle at 80% 0%, rgba(44,232,255,.05), transparent 28rem),
        var(--bg);
      font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      overflow-x:hidden;
    }
    a{color:inherit;text-decoration:none}
    button{font:inherit}
    .wrap{width:min(calc(100% - 44px),var(--max));margin:auto}
    .eyebrow{
      letter-spacing:.22em;text-transform:uppercase;font-size:.72rem;color:var(--muted);
    }
    .section{
      position:relative;
      padding:120px 0;
      border-top:1px solid var(--line);
      background:linear-gradient(180deg,rgba(255,255,255,.012),transparent 40%);
    }
    h1,h2,h3,p{margin-top:0}
    h2{
      font-size:clamp(2.4rem,5vw,5rem);
      line-height:.94;
      letter-spacing:-.045em;
      font-weight:550;
      margin-bottom:48px;
    }

    /* HEADER */
    .site-header{
      position:fixed;inset:0 0 auto 0;height:var(--header-h);
      z-index:50;
      backdrop-filter:blur(18px);
      background:linear-gradient(to bottom,rgba(5,6,10,.82),rgba(5,6,10,.35));
      border-bottom:1px solid rgba(255,255,255,.08);
    }
    .nav{
      height:100%;display:flex;align-items:center;justify-content:space-between;gap:30px;
    }
    .brand{
      font-weight:300;font-size:1.5rem;letter-spacing:.36em;white-space:nowrap;
    }
    .brand .a{display:inline-block;transform:scaleX(.82)}
    .nav-links{
      display:flex;align-items:center;gap:30px;
      font-size:.77rem;letter-spacing:.16em;text-transform:uppercase;color:#d9deea;
    }
    .nav-links a{position:relative;padding:8px 0}
    .nav-links a:after{
      content:"";position:absolute;left:0;bottom:0;width:0;height:1px;
      background:linear-gradient(90deg,var(--magenta),var(--cyan));
      transition:width .25s ease;
    }
    .nav-links a:hover:after{width:100%}
    .menu-btn{display:none;background:none;border:0;color:white;padding:10px}
    .menu-btn span{display:block;width:26px;height:1px;background:#fff;margin:6px 0}

    /* HERO */
    .hero{
      min-height:100svh;
      position:relative;isolation:isolate;
      overflow:hidden;
      display:grid;place-items:center;
      background:#05060a;
    }
    .hero-video::-webkit-media-controls{display:none!important}
    .hero-video{
      position:absolute;inset:0;width:100%;height:100%;
      object-fit:cover;object-position:center;
      z-index:-3;
      filter:saturate(1.08) contrast(1.04) brightness(.92);
    }
    .hero:after{
      content:"";position:absolute;inset:0;z-index:-2;
      background:
        linear-gradient(180deg,rgba(5,6,10,.10) 0%,rgba(5,6,10,.06) 48%,rgba(5,6,10,.72) 100%),
        radial-gradient(circle at center,rgba(5,6,10,0) 0%,rgba(5,6,10,.06) 58%,rgba(5,6,10,.26) 100%);
      pointer-events:none;
    }
    .hero-content{
      padding-top:var(--header-h);
      width:min(94%,1180px);
      text-align:center;
    }
    .hero-logo{
      font-size:clamp(4.8rem,15vw,11.7rem);
      font-weight:200;
      letter-spacing:.27em;
      padding-left:.27em;
      line-height:.8;
      text-shadow:0 0 44px rgba(255,255,255,.04);
    }
    .hero-sub{
      margin:32px auto 0;
      color:#c4cad7;
      max-width:620px;
      letter-spacing:.23em;
      font-size:.72rem;
      text-transform:uppercase;
    }
    .hero-cta{
      display:inline-flex;align-items:center;gap:14px;
      margin-top:48px;padding:14px 20px 14px 22px;
      border:1px solid rgba(255,255,255,.22);
      border-radius:999px;
      font-size:.73rem;letter-spacing:.15em;text-transform:uppercase;
      background:rgba(255,255,255,.025);
      transition:.25s ease;
    }
    .hero-cta:hover{
      transform:translateY(-2px);
      background:rgba(255,255,255,.08);
      border-color:rgba(255,255,255,.45);
    }
    .hero-cta i{
      width:7px;height:7px;border-right:1px solid white;border-bottom:1px solid white;
      transform:rotate(-45deg);display:block;
    }
    .scroll-hint{
      position:absolute;bottom:28px;left:50%;transform:translateX(-50%);
      color:#858c9d;font-size:.64rem;letter-spacing:.22em;text-transform:uppercase;
      display:flex;flex-direction:column;align-items:center;gap:12px;
    }
    .scroll-hint:after{content:"";width:1px;height:34px;background:linear-gradient(#727889,transparent)}

    /* LATEST */
    .latest-grid{
      display:grid;grid-template-columns:1.08fr .92fr;gap:70px;align-items:center;
    }
    .cover{
      aspect-ratio:1/1;position:relative;overflow:hidden;
      border:1px solid rgba(255,255,255,.08);
      background:
        radial-gradient(circle at 30% 30%,rgba(255,42,191,.55),transparent 28%),
        radial-gradient(circle at 70% 65%,rgba(44,232,255,.52),transparent 30%),
        linear-gradient(135deg,#111220,#020307 60%);
    }
    .cover:before,.cover:after{
      content:"";position:absolute;inset:-20%;
      border:1px solid rgba(255,255,255,.08);
      border-radius:47% 53% 38% 62%;
      transform:rotate(18deg);
      box-shadow:0 0 70px rgba(255,42,191,.14);
    }
    .cover:after{transform:rotate(-22deg) scale(.74);box-shadow:0 0 70px rgba(44,232,255,.18)}
    .cover-title{
      position:absolute;left:8%;bottom:8%;z-index:2;
      font-size:clamp(2rem,4vw,4rem);letter-spacing:-.04em;font-weight:500;
    }
    .release-copy h3{
      font-size:clamp(2.7rem,5vw,5.4rem);line-height:.92;letter-spacing:-.05em;font-weight:500;margin:14px 0 18px;
    }
    .release-copy p{color:var(--muted);font-size:1.03rem;line-height:1.7;max-width:520px}
    .actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
    .btn{
      border:1px solid rgba(255,255,255,.18);
      padding:13px 18px;border-radius:999px;
      font-size:.73rem;letter-spacing:.14em;text-transform:uppercase;
      transition:.25s;background:rgba(255,255,255,.025)
    }
    .btn.primary{background:#f5f7fb;color:#08090d;border-color:#f5f7fb}
    .btn:hover{transform:translateY(-2px)}

    /* CARDS */
    .card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
    .music-card,.product-card,.video-card{
      border:1px solid var(--line);background:rgba(255,255,255,.018);overflow:hidden;
      transition:.3s ease;
    }
    .music-card:hover,.product-card:hover,.video-card:hover{transform:translateY(-5px);border-color:rgba(255,255,255,.22)}
    .art{
      aspect-ratio:1/1;
      background:
        radial-gradient(circle at 75% 25%,rgba(44,232,255,.26),transparent 32%),
        radial-gradient(circle at 25% 65%,rgba(255,42,191,.28),transparent 35%),
        linear-gradient(145deg,#11131c,#05060a);
      position:relative;
    }
    .art.two{background:
      linear-gradient(165deg,transparent 20%,rgba(255,42,191,.25) 48%,transparent 70%),
      radial-gradient(circle at 70% 40%,rgba(44,232,255,.25),transparent 34%),
      #080910;}
    .art.three{background:
      radial-gradient(ellipse at center,rgba(255,42,191,.32),transparent 15%),
      repeating-radial-gradient(ellipse at center,rgba(44,232,255,.10) 0 1px,transparent 2px 18px),
      #07080c;}
    .card-copy{padding:18px 18px 22px}
    .card-copy h3{font-size:1.1rem;font-weight:500;margin:4px 0 7px}
    .card-copy p{color:var(--muted);margin:0;font-size:.84rem}


    /* LATEST RELEASE */
    .latest-release{
      position:relative;
      padding:140px 0 110px;
      background:
        radial-gradient(ellipse at 24% 50%,rgba(255,42,191,.15) 0%,rgba(255,42,191,.075) 24%,transparent 55%),
        radial-gradient(ellipse at 77% 48%,rgba(44,232,255,.13) 0%,rgba(44,232,255,.065) 25%,transparent 56%),
        radial-gradient(ellipse at 52% 58%,rgba(92,54,255,.07) 0%,transparent 48%),
        linear-gradient(180deg,#05060a 0%,#07080c 100%);
    }
    .latest-release-grid{
      min-height:690px;
      display:grid;
      grid-template-columns:minmax(0,1.12fr) minmax(360px,.88fr);
      gap:clamp(48px,7vw,110px);
      align-items:center;
    }
    .latest-visual{
      position:relative;
      min-height:640px;
      display:grid;
      place-items:center;
    }
    .latest-artwork{
      position:relative;
      z-index:2;
      width:min(100%,610px);
      aspect-ratio:1;
      overflow:hidden;
      border:1px solid rgba(255,255,255,.10);
      background:
        radial-gradient(circle at 30% 30%,rgba(255,42,191,.50),transparent 28%),
        radial-gradient(circle at 72% 68%,rgba(44,232,255,.42),transparent 30%),
        linear-gradient(135deg,#131421 0%,#06070b 58%,#020306 100%);
      box-shadow:
        0 50px 100px rgba(0,0,0,.36),
        0 0 80px rgba(255,42,191,.06);
    }

    .latest-artwork-real{
      background:#05060a;
    }
    .latest-artwork-real img{
      position:absolute;
      inset:0;
      width:100%;
      height:100%;
      object-fit:cover;
      display:block;
      z-index:2;
    }
    .latest-artwork-real:before,
    .latest-artwork-real:after{
      display:none;
    }

    .latest-artwork:before{
      content:"";
      position:absolute;
      inset:-12%;
      background:
        repeating-radial-gradient(
          ellipse at 45% 52%,
          rgba(255,255,255,.08) 0 1px,
          transparent 2px 24px
        );
      opacity:.25;
      transform:rotate(-12deg) scale(1.25);
      mix-blend-mode:screen;
    }
    .latest-artwork:after{
      content:"";
      position:absolute;
      inset:0;
      background:
        linear-gradient(180deg,transparent 58%,rgba(0,0,0,.44) 100%),
        radial-gradient(circle at center,transparent 0%,rgba(0,0,0,.10) 60%,rgba(0,0,0,.32) 100%);
    }
    .latest-artwork-title{
      position:absolute;
      left:7%;
      bottom:9%;
      z-index:3;
      font-size:clamp(2.6rem,5.2vw,5.6rem);
      line-height:.88;
      font-weight:500;
      letter-spacing:-.055em;
    }
    .latest-artwork-kicker{
      position:absolute;
      right:7%;
      top:7%;
      z-index:3;
      color:rgba(255,255,255,.68);
      font-size:.67rem;
      letter-spacing:.21em;
      text-transform:uppercase;
    }
    .latest-glow{
      position:absolute;
      width:46%;
      aspect-ratio:1;
      filter:blur(70px);
      opacity:.24;
      border-radius:50%;
      z-index:0;
      pointer-events:none;
    }
    .glow-magenta{
      left:2%;
      top:18%;
      background:rgba(255,42,191,.34);
    }
    .glow-cyan{
      right:0;
      bottom:16%;
      background:rgba(44,232,255,.24);
    }
    .latest-copy{
      max-width:560px;
    }
    .latest-title{
      margin:15px 0 8px;
      font-size:clamp(2.4rem,4.2vw,4.6rem);
      line-height:.9;
      letter-spacing:-.06em;
      font-family:Inter,Arial,Helvetica,sans-serif;
      font-weight:700;
      letter-spacing:.06em;
    }
    .latest-subtitle{
      color:#d9deea;
      font-size:.82rem;
      letter-spacing:.28em;
      text-transform:uppercase;
      margin-bottom:30px;
    }
    .latest-description{
      max-width:510px;
      color:var(--muted);
      font-size:1.03rem;
      line-height:1.75;
    }
    .latest-actions{
      margin-top:34px;
    }



    .section-scroll-next{
      position:absolute;
      left:50%;
      bottom:26px;
      transform:translateX(-50%);
      z-index:4;
      width:54px;
      height:54px;
      display:grid;
      place-items:center;
      text-decoration:none;
    }
    .section-scroll-arrow{
      display:block;
      font-size:2.35rem;
      line-height:1;
      font-weight:300;
      background:linear-gradient(90deg,var(--magenta),var(--purple),var(--cyan));
      -webkit-background-clip:text;
      background-clip:text;
      color:transparent;
      filter:
        drop-shadow(-4px 0 10px rgba(255,42,191,.28))
        drop-shadow(4px 0 10px rgba(44,232,255,.28));
      animation:sectionArrowFloat 1.8s ease-in-out infinite;
      transition:filter .25s ease, transform .25s ease;
    }
    .section-scroll-next:hover .section-scroll-arrow{
      filter:
        drop-shadow(-5px 0 16px rgba(255,42,191,.62))
        drop-shadow(5px 0 16px rgba(44,232,255,.62));
    }
    @keyframes sectionArrowFloat{
      0%,100%{transform:translateY(0)}
      50%{transform:translateY(7px)}
    }

    /* FEATURED TRACK */
    .featured-track{
      padding:125px 0;
      background:
        radial-gradient(circle at 78% 46%,rgba(44,232,255,.06),transparent 30rem),
        radial-gradient(circle at 22% 55%,rgba(255,42,191,.07),transparent 30rem),
        #05060a;
    }
    .featured-grid{
      display:grid;
      grid-template-columns:minmax(320px,.86fr) minmax(0,1.14fr);
      gap:clamp(46px,7vw,100px);
      align-items:center;
    }
    .featured-copy{
      max-width:560px;
    }
    .featured-copy h2{
      margin:14px 0 8px;
      font-family:Inter,Arial,Helvetica,sans-serif;
      font-size:clamp(2.45rem,4.2vw,4.7rem);
      line-height:1.02;
      letter-spacing:.045em;
      font-weight:700;
    }
    .featured-meta{
      margin-bottom:28px;
      color:#d9deea;
      font-size:.78rem;
      letter-spacing:.24em;
      text-transform:uppercase;
    }
    .featured-copy p{
      max-width:500px;
      color:var(--muted);
      font-size:1rem;
      line-height:1.75;
    }
    .featured-media{
      position:relative;
    }
    .featured-cover{
      display:block;
      aspect-ratio:1;
      overflow:hidden;
      border:1px solid rgba(255,255,255,.10);
      box-shadow:0 42px 90px rgba(0,0,0,.34);
    }
    .featured-cover img{
      width:100%;
      height:100%;
      object-fit:cover;
      display:block;
      transition:transform .55s ease;
    }
    .featured-cover:hover img{
      transform:scale(1.018);
    }
    .featured-video-badge{
      position:absolute;
      right:18px;
      bottom:18px;
      display:flex;
      align-items:center;
      gap:9px;
      padding:10px 13px;
      border:1px solid rgba(255,255,255,.18);
      border-radius:999px;
      background:rgba(5,6,10,.58);
      backdrop-filter:blur(10px);
      font-size:.66rem;
      letter-spacing:.15em;
      text-transform:uppercase;
    }
    .featured-video-badge:before{
      content:"";
      width:0;
      height:0;
      border-top:5px solid transparent;
      border-bottom:5px solid transparent;
      border-left:8px solid white;
    }


    .featured-carousel{
      position:relative;
    }
    .featured-grid{
      transition:opacity .28s ease, transform .28s ease;
    }
    .featured-grid.switching{
      opacity:.22;
      transform:translateY(8px);
    }
    .featured-nav{
      margin-top:42px;
      display:flex;
      align-items:center;
      gap:18px;
    }
    .featured-arrow{
      appearance:none;
      border:0;
      background:transparent;
      padding:4px 2px;
      font-size:2.05rem;
      font-weight:300;
      line-height:1;
      cursor:pointer;
      transition:transform .22s ease,text-shadow .22s ease,opacity .22s ease;
    }
    .featured-prev{
      color:var(--magenta);
      text-shadow:0 0 14px rgba(255,42,191,.24);
    }
    .featured-next{
      color:var(--cyan);
      text-shadow:0 0 14px rgba(44,232,255,.24);
    }
    .featured-prev:hover{
      transform:translateX(-3px);
      text-shadow:0 0 22px rgba(255,42,191,.70);
    }
    .featured-next:hover{
      transform:translateX(3px);
      text-shadow:0 0 22px rgba(44,232,255,.70);
    }
    .featured-arrow:active{
      transform:scale(.92);
    }
    .featured-count{
      color:rgba(255,255,255,.64);
      font-size:.68rem;
      letter-spacing:.18em;
      min-width:64px;
      text-align:center;
    }

    .featured-cover{
      position:relative;
    }
    .featured-cover::after{
      content:"";
      position:absolute;
      inset:0;
      pointer-events:none;
      opacity:.18;
      mix-blend-mode:screen;
      transition:background .3s ease,opacity .3s ease;
      background:var(--track-overlay,linear-gradient(135deg,rgba(255,42,191,.18),rgba(44,232,255,.10)));
    }

    .featured-cover.placeholder-cover{
      display:grid;
      place-items:end start;
      padding:34px;
      background:
        radial-gradient(circle at 25% 30%,rgba(255,42,191,.26),transparent 30%),
        radial-gradient(circle at 74% 68%,rgba(44,232,255,.23),transparent 34%),
        linear-gradient(145deg,#12141d,#05060a 66%);
    }
    .featured-cover.placeholder-cover:after{
      content:attr(data-label);
      font-size:clamp(1.65rem,3vw,3rem);
      font-weight:700;
      letter-spacing:.05em;
      line-height:.95;
      color:white;
      white-space:pre-line;
    }
    .featured-cover.placeholder-cover img{
      display:none;
    }


    /* ABOUT */
    .about{position:relative;overflow:hidden;padding:140px 0;background:radial-gradient(ellipse at 18% 48%,rgba(255,42,191,.10),transparent 42%),radial-gradient(ellipse at 82% 50%,rgba(44,232,255,.09),transparent 44%),#05060a}
    .about-grid{display:grid;grid-template-columns:.88fr 1.12fr;gap:clamp(50px,8vw,120px);align-items:center}
    .about-visual{position:relative;min-height:560px;border:1px solid rgba(255,255,255,.09);background:linear-gradient(145deg,rgba(255,255,255,.025),rgba(255,255,255,0)),radial-gradient(circle at 34% 35%,rgba(255,42,191,.18),transparent 34%),radial-gradient(circle at 70% 67%,rgba(44,232,255,.16),transparent 38%),#090a10;overflow:hidden}
    .about-visual:before{content:"THYLA";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:clamp(4.5rem,10vw,9rem);font-weight:200;letter-spacing:.22em;padding-left:.22em;color:rgba(255,255,255,.075)}
    .about-copy{max-width:650px}.about-copy h2{margin:14px 0 28px;font-size:clamp(3rem,5vw,5.5rem);line-height:.96;font-weight:700;letter-spacing:.055em}.about-copy p{margin:0 0 18px;max-width:610px;color:var(--muted);font-size:1rem;line-height:1.82}
    .about-follow{margin-top:42px;padding-top:28px;border-top:1px solid rgba(255,255,255,.09)}.about-follow-label{margin-bottom:17px;font-size:.68rem;letter-spacing:.23em;color:#d8dce6}.about-socials{display:flex;flex-wrap:wrap;gap:10px 22px}.about-socials a{font-size:.72rem;letter-spacing:.13em;color:#9da3b1;transition:.2s}.about-socials a:hover{color:white;text-shadow:-2px 0 10px rgba(255,42,191,.4),2px 0 10px rgba(44,232,255,.4)}
    @media(max-width:850px){.about{padding:96px 0}.about-grid{grid-template-columns:1fr;gap:42px}.about-visual{min-height:420px}}


    .about-visual-image::before,
    .about-visual-image::after{
      display:none !important;
    }
    .about-visual-image img{
      position:absolute;
      inset:0;
      width:100%;
      height:100%;
      object-fit:cover;
      object-position:center;
      display:block;
    }







    /* LYRICS */
    .lyrics-box{
      min-height:430px;border:1px solid var(--line);padding:clamp(28px,6vw,80px);
      display:flex;flex-direction:column;justify-content:center;
      background:
        radial-gradient(circle at 18% 40%,rgba(255,42,191,.08),transparent 30rem),
        radial-gradient(circle at 82% 60%,rgba(44,232,255,.07),transparent 30rem);
    }
    .lyrics-box h2{margin-bottom:20px}
    .search{
      width:100%;max-width:720px;margin-top:24px;display:flex;
      border-bottom:1px solid rgba(255,255,255,.32);
    }
    .search input{
      width:100%;padding:18px 0;background:transparent;border:0;outline:0;color:white;
      font-size:clamp(1.1rem,2vw,1.45rem);
    }
    .search button{background:none;border:0;color:#bbb;font-size:1.35rem}

    /* VIDEO */
    .video-main{
      aspect-ratio:16/8.3;position:relative;overflow:hidden;border:1px solid var(--line);
      display:grid;place-items:center;
      background:
        linear-gradient(120deg,rgba(255,42,191,.25),transparent 36%),
        radial-gradient(circle at 72% 38%,rgba(44,232,255,.22),transparent 30%),
        linear-gradient(135deg,#141522,#05060a 70%);
    }
    .play{
      width:74px;height:74px;border-radius:50%;border:1px solid rgba(255,255,255,.4);
      display:grid;place-items:center;background:rgba(0,0,0,.18);backdrop-filter:blur(8px)
    }
    .play:after{content:"";border-top:8px solid transparent;border-bottom:8px solid transparent;border-left:13px solid white;margin-left:4px}


    /* DISCOGRAPHY */
    .discography{
      position:relative;
      padding:135px 0;
      background:
        radial-gradient(circle at 12% 42%,rgba(255,42,191,.055),transparent 28rem),
        radial-gradient(circle at 88% 58%,rgba(44,232,255,.05),transparent 30rem),
        #05060a;
    }
    .discography-head{
      display:flex;
      align-items:flex-end;
      justify-content:space-between;
      gap:30px;
      margin-bottom:44px;
    }
    .discography-head h2{
      margin-bottom:0;
    }
    .disc-filter{
      display:flex;
      flex-wrap:wrap;
      gap:10px 18px;
      padding-bottom:9px;
    }
    .disc-filter button{
      border:0;
      background:transparent;
      color:rgba(255,255,255,.42);
      padding:5px 0;
      font-size:.67rem;
      letter-spacing:.18em;
      text-transform:uppercase;
      cursor:pointer;
      position:relative;
      transition:color .2s ease;
    }
    .disc-filter button::after{
      content:"";
      position:absolute;
      left:0;
      right:100%;
      bottom:-2px;
      height:1px;
      background:linear-gradient(90deg,var(--magenta),var(--cyan));
      transition:right .25s ease;
    }
    .disc-filter button.active,
    .disc-filter button:hover{
      color:white;
    }
    .disc-filter button.active::after{
      right:0;
    }

    .discography-grid{
      display:grid;
      grid-template-columns:repeat(3,minmax(0,1fr));
      gap:34px 24px;
    }
    .release-card{
      display:block;
      min-width:0;
      transition:transform .3s ease,opacity .3s ease;
    }
    .release-card.hidden-release{
      display:none;
    }
    .release-card:hover{
      transform:translateY(-5px);
    }
    .release-cover{
      position:relative;
      aspect-ratio:1;
      overflow:hidden;
      border:1px solid rgba(255,255,255,.085);
      background:
        radial-gradient(circle at 28% 32%,rgba(255,42,191,.22),transparent 30%),
        radial-gradient(circle at 72% 70%,rgba(44,232,255,.20),transparent 34%),
        #0b0c12;
      box-shadow:0 30px 65px rgba(0,0,0,.25);
    }
    .release-cover img{
      width:100%;
      height:100%;
      object-fit:cover;
      display:block;
      transition:transform .45s ease,filter .45s ease;
    }
    .release-card:hover .release-cover img{
      transform:scale(1.018);
    }
    .release-cover-fallback{
      width:100%;
      height:100%;
      display:grid;
      place-items:end start;
      padding:24px;
      background:
        linear-gradient(145deg,rgba(255,42,191,.18),transparent 35%),
        radial-gradient(circle at 72% 68%,rgba(44,232,255,.17),transparent 36%),
        #090a0f;
    }
    .release-cover-fallback span{
      font-size:clamp(1.35rem,2vw,2.2rem);
      font-weight:650;
      letter-spacing:.08em;
      line-height:1;
    }
    .release-type-badge{
      position:absolute;
      top:14px;
      left:14px;
      padding:7px 9px;
      border:1px solid rgba(255,255,255,.14);
      border-radius:999px;
      background:rgba(5,6,10,.52);
      backdrop-filter:blur(9px);
      font-size:.55rem;
      letter-spacing:.16em;
      color:rgba(255,255,255,.72);
      text-transform:uppercase;
    }
    .release-info{
      padding:16px 2px 0;
    }
    .release-info strong{
      display:block;
      font-size:1.02rem;
      font-weight:560;
      letter-spacing:.015em;
    }
    .release-info span{
      display:block;
      margin-top:6px;
      font-size:.72rem;
      color:var(--muted);
      letter-spacing:.10em;
      text-transform:uppercase;
    }
    .release-source{
      display:flex;
      align-items:center;
      gap:8px;
      margin-top:10px;
      color:rgba(255,255,255,.38);
      font-size:.59rem;
      letter-spacing:.12em;
      text-transform:uppercase;
    }
    .release-source::before{
      content:"";
      width:6px;height:6px;border-radius:50%;
      background:linear-gradient(135deg,var(--magenta),var(--cyan));
      box-shadow:0 0 10px rgba(44,232,255,.18);
    }
    .discography-footer{
      margin-top:52px;
      display:flex;
      justify-content:center;
      gap:18px;
      flex-wrap:wrap;
    }
    .disc-load-more{
      appearance:none;
      border:1px solid rgba(255,255,255,.17);
      border-radius:999px;
      padding:12px 18px;
      background:rgba(255,255,255,.02);
      color:white;
      font-size:.67rem;
      letter-spacing:.16em;
      text-transform:uppercase;
      cursor:pointer;
    }
    .disc-load-more[hidden]{display:none}
    .spotify-discography-link{
      border:0;
      padding:12px 4px;
      font-size:.67rem;
      letter-spacing:.16em;
      color:rgba(255,255,255,.5);
      text-transform:uppercase;
      transition:color .2s ease;
    }
    .spotify-discography-link:hover{color:white}
    @media(max-width:950px){
      .discography-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
      .discography-head{align-items:flex-start;flex-direction:column}
    }
    @media(max-width:600px){
      .discography{padding:95px 0}
      .discography-grid{grid-template-columns:1fr;gap:30px}
      .disc-filter{gap:9px 15px}
    }






    /* Smooth LED-strip color morph — no running light, no rotating gradient */
    .release-cover{
      position:relative;
      border:none !important;
      background:#090a0f;
      overflow:hidden;
      box-shadow:0 30px 65px rgba(0,0,0,.25);
    }

    .release-cover::before{
      content:"";
      position:absolute;
      inset:-2px;
      z-index:0;
      background:
        linear-gradient(
          135deg,
          #ff2abf 0%,
          #d72bdc 24%,
          #6b8cff 52%,
          #2ce8ff 76%,
          #ff2abf 100%
        );
      background-size:220% 220%;
      animation:releaseLedFlow 7s ease-in-out infinite alternate;
      filter:saturate(1.12) brightness(1.04);
      will-change:background-position;
    }

    .release-cover::after{
      content:"";
      position:absolute;
      inset:1px;
      z-index:1;
      background:#090a0f;
      pointer-events:none;
    }

    .release-cover > img,
    .release-cover > .release-cover-fallback{
      position:relative;
      z-index:2;
      width:calc(100% - 4px);
      height:calc(100% - 4px);
      margin:2px;
    }

    .release-cover .release-type-badge{
      z-index:4;
    }

    @keyframes releaseLedFlow{
      0%{background-position:0% 50%}
      100%{background-position:100% 50%}
    }
      to{
        filter:
          hue-rotate(360deg)
          saturate(1.16)
          brightness(1.03);
      }
    }

    .release-card:hover .release-cover::before{
      filter:
        saturate(1.28)
        brightness(1.10)
        drop-shadow(0 0 6px rgba(255,42,191,.28))
        drop-shadow(0 0 7px rgba(44,232,255,.28));
    }

    @media (prefers-reduced-motion: reduce){
      .release-cover::before{
        animation:none;
      }
    }
    }
    }


    /* FULLSCREEN ALBUM MODAL */
    .album-modal{
      position:fixed;
      inset:0;
      z-index:200;
      display:none;
      overflow-y:auto;
      background:
        radial-gradient(circle at 16% 30%,rgba(255,42,191,.08),transparent 32rem),
        radial-gradient(circle at 84% 56%,rgba(44,232,255,.07),transparent 34rem),
        rgba(5,6,10,.985);
      backdrop-filter:blur(18px);
    }
    .album-modal.open{display:block}
    .album-modal-inner{
      width:min(calc(100% - 40px),1260px);
      margin:0 auto;
      padding:96px 0 100px;
    }
    .album-modal-close{
      position:fixed;
      top:26px;
      right:30px;
      z-index:210;
      border:0;
      background:rgba(5,6,10,.45);
      color:#b0b5c2;
      padding:10px 12px;
      font-size:.68rem;
      letter-spacing:.16em;
      text-transform:uppercase;
      cursor:pointer;
      backdrop-filter:blur(10px);
    }
    .album-modal-close:hover{color:white}
    .album-modal-grid{
      display:grid;
      grid-template-columns:minmax(340px,.9fr) minmax(0,1.1fr);
      gap:clamp(48px,7vw,100px);
      align-items:center;
    }
    .album-modal-cover{
      aspect-ratio:1;
      padding:2px;
      background:linear-gradient(135deg,#ff2abf 0%,#d72bdc 24%,#6b8cff 52%,#2ce8ff 76%,#ff2abf 100%);
      background-size:220% 220%;
      animation:releaseLedFlow 7s ease-in-out infinite alternate;
      box-shadow:-8px 0 28px rgba(255,42,191,.08),8px 0 28px rgba(44,232,255,.08),0 38px 82px rgba(0,0,0,.34);
    }
    .album-modal-cover img{
      width:100%;height:100%;object-fit:cover;display:block;background:#090a0f;
    }
    .album-modal-copy h2{
      margin:14px 0 12px;
      font-size:clamp(3rem,5.2vw,5.8rem);
      line-height:.95;
      letter-spacing:.045em;
      font-weight:700;
    }
    .album-modal-meta{
      color:#d9deea;
      font-size:.76rem;
      letter-spacing:.22em;
      text-transform:uppercase;
    }
    .album-modal-copy p{
      max-width:650px;color:var(--muted);line-height:1.8;font-size:1rem;margin-top:28px;
    }
    .album-modal-track-section{
      margin-top:78px;
      padding-top:45px;
      border-top:1px solid var(--line);
    }
    .album-modal-track-section h3{
      margin:12px 0 28px;
      font-size:clamp(2rem,3vw,3.2rem);
      font-weight:650;
      letter-spacing:.04em;
    }
    .modal-tracklist{border-top:1px solid var(--line)}
    .modal-track{
      display:grid;
      grid-template-columns:54px 1fr auto;
      gap:18px;
      align-items:center;
      padding:20px 0;
      border-bottom:1px solid var(--line);
    }
    .modal-track-num{color:#5e6574;font-size:.7rem;letter-spacing:.12em}
    .modal-track-title{font-size:.98rem}
    .modal-track-actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:flex-end}
    .modal-track-actions a{
      font-size:.61rem;letter-spacing:.14em;text-transform:uppercase;color:#aab0bd;
    }
    .modal-track-actions a:hover{
      color:white;
      text-shadow:-2px 0 10px rgba(255,42,191,.34),2px 0 10px rgba(44,232,255,.34);
    }
    body.album-modal-open{overflow:hidden}
    @media(max-width:900px){
      .album-modal-grid{grid-template-columns:1fr}
      .modal-track{grid-template-columns:42px 1fr}
      .modal-track-actions{grid-column:2;justify-content:flex-start}
      .album-modal-inner{padding-top:82px}
    }

    /* STORE */
    .product-img{
      aspect-ratio:4/5;border-bottom:1px solid var(--line);
      background:
        radial-gradient(circle at 50% 35%,rgba(255,255,255,.06),transparent 30%),
        linear-gradient(180deg,#101118,#07080c);
      position:relative;display:grid;place-items:center;
    }
    .hoodie{
      width:56%;height:54%;
      border-radius:24% 24% 10% 10%;
      background:#0b0c10;position:relative;
      box-shadow:0 40px 60px rgba(0,0,0,.35);
    }
    .hoodie:before{
      content:"THYLA";position:absolute;top:28%;left:50%;transform:translateX(-50%);
      font-size:.7rem;letter-spacing:.24em;
      background:linear-gradient(90deg,var(--magenta),var(--cyan));-webkit-background-clip:text;color:transparent;
    }
    .hoodie:after{
      content:"";position:absolute;inset:0;
      background:linear-gradient(110deg,transparent 20%,rgba(255,42,191,.45) 48%,rgba(44,232,255,.38) 53%,transparent 76%);
      clip-path:polygon(0 68%,100% 45%,100% 52%,0 75%);
    }
    .vinyl{
      width:62%;aspect-ratio:1;border-radius:50%;
      background:
        radial-gradient(circle at center,#06070a 0 4%,#e7e7e7 4.5% 8%,transparent 8.5%),
        conic-gradient(from 20deg,var(--magenta),#6b2cff,var(--cyan),#15161c,var(--magenta));
      box-shadow:0 35px 70px rgba(0,0,0,.5)
    }
    .tee{width:58%;height:52%;background:#0b0c10;clip-path:polygon(22% 0,38% 8%,62% 8%,78% 0,100% 20%,85% 38%,76% 31%,76% 100%,24% 100%,24% 31%,15% 38%,0 20%);position:relative}
    .tee:after{content:"THYLA";position:absolute;left:50%;top:43%;transform:translateX(-50%);font-size:.75rem;letter-spacing:.23em;background:linear-gradient(90deg,var(--magenta),var(--cyan));-webkit-background-clip:text;color:transparent}

    /* FOOTER */
    footer{padding:70px 0 42px;border-top:1px solid var(--line)}
    .footer-logo{font-size:2rem;letter-spacing:.32em;font-weight:300}
    .footer-row{display:flex;justify-content:space-between;gap:30px;align-items:flex-end}
    .socials{display:flex;flex-wrap:wrap;gap:18px;color:var(--muted);font-size:.78rem;letter-spacing:.1em;text-transform:uppercase}
    .copyright{margin-top:40px;color:#676e7d;font-size:.72rem}

    .reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}
    .reveal.visible{opacity:1;transform:none}


    .sound-toggle{
      position:absolute;right:28px;bottom:28px;z-index:5;
      display:flex;align-items:center;gap:11px;
      border:0;background:transparent;color:rgba(245,247,251,.72);
      font-size:.63rem;letter-spacing:.18em;text-transform:uppercase;
      cursor:pointer;padding:10px;
      transition:color .25s ease;
    }
    .sound-toggle:hover{color:#fff}
    .sound-bars{height:15px;display:flex;align-items:center;gap:2px}
    .sound-bars i{
      display:block;width:1px;height:4px;background:currentColor;
      transform-origin:center;
    }
    .sound-toggle.on .sound-bars i:nth-child(1){animation:soundbar .8s ease-in-out infinite alternate}
    .sound-toggle.on .sound-bars i:nth-child(2){animation:soundbar .55s ease-in-out .08s infinite alternate}
    .sound-toggle.on .sound-bars i:nth-child(3){animation:soundbar .7s ease-in-out .16s infinite alternate}
    .sound-toggle.on .sound-bars i:nth-child(4){animation:soundbar .48s ease-in-out .05s infinite alternate}
    @keyframes soundbar{from{height:3px}to{height:14px}}
    .hero-cta{
      min-width:126px;justify-content:center;
      background:rgba(5,6,10,.12);
      backdrop-filter:blur(5px);
    }
    .hero-cta:hover{
      border-color:transparent;
      box-shadow:0 0 0 1px rgba(255,42,191,.75),0 0 22px rgba(44,232,255,.13);
    }

    @media (max-width:900px){
      .nav-links{
        position:fixed;top:var(--header-h);left:0;right:0;
        padding:30px 22px 42px;background:rgba(5,6,10,.97);
        border-bottom:1px solid var(--line);display:none;flex-direction:column;align-items:flex-start;gap:22px;
      }
      .nav-links.open{display:flex}
      .menu-btn{display:block}
      .latest-release-grid{grid-template-columns:1fr;gap:38px;min-height:auto}
      .featured-grid{grid-template-columns:1fr;gap:38px}
      .latest-visual{min-height:auto}
      .latest-artwork{width:min(100%,620px)}
      .card-grid{grid-template-columns:1fr 1fr}
      .disc-row{grid-template-columns:1fr 1fr}
      .hero-logo{letter-spacing:.18em;padding-left:.18em}
    }
    @media (max-width:600px){
      :root{--header-h:70px}
      .wrap{width:min(calc(100% - 28px),var(--max))}
      .section{padding:88px 0}
      .latest-release{padding:96px 0 92px}
      .section-scroll-next{bottom:18px}
      .featured-track{padding:92px 0}
      .latest-release-grid{gap:44px}
      .latest-copy{max-width:none}
      .latest-title{font-size:clamp(2.5rem,11vw,4rem)}
      .card-grid,.disc-row{grid-template-columns:1fr}
      .footer-row{align-items:flex-start;flex-direction:column}
      .hero-logo{font-size:clamp(3.5rem,17vw,6rem);letter-spacing:.12em;padding-left:.12em}
      .hero-sub{font-size:.62rem;line-height:1.7}
      .brand{font-size:1.22rem}
      .sound-toggle{right:12px;bottom:18px}
      .scroll-hint{left:14px;transform:none;align-items:flex-start}
    }

    @media (prefers-reduced-motion: reduce){
      html{scroll-behavior:auto}
      .reveal{opacity:1;transform:none;transition:none}
    }
  


    /* IN-CARD SCROLLABLE TRACKLIST */
    .release-card[data-track-card]{
      cursor:default;
    }
    .release-card[data-track-card] .release-cover{
      position:relative;
    }
    .release-card-front,
    .release-card-tracks{
      position:absolute;
      inset:2px;
      z-index:2;
    }
    .release-card-front{
      transition:opacity .28s ease, transform .28s ease;
    }
    .release-card-front > img,
    .release-card-front > .release-cover-fallback{
      width:100%;
      height:100%;
      object-fit:cover;
      display:block;
      margin:0;
    }
    .release-card-front .release-type-badge{
      z-index:4;
    }
    .release-card-tracks{
      display:flex;
      flex-direction:column;
      padding:18px 18px 14px;
      background:
        radial-gradient(circle at 12% 12%,rgba(255,42,191,.10),transparent 35%),
        radial-gradient(circle at 88% 88%,rgba(44,232,255,.10),transparent 36%),
        rgba(5,6,10,.985);
      opacity:0;
      transform:scale(.985);
      pointer-events:none;
      transition:opacity .28s ease, transform .28s ease;
    }
    .release-card[data-track-card].tracks-open .release-card-front{
      opacity:0;
      transform:scale(1.015);
      pointer-events:none;
    }
    .release-card[data-track-card].tracks-open .release-card-tracks{
      opacity:1;
      transform:none;
      pointer-events:auto;
    }
    .release-card-tracks-head{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:12px;
      margin-bottom:15px;
    }
    .track-card-back,
    .track-card-open{
      border:0;
      background:transparent;
      color:#aeb4c1;
      font-size:.58rem;
      letter-spacing:.14em;
      text-transform:uppercase;
      cursor:pointer;
      padding:0;
    }
    .track-card-back:hover,
    .track-card-open:hover{color:white}
    .track-card-spotify{
      font-size:.58rem;
      letter-spacing:.14em;
      text-transform:uppercase;
      color:#9da4b3;
    }
    .track-card-spotify:hover{
      color:white;
      text-shadow:-2px 0 9px rgba(255,42,191,.3),2px 0 9px rgba(44,232,255,.3);
    }
    .track-card-title{
      font-size:1rem;
      font-weight:650;
      letter-spacing:.04em;
      margin-bottom:12px;
    }
    .track-card-scroll{
      overflow-y:auto;
      padding-right:6px;
      scrollbar-width:thin;
      scrollbar-color:rgba(44,232,255,.45) transparent;
    }
    .track-card-scroll::-webkit-scrollbar{width:4px}
    .track-card-scroll::-webkit-scrollbar-track{background:transparent}
    .track-card-scroll::-webkit-scrollbar-thumb{
      background:linear-gradient(var(--magenta),var(--cyan));
      border-radius:999px;
    }
    .track-card-row{
      display:grid;
      grid-template-columns:27px minmax(0,1fr);
      gap:8px 10px;
      padding:10px 0;
      border-bottom:1px solid rgba(255,255,255,.07);
    }
    .track-card-num{
      color:#626978;
      font-size:.58rem;
      letter-spacing:.08em;
      padding-top:2px;
    }
    .track-card-track{
      font-size:.74rem;
      line-height:1.35;
      color:#e5e8ee;
    }
    .track-card-actions{
      grid-column:2;
      display:flex;
      gap:10px;
    }
    .track-card-actions a{
      font-size:.52rem;
      letter-spacing:.12em;
      color:#858c9b;
    }
    .track-card-actions a:hover{color:white}
    .track-card-open{
      display:block;
      margin-top:13px;
      color:rgba(255,255,255,.48);
    }


    /* TWO-ROW DISCOGRAPHY CAROUSELS */
    .discography-head{
      margin-bottom:34px;
    }
    .disc-row-block{
      margin-top:34px;
    }
    .disc-row-block + .disc-row-block{
      margin-top:58px;
    }
    .disc-row-head{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:20px;
      margin-bottom:18px;
    }
    .disc-row-label{
      font-size:.72rem;
      letter-spacing:.24em;
      text-transform:uppercase;
      color:#cfd4df;
    }
    .disc-row-nav{
      display:flex;
      align-items:center;
      gap:15px;
    }
    .disc-row-arrow{
      appearance:none;
      border:0;
      background:transparent;
      padding:0 2px;
      font-size:1.9rem;
      line-height:1;
      cursor:pointer;
      transition:transform .2s ease,text-shadow .2s ease,opacity .2s ease;
    }
    .disc-row-prev{
      color:var(--magenta);
      text-shadow:0 0 12px rgba(255,42,191,.28);
    }
    .disc-row-next{
      color:var(--cyan);
      text-shadow:0 0 12px rgba(44,232,255,.28);
    }
    .disc-row-prev:hover{
      transform:translateX(-3px);
      text-shadow:0 0 20px rgba(255,42,191,.62);
    }
    .disc-row-next:hover{
      transform:translateX(3px);
      text-shadow:0 0 20px rgba(44,232,255,.62);
    }
    .disc-row-viewport{
      overflow:hidden;
      width:100%;
    }
    .disc-row-track{
      display:flex;
      gap:24px;
      transition:transform .42s cubic-bezier(.22,.61,.36,1);
      will-change:transform;
    }
    .disc-row-track > .release-card{
      flex:0 0 calc((100% - 48px)/3);
      min-width:0;
    }
    @media(max-width:950px){
      .disc-row-track > .release-card{
        flex-basis:calc((100% - 24px)/2);
      }
    }
    @media(max-width:600px){
      .disc-row-track{
        gap:16px;
      }
      .disc-row-track > .release-card{
        flex-basis:86%;
      }
      .disc-row-label{
        font-size:.66rem;
      }
      .disc-row-arrow{
        font-size:1.7rem;
      }
    }

    #discSingles{display:block!important;overflow:hidden}
    #discSingles .disc-row-track{display:flex!important}
    #discSingles .release-card{display:block!important;visibility:visible!important;opacity:1!important}

    /* VIDEO buttons inside album tracklist cards */
    .track-card-actions{
      align-items:center;
    }
    .track-card-actions .track-video-button{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      min-height:20px;
      padding:4px 7px;
      border:1px solid transparent;
      border-radius:999px;
      background:
        linear-gradient(rgba(5,6,10,.94),rgba(5,6,10,.94)) padding-box,
        linear-gradient(90deg,rgba(255,42,191,.68),rgba(44,232,255,.68)) border-box;
      color:rgba(255,255,255,.76);
      font-size:.49rem;
      letter-spacing:.11em;
      line-height:1;
      text-transform:uppercase;
      transition:color .2s ease,box-shadow .2s ease,transform .2s ease;
    }
    .track-card-actions .track-video-button:hover{
      color:white;
      transform:translateY(-1px);
      box-shadow:
        -2px 0 8px rgba(255,42,191,.18),
         2px 0 8px rgba(44,232,255,.18);
    }

    /* Single release action buttons */
    .single-card-with-actions{cursor:default}
    .single-card-actions{
      display:flex;
      align-items:center;
      gap:8px;
      flex-wrap:wrap;
      margin-top:12px;
    }
    .single-action-btn{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      min-height:23px;
      padding:5px 9px;
      border:1px solid transparent;
      border-radius:999px;
      background:
        linear-gradient(rgba(5,6,10,.94),rgba(5,6,10,.94)) padding-box,
        linear-gradient(90deg,rgba(255,42,191,.66),rgba(44,232,255,.66)) border-box;
      color:rgba(255,255,255,.72);
      font-size:.52rem;
      letter-spacing:.11em;
      line-height:1;
      text-transform:uppercase;
      transition:color .2s ease,box-shadow .2s ease,transform .2s ease;
    }
    .single-action-btn:hover{
      color:white;
      transform:translateY(-1px);
      box-shadow:-2px 0 8px rgba(255,42,191,.16),2px 0 8px rgba(44,232,255,.16);
    }

    /* UPCOMING LP */
    .upcoming-release-card{cursor:default}
    .upcoming-cover-fallback{
      display:flex !important;
      flex-direction:column;
      align-items:center;
      justify-content:center;
      gap:10px;
      text-align:center;
      padding:28px;
      background:
        radial-gradient(circle at 25% 30%,rgba(255,42,191,.16),transparent 36%),
        radial-gradient(circle at 75% 70%,rgba(44,232,255,.15),transparent 38%),
        linear-gradient(145deg,#090a10,#05060a 62%,#080912);
    }
    .upcoming-cover-kicker{
      font-size:.57rem;
      letter-spacing:.34em;
      color:rgba(255,255,255,.48);
    }
    .upcoming-cover-title{
      max-width:90%;
      font-size:clamp(1rem,1.55vw,1.35rem);
      line-height:1.15;
      letter-spacing:.13em;
      font-weight:650;
      color:#f3f5fa;
    }
    .upcoming-badge{
      background:rgba(5,6,10,.78);
      color:white;
      border:1px solid transparent;
      background:
        linear-gradient(rgba(5,6,10,.88),rgba(5,6,10,.88)) padding-box,
        linear-gradient(90deg,#ff2abf,#2ce8ff) border-box;
    }
    .upcoming-actions{margin-top:12px}
    .upcoming-presave-btn{
      background:
        linear-gradient(rgba(5,6,10,.94),rgba(5,6,10,.94)) padding-box,
        linear-gradient(90deg,rgba(255,42,191,.82),rgba(44,232,255,.82)) border-box;
      color:white;
    }

    /* Discography LP / Single filter */
    .disc-type-filter{
      display:flex;
      align-items:center;
      gap:9px;
      margin:6px 0 28px;
    }
    .disc-type-filter-btn{
      appearance:none;
      border:1px solid rgba(255,255,255,.12);
      border-radius:999px;
      background:rgba(5,6,10,.45);
      color:#858c9b;
      padding:7px 13px;
      font-size:.58rem;
      letter-spacing:.15em;
      text-transform:uppercase;
      cursor:pointer;
      transition:color .2s ease,border-color .2s ease,box-shadow .2s ease;
    }
    .disc-type-filter-btn:hover{
      color:white;
      border-color:rgba(255,255,255,.28);
    }
    .disc-type-filter-btn.active{
      color:white;
      border-color:transparent;
      background:
        linear-gradient(rgba(5,6,10,.94),rgba(5,6,10,.94)) padding-box,
        linear-gradient(90deg,#ff2abf,#2ce8ff) border-box;
      box-shadow:-2px 0 9px rgba(255,42,191,.12),2px 0 9px rgba(44,232,255,.12);
    }
    .disc-row-block.disc-filter-hidden{
      display:none !important;
    }

    /* VIDEOS */
    .videos-section{
      padding:130px 0;
      background:
        radial-gradient(circle at 16% 45%,rgba(255,42,191,.055),transparent 28rem),
        radial-gradient(circle at 84% 55%,rgba(44,232,255,.05),transparent 30rem),
        #05060a;
      border-top:1px solid var(--line);
    }
    .videos-head{
      display:flex;
      align-items:flex-end;
      justify-content:space-between;
      gap:30px;
      margin-bottom:34px;
    }
    .videos-head h2{
      margin:10px 0 0;
      font-size:clamp(2.8rem,5vw,5rem);
      line-height:.95;
      letter-spacing:.04em;
    }
    .videos-nav{
      display:flex;
      align-items:center;
      gap:15px;
      padding-bottom:8px;
    }
    .videos-arrow{
      appearance:none;
      border:0;
      background:transparent;
      padding:0 2px;
      font-size:2rem;
      line-height:1;
      cursor:pointer;
      transition:transform .2s ease,text-shadow .2s ease;
    }
    .videos-prev{
      color:var(--magenta);
      text-shadow:0 0 12px rgba(255,42,191,.28);
    }
    .videos-next{
      color:var(--cyan);
      text-shadow:0 0 12px rgba(44,232,255,.28);
    }
    .videos-prev:hover{
      transform:translateX(-3px);
      text-shadow:0 0 20px rgba(255,42,191,.62);
    }
    .videos-next:hover{
      transform:translateX(3px);
      text-shadow:0 0 20px rgba(44,232,255,.62);
    }
    .videos-viewport{
      overflow:hidden;
      width:100%;
    }
    .videos-track{
      display:flex;
      gap:24px;
      transition:transform .42s cubic-bezier(.22,.61,.36,1);
      will-change:transform;
    }
    .video-card{
      flex:0 0 calc((100% - 48px)/3);
      min-width:0;
      color:inherit;
      text-decoration:none;
    }
    .video-thumb{
      position:relative;
      aspect-ratio:16/9;
      overflow:hidden;
      border:1px solid transparent;
      background:
        linear-gradient(#090a0f,#090a0f) padding-box,
        linear-gradient(135deg,rgba(255,42,191,.64),rgba(44,232,255,.64)) border-box;
      box-shadow:0 24px 54px rgba(0,0,0,.24);
    }
    .video-thumb img{
      width:100%;
      height:100%;
      object-fit:cover;
      display:block;
      transition:transform .45s ease,filter .45s ease;
    }
    .video-play{
      position:absolute;
      inset:0;
      display:grid;
      place-items:center;
      font-size:2.1rem;
      color:white;
      text-shadow:
        -3px 0 14px rgba(255,42,191,.38),
         3px 0 14px rgba(44,232,255,.38);
      background:linear-gradient(180deg,transparent 45%,rgba(5,6,10,.28));
      transition:background .25s ease,transform .25s ease;
    }
    .video-card:hover .video-thumb img{
      transform:scale(1.025);
      filter:brightness(.82);
    }
    .video-card:hover .video-play{
      transform:scale(1.08);
      background:linear-gradient(180deg,rgba(5,6,10,.06),rgba(5,6,10,.38));
    }
    .video-info{
      padding:14px 2px 0;
    }
    .video-info strong{
      display:block;
      font-size:.96rem;
      font-weight:560;
      line-height:1.35;
    }
    .video-info span{
      display:block;
      margin-top:8px;
      color:#8f96a5;
      font-size:.58rem;
      letter-spacing:.13em;
      text-transform:uppercase;
    }
    @media(max-width:950px){
      .video-card{
        flex-basis:calc((100% - 24px)/2);
      }
    }
    @media(max-width:600px){
      .videos-section{padding:95px 0}
      .videos-head{align-items:flex-start}
      .videos-track{gap:16px}
      .video-card{flex-basis:86%}
      .videos-arrow{font-size:1.75rem}
    }

    .video-collab-badge{
      position:absolute;
      top:12px;
      left:12px;
      z-index:5;
      padding:5px 8px;
      border:1px solid transparent;
      border-radius:999px;
      background:
        linear-gradient(rgba(5,6,10,.82),rgba(5,6,10,.82)) padding-box,
        linear-gradient(90deg,rgba(255,42,191,.78),rgba(44,232,255,.78)) border-box;
      color:rgba(255,255,255,.82);
      font-size:.48rem;
      letter-spacing:.13em;
      text-transform:uppercase;
      backdrop-filter:blur(8px);
    }

    /* Video filters + counter */
    .videos-filter{
      display:flex;
      align-items:center;
      gap:9px;
      margin:0 0 28px;
    }
    .videos-filter-btn{
      appearance:none;
      border:1px solid rgba(255,255,255,.12);
      border-radius:999px;
      background:rgba(5,6,10,.45);
      color:#858c9b;
      padding:7px 13px;
      font-size:.58rem;
      letter-spacing:.15em;
      text-transform:uppercase;
      cursor:pointer;
      transition:color .2s ease,border-color .2s ease,box-shadow .2s ease;
    }
    .videos-filter-btn:hover{
      color:white;
      border-color:rgba(255,255,255,.28);
    }
    .videos-filter-btn.active{
      color:white;
      border-color:transparent;
      background:
        linear-gradient(rgba(5,6,10,.94),rgba(5,6,10,.94)) padding-box,
        linear-gradient(90deg,#ff2abf,#2ce8ff) border-box;
      box-shadow:-2px 0 9px rgba(255,42,191,.12),2px 0 9px rgba(44,232,255,.12);
    }
    .videos-count{
      min-width:62px;
      text-align:center;
      color:rgba(255,255,255,.58);
      font-size:.62rem;
      letter-spacing:.16em;
    }
    .video-card.video-filter-hidden{
      display:none !important;
    }
    @media(max-width:600px){
      .videos-filter{
        flex-wrap:wrap;
        gap:8px;
      }
      .videos-count{
        min-width:54px;
      }
    }
