.home-sections{
  --bg:#050708;--bg2:#0a0d14;--panel:rgba(14,20,38,.62);--line:rgba(24,224,255,.28);
  --white:#f4f6fb;--muted:#9aa6c2;--gold1:#f6dc8a;--gold2:#d4a53c;--gold3:#8f6420;
  --cyan:#18e0ff;--blue:#2f5bff;--violet:#a83cff;
  --glow:linear-gradient(180deg,var(--cyan),var(--blue) 55%,var(--violet));
  --glowX:linear-gradient(90deg,var(--cyan),var(--blue) 50%,var(--violet));
  --gold:linear-gradient(135deg,var(--gold1),var(--gold2) 45%,var(--gold3) 75%,var(--gold2));


.hs{position:relative;padding:80px 0;z-index:2}
.hs *{box-sizing:border-box}
.hs .wrap{max-width:1200px;margin:0 auto;padding:0 16px}
.hs .hud{font-family:Orbitron,Montserrat,sans-serif;letter-spacing:.22em;text-transform:uppercase;font-size:.7rem}
.hs .gold-text{background:var(--gold);-webkit-background-clip:text;background-clip:text;color:transparent}
.hs .glow-text{background:var(--glowX);-webkit-background-clip:text;background-clip:text;color:transparent}
.hs .eyebrow{display:inline-flex;align-items:center;gap:10px;color:var(--cyan)}
.hs .eyebrow::before{content:"";width:28px;height:1px;background:var(--glowX)}
.hs-head{display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;margin-bottom:38px}
.hs-head h2{font-size:clamp(2rem,6vw,3.4rem);font-weight:900;line-height:1.02;letter-spacing:-.01em}
.hs-head p{color:var(--muted);max-width:620px}
.hs .holo{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:22px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:inset 0 0 40px rgba(24,224,255,.05),0 20px 60px rgba(0,0,0,.4)}
.hs .corners{position:absolute;inset:-1px;pointer-events:none}
.hs .corners i{position:absolute;width:20px;height:20px;border:solid var(--gold2);border-width:0}
.hs .corners i:nth-child(1){top:0;left:0;border-width:2px 0 0 2px;border-top-left-radius:22px}
.hs .corners i:nth-child(2){top:0;right:0;border-width:2px 2px 0 0;border-top-right-radius:22px}
.hs .corners i:nth-child(3){bottom:0;left:0;border-width:0 0 2px 2px;border-bottom-left-radius:22px}
.hs .corners i:nth-child(4){bottom:0;right:0;border-width:0 2px 2px 0;border-bottom-right-radius:22px}
.hs .arrow{width:44px;height:44px;border-radius:50%;cursor:pointer;display:grid;place-items:center;color:var(--white);
  border:1px solid transparent;background-image:linear-gradient(var(--bg2),var(--bg2)),var(--glowX);background-origin:border-box;background-clip:padding-box,border-box;box-shadow:0 0 18px rgba(24,224,255,.18);transition:box-shadow .2s,transform .2s}
.hs .arrow:hover{box-shadow:0 0 28px rgba(24,224,255,.4);transform:translateY(-2px)}
.hs .arrow svg{width:18px;height:18px}
.hs .ctrls{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:20px}
.hs .dots{display:flex;gap:8px}
.hs .dots button{width:9px;height:9px;border-radius:50%;border:0;background:rgba(255,255,255,.18);cursor:pointer;padding:0;transition:all .3s}
.hs .dots button.on{width:26px;border-radius:6px;background:var(--gold);box-shadow:0 0 12px rgba(212,165,60,.6)}
.hs .reveal{opacity:0;transform:translateY(26px);transition:opacity .8s ease,transform .8s ease}
.hs .reveal.in{opacity:1;transform:none}
@keyframes hsScan{from{top:-30%}to{top:110%}}
@keyframes hsBlink{50%{opacity:.15}}
@keyframes hsRise{from{opacity:0;transform:translateY(20px) scale(.98)}}
@media(prefers-reduced-motion:reduce){.hs *,.hs *::before,.hs *::after{animation:none!important;transition:none!important}.hs .reveal{opacity:1;transform:none}}

/* ---- Clients + Producer Reel ---- */
.rig{max-width:960px;margin:0 auto}
.mon{position:relative;border-radius:22px;padding:14px;background:linear-gradient(145deg,#1b1f2a,#07090d);
  box-shadow:0 0 0 1px rgba(212,165,60,.55),0 0 0 6px #0b0e15,0 0 0 7px rgba(24,224,255,.35),0 0 60px rgba(24,224,255,.22),0 0 120px rgba(168,60,255,.16),0 40px 80px rgba(0,0,0,.6)}
.mon .lbl{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--bg);padding:3px 14px;color:var(--gold1);border:1px solid var(--gold3);border-radius:20px;white-space:nowrap;font-size:.56rem;z-index:6}
.mon .scr{position:relative;aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:radial-gradient(ellipse at center,#0b1a3a,#05070e 75%) center/cover no-repeat;isolation:isolate}
.mon .scr::before{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(255,255,255,.035) 0 1px,transparent 1px 3px)}
.mon .scr::after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;box-shadow:inset 0 0 90px rgba(0,0,0,.75)}
.mon .bar{position:absolute;left:0;right:0;height:22%;z-index:3;pointer-events:none;background:linear-gradient(transparent,rgba(24,224,255,.08),transparent);animation:hsScan 5s linear infinite}
.mon video,.mon iframe{position:absolute;inset:0;width:100%;height:100%;border:0;z-index:2;background:#000;object-fit:cover}
.mon .play{position:absolute;inset:0;z-index:4;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:rgba(5,7,14,.35);border:0;cursor:pointer;color:var(--white)}
.mon .play .ring{width:clamp(58px,10vw,84px);aspect-ratio:1;border-radius:50%;display:grid;place-items:center;background:rgba(5,7,8,.45);border:2px solid var(--gold1);box-shadow:0 0 30px rgba(212,165,60,.5),0 0 60px rgba(24,224,255,.25);transition:transform .3s}
.mon .play:hover .ring{transform:scale(1.08)}
.mon .play svg{width:36%;margin-left:8%;fill:var(--gold1)}
.mon .snd{position:absolute;top:14px;right:14px;z-index:5;display:none;align-items:center;gap:8px;padding:9px 14px;border-radius:999px;cursor:pointer;color:var(--white);font-weight:700;font-size:.74rem;
  background:rgba(5,7,8,.6);backdrop-filter:blur(6px);border:1px solid transparent;background-image:linear-gradient(rgba(5,7,8,.7),rgba(5,7,8,.7)),var(--glowX);background-origin:border-box;background-clip:padding-box,border-box}
.mon .snd svg{width:15px;height:15px}
.mon.has-video .snd{display:inline-flex}
.rig .base{width:46%;height:16px;margin:0 auto;background:linear-gradient(#141821,#07090d);border-radius:0 0 30px 30px;box-shadow:0 0 0 1px rgba(212,165,60,.35)}
.rig .floorglow{width:70%;height:30px;margin:6px auto 0;background:radial-gradient(ellipse,rgba(24,224,255,.35),transparent 70%);filter:blur(8px)}
.rig .meta{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:18px;flex-wrap:wrap}
.rig .meta b{font-weight:900;font-size:clamp(1.05rem,2.6vw,1.35rem)}
.rig .meta span{color:var(--muted);font-size:.86rem}
.rig .rec{display:inline-flex;align-items:center;gap:8px;color:var(--cyan)}
.rig .rec i{width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 10px var(--cyan);animation:hsBlink 1.2s infinite}
.nets{margin-top:56px}
.nets .cap{text-align:center;color:var(--cyan);margin-bottom:20px}
.nrow{display:flex;overflow:hidden;margin-bottom:16px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.ntrack{display:flex;gap:16px;padding-right:16px;flex-shrink:0;animation:hsMq 32s linear infinite}
.nrow.rev .ntrack{animation-direction:reverse;animation-duration:38s}
@media(hover:hover) and (pointer:fine){.nrow:hover .ntrack{animation-play-state:paused}}
@keyframes hsMq{to{transform:translateX(-100%)}}
.ntile{flex:0 0 auto;height:76px;min-width:170px;padding:0 26px;display:grid;place-items:center;border-radius:16px;
  background:linear-gradient(160deg,rgba(18,26,52,.7),rgba(7,9,18,.8));border:1px solid rgba(24,224,255,.18);transition:border-color .3s,box-shadow .3s,transform .3s}
.ntile:hover{border-color:rgba(246,220,138,.6);box-shadow:0 0 26px rgba(212,165,60,.2);transform:translateY(-3px)}
.ntile img{max-height:44px;max-width:140px;width:auto;object-fit:contain;filter:grayscale(1) brightness(1.8) contrast(.9);opacity:.8;transition:filter .4s,opacity .4s}
.ntile:hover img{filter:none;opacity:1}
.ntile span{font-family:Orbitron,sans-serif;font-weight:900;font-size:1.05rem;letter-spacing:.08em;color:rgba(244,246,251,.85);white-space:nowrap;transition:all .3s}
.ntile:hover span{background:var(--gold);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ---- Deliver Us ---- */
.du{display:grid;grid-template-columns:minmax(260px,420px) 1fr;gap:clamp(24px,4vw,48px);align-items:center;padding:clamp(24px,4vw,48px)}
@media(max-width:820px){.du{grid-template-columns:1fr}}
.deck2{position:relative;aspect-ratio:4/5;max-width:420px;width:100%;margin:0 auto;cursor:pointer;perspective:1200px}
.deck2 .pc{position:absolute;inset:0;border-radius:18px;overflow:hidden;border:1px solid rgba(246,220,138,.5);background:radial-gradient(ellipse at 50% 30%,#1a2350,#070a14 75%);
  box-shadow:0 24px 60px rgba(0,0,0,.6);transition:transform .9s cubic-bezier(.2,.8,.2,1),opacity .9s,filter .9s}
.deck2 .pc img{width:100%;height:100%;object-fit:cover}
.deck2 .pc .ph{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:24px;font-weight:900;font-size:1.6rem;line-height:1.1}
.deck2 .pc::after{content:"";position:absolute;inset:0;background:linear-gradient(160deg,rgba(255,255,255,.12),transparent 35%);pointer-events:none}
.deck2 .hint{position:absolute;left:50%;bottom:-34px;transform:translateX(-50%);color:var(--muted);font-size:.55rem;white-space:nowrap}
.du h3{font-size:clamp(2.4rem,7vw,4.4rem);font-weight:900;line-height:.95;letter-spacing:-.01em;margin:10px 0 8px}
.du .credit{color:var(--muted)}
.du .credit b{color:var(--gold1)}
.du .big{display:flex;align-items:baseline;gap:12px;margin:22px 0 18px}
.du .big strong{font-family:Orbitron,sans-serif;font-weight:900;font-size:clamp(3rem,9vw,4.8rem);line-height:1;background:var(--gold);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 16px rgba(212,165,60,.35))}
.du .big span{font-weight:800;font-size:clamp(1rem,2.6vw,1.3rem);line-height:1.2}
.medals{display:flex;flex-direction:column;gap:12px}
.mrow{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:14px;background:rgba(24,224,255,.04);border:1px solid rgba(24,224,255,.16);opacity:0;transform:translateX(20px);transition:opacity .7s,transform .7s,border-color .3s}
.reveal.in .mrow{opacity:1;transform:none}
.reveal.in .mrow:nth-child(2){transition-delay:.15s}.reveal.in .mrow:nth-child(3){transition-delay:.3s}
.mrow:hover{border-color:rgba(246,220,138,.5)}
.medal{flex:0 0 auto;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;font-family:Orbitron,sans-serif;font-weight:900;font-size:.62rem;color:#1a1205;letter-spacing:.06em}
.medal.g{background:radial-gradient(circle at 35% 30%,#fff3c4,#e2b54f 45%,#8f6420 85%);box-shadow:0 0 22px rgba(212,165,60,.55)}
.medal.s{background:radial-gradient(circle at 35% 30%,#ffffff,#c9d1e6 45%,#6b7489 85%);box-shadow:0 0 22px rgba(201,209,230,.4)}
.medal.b{background:radial-gradient(circle at 35% 30%,#ffe2c8,#c47a3c 45%,#6b3a17 85%);box-shadow:0 0 22px rgba(196,122,60,.45)}
.mrow b{display:block;font-weight:900;font-size:1rem;line-height:1.2}
.mrow span{color:var(--muted);font-size:.86rem}

/* ---- Laurels ---- */
#lrStage{position:relative;height:calc(var(--lw) * 1.08 + 70px);perspective:1500px;touch-action:pan-y;user-select:none;-webkit-user-select:none;cursor:grab}
#lrStage.dragging{cursor:grabbing}
.hs-laurels{--lw:clamp(220px,58vw,300px)}
.lr{position:absolute;left:50%;top:20px;width:var(--lw);margin-left:calc(var(--lw)/-2);aspect-ratio:1/1.08;border-radius:22px;will-change:transform,opacity;
  background:linear-gradient(160deg,rgba(18,26,52,.92),rgba(5,7,14,.97));border:1px solid rgba(24,224,255,.2);box-shadow:0 24px 60px rgba(0,0,0,.55);transition:border-color .4s,box-shadow .4s;outline:none}
.lr.is-center{border-color:rgba(246,220,138,.75);box-shadow:0 0 0 1px rgba(212,165,60,.35),0 0 46px rgba(212,165,60,.22),0 0 90px rgba(24,224,255,.15),0 30px 70px rgba(0,0,0,.6)}
.lr svg{position:absolute;left:8%;top:6%;width:84%;height:auto}
.lr .tx{position:absolute;left:24%;right:24%;top:20%;bottom:28%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:4px}
.lr .k{color:var(--gold1);font-size:clamp(.46rem,1.3vw,.56rem);letter-spacing:.16em;line-height:1.4}
.lr .f{font-weight:900;font-size:clamp(.92rem,2.8vw,1.18rem);line-height:1.12}
.lr .y{font-family:Orbitron,sans-serif;font-weight:700;font-size:.66rem;color:var(--muted);letter-spacing:.2em}
.lr .film{position:absolute;left:0;right:0;bottom:7%;text-align:center;font-size:.72rem;color:var(--cyan);font-weight:700;padding:0 12px}
.lr .dim{position:absolute;inset:0;border-radius:inherit;background:#050708;opacity:0;pointer-events:none}
.lr.feat .f{background:var(--gold);-webkit-background-clip:text;background-clip:text;color:transparent}
.lr .shine{position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;background:linear-gradient(105deg,transparent 40%,rgba(255,240,200,.18) 50%,transparent 60%);background-size:300% 100%;transition:opacity .4s}
.lr.is-center .shine{opacity:1;animation:hsSweep 4.5s cubic-bezier(.45,0,.25,1) infinite}
@keyframes hsSweep{0%{background-position:150% 0}45%,100%{background-position:-50% 0}}

}

.home-sections{overflow:hidden;--panel:rgba(14,20,38,.62)}
.home-sections .hs .reveal{opacity:1;transform:none}
.home-sections .deck2 .pc img{object-fit:contain;background:#050708}
.home-sections .deck2{max-width:330px;aspect-ratio:4/5;margin-bottom:36px}
.home-sections .producer-reel{max-width:960px;margin:0 auto;padding:0;background:none;border:0;box-shadow:none}
.home-sections .reel-heading{margin-bottom:22px}
.home-sections .reel-frame{border-radius:22px;padding:12px;background:linear-gradient(145deg,#1b1f2a,#07090d);box-shadow:0 0 0 1px rgba(212,165,60,.55),0 0 0 6px #0b0e15,0 0 0 7px rgba(24,224,255,.35),0 0 60px rgba(24,224,255,.22),0 0 120px rgba(168,60,255,.16);aspect-ratio:16/9;position:relative;overflow:visible}
.home-sections .reel-frame iframe{position:absolute;inset:12px;width:calc(100% - 24px);height:calc(100% - 24px);border-radius:12px}
.home-sections .reel-caption{margin-top:24px}
.home-sections .reel-monitor-label{position:absolute;z-index:3;top:-14px;left:50%;transform:translateX(-50%);padding:3px 14px;border:1px solid #8f6420;background:#050708;border-radius:20px;color:#f6dc8a;font-size:9px;white-space:nowrap}
.home-sections button:focus-visible{outline:2px solid #18e0ff;outline-offset:5px}
.home-sections .hs-pause{border:1px solid rgba(24,224,255,.4);border-radius:30px;background:#0a0d14;color:#f4f6fb;padding:10px 16px;cursor:pointer;margin:18px auto;display:block}
.home-sections .credits-carousel{margin-top:40px}
@media(max-width:600px){.home-sections .hs{padding:48px 0}.home-sections .du{padding:24px 16px}.home-sections .reel-heading{align-items:flex-start;gap:12px}.home-sections .reel-heading h3{font-size:18px}.home-sections .reel-sound{font-size:11px;padding:10px}.home-sections .ctrls{gap:10px}.home-sections .dots{gap:5px}}

.home-sections .reel-frame::after{content:"";position:absolute;inset:12px;border-radius:12px;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(255,255,255,.018) 0 1px,transparent 1px 4px)}
.home-sections #deliver-us .du>button{grid-column:1/-1;margin:0 auto}
.home-sections .hs-head h2,.home-sections .hs-head p{margin:0}

.home-sections .credits-track{animation-duration:96s}
@media(max-width:620px){.home-sections .credits-track{animation-duration:70s}}

/* Top-level keyframes also work in Safari versions without nested keyframe support. */
@keyframes jhtvNetworkLoop{from{transform:translate3d(0,0,0)}to{transform:translate3d(-100%,0,0)}}
.home-sections .ntrack{animation-name:jhtvNetworkLoop;animation-timing-function:linear;animation-iteration-count:infinite;will-change:transform}
.home-sections .nrow:not(.rev) .ntrack{animation-direction:reverse}
.home-sections .nrow.rev .ntrack{animation-direction:normal}
@media(prefers-reduced-motion:reduce){.home-sections .nrow{overflow-x:auto;mask-image:none;-webkit-mask-image:none}.home-sections .ntrack{animation:none!important;will-change:auto}.home-sections .ntrack[aria-hidden="true"]{display:none}}
