/* HarmonyDrop Homepage CSS */
body.page-home .music_app { background: transparent !important; }
body.page-home { overflow-x: hidden; }

:root{
  --bg:#06080f;--bg2:#0a0e1a;--surface:rgba(255,255,255,0.03);
  --border:rgba(255,255,255,0.06);--cyan:#00d4ff;--purple:#7b2ff7;
  --pink:#ff6fd8;--text:#fff;--text2:rgba(255,255,255,0.55);
  --glass:rgba(6,8,15,0.75);--sidebar-w:340px;
}

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body.page-home{font-family:'Inter',sans-serif;background:linear-gradient(180deg,#0b3d6e 0%,#0a3058 4%,#082849 8%,#072040 14%,#061a35 22%,#05152c 32%,#041224 44%,#030e1c 56%,#020b16 68%,#020912 78%,#010710 88%,#01060e 94%,#00050c 100%) !important;background-size:100% 600vh !important;background-repeat:no-repeat !important;background-color:#00050c !important;color:#fff !important;overflow-x:hidden;}
::-webkit-scrollbar{width:5px;}
::-webkit-scrollbar-track{background:transparent;}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#00d4ff,#7b2ff7);border-radius:3px;}

/* ─── NAV ─── */
nav{position:fixed;top:0;left:0;right:0;z-index:200;display:flex;align-items:center;justify-content:space-between;padding:14px 28px;background:var(--glass);backdrop-filter:blur(30px);border-bottom:1px solid var(--border)}
nav.scrolled{padding:11px 48px;background:rgba(3,10,24,0.92);}
.logo{display:flex;align-items:center;gap:10px;font-weight:800;font-size:1.35rem;background:linear-gradient(135deg,#00d4ff,#7b2ff7,#ff6fd8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;cursor:pointer;text-decoration:none;}
.nav-center{display:flex;gap:6px;background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:4px}
.nav-c{display:flex;gap:6px;background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:4px}
.nav-tab{padding:8px 20px;border-radius:10px;border:none;background:none;color:var(--text2);font-size:.82rem;font-weight:500;cursor:pointer;transition:.3s;position:relative}
.nav-tab.active{background:rgba(0,212,255,0.1);color:var(--cyan)}
.nav-tab:hover{color:#fff}
.nav-dropdown-btn{padding:8px 20px;border-radius:10px;border:none;background:none;color:var(--text2);font-size:.82rem;font-weight:500;cursor:pointer;transition:.3s;font-family:inherit;display:flex;align-items:center;gap:5px;}
.nav-dropdown-btn:hover{color:#fff}
.nav-dropdown-btn .dd-arrow{font-size:.55rem;transition:transform .3s;display:inline-block;opacity:.5;}
.nav-tab-wrap:hover .dd-arrow{transform:rotate(180deg);opacity:1;}

/* ─── MEGA MENU ─── */
.nav-tab-wrap{position:relative}
.mega-menu{position:absolute;top:calc(100% + 16px);left:50%;transform:translateX(-50%) translateY(8px);min-width:520px;background:rgba(10,14,26,0.97);backdrop-filter:blur(40px);border:1px solid var(--border);border-radius:20px;padding:24px;opacity:0;visibility:hidden;pointer-events:none;transition:all .35s cubic-bezier(.4,0,.2,1);z-index:300;box-shadow:0 25px 80px rgba(0,0,0,0.6)}
.mega-menu::before{content:'';position:absolute;top:-16px;left:0;right:0;height:16px;background:transparent;}
.mega-menu::after{content:'';position:absolute;top:-8px;left:50%;width:16px;height:16px;background:rgba(10,14,26,0.97);border-left:1px solid var(--border);border-top:1px solid var(--border);transform:translateX(-50%) rotate(45deg);border-radius:3px 0 0 0}
.nav-tab-wrap:hover .mega-menu{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0)}
.mega-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.mega-item{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;cursor:pointer;transition:.3s}
.mega-item:hover{background:rgba(0,212,255,0.06)}
.mega-item:hover .mega-icon{transform:scale(1.15);box-shadow:0 0 20px rgba(0,212,255,0.2)}
.mega-icon{width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.1rem;flex-shrink:0;transition:.3s}
.mega-icon svg{width:18px;height:18px;display:block;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mega-label{font-size:.82rem;font-weight:600;color:#fff}
.mega-desc{font-size:.68rem;color:var(--text2);margin-top:1px;line-height:1.4}
.mega-divider{grid-column:1/-1;height:1px;background:var(--border);margin:6px 0}
.mega-footer{position:relative;z-index:1;grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;padding:8px 14px 0;margin-top:4px}
.mega-footer-link{font-size:.72rem;color:var(--cyan);cursor:pointer;font-weight:500;transition:.3s;text-decoration:none}
.mega-footer-link:hover{text-decoration:underline}
.mega-badge{font-size:.55rem;padding:3px 10px;border-radius:20px;background:rgba(255,111,216,0.12);color:var(--pink);font-weight:700;letter-spacing:.5px}
.mega-menu.compact{min-width:280px}
.mega-menu.compact .mega-grid{grid-template-columns:1fr}
.nav-r{display:flex;gap:10px;align-items:center;}
.btn-g{padding:8px 20px;border:1px solid rgba(255,255,255,0.1);border-radius:50px;background:0;color:#fff;font-size:.8rem;font-weight:500;cursor:pointer;transition:.3s;font-family:inherit;}
.btn-g:hover{border-color:rgba(0,212,255,0.35);background:rgba(0,212,255,0.05);}
.btn-p{padding:8px 22px;border:none;border-radius:50px;background:linear-gradient(135deg,#00d4ff,#7b2ff7);color:#fff;font-weight:600;font-size:.8rem;cursor:pointer;transition:.3s;font-family:inherit;box-shadow:0 4px 18px rgba(0,212,255,0.2);}
.btn-p:hover{transform:translateY(-1px);box-shadow:0 8px 28px rgba(0,212,255,0.35);}

/* === SLIDER === */
.slider{position:absolute;inset:0;z-index:2;overflow:hidden;}
.slide{position:absolute;inset:0;opacity:0;transition:opacity 1.2s cubic-bezier(.4,0,.2,1);pointer-events:none;}
.slide.active{opacity:1;pointer-events:all;}
.slide-bg{position:absolute;inset:0;transform:scale(1.08);transition:transform 8s ease-out;}
.slide.active .slide-bg{transform:scale(1);}
.slide-bg-img{width:100%;height:100%;object-fit:cover;display:block;}
.slide-art{position:absolute;inset:0;overflow:hidden;z-index:1;}
.slide-overlay{position:absolute;inset:0;z-index:2;}
.slide-content{position:absolute;inset:0;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:100px 8% 80px;z-index:10;max-width:55%;}
.slide-panel{background:rgba(0,0,0,0.25);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,0.06);border-radius:28px;padding:40px 38px 36px;opacity:0;transform:translateY(30px);transition:opacity .6s .25s,transform .6s .25s;}
.slide.active .slide-panel{opacity:1;transform:translateY(0);}
.slide-badge{display:inline-flex;align-items:center;gap:7px;padding:6px 16px;border-radius:50px;font-size:.68rem;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:16px;opacity:0;transform:translateY(12px);transition:opacity .5s .4s,transform .5s .4s;}
.slide.active .slide-badge{opacity:1;transform:translateY(0);}
.sl1 .slide-badge{background:rgba(0,212,255,0.15);color:#00d4ff;border:1px solid rgba(0,212,255,0.2);}
.sl2 .slide-badge{background:rgba(123,47,247,0.15);color:#c97bff;border:1px solid rgba(123,47,247,0.2);}
.sl3 .slide-badge{background:rgba(0,184,148,0.15);color:#38ef7d;border:1px solid rgba(0,184,148,0.2);}
.sl4 .slide-badge{background:rgba(204,41,54,0.15);color:#ff6b7a;border:1px solid rgba(204,41,54,0.2);}
.slide-badge svg{width:14px;height:14px;fill:currentColor;}
.slide-label{font-size:.72rem;font-weight:700;letter-spacing:5px;text-transform:uppercase;margin-bottom:18px;opacity:0;transform:translateY(20px);transition:opacity .6s .3s,transform .6s .3s;display:flex;align-items:center;gap:10px;}
.slide-label::before{content:'';display:inline-block;width:28px;height:2px;border-radius:2px;background:currentColor;opacity:.8;}
.slide.active .slide-label{opacity:1;transform:translateY(0);}
.slide-title{font-size:clamp(2.4rem,5.8vw,5.5rem);font-weight:900;line-height:1.0;margin-bottom:20px;opacity:0;transform:translateY(28px);transition:opacity .7s .45s,transform .7s .45s;letter-spacing:-.02em;}
.slide.active .slide-title{opacity:1;transform:translateY(0);}
.slide-desc{font-size:1rem;color:rgba(255,255,255,0.55);line-height:1.75;margin-bottom:28px;opacity:0;transform:translateY(20px);transition:opacity .7s .6s,transform .7s .6s;}
.slide.active .slide-desc{opacity:1;transform:translateY(0);}
.slide-stats{display:flex;gap:24px;margin-bottom:28px;opacity:0;transform:translateY(14px);transition:opacity .6s .65s,transform .6s .65s;}
.slide.active .slide-stats{opacity:1;transform:translateY(0);}
.slide-stat{display:flex;flex-direction:column;gap:2px;}
.slide-stat-num{font-size:1.3rem;font-weight:800;letter-spacing:-.02em;}
.slide-stat-lbl{font-size:.65rem;color:rgba(255,255,255,0.35);text-transform:uppercase;letter-spacing:1px;font-weight:500;}
.sl1 .slide-stat-num{color:#00d4ff;}
.sl2 .slide-stat-num{color:#c97bff;}
.sl3 .slide-stat-num{color:#38ef7d;}
.sl4 .slide-stat-num{color:#ff6b7a;}
.slide-btn{display:inline-flex;align-items:center;gap:9px;padding:14px 34px;border-radius:60px;font-size:.9rem;font-weight:700;cursor:pointer;border:none;font-family:inherit;opacity:0;transform:translateY(16px);transition:opacity .7s .75s,transform .7s .75s,filter .3s;}
.slide.active .slide-btn{opacity:1;transform:translateY(0);}
.slide-btn:hover{filter:brightness(1.15);}
@media(max-width:768px){
  .slide-content{max-width:85%;padding:90px 6% 70px;}
  .slide-panel{padding:28px 24px 24px;border-radius:20px;}
  .slide-stats{gap:16px;}
  .slide-stat-num{font-size:1.1rem;}
}
.sl1 .slide-bg{background:radial-gradient(ellipse 80% 60% at 75% 40%,#0077b6 0%,#023e8a 35%,#03045e 65%,#020a18 100%);}
.sl1 .slide-overlay{background:linear-gradient(90deg,rgba(2,8,20,0.96) 0%,rgba(2,8,20,0.75) 45%,rgba(2,8,20,0.2) 100%),linear-gradient(180deg,rgba(2,8,20,0.4) 0%,transparent 40%,rgba(2,8,20,0.5) 100%);}
.sl1 .slide-label{color:#00d4ff;}
.sl1 .slide-btn{background:linear-gradient(135deg,#00d4ff,#007baa);color:#fff;box-shadow:0 8px 30px rgba(0,212,255,0.35);}
.sl2 .slide-bg{background:radial-gradient(ellipse 80% 60% at 70% 45%,#7b2ff7 0%,#4a0e8f 35%,#1a0040 65%,#080010 100%);}
.sl2 .slide-overlay{background:linear-gradient(90deg,rgba(5,0,20,0.96) 0%,rgba(5,0,20,0.75) 45%,rgba(5,0,20,0.2) 100%),linear-gradient(180deg,rgba(5,0,20,0.4) 0%,transparent 40%,rgba(5,0,20,0.5) 100%);}
.sl2 .slide-label{color:#c97bff;}
.sl2 .slide-btn{background:linear-gradient(135deg,#7b2ff7,#ff6fd8);color:#fff;box-shadow:0 8px 30px rgba(123,47,247,0.4);}
.sl3 .slide-bg{background:radial-gradient(ellipse 80% 60% at 72% 42%,#00b894 0%,#006a4e 35%,#003022 65%,#000e08 100%);}
.sl3 .slide-overlay{background:linear-gradient(90deg,rgba(0,8,18,0.96) 0%,rgba(0,8,18,0.75) 45%,rgba(0,8,18,0.2) 100%),linear-gradient(180deg,rgba(0,8,18,0.4) 0%,transparent 40%,rgba(0,8,18,0.5) 100%);}
.sl3 .slide-label{color:#38ef7d;}
.sl3 .slide-btn{background:linear-gradient(135deg,#00b894,#38ef7d);color:#030a18;box-shadow:0 8px 30px rgba(0,184,148,0.4);}
.sl4 .slide-bg{background:radial-gradient(ellipse 80% 60% at 72% 40%,#e94560 0%,#9b1330 35%,#3d0010 65%,#100005 100%);}
.sl4 .slide-overlay{background:linear-gradient(90deg,rgba(10,2,5,0.96) 0%,rgba(10,2,5,0.75) 45%,rgba(10,2,5,0.2) 100%),linear-gradient(180deg,rgba(10,2,5,0.4) 0%,transparent 40%,rgba(10,2,5,0.5) 100%);}
.sl4 .slide-label{color:#ff6b7a;}
.sl4 .slide-btn{background:linear-gradient(135deg,#cc2936,#ff8c69);color:#fff;box-shadow:0 8px 30px rgba(204,41,54,0.4);}
/* Floating orbs */
.sl-orb{position:absolute;border-radius:50%;filter:blur(100px);pointer-events:none;animation:orbF 8s ease-in-out infinite;}
@keyframes orbF{0%,100%{transform:translate(0,0) scale(1);}50%{transform:translate(3%,-4%) scale(1.12);}}
/* Progress bar */
.slider-progress{position:absolute;bottom:0;left:0;right:0;height:3px;background:rgba(255,255,255,0.05);z-index:20;}
.slider-progress-bar{height:100%;background:linear-gradient(90deg,#00d4ff,#7b2ff7,#ff6fd8);width:0%;transition:width linear;}
/* Dots */
.slider-dots{position:absolute;bottom:92px;left:8%;display:flex;gap:8px;z-index:20;align-items:center;}
.sdot{width:28px;height:4px;border-radius:2px;background:rgba(255,255,255,0.18);cursor:pointer;transition:.4s;}
.sdot.active{width:52px;background:linear-gradient(90deg,#00d4ff,#7b2ff7);}
/* Arrows */
.slider-arrow{position:absolute;top:50%;z-index:20;transform:translateY(-50%);width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);backdrop-filter:blur(16px);color:rgba(255,255,255,0.6);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.3s;font-size:1.1rem;}
.slider-arrow:hover{background:rgba(0,212,255,0.1);border-color:rgba(0,212,255,0.3);color:#fff;}
.slider-arrow svg{width:18px;height:18px;display:block;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;}
.slider-prev{left:2.5%;}
.slider-next{right:2.5%;}
/* Counter */
.slider-count{position:absolute;bottom:100px;right:8%;z-index:20;font-size:.7rem;font-weight:700;color:rgba(255,255,255,0.22);letter-spacing:3px;}
.slider-count em{color:rgba(255,255,255,0.75);font-style:normal;}
/* Right visual blob */
.slide-visual{position:absolute;right:7%;top:50%;transform:translateY(-50%) scale(.88);z-index:10;opacity:0;transition:opacity .9s 1s,transform .9s 1s;}
.slide.active .slide-visual{opacity:1;transform:translateY(-50%) scale(1);}
.slide-visual-inner{width:clamp(200px,26vw,380px);height:clamp(200px,26vw,380px);border-radius:50% 40% 60% 45%/55% 60% 40% 50%;display:flex;align-items:center;justify-content:center;font-size:clamp(4rem,9vw,7.5rem);animation:morphB 9s ease-in-out infinite;}
@keyframes morphB{0%,100%{border-radius:50% 40% 60% 45%/55% 60% 40% 50%;}33%{border-radius:40% 60% 45% 55%/60% 45% 55% 40%;}66%{border-radius:60% 45% 55% 40%/40% 55% 45% 60%;}}
.sl1 .slide-visual-inner{background:linear-gradient(135deg,rgba(0,212,255,0.12),rgba(10,61,98,0.35));border:1px solid rgba(0,212,255,0.18);box-shadow:0 20px 80px rgba(0,212,255,0.15),inset 0 0 60px rgba(0,212,255,0.05);}
.sl2 .slide-visual-inner{background:linear-gradient(135deg,rgba(123,47,247,0.12),rgba(74,16,128,0.35));border:1px solid rgba(123,47,247,0.18);box-shadow:0 20px 80px rgba(123,47,247,0.18),inset 0 0 60px rgba(123,47,247,0.05);}
.sl3 .slide-visual-inner{background:linear-gradient(135deg,rgba(0,184,148,0.12),rgba(0,90,51,0.35));border:1px solid rgba(0,184,148,0.18);box-shadow:0 20px 80px rgba(0,184,148,0.15),inset 0 0 60px rgba(0,184,148,0.05);}
.sl4 .slide-visual-inner{background:linear-gradient(135deg,rgba(204,41,54,0.12),rgba(110,0,34,0.35));border:1px solid rgba(204,41,54,0.18);box-shadow:0 20px 80px rgba(204,41,54,0.15),inset 0 0 60px rgba(204,41,54,0.05);}


/* === SLIDE ART (SVG backgrounds) === */
.slide-art{position:absolute;inset:0;overflow:hidden;z-index:1;}
.slide-art svg{position:absolute;width:100%;height:100%;}


/* ================================================
   CREATORS MARQUEE
   ================================================ */
.creators-sec{position:relative;z-index:1;padding:90px 0;overflow:hidden;background:transparent;}
.creators-sec-title{text-align:center;margin-bottom:48px;padding:0 24px;}
.creators-sec-title .label{font-size:.68rem;font-weight:700;letter-spacing:4px;text-transform:uppercase;color:#00d4ff;margin-bottom:10px;}
.creators-sec-title h2{font-size:clamp(1.6rem,3vw,2.2rem);font-weight:800;color:#fff;margin:0;}
.creators-sec-title h2 span{background:linear-gradient(135deg,#00d4ff,#7b2ff7);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}

.cr-marquee{overflow:hidden;position:relative;cursor:pointer;margin-bottom:28px;}
.cr-marquee::before,.cr-marquee::after{content:'';position:absolute;top:0;bottom:0;width:120px;z-index:10;pointer-events:none;}
.cr-marquee::before{left:0;background:linear-gradient(90deg,#030a18,transparent);}
.cr-marquee::after{right:0;background:linear-gradient(-90deg,#030a18,transparent);}

.cr-marquee-reverse{direction:ltr;}
.cr-marquee-reverse .cr-track{animation:crScrollRev 40s linear infinite;}

.cr-track{display:flex;gap:0;width:max-content;}
.cr-marquee .cr-track{animation:crScroll 40s linear infinite;}
.cr-marquee-reverse .cr-track{animation:crScrollRev 40s linear infinite;}
.cr-marquee .cr-track:hover,.cr-marquee-reverse .cr-track:hover{animation-play-state:paused;}

@keyframes crScroll{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}
@keyframes crScrollRev{0%{transform:translateX(-50%);}100%{transform:translateX(0);}}

.cr-item{display:flex;align-items:center;gap:14px;padding:14px 22px;margin-right:16px;background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.06);border-radius:60px;text-decoration:none;color:#fff;transition:.3s;flex-shrink:0;white-space:nowrap;}
.cr-item:hover{background:rgba(0,212,255,0.06);border-color:rgba(0,212,255,0.2);transform:translateY(-2px);}
.cr-avatar{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.2rem;flex-shrink:0;border:2px solid rgba(255,255,255,0.08);}
.cr-info h4{font-size:.88rem;font-weight:700;color:#fff;margin:0 0 2px;line-height:1.2;}
.cr-info span{font-size:.72rem;color:rgba(255,255,255,0.38);font-weight:400;}
.cr-item:hover .cr-info h4{color:#00d4ff;}

/* === HERO === */
.hero{position:relative;z-index:1;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;overflow:hidden;padding:120px 24px 60px;}
#particles{position:absolute;inset:0;z-index:1;pointer-events:none;}
.hz{position:relative;z-index:10;}
.drop-anim{margin-bottom:20px;animation:floatD 4s ease-in-out infinite;}
@keyframes floatD{0%,100%{transform:translateY(0);}50%{transform:translateY(-14px);}}
.hero-title{font-size:clamp(2.6rem,6vw,5.2rem);font-weight:900;line-height:1.05;margin-bottom:20px;background:linear-gradient(135deg,#fff 10%,#00d4ff 45%,#7b2ff7 75%,#ff6fd8 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-size:200% auto;animation:shimmer 6s ease-in-out infinite;}
@keyframes shimmer{0%,100%{background-position:0% center;}50%{background-position:100% center;}}
.hero-sub{font-size:1.08rem;color:rgba(255,255,255,0.48);max-width:520px;margin:0 auto 34px;line-height:1.7;font-weight:300;}
.hero-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-bottom:50px;}
.hb{padding:14px 38px;border-radius:60px;border:none;font-size:.95rem;font-weight:700;cursor:pointer;transition:.3s;font-family:inherit;display:inline-flex;align-items:center;gap:8px;}
.hb.primary{background:linear-gradient(135deg,#00d4ff,#7b2ff7);color:#fff;box-shadow:0 8px 36px rgba(0,212,255,0.28);}
.hb.primary:hover{transform:translateY(-3px);box-shadow:0 14px 48px rgba(0,212,255,0.42);}
.hb.outline{background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.1);color:#fff;}
.hb.outline:hover{border-color:rgba(0,212,255,0.3);background:rgba(0,212,255,0.05);}
.scroll-hint{display:flex;flex-direction:column;align-items:center;gap:6px;color:rgba(255,255,255,0.2);font-size:.68rem;letter-spacing:2px;text-transform:uppercase;animation:bounce 2s infinite;}
@keyframes bounce{0%,100%{transform:translateY(0);}50%{transform:translateY(8px);}}
.scroll-arrow{width:18px;height:18px;border-right:2px solid rgba(255,255,255,0.15);border-bottom:2px solid rgba(255,255,255,0.15);transform:rotate(45deg);}

/* OCEAN */
.ocean{position:absolute;bottom:0;left:0;width:100%;height:48%;z-index:2;overflow:hidden;}
.wv{position:absolute;bottom:0;left:-10%;width:120%;height:100%;}
@keyframes wa{0%,100%{transform:translateX(0) scaleY(1);}30%{transform:translateX(2%) translateY(-10px) scaleY(1.06);}60%{transform:translateX(-1.5%) translateY(-3px) scaleY(.96);}}
@keyframes wb{0%,100%{transform:translateX(0);}40%{transform:translateX(-3%) translateY(-14px) scaleY(1.05);}70%{transform:translateX(2%) translateY(-5px) scaleY(.94);}}
@keyframes wc{0%,100%{transform:translateX(0);}35%{transform:translateX(2.5%) translateY(-7px) scaleY(1.04);}65%{transform:translateX(-2%) translateY(-12px) scaleY(.95);}}
.svg-w{position:absolute;bottom:0;left:0;width:100%;z-index:4;}
.mn{position:absolute;z-index:5;font-size:1.3rem;opacity:0;animation:rise 7s ease-out infinite;color:rgba(0,212,255,0.28);}
@keyframes rise{0%{opacity:0;transform:translateY(0) scale(.5);}15%{opacity:.45;}100%{opacity:0;transform:translateY(-230px) scale(1.2) rotate(28deg);}}
.rpl{position:absolute;z-index:4;border:1px solid rgba(0,212,255,0.08);border-radius:50%;animation:rp 5s ease-out infinite;}
@keyframes rp{0%{width:8px;height:8px;opacity:.4;}100%{width:260px;height:260px;opacity:0;}}

/* ================================================
   INTRO SECTIONS — exact Playary layout
   ================================================ */
.intro-gap{display:flex;flex-direction:column;gap:80px;margin-top:80px;}

/* Each row: full-width flex, image takes ~50% flush to edge */
.intro-row{position:relative;z-index:1;display:flex;align-items:center;width:100%;min-height:500px;}

/* --- IMAGE SIDE --- */
.intro-img-side{width:50%;height:600px;position:relative;flex-shrink:0;overflow:visible;}
.intro-img-box{width:100%;height:100%;position:relative;overflow:hidden;}
/* Gradient placeholder */
.intro-img-bg{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:5rem;object-fit:cover;}
.intro-img-bg img{width:100%;height:100%;object-fit:cover;display:block;}

/* Right-aligned image: rounded on left side */
.intro-row.img-right .intro-img-side{margin-left:auto;}
.intro-row.img-right .intro-img-box{border-top-left-radius:9999px;border-bottom-left-radius:9999px;}

/* Left-aligned image: rounded on right side */
.intro-row.img-left .intro-img-side{margin-right:auto;}
.intro-row.img-left .intro-img-box{border-top-right-radius:9999px;border-bottom-right-radius:9999px;}

/* Ordering */
.intro-row.img-right{flex-direction:row-reverse;}
.intro-row.img-left{flex-direction:row;}

/* --- BLOB ICON --- */
.blob{position:absolute;top:50%;transform:translateY(-50%);width:110px;height:110px;display:flex;align-items:center;justify-content:center;flex-direction:column;z-index:20;background:linear-gradient(135deg,#00d4ff,#7b2ff7);border-radius:50% 30% 70% 40% / 60% 40% 70% 50%;box-shadow:0 8px 30px rgba(0,212,255,0.35);}
.blob svg{width:44px;height:44px;stroke:#fff;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;}
/* Blob on right edge of image (for img-right rows) */
.intro-row.img-right .blob{left:-55px;}
/* Blob on left edge of image (for img-left rows) */
.intro-row.img-left .blob{right:-55px;}

/* --- TEXT SIDE --- */
.intro-txt-side{flex:1;padding:40px 30px;max-width:50rem;margin:0 auto;}
.intro-txt-side .label{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:3px;color:#00d4ff;margin-bottom:10px;}
.intro-txt-side h2{font-size:clamp(2rem,3.8vw,3.5rem);font-weight:900;line-height:1.25;margin-bottom:18px;}
.intro-txt-side p{font-size:1.05rem;color:rgba(255,255,255,0.48);line-height:1.75;}
.intro-txt-side .link{display:inline-flex;align-items:center;gap:6px;margin-top:24px;color:#00d4ff;font-weight:700;font-size:1rem;text-decoration:none;transition:.3s;}
.intro-txt-side .link:hover{gap:12px;color:#fff;}
.link-arrow{display:inline-block;font-size:1.2rem;}

.ib1{background:linear-gradient(135deg,#062a4e,#0077b6,#00d4ff);}
.ib2{background:linear-gradient(135deg,#2a0845,#7b2ff7,#ff6fd8);}
.ib3{background:linear-gradient(135deg,#0a3044,#00b894,#38ef7d);}
.ib4{background:linear-gradient(135deg,#4a0e2a,#e94560,#f8c291);}
.ib5{background:linear-gradient(135deg,#0d1f3c,#1a6b8a,#00d4ff);}
.ib6{background:linear-gradient(135deg,#1a0a3c,#5e1fa8,#c97bff);}
.ib7{background:linear-gradient(135deg,#3c0a1a,#cc2936,#ff8c69);}
.ib8{background:linear-gradient(135deg,#012a1a,#00796b,#00e5cc);}
.ib9{background:linear-gradient(135deg,#1a0a2e,#4a00e0,#f857a6);}

/* ================================================
   MARQUEE (Playary style: rotated bands + floating circles)
   ================================================ */
.marquee-sec{position:relative;z-index:1;height:clamp(300px,60vw,800px);overflow:hidden;margin-top:60px;display:flex;flex-direction:column;justify-content:center;gap:clamp(16px,3vw,48px);}

/* Floating circular images */
.float-circle{position:absolute;z-index:10;border-radius:50%;border:3px solid rgba(255,255,255,0.15);overflow:hidden;display:flex;align-items:center;justify-content:center;font-size:clamp(1.5rem,3vw,3rem);transition:transform .3s;box-shadow:0 12px 40px rgba(0,0,0,0.4);animation:floatC 6s ease-in-out infinite;}
.float-circle:hover{transform:scale(1.1);}
@keyframes floatC{0%,100%{transform:translateY(0) rotate(0deg);}50%{transform:translateY(-12px) rotate(3deg);}}
.fc1{width:clamp(64px,14vw,200px);height:clamp(64px,14vw,200px);top:22%;left:clamp(16px,4vw,60px);animation-delay:0s;}
.fc2{width:clamp(64px,14vw,200px);height:clamp(64px,14vw,200px);top:clamp(8px,2vw,40px);left:50%;transform:translateX(-50%);animation-delay:-.8s;}
.fc3{width:clamp(64px,14vw,200px);height:clamp(64px,14vw,200px);top:45%;right:clamp(16px,5vw,80px);animation-delay:-1.6s;}
.fc1 .fc-bg{background:linear-gradient(135deg,#0a3d62,#00d4ff);}
.fc2 .fc-bg{background:linear-gradient(135deg,#7b2ff7,#ff6fd8);}
.fc3 .fc-bg{background:linear-gradient(135deg,#e94560,#f8c291);}
.fc-bg{width:100%;height:100%;display:flex;align-items:center;justify-content:center;}

/* Marquee bands */
.mq-band{position:relative;width:105vw;left:-2%;background:#000;padding:clamp(8px,1.5vw,28px) 0;overflow:hidden;box-shadow:0 4px 12px rgba(0,0,0,0.4);font-weight:900;font-size:clamp(1.8rem,5vw,4.5rem);color:#fff;white-space:nowrap;}
.mq-band.r1{transform:rotate(-3deg);}
.mq-band.r2{transform:rotate(3deg);}
.mq-band.r3{transform:rotate(-3deg);}
.mq-inner{display:flex;width:max-content;}
.mq-inner.left{animation:mqL 60s linear infinite;}
.mq-inner.right{animation:mqR 60s linear infinite;}
@keyframes mqL{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}
@keyframes mqR{0%{transform:translateX(-50%);}100%{transform:translateX(0);}}
.mq-word{flex-shrink:0;padding:0 clamp(16px,2.5vw,40px);}

/* ================================================
   DEVICES
   ================================================ */
.dev-sec{position:relative;z-index:1;text-align:center;padding:110px 48px;background:transparent;}
.dev-sec h2{font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:800;margin-bottom:14px;}
.dev-sec .sub{color:rgba(255,255,255,0.42);max-width:540px;margin:0 auto 20px;line-height:1.7;font-size:.92rem;}
.dev-sec .dl{display:inline-block;color:#00d4ff;font-weight:700;font-size:.9rem;text-decoration:none;margin-bottom:40px;transition:.3s;}
.dev-sec .dl:hover{color:#fff;}
.dg{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;max-width:800px;margin:0 auto;}
.dc{display:flex;align-items:center;gap:8px;padding:12px 24px;border-radius:60px;background:rgba(255,255,255,0.025);border:1px solid rgba(255,255,255,0.05);font-size:.84rem;font-weight:500;transition:.3s;}
.dc:hover{border-color:rgba(0,212,255,0.15);background:rgba(0,212,255,0.03);transform:translateY(-2px);}

/* ================================================
   PRICING
   ================================================ */
.pri-sec{position:relative;z-index:1;text-align:center;padding:110px 48px;}
.pri-sec h2{font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:800;margin-bottom:14px;}
.pri-sec .sub{color:rgba(255,255,255,0.42);max-width:540px;margin:0 auto 20px;line-height:1.7;font-size:.92rem;}
.pri-sec .dl{display:inline-block;color:#00d4ff;font-weight:700;font-size:.9rem;text-decoration:none;margin-bottom:40px;transition:.3s;}
.pri-sec .dl:hover{color:#fff;}
.premium-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;max-width:900px;margin:36px auto 0;}
.premium-card{background:rgba(255,255,255,0.025);border:1px solid rgba(255,255,255,0.06);border-radius:20px;padding:28px 22px;text-align:center;transition:all .35s;position:relative;overflow:hidden;}
.premium-card:hover{border-color:rgba(0,212,255,0.2);transform:translateY(-4px);}
.premium-card::before{content:'';position:absolute;top:-30px;right:-30px;width:80px;height:80px;border-radius:50%;pointer-events:none;opacity:.5;}
.premium-card:nth-child(1)::before{background:radial-gradient(circle,rgba(0,212,255,0.1),transparent 70%);}
.premium-card:nth-child(2)::before{background:radial-gradient(circle,rgba(123,47,247,0.1),transparent 70%);}
.premium-card:nth-child(3)::before{background:radial-gradient(circle,rgba(56,239,125,0.1),transparent 70%);}
.premium-card:nth-child(4)::before{background:radial-gradient(circle,rgba(255,111,216,0.1),transparent 70%);}
.premium-card-icon{width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 14px;font-size:1.4rem;}
.premium-card h4{font-size:.95rem;font-weight:700;margin-bottom:6px;}
.premium-card p{font-size:.75rem;color:rgba(255,255,255,0.4);line-height:1.55;}
@media(max-width:768px){.premium-cards{grid-template-columns:repeat(2,1fr);gap:12px;}}
@media(max-width:480px){.premium-cards{grid-template-columns:1fr;}}
.pc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;max-width:1100px;margin:0 auto 36px;}
.pc{background:linear-gradient(135deg,rgba(0,212,255,0.03),rgba(123,47,247,0.03));border:1px solid rgba(0,212,255,0.08);border-radius:26px;padding:36px 28px;position:relative;overflow:hidden;transition:all .35s;}
.pc:hover{border-color:rgba(0,212,255,0.18);transform:translateY(-4px);}
.pc::before{content:'';position:absolute;top:-50px;right:-50px;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,rgba(0,212,255,0.06),transparent);pointer-events:none;}
.pc.pc-highlight{border-color:rgba(0,212,255,0.15);background:linear-gradient(135deg,rgba(0,212,255,0.05),rgba(123,47,247,0.05));box-shadow:0 12px 40px rgba(0,212,255,0.08);}
.pc.pc-purple{border-color:rgba(123,47,247,0.1);background:linear-gradient(135deg,rgba(123,47,247,0.04),rgba(255,111,216,0.03));}
.pc.pc-purple::before{background:radial-gradient(circle,rgba(123,47,247,0.06),transparent);}
.pc.pc-green{border-color:rgba(0,184,148,0.1);background:linear-gradient(135deg,rgba(0,184,148,0.04),rgba(56,239,125,0.03));}
.pc.pc-green::before{background:radial-gradient(circle,rgba(0,184,148,0.06),transparent);}
@media(max-width:768px){.pc-grid{grid-template-columns:1fr;max-width:420px;}}
.pb{display:inline-block;padding:5px 18px;border-radius:50px;background:linear-gradient(135deg,#00d4ff,#7b2ff7);font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:2px;margin-bottom:18px;}
.pp{font-size:2.8rem;font-weight:900;margin-bottom:4px;}
.pp span{font-size:.9rem;font-weight:400;color:rgba(255,255,255,0.35);}
.psu{font-size:.78rem;color:rgba(255,255,255,0.35);margin-bottom:26px;}
.pf{list-style:none;text-align:left;margin-bottom:28px;}
.pf li{display:flex;align-items:center;gap:10px;padding:9px 0;font-size:.84rem;color:rgba(255,255,255,0.65);border-bottom:1px solid rgba(255,255,255,0.03);}
.pf li:last-child{border:none;}
.ck{color:#00d4ff;font-weight:700;}
.pq{font-size:.74rem;color:rgba(255,255,255,0.25);font-style:italic;margin-bottom:22px;line-height:1.5;}
.bp{width:100%;padding:14px;border:none;border-radius:60px;background:linear-gradient(135deg,#00d4ff,#7b2ff7);color:#fff;font-size:.95rem;font-weight:700;cursor:pointer;transition:.3s;font-family:inherit;box-shadow:0 6px 28px rgba(0,212,255,0.22);}
.bp:hover{transform:translateY(-2px);box-shadow:0 12px 38px rgba(0,212,255,0.35);}

/* ================================================
   FEATURES GRID (Playary artists style)
   ================================================ */
.feat-sec{position:relative;padding:110px 24px;background:#000;overflow:hidden;text-align:center;}
.feat-sec::before{content:'';position:absolute;top:20%;left:20%;width:250px;height:250px;border-radius:50%;background:rgba(0,212,255,0.08);filter:blur(100px);pointer-events:none;}
.feat-sec::after{content:'';position:absolute;bottom:25%;right:20%;width:300px;height:300px;border-radius:50%;background:rgba(123,47,247,0.08);filter:blur(120px);pointer-events:none;}
.feat-sec h2{position:relative;z-index:20;font-size:clamp(2rem,5vw,4.5rem);font-weight:900;margin-bottom:40px;}
.feat-grid{position:relative;z-index:20;display:grid;grid-template-columns:repeat(3,1fr);gap:20px;max-width:1200px;margin:0 auto;}
.feat-card{background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.07);border-radius:24px;padding:32px 24px;display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center;transition:all .3s;backdrop-filter:blur(12px);box-shadow:0 10px 15px -3px rgba(0,0,0,0.3);}
.feat-card:hover{transform:translateY(-8px);border-color:rgba(0,212,255,0.3);}
.feat-card-icon{width:64px;height:64px;border-radius:50%;border:1px solid rgba(255,255,255,0.08);display:flex;align-items:center;justify-content:center;transition:all .3s;backdrop-filter:blur(4px);}
.feat-card:hover .feat-card-icon{background:rgba(0,212,255,0.08);border-color:rgba(0,212,255,0.2);}
.feat-card-icon svg{width:32px;height:32px;stroke:#00d4ff;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;}
.feat-card h3{font-size:1.1rem;font-weight:700;}
.feat-card p{font-size:.82rem;color:rgba(255,255,255,0.6);line-height:1.6;}

@media(max-width:1024px){.feat-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:640px){.feat-grid{grid-template-columns:1fr;}}

/* ================================================
   CREATORS
   ================================================ */
.crt-sec{padding:110px 48px;}
.crt-in{display:flex;align-items:center;gap:50px;max-width:1100px;margin:0 auto;}
.crt-txt{flex:1;}
.crt-txt .label{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:3px;color:#00d4ff;margin-bottom:10px;}
.crt-txt h2{font-size:clamp(1.8rem,3.5vw,2.4rem);font-weight:800;margin-bottom:14px;line-height:1.15;}
.crt-txt p{font-size:.92rem;color:rgba(255,255,255,0.45);line-height:1.7;margin-bottom:22px;}
.crt-btns{display:flex;gap:10px;flex-wrap:wrap;}
.cbl{padding:11px 26px;border-radius:50px;font-size:.84rem;font-weight:600;cursor:pointer;transition:.3s;text-decoration:none;display:inline-block;}
.cbl.pr{background:linear-gradient(135deg,#00d4ff,#7b2ff7);color:#fff;border:none;}
.cbl.sc{background:0;color:#fff;border:1px solid rgba(255,255,255,0.1);}
.cbl:hover{transform:translateY(-2px);}
.crt-imgs{flex:1;display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.ci{border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:3rem;overflow:hidden;}
.ci.tall{grid-row:span 2;min-height:300px;}
.ci:not(.tall){min-height:145px;}
.ci1{background:linear-gradient(135deg,#062a4e,#00d4ff);}
.ci2{background:linear-gradient(135deg,#3a0d6e,#ff6fd8);}
.ci3{background:linear-gradient(135deg,#4a0e2a,#f8c291);}

/* ================================================
   CTA CARD (exact Playary dark card)
   ================================================ */
.cta-wrap{max-width:1100px;margin:80px auto 0;padding:0 24px;}
.cta-card{border-radius:24px;overflow:hidden;border:1px solid rgba(255,255,255,0.06);background:#0a0a0a;display:flex;max-height:520px;position:relative;box-shadow:0 25px 50px -12px rgba(0,0,0,0.25);}
.cta-radial{position:absolute;inset:0;background:radial-gradient(circle at center,rgba(0,212,255,0.05) 0%,transparent 70%);opacity:.35;pointer-events:none;}
.cta-img{flex:1;overflow:hidden;display:flex;align-items:center;justify-content:center;}
.cta-img-bg{width:100%;height:100%;min-height:420px;background:linear-gradient(135deg,#041e36,#0a3d62,#00b4d8);display:flex;align-items:center;justify-content:center;font-size:6rem;}
.cta-txt{flex:1;position:relative;z-index:10;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;padding:48px 36px;text-align:center;}
.cta-txt h2{font-size:clamp(1.5rem,3vw,2.6rem);font-weight:700;letter-spacing:-.025em;line-height:1.2;max-width:400px;}
.cta-txt>p{font-size:1rem;color:rgba(255,255,255,0.6);line-height:1.65;max-width:420px;}
.cta-btns{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-top:8px;}
.cta-b{display:inline-flex;align-items:center;gap:10px;padding:12px 24px;border-radius:60px;font-weight:700;font-size:.88rem;cursor:pointer;transition:all .3s;text-decoration:none;border:1px solid rgba(255,255,255,0.08);background:linear-gradient(to right,#101010,#1a1a1a);color:#fff;box-shadow:0 4px 12px rgba(0,0,0,0.3);}
.cta-b:hover{border-color:rgba(255,255,255,0.15);background:linear-gradient(to right,#1a1a1a,#252525);transform:scale(1.02);}
.cta-ico{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.85rem;box-shadow:0 2px 8px rgba(0,0,0,0.3);}
.cta-ico.g{background:linear-gradient(135deg,#00d4ff,#7b2ff7);}
.cta-ico.w{background:#fff;color:#000;}

.store-row{display:flex;gap:12px;justify-content:center;margin:28px auto 80px;max-width:1100px;padding:0 24px;}
.sb{padding:11px 24px;border-radius:12px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.06);display:flex;align-items:center;gap:8px;font-size:.78rem;font-weight:500;cursor:pointer;transition:.3s;}
.sb:hover{border-color:rgba(0,212,255,0.15);background:rgba(0,212,255,0.03);}

/* ================================================
   FOOTER
   ================================================ */
footer{position:relative;z-index:1;border-top:1px solid rgba(255,255,255,0.04);padding:56px 48px 36px;margin-top:80px;}
.fg{display:grid;grid-template-columns:2fr 1fr 1fr 1fr 1fr;gap:36px;max-width:1100px;margin:0 auto;}
.fb p{font-size:.76rem;color:rgba(255,255,255,0.3);line-height:1.6;margin-top:10px;max-width:250px;}
.fs{display:flex;gap:8px;margin-top:14px;}
.soc{width:32px;height:32px;border-radius:50%;border:1px solid rgba(255,255,255,0.05);display:flex;align-items:center;justify-content:center;font-size:.7rem;cursor:pointer;transition:.3s;color:rgba(255,255,255,0.35);}
.soc:hover{border-color:rgba(0,212,255,0.25);color:#00d4ff;}
.fc h4{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:1.5px;color:rgba(255,255,255,0.55);margin-bottom:14px;}
.fc a{display:block;font-size:.76rem;color:rgba(255,255,255,0.3);text-decoration:none;margin-bottom:9px;transition:.3s;}
.fc a:hover{color:#00d4ff;}
.fbot{max-width:1100px;margin:30px auto 0;padding-top:20px;border-top:1px solid rgba(255,255,255,0.03);text-align:center;font-size:.68rem;color:rgba(255,255,255,0.18);}

.reveal{opacity:0;transform:translateY(36px);transition:all .65s cubic-bezier(.22,1,.36,1);}
.reveal.visible{opacity:1;transform:translateY(0);}

@media(max-width:1024px){
  .intro-row{flex-direction:column !important;min-height:auto;gap:0;}
  .intro-img-side{width:90%;height:350px;margin:0 auto !important;}
  .intro-row.img-right .intro-img-side,.intro-row.img-left .intro-img-side{margin-left:auto !important;margin-right:auto !important;}
  .intro-row.img-right .intro-img-box,.intro-row.img-left .intro-img-box{border-radius:24px;}
  .blob{width:72px;height:72px;}
  .blob svg{width:28px;height:28px;}
  .intro-row.img-right .blob{left:auto;right:20px;top:auto;bottom:-36px;transform:none;}
  .intro-row.img-left .blob{right:auto;left:20px;top:auto;bottom:-36px;transform:none;}
  .intro-txt-side{padding:48px 24px 32px;max-width:100%;text-align:center;}
  .intro-txt-side .link{justify-content:center;}
  .intro-txt-side h2{font-size:1.8rem;}
}
@media(max-width:768px){
  nav{padding:12px 18px;}
  .nav-c{display:none;}
  .intro-img-side{width:92%;height:280px;}
  .intro-row.img-right .intro-img-box,.intro-row.img-left .intro-img-box{border-radius:20px;}
  .intro-txt-side{padding:44px 20px 28px;}
  .intro-txt-side h2{font-size:1.6rem;}
  .intro-txt-side p{font-size:.95rem;}
  .intro-gap{gap:50px;}
  .blob{width:60px;height:60px;bottom:-30px !important;}
  .blob svg{width:24px;height:24px;}
  .marquee-imgs{flex-wrap:wrap;}
  .mqi{width:140px;height:200px;}
  .dev-sec,.pri-sec{padding:70px 20px;}
  .crt-in{flex-direction:column;gap:30px;}
  .crt-sec{padding:70px 20px;}
  .cta-card{flex-direction:column;max-height:none;}
  .cta-img{min-height:200px;}
  .cta-img-bg{min-height:200px;}
  .fg{grid-template-columns:1fr 1fr;}
  footer{position:relative;z-index:1;padding:40px 20px 30px;}
  .store-row{flex-wrap:wrap;}
}
@media(max-width:480px){
  .intro-img-side{height:220px;width:calc(100% - 16px);margin:0 8px !important;}
  .intro-row.img-right .intro-img-box,.intro-row.img-left .intro-img-box{border-radius:16px;}
  .intro-txt-side{padding:38px 16px 24px;}
  .intro-txt-side h2{font-size:1.35rem;}
  .intro-txt-side p{font-size:.88rem;line-height:1.65;}
  .intro-gap{gap:40px;margin-top:50px;}
  .blob{width:50px;height:50px;bottom:-25px !important;}
  .blob svg{width:20px;height:20px;}
  .intro-row.img-right .blob{right:16px !important;}
  .intro-row.img-left .blob{left:16px !important;}
}

/* ================================================
   FEATURED ARTISTS (AudioBeats style)
   ================================================ */
.featured { position: relative; z-index:1; }
.featured .container-fluid { max-width: 100%; padding: 0 48px; }
@media (min-width: 1440px) { .featured .container-fluid { padding: 0 96px; } }
.p-40 { padding: 40px 0; }
@media (max-width: 1199px) { .p-40 { padding: 32px 0; } }
@media (max-width: 991px)  { .p-40 { padding: 28px 0; } }
@media (max-width: 767px)  { .p-40 { padding: 22px 0; } }

.featured .heading { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; margin-bottom: 32px; position: relative; }
.featured .heading h3 {
  font-family: 'Orbitron', sans-serif;
  font-weight: 700;
  font-size: clamp(22px, 1.875vw, 36px);
  line-height: 120%;
  letter-spacing: -0.27px;
  color: #fff;
  margin: 0;
}
.featured .heading h6 { margin: 0; font-size: clamp(13px, 0.9vw, 16px); font-weight: 500; color: rgba(255,255,255,0.4); }
.featured .heading h6 a { color: rgba(255,255,255,0.45); text-decoration: none; transition: color .3s; letter-spacing: 0.32px; }
.featured .heading h6 a:hover { color: #FF6B00; }

/* Artist card */
.artist-card { text-align: center; transition: all 0.5s ease; cursor: pointer; padding: 0 12px; }
.artist-card:hover { transform: translateY(-4px); }
.artist-avatar-wrap {
  width: 160px; height: 160px;
  border-radius: 50%; overflow: hidden;
  margin: 0 auto 16px;
  border: 2px solid rgba(255,255,255,0.06);
  transition: border-color .3s, box-shadow .3s;
}
.artist-card:hover .artist-avatar-wrap {
  border-color: rgba(0,212,255,0.4);
  box-shadow: 0 0 28px rgba(0,212,255,0.15);
}
.artist-avatar-wrap svg { display: block; width: 100%; height: 100%; }
.artist-card h5 {
  font-weight: 600; font-size: clamp(14px, 1.094vw, 18px);
  line-height: 130%; color: #fff; margin: 0 0 4px;
  transition: color .3s;
}
.artist-card:hover h5 { color: #00d4ff; }
.artist-card h6 { font-size: clamp(11px, 0.833vw, 14px); font-weight: 500; color: #797D86; margin: 0; letter-spacing: 0.32px; }

/* Slick overrides */
.artist-slider { position: relative; margin-top: 8px; }
.artist-slider .slick-track { display: flex; align-items: center; }
.artist-slider .slick-slide { margin: 0 12px; }
.artist-slider .slick-list { margin: 0 -12px; }

/* Arrows — identical to AudioBeats template */
.artist-slider .slick-prev,
.artist-slider .slick-next {
  display: none;
}
.artist-slider .slick-prev { left: auto; right: 46px; }
.artist-slider .slick-next { right: 0; }
.artist-slider .slick-prev::after {
  content: "\2039";
  font-size: 20px; line-height: 16px; padding: 8px;
  height: 32px; width: 32px;
  background: linear-gradient(180deg, rgba(27,28,30,0.8) 0%, rgba(27,28,30,0.48) 100%);
  border-radius: 10px; color: #797D86;
  position: absolute; top: -61px; right: 0;
  display: flex; align-items: center; justify-content: center;
  z-index: 10; transition: color .25s;
}
.artist-slider .slick-next::after {
  content: "\203A";
  font-size: 23px; line-height: 18px; padding: 8px;
  height: 32px; width: 32px;
  background: linear-gradient(180deg, rgba(27,28,30,0.8) 0%, rgba(27,28,30,0.48) 100%);
  border-radius: 10px; color: #797D86;
  position: absolute; top: -61px; right: 0;
  display: flex; align-items: center; justify-content: center;
  z-index: 10; transition: color .25s;
}
.artist-slider .slick-prev:hover::after,
.artist-slider .slick-next:hover::after { color: #FF6B00; }


/* ================================================
   LINE-UP SECTION (Eventiva style)
   ================================================ */
:root {
  --eventiva-primary: #00d4ff;
  --eventiva-primary-rgb: 0,212,255;
  --eventiva-heading-color: #fff;
  --eventiva-heading-color-rgb: 255,255,255;
  --eventiva-headings-font-family: 'Inter', sans-serif;
  --eventiva-body-font-family: 'Inter', sans-serif;
  --swiper-theme-color: #00d4ff;
  --swiper-pagination-line-color: rgba(255,255,255,0.15);
}

.lineup-section { position:relative; z-index:1; padding-top: 3.75rem; margin-bottom: 2.5rem; }

.lineup-contents {
  border-radius: 0;
  border: none;
  background: transparent;
  box-shadow: none;
  padding: 3.125rem 0;
  position: relative;
  overflow: hidden;
}

/* Two-col layout */
.lineup-row {
  display: flex;
  flex-wrap: wrap;
  gap: 1.875rem;
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 1.5rem;
  align-items: center;
}
.lineup-col-swiper { flex: 0 0 58.333%; width: 58.333%; position: relative; }
.lineup-col-text   { flex: 0 0 38%;      width: 38%; }
@media (max-width: 991px) {
  .lineup-col-swiper,
  .lineup-col-text { flex: 0 0 100%; width: 100%; }
  .lineup-col-text { order: -1; }
}

/* Swiper images */
.lineup-image-wrapper { position: relative; transition: all .5s ease-in-out; }
.lineup-image { position: relative; border-radius: 30px; overflow: hidden; }
.lineup-image img { display: block; width: 100%; border-radius: 30px; }
.lineup-image::after {
  content: '';
  position: absolute; left: 0; top: 0; width: 100%; height: 100%;
  border-radius: 30px;
  background: linear-gradient(174deg, rgba(178,13,93,0) 46.95%, rgba(var(--eventiva-primary-rgb),.81) 103.38%);
}

/* Hover overlay */
.lineup-image-hover {
  position: absolute; bottom: -20px; left: 16px;
  transition: all .5s ease-in-out;
  z-index: 2;
}
.lineup-image-wrapper:hover .lineup-image-hover { bottom: 32px; }
.lineup-image-hover .author-name {
  font-size: 28px; font-weight: 800; color: #CECCDA;
  margin-bottom: 0; line-height: 1.3;
  font-family: 'Inter', sans-serif;
}
@media (max-width: 1399px) { .lineup-image-hover .author-name { font-size: 22px; } }
.lineup-image-hover h5 { color: #CECCDA; font-size: 1rem; font-weight: 500; margin: 0 0 10px; }
.line-up-hover-content { visibility: hidden; opacity: 0; transition: all .5s ease-in-out; }
.lineup-image-wrapper:hover .line-up-hover-content { visibility: visible; opacity: 1; }
.line-up-icons { display: flex; align-items: center; gap: 12px; }
.line-up-icons a {
  color: #CECCDA !important;
  font-size: .9rem;
  text-decoration: none;
  transition: color .2s;
  min-width: 20px; text-align: center;
}
.line-up-icons a:hover { color: var(--eventiva-primary) !important; }

/* Swiper custom controls */
.swiper-custom-progress {
  --swiper-theme-color: var(--eventiva-primary);
  --swiper-pagination-line-color: rgba(255,255,255,0.15);
  position: relative;
  padding-bottom: 70px;
}
.swiper-custom-progress .lineup-swiper-pagination {
  position: absolute;
  bottom: 18px !important;
  left: 11% !important;
  width: 89% !important;
  height: 2px !important;
  background: var(--swiper-pagination-line-color);
  border-radius: 10px;
  top: auto !important;
}
.swiper-custom-progress .lineup-swiper-pagination .swiper-pagination-progressbar-fill {
  background: var(--eventiva-primary);
  position: absolute; left: 0; top: 0;
  width: 100%; height: 100%;
  transform-origin: left top;
}
.swiper-button-progress {
  position: absolute;
  bottom: 0; left: 0;
  display: flex; gap: 12px;
}
.swiper-custom-progress .swiper-button-prev,
.swiper-custom-progress .swiper-button-next {
  position: static;
  width: 25px; height: 25px;
  border: 1px solid rgba(255,255,255,0.3);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: all .2s;
  margin-top: 0;
  color: #fff;
}
.swiper-custom-progress .swiper-button-prev::after,
.swiper-custom-progress .swiper-button-next::after { content: none; }
.swiper-custom-progress .swiper-button-prev:hover,
.swiper-custom-progress .swiper-button-next:hover { border-color: var(--eventiva-primary); color: var(--eventiva-primary); }
.swiper-custom-progress .swiper-button-prev svg,
.swiper-custom-progress .swiper-button-next svg { fill: currentColor; width: 12px; height: 12px; }

/* Right text column */
.lineup-right-content { max-width: 445px; }
@media (max-width: 991px) { .lineup-right-content { max-width: 100%; } }

.section-title { position: relative; z-index: 9; }
.section-title .name {
  display: inline-block;
  padding-left: 50px;
  font-size: 1.5rem; font-weight: 600;
  color: #fff;
  position: relative;
  margin-bottom: 12px;
  font-family: 'Inter', sans-serif;
}
.section-title .name .straight-line {
  position: absolute; top: 50%; left: 0;
  width: 34px; height: 2px;
  background: var(--eventiva-primary);
  transform-origin: bottom left;
  transition: all .4s;
}
.section-title .name:hover { padding-left: 80px; }
.section-title .name:hover .straight-line { transform: scaleX(2); }

.lineup-title {
  font-size: clamp(2.5rem, 5vw, 4rem);
  font-weight: 800; line-height: 1.1;
  color: #fff; margin: 0 0 -4px;
  display: flex; flex-direction: column;
}
@media (max-width: 1399px) { .lineup-title { font-size: 3.3rem; } }
.lineup-title .text-opacity { opacity: 0.15; }
.lineup-title .sub-title {
  -webkit-text-stroke: 1.5px var(--eventiva-primary);
  color: transparent;
  filter: drop-shadow(10px 9px 46px rgba(var(--eventiva-primary-rgb),.6));
}

.lineup-desc { color: rgba(255,255,255,0.55); line-height: 1.7; margin: 20px 0 30px; font-size: .9rem; }

.download-link {
  display: inline-flex; align-items: center; gap: 2.5rem;
  text-decoration: underline !important;
  text-underline-offset: 10px;
  color: rgba(210,210,210,.85);
  font-weight: 500;
  transition: all .2s !important;
}
.download-link:hover { color: var(--eventiva-primary); }
.download-link:hover .ticket-arrow svg { transform: rotate(45deg); }
.ticket-arrow {
  display: flex; align-items: center; justify-content: center;
  width: 56px; height: 56px;
  background: rgba(255,255,255,0.1);
  border-radius: 50%; cursor: pointer;
  overflow: hidden; transition: all .4s;
}
.ticket-arrow svg { fill: currentColor; width: 30px; height: 30px; transition: transform .3s; }

/* Ellipse decoration */
.lineup-contents .ellipse-image-2 {
  position: absolute; bottom: -45px; left: -78px;
  z-index: -1; opacity: .12;
  animation: lu-move-x 4s infinite alternate;
}
@keyframes lu-move-x { 0%{transform:translateX(0)} 100%{transform:translateX(-30px)} }


/* ── TOOLS ACCORDION ── */
.tools-sec { position:relative; z-index:1; padding: 110px 48px; }
.tools-inner { max-width: 900px; margin: 0 auto; }
.tools-header { text-align: center; margin-bottom: 56px; }
.tools-header h2 { font-size: clamp(1.8rem,3.5vw,2.6rem); font-weight: 800; margin-bottom: 14px; line-height: 1.2; }
.tools-header h2 span { background: linear-gradient(135deg,#00d4ff,#7b2ff7); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.tools-header p { color: rgba(255,255,255,0.42); font-size: .95rem; max-width: 520px; margin: 0 auto; }

.tool-item { border: 1px solid rgba(255,255,255,0.07); border-radius: 16px; margin-bottom: 14px; overflow: hidden; background: rgba(255,255,255,0.02); transition: border-color .3s; }
.tool-item:hover { border-color: rgba(0,212,255,0.2); }
.tool-item.open { border-color: rgba(0,212,255,0.3); background: rgba(0,212,255,0.03); }

.tool-btn { display: flex; align-items: center; gap: 20px; padding: 18px 24px; cursor: pointer; user-select: none; }
.tool-btn-img { width: 72px; height: 72px; border-radius: 14px; overflow: hidden; flex-shrink: 0; }
.tool-btn-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.tool-item.open .tool-btn-img img { transform: scale(1.08); }
.tool-btn-text { flex: 1; }
.tool-btn-text h3 { font-size: 1.1rem; font-weight: 700; color: #fff; margin: 0 0 4px; }
.tool-info { font-size: .82rem; color: rgba(255,255,255,0.4); margin: 0; line-height: 1.4; }
.tool-chevron { font-size: 1.4rem; color: rgba(255,255,255,0.3); transition: transform .3s, color .3s; line-height: 1; flex-shrink: 0; }
.tool-item.open .tool-chevron { color: #00d4ff; }
.tool-item.open .tool-chevron .chev-svg { transform: rotate(45deg); }
.chev-svg { transition: transform .3s; display: block; }

.tool-collapse { max-height: 0; overflow: hidden; transition: max-height .45s cubic-bezier(.4,0,.2,1); }
.tool-collapse.open { max-height: 600px; }

.tool-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; padding: 0 24px 24px; }
.tool-card { background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.06); border-radius: 14px; padding: 20px; transition: border-color .3s, background .3s; }
.tool-card:hover { border-color: rgba(0,212,255,0.2); background: rgba(0,212,255,0.04); }
.tool-card-img { width: 56px; height: 56px; margin-bottom: 14px; }
.tool-card h4 { font-size: .9rem; font-weight: 700; color: #fff; margin: 0 0 8px; }
.tool-card p { font-size: .78rem; color: rgba(255,255,255,0.42); line-height: 1.6; margin: 0; }

@media (max-width: 768px) {
  .tools-sec { position:relative; z-index:1; padding: 70px 20px; }
  .tool-grid { grid-template-columns: 1fr; }
  .tool-btn-img { width: 56px; height: 56px; }
}

/* ================================================
   UNDERWATER EFFECTS
   ================================================ */

/* ================================================
   PLATFORM EMBED SWITCH
   ================================================ */
.platform-sec{position:relative;z-index:1;padding:110px 40px;text-align:center;overflow:hidden;}
.platform-inner{max-width:1400px;margin:0 auto;}
.platform-title{font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:800;margin-bottom:14px;}
.platform-sub{color:rgba(255,255,255,0.42);max-width:580px;margin:0 auto 40px;line-height:1.7;font-size:.92rem;}
.platform-tabs{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-bottom:32px;}
.platform-tab{display:inline-flex;align-items:center;gap:8px;padding:12px 24px;border-radius:60px;border:1px solid rgba(255,255,255,0.08);background:rgba(255,255,255,0.03);color:rgba(255,255,255,0.5);font-size:.88rem;font-weight:600;cursor:pointer;transition:all .35s;font-family:inherit;backdrop-filter:blur(8px);}
.platform-tab:hover{border-color:rgba(255,255,255,0.15);color:rgba(255,255,255,0.8);background:rgba(255,255,255,0.05);}
.platform-tab.active{border-color:rgba(0,212,255,0.4);background:rgba(0,212,255,0.1);color:#00d4ff;box-shadow:0 0 20px rgba(0,212,255,0.12);}
.platform-tab[data-platform="youtube"].active{border-color:rgba(255,0,0,0.45);background:rgba(255,0,0,0.1);color:#ff0000;box-shadow:0 0 20px rgba(255,0,0,0.12);}
.platform-tab[data-platform="spotify"].active{border-color:rgba(30,215,96,0.45);background:rgba(30,215,96,0.1);color:#1ed760;box-shadow:0 0 20px rgba(30,215,96,0.12);}
.platform-tab[data-platform="soundcloud"].active{border-color:rgba(255,85,0,0.45);background:rgba(255,85,0,0.1);color:#ff5500;box-shadow:0 0 20px rgba(255,85,0,0.12);}
.platform-tab[data-platform="mixcloud"].active{border-color:rgba(81,209,231,0.45);background:rgba(81,209,231,0.1);color:#51d1e7;box-shadow:0 0 20px rgba(81,209,231,0.12);}
.platform-tab svg{flex-shrink:0;}
.platform-embeds{position:relative;border-radius:18px;overflow:hidden;}
.platform-embed{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .45s ease,visibility .45s;pointer-events:none;}
.platform-embed.active{position:relative;opacity:1;visibility:visible;pointer-events:all;}
.embed-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding:4px;}
.embed-item{border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,0.06);background:rgba(0,0,0,0.4);aspect-ratio:16/9;position:relative;}
.embed-item iframe{position:absolute;inset:0;width:100%;height:100%;border:none;border-radius:16px;}

@media(max-width:1200px){
  .embed-grid{grid-template-columns:repeat(2,1fr);gap:16px;}
  .embed-item{aspect-ratio:16/9;}
}
@media(max-width:640px){
  .platform-sec{padding:70px 16px;}
  .platform-tabs{gap:6px;}
  .platform-tab{padding:10px 16px;font-size:.78rem;gap:6px;}
  .platform-tab svg{width:16px;height:16px;}
  .embed-grid{grid-template-columns:1fr 1fr;gap:10px;}
  .embed-item{aspect-ratio:16/9;}
}
@media(max-width:420px){
  .embed-grid{grid-template-columns:1fr;gap:12px;}
  .embed-item{aspect-ratio:16/9;}
}

/* ================================================
   ANIMATED COUNTERS
   ================================================ */
/* ── COUNTERS ── */
.counters-sec{position:relative;z-index:1;padding:0 24px 90px;}
.counters-wrap{max-width:1200px;margin:0 auto;}
.counters-bg-strip{position:relative;border-radius:28px;overflow:hidden;padding:2px;background:linear-gradient(135deg,rgba(0,212,255,0.25),rgba(123,47,247,0.2),rgba(255,111,216,0.2));}
.counters-bg-inner{border-radius:26px;background:linear-gradient(135deg,rgba(0,212,255,0.04) 0%,rgba(10,8,22,0.96) 30%,rgba(10,8,22,0.96) 70%,rgba(123,47,247,0.05) 100%);backdrop-filter:blur(24px);}
.counters-grid{
  display:flex;flex-direction:row;align-items:stretch;
  width:100%;
}
.counter-item{
  flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:8px;padding:40px 16px;position:relative;cursor:default;transition:background .3s;
  min-width:0;
}
.counter-item::after{
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse 70% 60% at 50% 50%,rgba(0,212,255,0.06),transparent);
  opacity:0;transition:opacity .4s;pointer-events:none;
}
.counter-item:hover::after{opacity:1;}
.counter-icon{
  width:44px;height:44px;border-radius:13px;display:flex;align-items:center;
  justify-content:center;transition:transform .35s;flex-shrink:0;
}
.counter-item:hover .counter-icon{transform:scale(1.12) rotate(-4deg);}
.counter-num{
  font-size:clamp(1.8rem,2.8vw,3rem);font-weight:900;line-height:1;
  letter-spacing:-.03em;
  background:linear-gradient(135deg,#fff 0%,#00d4ff 55%,#7b2ff7 100%);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
  background-size:200% auto;transition:background-position .6s;white-space:nowrap;
}
.counter-item:hover .counter-num{background-position:right center;}
.counter-lbl{
  font-size:.68rem;color:rgba(255,255,255,0.42);text-transform:uppercase;
  letter-spacing:2px;font-weight:700;text-align:center;white-space:nowrap;
}
.counter-sublbl{
  font-size:.63rem;color:rgba(255,255,255,0.18);letter-spacing:.3px;
  text-align:center;white-space:nowrap;
}
.counter-trend{
  display:inline-flex;align-items:center;gap:4px;
  font-size:.6rem;font-weight:700;padding:3px 9px;
  border-radius:20px;white-space:nowrap;
}
.counter-trend.up{background:rgba(56,239,125,0.1);color:#38ef7d;border:1px solid rgba(56,239,125,0.2);}
.counter-trend.hot{background:rgba(255,111,216,0.1);color:#ff6fd8;border:1px solid rgba(255,111,216,0.2);}
.counter-trend.new{background:rgba(0,212,255,0.1);color:#00d4ff;border:1px solid rgba(0,212,255,0.2);}
.counter-divider{
  width:1px;flex-shrink:0;
  background:linear-gradient(180deg,transparent 0%,rgba(255,255,255,0.08) 25%,rgba(255,255,255,0.08) 75%,transparent 100%);
  margin:20px 0;
}
@media(max-width:900px){
  .counters-grid{flex-wrap:wrap;}
  .counter-item{flex-basis:calc(33.33% - 2px);min-width:140px;}
  .counter-divider{display:none;}
  .counter-item{padding:28px 12px;}
}
@media(max-width:520px){
  .counter-item{flex-basis:calc(50% - 2px);}
  .counter-sublbl,.counter-trend{display:none;}
}

/* ================================================
   HOW IT WORKS
   ================================================ */
.hiw-sec{position:relative;z-index:1;padding:110px 24px;text-align:center;}
.hiw-sec h2{font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:800;margin-bottom:14px;}
.hiw-sub{color:rgba(255,255,255,0.42);max-width:520px;margin:0 auto 50px;line-height:1.7;font-size:.92rem;}
.hiw-grid{display:flex;justify-content:center;gap:22px;max-width:1100px;margin:0 auto;position:relative;}
.hiw-step{flex:1;max-width:200px;display:flex;flex-direction:column;align-items:center;gap:14px;position:relative;}
.hiw-num{width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,#00d4ff,#7b2ff7);display:flex;align-items:center;justify-content:center;font-size:1.15rem;font-weight:900;color:#fff;flex-shrink:0;box-shadow:0 8px 28px rgba(0,212,255,0.25);}
.hiw-icon{width:64px;height:64px;border-radius:18px;background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.06);display:flex;align-items:center;justify-content:center;transition:.3s;}
.hiw-step:hover .hiw-icon{border-color:rgba(0,212,255,0.2);background:rgba(0,212,255,0.05);transform:translateY(-4px);}
.hiw-icon svg{width:32px;height:32px;stroke:#00d4ff;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;}
.hiw-step h3{font-size:.95rem;font-weight:700;text-align:center;}
.hiw-step p{font-size:.78rem;color:rgba(255,255,255,0.45);line-height:1.55;text-align:center;}
.hiw-connector{position:absolute;top:24px;width:calc(100% - 200px);height:2px;left:50%;transform:translateX(-50%);background:linear-gradient(90deg,transparent,rgba(0,212,255,0.15),rgba(123,47,247,0.12),rgba(255,111,216,0.1),rgba(0,212,255,0.15),transparent);z-index:-1;display:block;}
@media(max-width:1024px){.hiw-grid{flex-wrap:wrap;gap:28px;}.hiw-step{max-width:180px;min-width:140px;}.hiw-connector{display:none;}}
@media(max-width:768px){.hiw-grid{flex-direction:column;align-items:center;gap:36px;}.hiw-step{max-width:300px;}.hiw-connector{display:none;}}

/* ================================================
   TESTIMONIALS
   ================================================ */
.testi-sec{position:relative;z-index:1;padding:110px 24px;text-align:center;overflow:hidden;}
.testi-sec h2{font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:800;margin-bottom:14px;}
.testi-sub{color:rgba(255,255,255,0.42);max-width:520px;margin:0 auto 44px;line-height:1.7;font-size:.92rem;}
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;max-width:1100px;margin:0 auto;}
.testi-card{background:rgba(255,255,255,0.025);border:1px solid rgba(255,255,255,0.06);border-radius:22px;padding:30px 24px;text-align:left;transition:all .35s;position:relative;}
.testi-card:hover{border-color:rgba(0,212,255,0.15);transform:translateY(-4px);}
.testi-stars{display:flex;gap:3px;margin-bottom:14px;font-size:.85rem;color:#f5a623;}
.testi-quote{font-size:.88rem;color:rgba(255,255,255,0.6);line-height:1.7;margin-bottom:20px;font-style:italic;}
.testi-author{display:flex;align-items:center;gap:12px;}
.testi-avatar{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0;border:2px solid rgba(255,255,255,0.06);}
.testi-name{font-size:.82rem;font-weight:700;color:#fff;}
.testi-role{font-size:.7rem;color:rgba(255,255,255,0.3);}
@media(max-width:1024px){.testi-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:640px){.testi-grid{grid-template-columns:1fr;}}

/* ================================================
   SCROLL TO TOP
   ================================================ */
.scroll-top{position:fixed;bottom:28px;right:28px;width:46px;height:46px;border-radius:50%;background:linear-gradient(135deg,#00d4ff,#7b2ff7);border:none;color:#fff;font-size:1.1rem;cursor:pointer;z-index:250;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transform:translateY(12px);transition:all .35s;box-shadow:0 6px 24px rgba(0,212,255,0.25);}
.scroll-top.visible{opacity:1;visibility:visible;transform:translateY(0);}
.scroll-top:hover{transform:translateY(-3px);box-shadow:0 10px 32px rgba(0,212,255,0.4);}
.scroll-top svg{width:20px;height:20px;fill:none;stroke:#fff;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;}

/* ================================================
   HAMBURGER MENU
   ================================================ */
.hamburger{display:none;background:none;border:none;cursor:pointer;padding:6px;z-index:210;position:relative;}
.hamburger span{display:block;width:22px;height:2px;background:#fff;border-radius:2px;transition:all .3s;margin:5px 0;}
.hamburger.open span:nth-child(1){transform:rotate(45deg) translate(5px,5px);}
.hamburger.open span:nth-child(2){opacity:0;}
.hamburger.open span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px);}
.mobile-menu{position:fixed;top:0;right:-100%;width:min(320px,85vw);height:100vh;background:rgba(6,8,15,0.97);backdrop-filter:blur(30px);z-index:205;padding:90px 28px 40px;display:flex;flex-direction:column;gap:8px;transition:right .4s cubic-bezier(.4,0,.2,1);overflow-y:auto;border-left:1px solid rgba(255,255,255,0.04);}
.mobile-menu.open{right:0;}
.mobile-menu-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.5);z-index:204;opacity:0;visibility:hidden;transition:all .35s;}
.mobile-menu-overlay.open{opacity:1;visibility:visible;}
.mm-item{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:14px;color:rgba(255,255,255,0.7);font-size:.92rem;font-weight:500;text-decoration:none;transition:.3s;cursor:pointer;}
.mm-item:hover,.mm-item:active{background:rgba(0,212,255,0.06);color:#fff;}
.mm-icon{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0;}
.mm-divider{height:1px;background:rgba(255,255,255,0.04);margin:8px 0;}
.mm-btns{display:flex;gap:10px;margin-top:auto;padding-top:20px;}
.mm-btns .btn-g,.mm-btns .btn-p{flex:1;text-align:center;font-size:.85rem;padding:12px 0;}

@media(max-width:768px){
  .hamburger{display:block;}
  .nav-r{display:none;}
}

/* ================================================
   APP MOCKUP SECTION
   ================================================ */
.app-sec{position:relative;z-index:1;padding:110px 24px;overflow:hidden;}
.app-inner{display:flex;align-items:center;gap:60px;max-width:1100px;margin:0 auto;}
.app-visual{flex:0 0 320px;position:relative;display:flex;justify-content:center;}
.app-phone{width:260px;height:520px;background:linear-gradient(180deg,#0d1b2a,#1b2838);border-radius:36px;border:2px solid rgba(255,255,255,0.08);position:relative;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,0.5),0 0 0 1px rgba(255,255,255,0.03) inset;}
.app-phone-notch{position:absolute;top:0;left:50%;transform:translateX(-50%);width:100px;height:26px;background:#0d1b2a;border-radius:0 0 18px 18px;z-index:5;border:1px solid rgba(255,255,255,0.04);border-top:none;}
.app-phone-screen{position:absolute;inset:8px;border-radius:28px;overflow:hidden;background:linear-gradient(180deg,#0a1628 0%,#06080f 100%);}
.app-phone-screen img{width:100%;height:100%;object-fit:cover;}
.app-phone-glow{position:absolute;inset:-30px;border-radius:50%;background:radial-gradient(circle,rgba(0,212,255,0.12),transparent 70%);pointer-events:none;animation:appGlow 4s ease-in-out infinite;}
@keyframes appGlow{0%,100%{opacity:.6;transform:scale(1);}50%{opacity:1;transform:scale(1.05);}}
.app-txt{flex:1;}
.app-txt .label{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:3px;color:#00d4ff;margin-bottom:10px;}
.app-txt h2{font-size:clamp(1.8rem,3.5vw,2.4rem);font-weight:800;margin-bottom:14px;line-height:1.15;}
.app-txt p{font-size:.92rem;color:rgba(255,255,255,0.45);line-height:1.7;margin-bottom:28px;}
.app-badges{display:flex;gap:14px;flex-wrap:wrap;}
.app-badge{display:flex;align-items:center;gap:10px;padding:14px 24px;border-radius:14px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);cursor:pointer;transition:.3s;text-decoration:none;color:#fff;}
.app-badge:hover{border-color:rgba(0,212,255,0.2);background:rgba(0,212,255,0.04);transform:translateY(-2px);}
.app-badge-icon{font-size:1.6rem;}
.app-badge-text{display:flex;flex-direction:column;}
.app-badge-small{font-size:.6rem;color:rgba(255,255,255,0.4);text-transform:uppercase;letter-spacing:.5px;}
.app-badge-big{font-size:.95rem;font-weight:700;}
@media(max-width:768px){
  .app-inner{flex-direction:column;text-align:center;}
  .app-visual{flex:none;}
  .app-txt{text-align:center;}
  .app-badges{justify-content:center;}
}

/* ================================================
   SUPPORT CENTER
   ================================================ */
.support-sec{position:relative;z-index:1;padding:30px 24px 110px;overflow:hidden;}
.support-card{max-width:1000px;margin:0 auto;border-radius:28px;background:linear-gradient(135deg,rgba(0,212,255,0.04),rgba(123,47,247,0.04));border:1px solid rgba(255,255,255,0.06);position:relative;overflow:hidden;display:flex;align-items:stretch;min-height:380px;}
.support-card::before{content:'';position:absolute;top:-80px;right:-80px;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(0,212,255,0.08),transparent 70%);pointer-events:none;}
.support-card::after{content:'';position:absolute;bottom:-60px;left:-60px;width:250px;height:250px;border-radius:50%;background:radial-gradient(circle,rgba(123,47,247,0.06),transparent 70%);pointer-events:none;}
.support-left{flex:1;padding:50px 48px;display:flex;flex-direction:column;justify-content:center;position:relative;z-index:2;}
.support-left .label{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:3px;color:#00d4ff;margin-bottom:12px;}
.support-left h2{font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:800;line-height:1.15;margin-bottom:16px;}
.support-left h2 span{background:linear-gradient(135deg,#00d4ff,#7b2ff7);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.support-left>p{font-size:.92rem;color:rgba(255,255,255,0.45);line-height:1.7;margin-bottom:30px;max-width:420px;}
.support-features{display:flex;flex-direction:column;gap:14px;margin-bottom:32px;}
.support-feat{display:flex;align-items:center;gap:12px;font-size:.85rem;color:rgba(255,255,255,0.6);}
.support-feat-icon{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:.95rem;}
.support-btn{display:inline-flex;align-items:center;gap:10px;padding:14px 34px;border-radius:60px;background:linear-gradient(135deg,#00d4ff,#7b2ff7);color:#fff;font-weight:700;font-size:.92rem;border:none;cursor:pointer;font-family:inherit;transition:all .35s;box-shadow:0 8px 30px rgba(0,212,255,0.25);text-decoration:none;}
.support-btn:hover{transform:translateY(-3px);box-shadow:0 14px 40px rgba(0,212,255,0.35);}
.support-btn svg{width:18px;height:18px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.support-right{flex:0 0 360px;position:relative;display:flex;align-items:center;justify-content:center;z-index:2;}
.support-visual{position:relative;width:260px;height:260px;}
.support-ring{position:absolute;inset:0;border-radius:50%;border:1.5px solid rgba(0,212,255,0.1);animation:supRing 12s linear infinite;}
.support-ring:nth-child(2){inset:20px;border-color:rgba(123,47,247,0.1);animation-duration:18s;animation-direction:reverse;}
.support-ring:nth-child(3){inset:40px;border-color:rgba(255,111,216,0.08);animation-duration:24s;}
@keyframes supRing{0%{transform:rotate(0deg);}100%{transform:rotate(360deg);}}
.support-ring-dot{position:absolute;width:8px;height:8px;border-radius:50%;top:-4px;left:50%;transform:translateX(-50%);}
.support-ring:nth-child(1) .support-ring-dot{background:#00d4ff;box-shadow:0 0 12px rgba(0,212,255,0.5);}
.support-ring:nth-child(2) .support-ring-dot{background:#7b2ff7;box-shadow:0 0 12px rgba(123,47,247,0.5);}
.support-ring:nth-child(3) .support-ring-dot{background:#ff6fd8;box-shadow:0 0 12px rgba(255,111,216,0.5);}
.support-center-icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:80px;height:80px;border-radius:50%;background:linear-gradient(135deg,rgba(0,212,255,0.12),rgba(123,47,247,0.12));border:1px solid rgba(0,212,255,0.15);display:flex;align-items:center;justify-content:center;backdrop-filter:blur(8px);box-shadow:0 0 40px rgba(0,212,255,0.1);}
.support-center-icon svg{width:36px;height:36px;fill:none;stroke:#00d4ff;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;}
.support-float-icons{position:absolute;inset:0;}
.support-float-icon{position:absolute;width:40px;height:40px;border-radius:12px;background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.06);display:flex;align-items:center;justify-content:center;font-size:.9rem;backdrop-filter:blur(4px);animation:supFloat 5s ease-in-out infinite;}
.support-float-icon:nth-child(1){top:8%;left:5%;animation-delay:0s;}
.support-float-icon:nth-child(2){top:5%;right:10%;animation-delay:1s;}
.support-float-icon:nth-child(3){bottom:12%;left:0;animation-delay:2s;}
.support-float-icon:nth-child(4){bottom:5%;right:5%;animation-delay:0.5s;}
@keyframes supFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-8px);}}
@media(max-width:768px){
  .support-card{flex-direction:column;text-align:center;}
  .support-left{padding:36px 24px 20px;align-items:center;}
  .support-left>p{max-width:none;}
  .support-features{align-items:center;}
  .support-right{flex:none;padding:20px 24px 40px;}
  .support-visual{width:200px;height:200px;}
}

/* ================================================
   COOKIE BANNER
   ================================================ */
.cookie-banner{position:fixed;bottom:0;left:0;right:0;z-index:280;padding:18px 28px;background:rgba(6,8,15,0.95);backdrop-filter:blur(24px);border-top:1px solid rgba(255,255,255,0.06);display:flex;align-items:center;justify-content:space-between;gap:20px;transform:translateY(100%);transition:transform .5s cubic-bezier(.4,0,.2,1);flex-wrap:wrap;}
.cookie-banner.show{transform:translateY(0);}
.cookie-text{font-size:.82rem;color:rgba(255,255,255,0.55);line-height:1.6;flex:1;min-width:240px;}
.cookie-text a{color:#00d4ff;text-decoration:underline;text-underline-offset:2px;}
.cookie-btns{display:flex;gap:10px;flex-shrink:0;}
.cookie-btn{padding:10px 22px;border-radius:50px;font-size:.8rem;font-weight:600;cursor:pointer;transition:.3s;font-family:inherit;border:none;}
.cookie-accept{background:linear-gradient(135deg,#00d4ff,#7b2ff7);color:#fff;box-shadow:0 4px 16px rgba(0,212,255,0.2);}
.cookie-accept:hover{transform:translateY(-1px);box-shadow:0 6px 22px rgba(0,212,255,0.3);}
.cookie-decline{background:rgba(255,255,255,0.05);color:rgba(255,255,255,0.5);border:1px solid rgba(255,255,255,0.08);}
.cookie-decline:hover{color:#fff;border-color:rgba(255,255,255,0.15);}

/* ================================================
   COMMUNITY FEED
   ================================================ */
.feed-sec{position:relative;z-index:1;padding:100px 0 80px;background:transparent;}
.feed-wrap{max-width:1160px;margin:0 auto;padding:0 24px;}
.feed-header{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:40px;flex-wrap:wrap;gap:16px;}
.feed-label{font-size:.68rem;font-weight:700;letter-spacing:4px;text-transform:uppercase;color:#00d4ff;margin-bottom:10px;}
.feed-title{font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:900;line-height:1.1;margin-bottom:8px;}
.feed-title span{background:linear-gradient(135deg,#00d4ff,#7b2ff7,#ff6fd8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.feed-sub{color:rgba(255,255,255,0.4);font-size:.9rem;line-height:1.6;}
.feed-new-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 26px;border-radius:50px;border:none;background:linear-gradient(135deg,#00d4ff,#7b2ff7);color:#fff;font-size:.88rem;font-weight:700;cursor:pointer;font-family:inherit;box-shadow:0 6px 24px rgba(0,212,255,0.25);transition:.3s;flex-shrink:0;}
.feed-new-btn:hover{transform:translateY(-2px);box-shadow:0 10px 34px rgba(0,212,255,0.38);}
.feed-new-btn svg{width:16px;height:16px;}

/* Layout */
.feed-layout{display:grid;grid-template-columns:1fr 340px;gap:28px;align-items:start;}
@media(max-width:1024px){.feed-layout{grid-template-columns:1fr;} .feed-sidebar{display:none;}}

/* Compose box */
.compose-box{background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.07);border-radius:20px;padding:20px;margin-bottom:20px;transition:.3s;}
.compose-box:focus-within{border-color:rgba(0,212,255,0.2);background:rgba(0,212,255,0.02);}
.compose-top{display:flex;gap:14px;align-items:flex-start;margin-bottom:14px;}
.compose-avatar{width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.1rem;flex-shrink:0;}
.compose-field{flex:1;min-height:52px;outline:none;color:#fff;font-size:.95rem;line-height:1.6;padding:8px 0;font-family:inherit;word-break:break-word;}
.compose-field:empty::before{content:attr(data-placeholder);color:rgba(255,255,255,0.25);pointer-events:none;}
.compose-actions{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;}
.compose-tools{display:flex;gap:4px;flex-wrap:wrap;}
.compose-tool{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:50px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.06);color:rgba(255,255,255,0.55);font-size:.78rem;font-weight:500;cursor:pointer;transition:.3s;font-family:inherit;}
.compose-tool:hover{background:rgba(0,212,255,0.08);border-color:rgba(0,212,255,0.2);color:#00d4ff;}
.compose-tool svg{width:14px;height:14px;}
.compose-submit{padding:9px 26px;border-radius:50px;border:none;background:linear-gradient(135deg,#00d4ff,#7b2ff7);color:#fff;font-size:.85rem;font-weight:700;cursor:pointer;font-family:inherit;transition:.3s;}
.compose-submit:hover{transform:translateY(-1px);box-shadow:0 6px 20px rgba(0,212,255,0.3);}
.compose-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px;}
.compose-media-preview{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:10px;}
.compose-preview-thumb{width:80px;height:60px;border-radius:10px;object-fit:cover;border:1px solid rgba(255,255,255,0.08);}

/* Filtri */
.feed-filters{display:flex;gap:8px;margin-bottom:20px;flex-wrap:wrap;}
.ff{padding:8px 18px;border-radius:50px;border:1px solid rgba(255,255,255,0.07);background:rgba(255,255,255,0.03);color:rgba(255,255,255,0.45);font-size:.78rem;font-weight:600;cursor:pointer;transition:.3s;font-family:inherit;}
.ff:hover{border-color:rgba(0,212,255,0.25);color:#fff;}
.ff.active{background:rgba(0,212,255,0.1);border-color:rgba(0,212,255,0.3);color:#00d4ff;}

/* Post card */
.feed-post{background:rgba(255,255,255,0.025);border:1px solid rgba(255,255,255,0.06);border-radius:22px;padding:22px;margin-bottom:18px;transition:border-color .3s;}
.feed-post:hover{border-color:rgba(255,255,255,0.1);}
.post-header{display:flex;align-items:center;gap:12px;margin-bottom:14px;position:relative;}
.post-avatar{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.15rem;flex-shrink:0;border:2px solid rgba(255,255,255,0.06);}
.post-meta{flex:1;}
.post-name{font-size:.92rem;font-weight:700;display:flex;align-items:center;gap:8px;}
.post-badge{font-size:.58rem;padding:2px 8px;border-radius:20px;font-weight:700;letter-spacing:.5px;}
.post-badge.pro{background:rgba(0,212,255,0.15);color:#00d4ff;border:1px solid rgba(0,212,255,0.2);}
.post-badge.verified{background:rgba(123,47,247,0.15);color:#c97bff;border:1px solid rgba(123,47,247,0.2);}
.post-time{font-size:.72rem;color:rgba(255,255,255,0.35);margin-top:2px;}
.post-vis{color:rgba(255,255,255,0.25);}
.post-menu-btn{width:32px;height:32px;border-radius:50%;background:none;border:none;color:rgba(255,255,255,0.3);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.2s;margin-left:auto;}
.post-menu-btn:hover{background:rgba(255,255,255,0.06);color:#fff;}
.post-menu-btn svg{width:16px;height:16px;}
.post-menu{position:absolute;top:40px;right:0;background:rgba(10,14,26,0.97);backdrop-filter:blur(30px);border:1px solid rgba(255,255,255,0.08);border-radius:14px;padding:8px;min-width:200px;opacity:0;visibility:hidden;transform:translateY(6px);transition:all .25s;z-index:50;box-shadow:0 20px 60px rgba(0,0,0,0.5);}
.post-menu.open{opacity:1;visibility:visible;transform:translateY(0);}
.post-menu-item{padding:10px 14px;border-radius:10px;font-size:.82rem;color:rgba(255,255,255,0.7);cursor:pointer;transition:.2s;}
.post-menu-item:hover{background:rgba(255,255,255,0.05);color:#fff;}
.post-menu-item.danger{color:rgba(255,100,100,0.7);}
.post-menu-item.danger:hover{background:rgba(255,80,80,0.08);color:#ff6b7a;}
.post-menu-sep{height:1px;background:rgba(255,255,255,0.05);margin:6px 0;}

/* Testo post */
.post-body{margin-bottom:16px;}
.post-text{font-size:.92rem;line-height:1.7;color:rgba(255,255,255,0.85);}
.post-tags-inline{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px;}
.pt{font-size:.8rem;color:#00d4ff;font-weight:600;cursor:pointer;}
.pt:hover{text-decoration:underline;}

/* Mood chip */
.post-mood-tag{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px;}
.mood-chip{padding:5px 14px;border-radius:50px;font-size:.76rem;font-weight:600;background:color-mix(in srgb, var(--mc) 12%, transparent);border:1px solid color-mix(in srgb, var(--mc) 25%, transparent);color:var(--mc);}

/* Media grid */
.post-media{margin-bottom:14px;border-radius:16px;overflow:hidden;}
.post-media-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:4px;}
.post-img-wrap{aspect-ratio:4/3;overflow:hidden;}
.post-img-placeholder{width:100%;height:100%;}
.post-img-wrap img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s;}
.post-img-wrap:hover img{transform:scale(1.04);}

/* Video */
.post-video-wrap{margin-bottom:14px;}
.post-video-thumb{position:relative;overflow:hidden;aspect-ratio:16/9;border-radius:16px;cursor:pointer;}
.video-play-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,0.3);transition:.3s;}
.post-video-thumb:hover .video-play-overlay{background:rgba(0,0,0,0.15);}
.video-play-btn{width:64px;height:64px;border-radius:50%;background:rgba(255,255,255,0.15);backdrop-filter:blur(10px);border:2px solid rgba(255,255,255,0.3);display:flex;align-items:center;justify-content:center;transition:.3s;}
.post-video-thumb:hover .video-play-btn{transform:scale(1.1);background:rgba(0,212,255,0.2);border-color:rgba(0,212,255,0.5);}
.video-play-btn svg{width:24px;height:24px;margin-left:4px;}
.video-duration-badge{position:absolute;bottom:12px;right:14px;font-size:.72rem;font-weight:700;background:rgba(0,0,0,0.65);padding:3px 10px;border-radius:20px;color:#fff;}

/* Traccia tag */
.post-track-tag{display:flex;align-items:center;gap:12px;padding:12px 16px;background:rgba(0,212,255,0.04);border:1px solid rgba(0,212,255,0.1);border-radius:14px;margin-bottom:14px;}
.ptt-icon{font-size:1.2rem;}
.ptt-info{flex:1;}
.ptt-title{font-size:.85rem;font-weight:700;color:#fff;}
.ptt-artist{font-size:.72rem;color:rgba(255,255,255,0.4);}
.ptt-wave{display:flex;align-items:flex-end;gap:3px;height:20px;}
.ptt-wave span{width:3px;border-radius:2px;background:linear-gradient(180deg,#00d4ff,#7b2ff7);animation:wavebar 1.2s ease-in-out infinite;}
.ptt-wave span:nth-child(1){height:8px;animation-delay:0s;}
.ptt-wave span:nth-child(2){height:16px;animation-delay:.1s;}
.ptt-wave span:nth-child(3){height:12px;animation-delay:.2s;}
.ptt-wave span:nth-child(4){height:18px;animation-delay:.3s;}
.ptt-wave span:nth-child(5){height:10px;animation-delay:.4s;}
@keyframes wavebar{0%,100%{transform:scaleY(1);}50%{transform:scaleY(.4);}}
@keyframes feedPostIn{from{opacity:0;transform:translateY(-14px);}to{opacity:1;transform:translateY(0);}}

/* Release card */
.post-release-card{display:flex;gap:16px;background:rgba(255,255,255,0.03);border:1px solid rgba(255,111,216,0.1);border-radius:18px;padding:18px;margin-bottom:14px;}
.prc-cover{width:90px;height:90px;flex-shrink:0;border-radius:12px;overflow:hidden;}
.prc-info{flex:1;}
.prc-label{font-size:.6rem;font-weight:800;text-transform:uppercase;letter-spacing:3px;color:#ff6fd8;margin-bottom:6px;}
.prc-title{font-size:1rem;font-weight:800;margin-bottom:3px;}
.prc-artist{font-size:.8rem;color:rgba(255,255,255,0.5);}
.prc-tracks{font-size:.72rem;color:rgba(255,255,255,0.3);margin-bottom:12px;}
.prc-btn{padding:7px 20px;border-radius:50px;border:none;background:linear-gradient(135deg,#7b2ff7,#ff6fd8);color:#fff;font-size:.78rem;font-weight:700;cursor:pointer;font-family:inherit;transition:.3s;}
.prc-btn:hover{transform:translateY(-1px);box-shadow:0 6px 20px rgba(123,47,247,0.35);}

/* Reactions + azioni */
.post-footer{border-top:1px solid rgba(255,255,255,0.05);padding-top:14px;}
.post-reactions-bar{display:flex;gap:8px;margin-bottom:12px;flex-wrap:wrap;}
.reaction-pill{display:inline-flex;align-items:center;gap:5px;padding:4px 12px;border-radius:50px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.07);font-size:.78rem;cursor:pointer;transition:.25s;color:rgba(255,255,255,0.7);}
.reaction-pill:hover{background:rgba(255,255,255,0.08);border-color:rgba(255,255,255,0.15);}
.post-actions{display:flex;gap:4px;flex-wrap:wrap;}
.pa-btn{display:inline-flex;align-items:center;gap:7px;padding:8px 16px;border-radius:10px;background:none;border:none;color:rgba(255,255,255,0.45);font-size:.82rem;font-weight:600;cursor:pointer;transition:.25s;font-family:inherit;}
.pa-btn:hover{background:rgba(255,255,255,0.05);color:#fff;}
.pa-btn svg{width:17px;height:17px;}
.pa-btn.liked{color:#ff6fd8;}
.pa-btn.liked svg{fill:#ff6fd8;stroke:#ff6fd8;}

/* Commenti */
.post-comments{border-top:1px solid rgba(255,255,255,0.05);margin-top:14px;padding-top:14px;}
.comment{display:flex;gap:10px;margin-bottom:14px;}
.comment-av{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.85rem;flex-shrink:0;}
.comment-body{flex:1;background:rgba(255,255,255,0.04);border-radius:14px;padding:10px 14px;}
.comment-name{font-size:.8rem;font-weight:700;margin-bottom:4px;}
.comment-time{font-size:.7rem;color:rgba(255,255,255,0.3);font-weight:400;}
.comment-text{font-size:.84rem;color:rgba(255,255,255,0.75);line-height:1.5;}
.comment-input-row{display:flex;gap:10px;align-items:center;}
.comment-input-wrap{flex:1;display:flex;align-items:center;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.07);border-radius:50px;padding:8px 14px;transition:.3s;}
.comment-input-wrap:focus-within{border-color:rgba(0,212,255,0.25);}
.comment-input{flex:1;background:none;border:none;outline:none;color:#fff;font-size:.85rem;font-family:inherit;}
.comment-input::placeholder{color:rgba(255,255,255,0.25);}
.comment-send{background:none;border:none;color:rgba(0,212,255,0.6);font-size:1rem;cursor:pointer;padding:0 4px;transition:.2s;}
.comment-send:hover{color:#00d4ff;}

/* Load more */
.feed-load-more{text-align:center;padding:16px 0 8px;}
.feed-load-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 30px;border-radius:50px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);color:rgba(255,255,255,0.55);font-size:.85rem;font-weight:600;cursor:pointer;font-family:inherit;transition:.3s;}
.feed-load-btn:hover{border-color:rgba(0,212,255,0.25);color:#00d4ff;background:rgba(0,212,255,0.05);}
.feed-load-btn svg{width:15px;height:15px;}

/* Sidebar */
.feed-sidebar{position:sticky;top:90px;display:flex;flex-direction:column;gap:18px;}
.sidebar-card{background:rgba(255,255,255,0.025);border:1px solid rgba(255,255,255,0.06);border-radius:20px;padding:20px;}
.sc-title{font-size:.82rem;font-weight:700;margin-bottom:16px;color:rgba(255,255,255,0.8);}
.trending-list{display:flex;flex-direction:column;gap:12px;}
.trend-item{display:flex;align-items:center;gap:12px;}
.trend-rank{width:24px;height:24px;border-radius:50%;background:rgba(0,212,255,0.1);border:1px solid rgba(0,212,255,0.15);display:flex;align-items:center;justify-content:center;font-size:.68rem;font-weight:800;color:#00d4ff;flex-shrink:0;}
.trend-tag{font-size:.84rem;font-weight:700;color:#fff;cursor:pointer;}
.trend-tag:hover{color:#00d4ff;}
.trend-count{font-size:.7rem;color:rgba(255,255,255,0.3);margin-top:1px;}
.sugg-list{display:flex;flex-direction:column;gap:14px;}
.sugg-item{display:flex;align-items:center;gap:10px;}
.sugg-av{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.95rem;flex-shrink:0;}
.sugg-info{flex:1;}
.sugg-name{font-size:.84rem;font-weight:700;}
.sugg-desc{font-size:.7rem;color:rgba(255,255,255,0.35);}
.sugg-follow{padding:5px 14px;border-radius:50px;background:rgba(0,212,255,0.08);border:1px solid rgba(0,212,255,0.2);color:#00d4ff;font-size:.72rem;font-weight:700;cursor:pointer;font-family:inherit;transition:.3s;white-space:nowrap;}
.sugg-follow:hover{background:rgba(0,212,255,0.18);}
.sidebar-promo{background:linear-gradient(135deg,rgba(123,47,247,0.12),rgba(255,111,216,0.06));border-color:rgba(123,47,247,0.15);}
.sc-promo-badge{font-size:.6rem;font-weight:800;letter-spacing:3px;text-transform:uppercase;color:#ff6fd8;margin-bottom:10px;}
.sc-promo-title{font-size:1.05rem;font-weight:800;margin-bottom:8px;}
.sc-promo-text{font-size:.78rem;color:rgba(255,255,255,0.45);line-height:1.55;margin-bottom:16px;}
.sc-promo-btn{width:100%;padding:11px;border-radius:50px;border:none;background:linear-gradient(135deg,#7b2ff7,#ff6fd8);color:#fff;font-size:.84rem;font-weight:700;cursor:pointer;font-family:inherit;transition:.3s;}
.sc-promo-btn:hover{transform:translateY(-1px);box-shadow:0 8px 24px rgba(123,47,247,0.35);}

/* ================================================
   BLOG / NEWS
   ================================================ */
.blog-sec{position:relative;z-index:1;padding:110px 24px;text-align:center;}
.blog-sec h2{font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:800;margin-bottom:14px;}
.blog-sub{color:rgba(255,255,255,0.42);max-width:520px;margin:0 auto 44px;font-size:.92rem;line-height:1.7;}
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;max-width:1100px;margin:0 auto;}
.blog-card{border-radius:22px;overflow:hidden;background:rgba(255,255,255,0.025);border:1px solid rgba(255,255,255,0.06);text-align:left;transition:all .35s;cursor:pointer;}
.blog-card:hover{transform:translateY(-6px);border-color:rgba(0,212,255,0.2);}
.blog-card-img{width:100%;height:180px;overflow:hidden;}
.blog-card-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s;}
.blog-card:hover .blog-card-img img{transform:scale(1.06);}
.blog-card-body{padding:22px 20px;}
.blog-tag{display:inline-block;padding:4px 12px;border-radius:50px;font-size:.62rem;font-weight:700;letter-spacing:1px;text-transform:uppercase;margin-bottom:12px;}
.blog-card-body h3{font-size:1.05rem;font-weight:700;margin-bottom:8px;line-height:1.35;}
.blog-card-body p{font-size:.8rem;color:rgba(255,255,255,0.4);line-height:1.6;margin-bottom:14px;}
.blog-meta{display:flex;align-items:center;gap:8px;font-size:.7rem;color:rgba(255,255,255,0.25);}
.blog-meta-dot{width:3px;height:3px;border-radius:50%;background:rgba(255,255,255,0.2);}
@media(max-width:1024px){.blog-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:640px){.blog-grid{grid-template-columns:1fr;}}

/* ================================================
   PARTNER MARQUEE
   ================================================ */
.partner-sec{position:relative;z-index:1;padding:60px 0;overflow:hidden;}
.partner-title{text-align:center;font-size:.72rem;font-weight:600;letter-spacing:4px;text-transform:uppercase;color:rgba(255,255,255,0.2);margin-bottom:32px;}
.partner-track-wrap{overflow:hidden;position:relative;}
.partner-track-wrap::before,.partner-track-wrap::after{content:'';position:absolute;top:0;bottom:0;width:120px;z-index:5;pointer-events:none;}
.partner-track-wrap::before{left:0;background:linear-gradient(90deg,#06080f,transparent);}
.partner-track-wrap::after{right:0;background:linear-gradient(-90deg,#06080f,transparent);}
.partner-track{display:flex;gap:60px;width:max-content;animation:partnerScroll 30s linear infinite;align-items:center;}
.partner-track:hover{animation-play-state:paused;}
@keyframes partnerScroll{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}
.partner-logo{display:flex;align-items:center;gap:10px;font-size:1rem;font-weight:700;color:rgba(255,255,255,0.18);white-space:nowrap;transition:color .3s;flex-shrink:0;letter-spacing:.5px;}
.partner-logo:hover{color:rgba(255,255,255,0.45);}
.partner-logo svg{width:28px;height:28px;opacity:.4;flex-shrink:0;}

/* ================================================
   LANGUAGE DROPDOWN
   ================================================ */
.lang-wrap{position:relative;}
.lang-btn{display:flex;align-items:center;gap:6px;padding:7px 14px;border-radius:50px;border:1px solid rgba(255,255,255,0.08);background:rgba(255,255,255,0.03);color:rgba(255,255,255,0.7);font-size:.82rem;font-weight:600;cursor:pointer;transition:all .3s;font-family:inherit;}
.lang-btn:hover{border-color:rgba(0,212,255,0.25);background:rgba(0,212,255,0.05);color:#fff;}
.lang-btn .lang-flag{width:24px;height:18px;border-radius:3px;object-fit:cover;flex-shrink:0;}
.lang-code{letter-spacing:.5px;}
.lang-arrow{transition:transform .3s;opacity:.5;}
.lang-wrap.open .lang-arrow{transform:rotate(180deg);opacity:1;}
.lang-dropdown{position:absolute;top:calc(100% + 10px);right:0;min-width:200px;background:rgba(10,14,26,0.97);backdrop-filter:blur(30px);border:1px solid rgba(255,255,255,0.06);border-radius:16px;padding:8px;opacity:0;visibility:hidden;transform:translateY(6px);transition:all .3s cubic-bezier(.4,0,.2,1);z-index:300;box-shadow:0 20px 60px rgba(0,0,0,0.5);}
.lang-dropdown::before{content:'';position:absolute;top:-6px;right:20px;width:12px;height:12px;background:rgba(10,14,26,0.97);border-left:1px solid rgba(255,255,255,0.06);border-top:1px solid rgba(255,255,255,0.06);transform:rotate(45deg);border-radius:2px 0 0 0;}
.lang-wrap.open .lang-dropdown{opacity:1;visibility:visible;transform:translateY(0);}
.lang-option{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:10px;font-size:.84rem;color:rgba(255,255,255,0.6);cursor:pointer;transition:all .25s;font-weight:500;}
.lang-option:hover{background:rgba(0,212,255,0.06);color:#fff;}
.lang-option.active{color:#00d4ff;}
.lang-option .lang-flag{width:24px;height:18px;border-radius:3px;object-fit:cover;flex-shrink:0;}
.lang-check{margin-left:auto;opacity:0;transition:opacity .2s;}
.lang-option.active .lang-check{opacity:1;}
html.day-mode body.page-home .lang-dropdown{background:rgba(255,255,255,0.97) !important;border-color:rgba(0,0,0,0.08) !important;}
html.day-mode body.page-home .lang-dropdown::before{background:rgba(255,255,255,0.97);border-color:rgba(0,0,0,0.08);}
html.day-mode body.page-home .lang-option{color:rgba(0,0,0,0.55);}
html.day-mode body.page-home .lang-option:hover{background:rgba(0,212,255,0.06);color:#111;}
html.day-mode body.page-home .lang-option.active{color:#0077b6;}
html.day-mode body.page-home .lang-btn{color:rgba(0,0,0,0.6);border-color:rgba(0,0,0,0.08);background:rgba(0,0,0,0.03);}

/* ================================================
   DARK/LIGHT MODE
   ================================================ */
.theme-toggle{width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,0.08);background:rgba(255,255,255,0.03);color:rgba(255,255,255,0.5);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .35s;font-size:1rem;flex-shrink:0;}
.theme-toggle:hover{border-color:rgba(0,212,255,0.25);color:#fff;background:rgba(0,212,255,0.06);}
html.day-mode body.page-home{background:#f0f2f5 !important;color:#111 !important;}
html.day-mode body.page-home nav{background:rgba(240,242,245,0.92) !important;border-color:rgba(0,0,0,0.06) !important;}
html.day-mode body.page-home .logo{-webkit-text-fill-color:initial;color:#111;}
html.day-mode body.page-home .nav-tab,html.day-mode body.page-home .btn-g{color:#333 !important;}
html.day-mode body.page-home .slide-overlay{background:linear-gradient(90deg,rgba(240,242,245,0.92) 0%,rgba(240,242,245,0.6) 45%,rgba(240,242,245,0.1) 100%) !important;}
html.day-mode body.page-home .slide-panel{background:rgba(255,255,255,0.7) !important;border-color:rgba(0,0,0,0.08) !important;}
html.day-mode body.page-home .slide-desc{color:rgba(0,0,0,0.5) !important;}


/* ===== APP SCREENS GALLERY ===== */
.appgallery-sec{position:relative;z-index:1;padding:110px 0 80px;overflow:hidden;background:linear-gradient(180deg,rgba(3,10,24,0) 0%,rgba(6,4,18,0.5) 40%,rgba(3,10,24,0) 100%);}
.appgallery-inner{max-width:1400px;margin:0 auto;}
.appgallery-header{text-align:center;padding:0 48px;margin-bottom:64px;}
.appgallery-title{font-size:clamp(2rem,4vw,3.2rem);font-weight:900;margin-bottom:14px;line-height:1.15;background:linear-gradient(135deg,#fff 20%,#00d4ff 55%,#7b2ff7 85%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.appgallery-sub{color:rgba(255,255,255,0.42);font-size:.96rem;max-width:560px;margin:0 auto 36px;line-height:1.75;}
.appgallery-tabs{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;max-width:700px;margin:0 auto;}
.agallery-tab{padding:8px 22px;border-radius:30px;border:1px solid rgba(255,255,255,0.08);background:rgba(255,255,255,0.03);color:rgba(255,255,255,0.45);font-size:.78rem;font-weight:600;cursor:pointer;font-family:inherit;transition:all .25s;}
.agallery-tab:hover{color:#fff;border-color:rgba(255,255,255,0.18);}
.agallery-tab.active{background:rgba(0,212,255,0.1);border-color:rgba(0,212,255,0.3);color:#00d4ff;}

/* Scroll track */
.appgallery-scroll-wrap{overflow:hidden;position:relative;padding:30px 0 40px;}
.appgallery-scroll-wrap::before,.appgallery-scroll-wrap::after{content:'';position:absolute;top:0;bottom:0;width:80px;z-index:20;pointer-events:none;}
.appgallery-scroll-wrap::before{left:0;background:linear-gradient(90deg,rgba(3,6,14,0.9),transparent);}
.appgallery-scroll-wrap::after{right:0;background:linear-gradient(-90deg,rgba(3,6,14,0.9),transparent);}
.appgallery-track{display:flex;gap:28px;padding:0 60px;transition:transform .5s cubic-bezier(.4,0,.2,1);will-change:transform;}
.appgallery-track.no-transition{transition:none;}

/* Phone cards */
.agallery-item{flex-shrink:0;display:flex;flex-direction:column;align-items:center;gap:20px;cursor:default;transition:opacity .3s;}
.agallery-item.hidden-item{display:none;}
.agallery-phone{position:relative;}
.agallery-phone-shell{
  width:236px;height:476px;
  background:linear-gradient(145deg,#1c2030,#0d1020);
  border-radius:40px;
  border:1px solid rgba(255,255,255,0.09);
  padding:14px;
  position:relative;
  box-shadow:0 40px 80px rgba(0,0,0,0.6),0 0 0 1px rgba(255,255,255,0.03) inset, 0 2px 0 rgba(255,255,255,0.06) inset;
  transition:transform .4s cubic-bezier(.34,1.1,.64,1),box-shadow .4s;
}
.agallery-phone-shell::before{content:'';position:absolute;inset:0;border-radius:40px;background:linear-gradient(145deg,rgba(255,255,255,0.04) 0%,transparent 50%);pointer-events:none;}
.agallery-item:hover .agallery-phone-shell{transform:translateY(-12px) scale(1.02);}
/* Glow variants */
.agallery-phone-shell.glow-purple{box-shadow:0 40px 80px rgba(0,0,0,0.6),0 0 60px rgba(123,47,247,0.18),0 0 0 1px rgba(255,255,255,0.03) inset;}
.agallery-item:hover .agallery-phone-shell.glow-purple{box-shadow:0 50px 90px rgba(0,0,0,0.6),0 0 80px rgba(123,47,247,0.28),0 0 0 1px rgba(255,255,255,0.04) inset;}
.agallery-phone-shell.glow-cyan{box-shadow:0 40px 80px rgba(0,0,0,0.6),0 0 60px rgba(0,212,255,0.12),0 0 0 1px rgba(255,255,255,0.03) inset;}
.agallery-item:hover .agallery-phone-shell.glow-cyan{box-shadow:0 50px 90px rgba(0,0,0,0.6),0 0 80px rgba(0,212,255,0.22),0 0 0 1px rgba(255,255,255,0.04) inset;}
.agallery-phone-shell.glow-pink{box-shadow:0 40px 80px rgba(0,0,0,0.6),0 0 60px rgba(255,111,216,0.12),0 0 0 1px rgba(255,255,255,0.03) inset;}
.agallery-item:hover .agallery-phone-shell.glow-pink{box-shadow:0 50px 90px rgba(0,0,0,0.6),0 0 80px rgba(255,111,216,0.22),0 0 0 1px rgba(255,255,255,0.04) inset;}
.agallery-phone-shell.glow-green{box-shadow:0 40px 80px rgba(0,0,0,0.6),0 0 60px rgba(0,184,148,0.12),0 0 0 1px rgba(255,255,255,0.03) inset;}
.agallery-item:hover .agallery-phone-shell.glow-green{box-shadow:0 50px 90px rgba(0,0,0,0.6),0 0 80px rgba(0,184,148,0.22),0 0 0 1px rgba(255,255,255,0.04) inset;}
/* Featured card - slightly taller/bigger */
.agallery-item.featured .agallery-phone-shell{transform:scale(1.04);box-shadow:0 50px 90px rgba(0,0,0,0.65),0 0 80px rgba(123,47,247,0.2),0 0 0 1px rgba(255,255,255,0.04) inset;}
.agallery-item.featured:hover .agallery-phone-shell{transform:translateY(-12px) scale(1.06);}

.agallery-notch{position:absolute;top:14px;left:50%;transform:translateX(-50%);width:70px;height:20px;background:#0a0d14;border-radius:0 0 14px 14px;z-index:5;border:1px solid rgba(255,255,255,0.04);border-top:none;}
.agallery-screen{border-radius:28px;overflow:hidden;background:#000;width:100%;height:100%;}
.agallery-screen svg{display:block;}

/* Labels */
.agallery-label{text-align:center;display:flex;flex-direction:column;align-items:center;gap:4px;}
.agallery-tag{display:inline-block;padding:3px 12px;border-radius:20px;font-size:.65rem;font-weight:700;letter-spacing:.8px;text-transform:uppercase;background:rgba(0,212,255,0.08);color:rgba(0,212,255,0.8);border:1px solid rgba(0,212,255,0.15);margin-bottom:4px;}
.agallery-label strong{font-size:.92rem;font-weight:800;color:#fff;}
.agallery-label span{font-size:.75rem;color:rgba(255,255,255,0.35);}

/* Nav */
.agallery-nav{display:flex;align-items:center;justify-content:center;gap:20px;padding:0 48px;margin-top:12px;}
.agallery-arrow{width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);color:rgba(255,255,255,0.5);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.3s;flex-shrink:0;}
.agallery-arrow:hover{background:rgba(0,212,255,0.1);border-color:rgba(0,212,255,0.3);color:#fff;}
.agallery-arrow:disabled{opacity:.25;cursor:default;}
.agallery-dots{display:flex;gap:8px;align-items:center;}
.agallery-dot{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,0.18);cursor:pointer;transition:all .3s;}
.agallery-dot.active{width:24px;border-radius:3px;background:linear-gradient(90deg,#00d4ff,#7b2ff7);}
@media(max-width:768px){
  .appgallery-header{padding:0 24px;}
  .appgallery-track{padding:0 24px;gap:18px;}
  .agallery-phone-shell{width:200px;height:402px;}
  .agallery-screen svg{width:186px;height:374px;}
}
/* ===== /APP SCREENS GALLERY ===== */

/* ── Device switch ── */
.agallery-device-switch{display:inline-flex;align-items:center;gap:10px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);border-radius:50px;padding:5px 8px;margin-bottom:32px;}
.ads-btn{display:inline-flex;align-items:center;gap:7px;padding:8px 20px;border-radius:50px;border:none;background:none;color:rgba(255,255,255,0.4);font-size:.8rem;font-weight:600;cursor:pointer;font-family:inherit;transition:all .3s;}
.ads-btn svg{width:15px;height:15px;transition:inherit;}
.ads-btn.active{background:rgba(0,212,255,0.12);color:#00d4ff;border:1px solid rgba(0,212,255,0.2);}
.ads-track{display:none;}

/* ── Desktop gallery — scroll track (mirrors mobile) ── */
.agallery-desktop-view{animation:agdFadeIn .45s ease;}
@keyframes agdFadeIn{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:translateY(0);}}

#agallery-tabs-desktop{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;max-width:700px;margin:0 auto 36px;}
.agallery-tab-d{padding:8px 22px;border-radius:30px;border:1px solid rgba(255,255,255,0.08);background:rgba(255,255,255,0.03);color:rgba(255,255,255,0.45);font-size:.78rem;font-weight:600;cursor:pointer;font-family:inherit;transition:all .25s;}
.agallery-tab-d:hover{color:#fff;border-color:rgba(255,255,255,0.18);}
.agallery-tab-d.active{background:rgba(0,212,255,0.1);border-color:rgba(0,212,255,0.3);color:#00d4ff;}

.agd-scroll-wrap{overflow:hidden;position:relative;padding:30px 0 40px;}
.agd-scroll-wrap::before,.agd-scroll-wrap::after{content:'';position:absolute;top:0;bottom:0;width:80px;z-index:20;pointer-events:none;}
.agd-scroll-wrap::before{left:0;background:linear-gradient(90deg,rgba(3,6,14,0.9),transparent);}
.agd-scroll-wrap::after{right:0;background:linear-gradient(-90deg,rgba(3,6,14,0.9),transparent);}

.agd-track{display:flex;gap:28px;padding:0 60px;transition:transform .5s cubic-bezier(.4,0,.2,1);will-change:transform;}
.agd-track.no-transition{transition:none;}

.agd-item{flex-shrink:0;width:560px;display:flex;flex-direction:column;gap:18px;cursor:default;transition:opacity .3s,transform .35s;}
.agd-item.agd-hidden{display:none;}
.agd-item:hover{transform:translateY(-8px);}

/* Browser chrome frame */
.agd-frame{border-radius:14px;overflow:hidden;border:1px solid rgba(255,255,255,0.08);box-shadow:0 20px 60px rgba(0,0,0,0.5);background:#0a0d14;transition:box-shadow .35s;}
.agd-item:hover .agd-frame{box-shadow:0 30px 80px rgba(0,0,0,0.65),0 0 0 1px rgba(0,212,255,0.1);}
.agd-frame--glow-purple:hover,.agd-item:hover .agd-frame--glow-purple{box-shadow:0 30px 80px rgba(0,0,0,0.6),0 0 50px rgba(123,47,247,0.18),0 0 0 1px rgba(123,47,247,0.12);}
.agd-frame--glow-pink:hover,.agd-item:hover .agd-frame--glow-pink{box-shadow:0 30px 80px rgba(0,0,0,0.6),0 0 50px rgba(255,111,216,0.15),0 0 0 1px rgba(255,111,216,0.1);}
.agd-frame--glow-cyan:hover,.agd-item:hover .agd-frame--glow-cyan{box-shadow:0 30px 80px rgba(0,0,0,0.6),0 0 50px rgba(0,212,255,0.15),0 0 0 1px rgba(0,212,255,0.1);}
.agd-frame--glow-green:hover,.agd-item:hover .agd-frame--glow-green{box-shadow:0 30px 80px rgba(0,0,0,0.6),0 0 50px rgba(56,239,125,0.12),0 0 0 1px rgba(56,239,125,0.08);}

.agd-chrome{display:flex;align-items:center;gap:10px;padding:9px 14px;background:#0f1420;border-bottom:1px solid rgba(255,255,255,0.05);}
.agd-chrome-dots{display:flex;gap:5px;flex-shrink:0;}
.agd-chrome-dots span{width:9px;height:9px;border-radius:50%;}
.agd-chrome-dots span:nth-child(1){background:#ff5f57;}
.agd-chrome-dots span:nth-child(2){background:#febc2e;}
.agd-chrome-dots span:nth-child(3){background:#28c840;}
.agd-chrome-bar{flex:1;}
.agd-url-bar{padding:4px 12px;background:rgba(255,255,255,0.05);border-radius:5px;font-size:.68rem;color:rgba(255,255,255,0.28);font-family:'Inter',monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

.agd-screen{position:relative;aspect-ratio:16/10;overflow:hidden;background:#060912;}
.agd-img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease;}
.agd-item:hover .agd-img{transform:scale(1.03);}

.agd-label{text-align:center;display:flex;flex-direction:column;align-items:center;gap:4px;}
.agd-tag{display:inline-block;padding:3px 12px;border-radius:20px;font-size:.65rem;font-weight:700;letter-spacing:.8px;text-transform:uppercase;background:rgba(0,212,255,0.08);color:rgba(0,212,255,0.8);border:1px solid rgba(0,212,255,0.15);margin-bottom:2px;}
.agd-label strong{font-size:.9rem;font-weight:800;color:#fff;}
.agd-label span{font-size:.74rem;color:rgba(255,255,255,0.35);}

@media(max-width:768px){
  .agd-item{width:320px;}
  .agd-track{padding:0 24px;gap:18px;}
}


/* ===================================================================
   LIVE DJ SET SECTION
   =================================================================== */
.live-sec{position:relative;z-index:1;padding:110px 0 100px;overflow:hidden;}
.live-sec::before{content:'';position:absolute;inset:0;
  background:
    radial-gradient(ellipse 70% 50% at 15% 20%,rgba(123,47,247,0.12) 0%,transparent 60%),
    radial-gradient(ellipse 60% 45% at 85% 75%,rgba(0,212,255,0.09) 0%,transparent 60%),
    radial-gradient(ellipse 50% 40% at 50% 50%,rgba(255,111,216,0.06) 0%,transparent 70%);
  pointer-events:none;}

.live-inner{max-width:1280px;margin:0 auto;padding:0 48px;}
@media(max-width:768px){.live-inner{padding:0 20px;}}

/* Header */
.live-header{text-align:center;margin-bottom:72px;}
.live-header .label{font-size:.7rem;font-weight:700;letter-spacing:4px;text-transform:uppercase;color:#ff4040;margin-bottom:12px;display:flex;align-items:center;justify-content:center;gap:6px;}
.live-title{font-size:clamp(2.2rem,4.5vw,3.6rem);font-weight:900;line-height:1.08;margin-bottom:16px;}
.live-title span{background:linear-gradient(135deg,#ff6fd8,#7b2ff7,#00d4ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.live-sub{color:rgba(255,255,255,0.42);font-size:.96rem;max-width:580px;margin:0 auto;line-height:1.75;}

/* Layout */
.live-layout{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;margin-bottom:72px;}
@media(max-width:1024px){.live-layout{grid-template-columns:1fr;gap:40px;}}

/* Player card */
.live-player-wrap{}
.live-player-card{background:rgba(10,8,25,0.8);border:1px solid rgba(255,255,255,0.07);border-radius:24px;overflow:hidden;box-shadow:0 40px 100px rgba(0,0,0,0.5),0 0 60px rgba(123,47,247,0.12);}

/* Top bar */
.live-top-bar{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;background:rgba(0,0,0,0.3);border-bottom:1px solid rgba(255,255,255,0.05);}
.live-badge-pill{display:flex;align-items:center;gap:7px;padding:5px 14px;background:rgba(255,40,40,0.15);border:1px solid rgba(255,40,40,0.3);border-radius:30px;font-size:.7rem;font-weight:800;letter-spacing:2px;color:#ff4040;}
.live-dot-pulse{width:7px;height:7px;border-radius:50%;background:#ff4040;box-shadow:0 0 0 0 rgba(255,40,40,0.4);animation:livePulse 1.6s ease-in-out infinite;}
@keyframes livePulse{0%,100%{box-shadow:0 0 0 0 rgba(255,40,40,0.5);}50%{box-shadow:0 0 0 6px rgba(255,40,40,0);}}
.live-viewers{display:flex;align-items:center;gap:6px;font-size:.78rem;font-weight:700;color:rgba(255,255,255,0.6);}
.live-viewers svg{stroke:rgba(255,255,255,0.4);}

/* Stage */
.live-stage{position:relative;background:#0d0120;overflow:hidden;}

/* Stage photo */
.live-stage-img-wrap{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;}
.live-stage-photo{width:100%;height:100%;object-fit:cover;object-position:center 30%;display:block;transition:transform 8s ease-out;}
.live-player-card:hover .live-stage-photo{transform:scale(1.04);}
/* top gradient: dark vignette so badge/viewers stay readable */
.live-stage-overlay-top{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0.55) 0%,rgba(0,0,0,0.1) 40%,rgba(0,0,0,0.05) 60%,rgba(0,0,0,0.7) 100%);pointer-events:none;}
/* subtle brand colour tint */
.live-stage-overlay-bottom{position:absolute;inset:0;background:radial-gradient(ellipse 80% 60% at 30% 20%,rgba(123,47,247,0.18) 0%,transparent 60%),radial-gradient(ellipse 60% 50% at 70% 60%,rgba(0,212,255,0.12) 0%,transparent 60%);pointer-events:none;mix-blend-mode:screen;}
/* Now playing bar at bottom of photo */
.live-stage-np-bar{position:absolute;bottom:0;left:0;right:0;display:flex;align-items:center;gap:10px;padding:8px 14px;background:rgba(0,0,0,0.55);backdrop-filter:blur(6px);}
.live-stage-np-label{font-size:.62rem;font-weight:700;letter-spacing:1.5px;color:rgba(255,255,255,0.45);text-transform:uppercase;white-space:nowrap;}
.live-stage-np-track{font-size:.78rem;font-weight:700;color:#fff;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.live-stage-np-time{font-size:.68rem;color:rgba(255,255,255,0.35);white-space:nowrap;}

/* Chat float */
.live-chat-float{position:absolute;bottom:38px;left:10px;display:flex;flex-direction:column;gap:5px;z-index:10;pointer-events:none;}
.live-msg{display:flex;gap:5px;align-items:baseline;padding:5px 10px;background:rgba(0,0,0,0.55);backdrop-filter:blur(8px);border-radius:20px;border:1px solid rgba(255,255,255,0.06);font-size:.68rem;max-width:240px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;animation:msgSlideIn .4s ease both;animation-delay:var(--delay,0s);}
@keyframes msgSlideIn{from{opacity:0;transform:translateX(-12px);}to{opacity:1;transform:translateX(0);}}
.live-msg-name{font-weight:700;flex-shrink:0;}
.live-msg-text{color:rgba(255,255,255,0.7);overflow:hidden;text-overflow:ellipsis;}

/* Now playing */
.live-now-playing{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;background:rgba(0,0,0,0.25);border-top:1px solid rgba(255,255,255,0.05);}
.live-now-left{display:flex;align-items:center;gap:12px;}
.live-cover-art{border-radius:8px;overflow:hidden;flex-shrink:0;}
.live-track-title{font-size:.88rem;font-weight:700;color:#fff;margin-bottom:2px;}
.live-track-artist{font-size:.72rem;color:rgba(255,255,255,0.4);}
.live-now-right{display:flex;gap:8px;}
.live-bpm-badge,.live-key-badge{padding:3px 10px;border-radius:20px;font-size:.65rem;font-weight:700;letter-spacing:.5px;}
.live-bpm-badge{background:rgba(0,212,255,0.1);border:1px solid rgba(0,212,255,0.25);color:#00d4ff;}
.live-key-badge{background:rgba(255,111,216,0.1);border:1px solid rgba(255,111,216,0.25);color:#ff6fd8;}

/* Controls */
.live-controls{display:flex;align-items:center;gap:12px;padding:14px 18px;background:rgba(0,0,0,0.15);}
.live-ctrl-btn{width:36px;height:36px;border-radius:50%;border:1px solid rgba(255,255,255,0.08);background:rgba(255,255,255,0.04);color:rgba(255,255,255,0.6);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.25s;flex-shrink:0;}
.live-ctrl-btn:hover{background:rgba(0,212,255,0.1);border-color:rgba(0,212,255,0.3);color:#fff;}
.live-ctrl-primary{background:linear-gradient(135deg,#7b2ff7,#ff6fd8);border:none;color:#fff;width:40px;height:40px;}
.live-ctrl-primary:hover{transform:scale(1.08);filter:brightness(1.1);}
.live-ctrl-heart:hover{background:rgba(255,111,216,0.1);border-color:rgba(255,111,216,0.3);color:#ff6fd8;}
.live-progress-wrap{flex:1;}
.live-progress-bar{position:relative;height:4px;background:rgba(255,255,255,0.08);border-radius:2px;cursor:pointer;margin-bottom:4px;}
.live-progress-fill{position:absolute;left:0;top:0;height:100%;background:linear-gradient(90deg,#7b2ff7,#ff6fd8);border-radius:2px;}
.live-progress-thumb{position:absolute;top:50%;transform:translate(-50%,-50%);width:12px;height:12px;border-radius:50%;background:#fff;box-shadow:0 0 8px rgba(255,111,216,0.5);}
.live-progress-times{display:flex;justify-content:space-between;font-size:.62rem;color:rgba(255,255,255,0.3);}

/* Features list */
.live-features{display:flex;flex-direction:column;gap:0;}
.live-feat-item{display:flex;align-items:flex-start;gap:16px;padding:22px 0;border-bottom:1px solid rgba(255,255,255,0.04);}
.live-feat-item:last-of-type{border-bottom:none;}
.live-feat-icon{width:46px;height:46px;border-radius:14px;border:1px solid;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:.3s;}
.live-feat-item:hover .live-feat-icon{transform:scale(1.08);}
.live-feat-text h4{font-size:.92rem;font-weight:700;color:#fff;margin-bottom:5px;}
.live-feat-text p{font-size:.78rem;color:rgba(255,255,255,0.4);line-height:1.65;}
.live-cta-row{display:flex;gap:12px;flex-wrap:wrap;padding-top:22px;}
.live-cta-btn{padding:12px 28px;border-radius:50px;font-size:.86rem;font-weight:700;cursor:pointer;transition:.3s;text-decoration:none;display:inline-flex;align-items:center;gap:8px;font-family:inherit;}
.live-cta-primary{background:linear-gradient(135deg,#ff4040,#ff6fd8);color:#fff;border:none;box-shadow:0 8px 28px rgba(255,64,64,0.3);}
.live-cta-primary:hover{transform:translateY(-2px);box-shadow:0 12px 36px rgba(255,64,64,0.45);}
.live-cta-secondary{background:0;color:#fff;border:1px solid rgba(255,255,255,0.1);}
.live-cta-secondary:hover{border-color:rgba(0,212,255,0.3);color:#00d4ff;}

/* Stats row */
.live-stats-row{display:flex;align-items:center;justify-content:center;gap:0;background:rgba(255,255,255,0.02);border:1px solid rgba(255,255,255,0.05);border-radius:20px;padding:32px 48px;margin-bottom:56px;flex-wrap:wrap;}
.live-stat-box{text-align:center;padding:0 40px;}
.live-stat-num{font-size:2.2rem;font-weight:900;letter-spacing:-.03em;margin-bottom:4px;}
.live-stat-lbl{font-size:.72rem;color:rgba(255,255,255,0.35);text-transform:uppercase;letter-spacing:1.5px;font-weight:600;}
.live-stat-divider{width:1px;height:48px;background:rgba(255,255,255,0.07);}
@media(max-width:768px){
  .live-stats-row{gap:24px;padding:24px;}
  .live-stat-box{padding:0 16px;}
  .live-stat-divider{display:none;}
}

/* Upcoming lives */
.live-upcoming{}
.live-upcoming-title{display:flex;align-items:center;gap:8px;font-size:.75rem;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:rgba(255,255,255,0.35);margin-bottom:20px;}
.live-upcoming-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
@media(max-width:900px){.live-upcoming-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:540px){.live-upcoming-grid{grid-template-columns:1fr;}}

.live-upcoming-card{background:rgba(255,255,255,0.025);border:1px solid rgba(255,255,255,0.06);border-radius:16px;padding:16px;display:flex;flex-direction:column;gap:10px;transition:.3s;}
.live-upcoming-card:hover{border-color:rgba(0,212,255,0.2);background:rgba(0,212,255,0.03);transform:translateY(-3px);}
.live-upcoming-cover{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.4rem;flex-shrink:0;}
.live-upcoming-info{flex:1;}
.live-upcoming-name{font-size:.88rem;font-weight:700;color:#fff;margin-bottom:3px;}
.live-upcoming-genre{font-size:.7rem;color:rgba(255,255,255,0.35);margin-bottom:6px;}
.live-upcoming-time{display:flex;align-items:center;gap:5px;font-size:.7rem;color:rgba(255,255,255,0.5);font-weight:600;}
.live-upcoming-notify{width:100%;padding:8px;border-radius:10px;border:1px solid rgba(255,255,255,0.08);background:rgba(255,255,255,0.03);color:rgba(255,255,255,0.45);font-size:.72rem;font-weight:600;cursor:pointer;transition:.25s;font-family:inherit;display:flex;align-items:center;justify-content:center;gap:6px;}
.live-upcoming-notify:hover{background:rgba(0,212,255,0.08);border-color:rgba(0,212,255,0.25);color:#00d4ff;}

/* ===================================================================
   GROUP CHAT / COLLAB SECTION
   =================================================================== */
.gchat-sec{position:relative;z-index:1;padding:110px 0 100px;overflow:hidden;}
.gchat-sec::before{content:'';position:absolute;inset:0;
  background:
    radial-gradient(ellipse 65% 55% at 80% 15%,rgba(0,212,255,0.09) 0%,transparent 60%),
    radial-gradient(ellipse 55% 45% at 10% 80%,rgba(123,47,247,0.1) 0%,transparent 60%),
    radial-gradient(ellipse 40% 35% at 50% 50%,rgba(56,239,125,0.05) 0%,transparent 65%);
  pointer-events:none;}

.gchat-inner{max-width:1280px;margin:0 auto;padding:0 48px;}
@media(max-width:768px){.gchat-inner{padding:0 20px;}}

/* ── Header ── */
.gchat-header{text-align:center;margin-bottom:72px;}
.gchat-header .label{font-size:.7rem;font-weight:700;letter-spacing:4px;text-transform:uppercase;color:#38ef7d;margin-bottom:12px;display:flex;align-items:center;justify-content:center;gap:7px;}
.gchat-header .label-dot{width:7px;height:7px;border-radius:50%;background:#38ef7d;animation:gcDot 2s ease-in-out infinite;}
@keyframes gcDot{0%,100%{opacity:1;transform:scale(1);}50%{opacity:.4;transform:scale(.7);}}
.gchat-title{font-size:clamp(2.2rem,4.5vw,3.6rem);font-weight:900;line-height:1.08;margin-bottom:16px;}
.gchat-title span{background:linear-gradient(135deg,#38ef7d,#00d4ff,#7b2ff7);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.gchat-sub{color:rgba(255,255,255,0.42);font-size:.96rem;max-width:600px;margin:0 auto;line-height:1.75;}

/* ── Main layout ── */
.gchat-layout{display:grid;grid-template-columns:320px 1fr;gap:28px;align-items:start;margin-bottom:72px;}
@media(max-width:1100px){.gchat-layout{grid-template-columns:1fr;}}

/* ── Sidebar (room list) ── */
.gchat-sidebar{background:rgba(255,255,255,0.025);border:1px solid rgba(255,255,255,0.06);border-radius:22px;overflow:hidden;}
.gchat-sidebar-header{padding:18px 20px;border-bottom:1px solid rgba(255,255,255,0.05);display:flex;align-items:center;justify-content:space-between;}
.gchat-sidebar-title{font-size:.78rem;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:rgba(255,255,255,0.35);}
.gchat-new-room-btn{width:28px;height:28px;border-radius:8px;border:1px solid rgba(56,239,125,0.25);background:rgba(56,239,125,0.08);color:#38ef7d;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.25s;font-size:1rem;line-height:1;}
.gchat-new-room-btn:hover{background:rgba(56,239,125,0.15);border-color:rgba(56,239,125,0.4);}

.gchat-search{padding:12px 16px;border-bottom:1px solid rgba(255,255,255,0.04);}
.gchat-search-input{width:100%;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.07);border-radius:10px;padding:8px 12px 8px 34px;font-size:.76rem;color:#fff;font-family:inherit;outline:none;position:relative;}
.gchat-search-wrap{position:relative;}
.gchat-search-wrap svg{position:absolute;left:10px;top:50%;transform:translateY(-50%);pointer-events:none;opacity:.35;}
.gchat-search-input::placeholder{color:rgba(255,255,255,0.25);}
.gchat-search-input:focus{border-color:rgba(56,239,125,0.25);background:rgba(255,255,255,0.05);}

.gchat-room-list{padding:8px;}
.gchat-room{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:12px;cursor:pointer;transition:.2s;position:relative;}
.gchat-room:hover{background:rgba(255,255,255,0.04);}
.gchat-room.active{background:rgba(56,239,125,0.07);border:1px solid rgba(56,239,125,0.12);}
.gchat-room-avatar{width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.1rem;flex-shrink:0;position:relative;}
.gchat-room-online{position:absolute;bottom:-2px;right:-2px;width:10px;height:10px;border-radius:50%;border:2px solid rgba(10,8,25,0.9);}
.gchat-room-online.on{background:#38ef7d;}
.gchat-room-online.off{background:rgba(255,255,255,0.2);}
.gchat-room-body{flex:1;min-width:0;}
.gchat-room-name{font-size:.82rem;font-weight:700;color:#fff;margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.gchat-room.active .gchat-room-name{color:#38ef7d;}
.gchat-room-preview{font-size:.7rem;color:rgba(255,255,255,0.3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.gchat-room-meta{display:flex;flex-direction:column;align-items:flex-end;gap:4px;flex-shrink:0;}
.gchat-room-time{font-size:.62rem;color:rgba(255,255,255,0.22);}
.gchat-unread{min-width:18px;height:18px;border-radius:9px;background:linear-gradient(135deg,#38ef7d,#00d4ff);color:#030a18;font-size:.6rem;font-weight:800;display:flex;align-items:center;justify-content:center;padding:0 5px;}

/* ── Chat window ── */
.gchat-window{background:rgba(10,8,25,0.7);border:1px solid rgba(255,255,255,0.06);border-radius:22px;overflow:hidden;display:flex;flex-direction:column;height:600px;backdrop-filter:blur(20px);}

.gchat-win-header{padding:16px 22px;border-bottom:1px solid rgba(255,255,255,0.05);display:flex;align-items:center;justify-content:space-between;flex-shrink:0;}
.gchat-win-info{display:flex;align-items:center;gap:12px;}
.gchat-win-avatar{width:38px;height:38px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.1rem;flex-shrink:0;}
.gchat-win-name{font-size:.92rem;font-weight:700;color:#fff;}
.gchat-win-members{font-size:.7rem;color:rgba(255,255,255,0.35);display:flex;align-items:center;gap:5px;margin-top:2px;}
.gchat-win-members-dot{width:6px;height:6px;border-radius:50%;background:#38ef7d;}
.gchat-win-actions{display:flex;gap:8px;}
.gchat-win-act-btn{width:34px;height:34px;border-radius:10px;border:1px solid rgba(255,255,255,0.07);background:rgba(255,255,255,0.03);color:rgba(255,255,255,0.45);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.25s;}
.gchat-win-act-btn:hover{background:rgba(56,239,125,0.08);border-color:rgba(56,239,125,0.2);color:#38ef7d;}

/* ── Collab banner ── */
.gchat-collab-banner{padding:10px 22px;background:rgba(56,239,125,0.06);border-bottom:1px solid rgba(56,239,125,0.08);display:flex;align-items:center;gap:10px;flex-shrink:0;}
.gchat-collab-tag{padding:3px 10px;background:rgba(56,239,125,0.12);border:1px solid rgba(56,239,125,0.2);border-radius:20px;font-size:.62rem;font-weight:700;color:#38ef7d;letter-spacing:.5px;white-space:nowrap;}
.gchat-collab-text{font-size:.74rem;color:rgba(255,255,255,0.45);flex:1;}
.gchat-collab-btn{padding:5px 14px;border-radius:20px;border:1px solid rgba(56,239,125,0.25);background:rgba(56,239,125,0.08);color:#38ef7d;font-size:.7rem;font-weight:700;cursor:pointer;transition:.25s;font-family:inherit;white-space:nowrap;}
.gchat-collab-btn:hover{background:rgba(56,239,125,0.15);}

/* ── Messages area ── */
.gchat-messages{flex:1;overflow-y:auto;padding:20px 22px;display:flex;flex-direction:column;gap:18px;}
.gchat-messages::-webkit-scrollbar{width:3px;}
.gchat-messages::-webkit-scrollbar-thumb{background:rgba(56,239,125,0.2);border-radius:2px;}

/* day separator */
.gchat-day-sep{text-align:center;position:relative;margin:4px 0;}
.gchat-day-sep::before{content:'';position:absolute;top:50%;left:0;right:0;height:1px;background:rgba(255,255,255,0.05);}
.gchat-day-sep span{position:relative;background:rgba(10,8,25,0.9);padding:0 12px;font-size:.64rem;color:rgba(255,255,255,0.22);font-weight:600;letter-spacing:1px;}

/* message bubble */
.gchat-msg{display:flex;gap:10px;align-items:flex-start;}
.gchat-msg.me{flex-direction:row-reverse;}
.gchat-msg-avatar{width:32px;height:32px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:.9rem;flex-shrink:0;border:1px solid rgba(255,255,255,0.06);}
.gchat-msg-body{max-width:72%;display:flex;flex-direction:column;gap:4px;}
.gchat-msg.me .gchat-msg-body{align-items:flex-end;}
.gchat-msg-meta{display:flex;align-items:center;gap:6px;}
.gchat-msg.me .gchat-msg-meta{flex-direction:row-reverse;}
.gchat-msg-name{font-size:.68rem;font-weight:700;}
.gchat-msg-time{font-size:.6rem;color:rgba(255,255,255,0.22);}
.gchat-bubble{padding:10px 14px;border-radius:16px;font-size:.8rem;line-height:1.6;color:rgba(255,255,255,0.85);word-break:break-word;}
.gchat-msg:not(.me) .gchat-bubble{background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.06);border-top-left-radius:4px;}
.gchat-msg.me .gchat-bubble{background:linear-gradient(135deg,rgba(56,239,125,0.15),rgba(0,212,255,0.12));border:1px solid rgba(56,239,125,0.18);border-top-right-radius:4px;}

/* file / track attachment */
.gchat-attachment{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:14px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.07);margin-top:4px;cursor:pointer;transition:.25s;}
.gchat-attachment:hover{border-color:rgba(56,239,125,0.25);background:rgba(56,239,125,0.05);}
.gchat-attach-icon{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.gchat-attach-name{font-size:.76rem;font-weight:700;color:#fff;margin-bottom:2px;}
.gchat-attach-meta{font-size:.66rem;color:rgba(255,255,255,0.3);}
.gchat-attach-play{width:28px;height:28px;border-radius:50%;border:1px solid rgba(56,239,125,0.3);background:rgba(56,239,125,0.08);color:#38ef7d;display:flex;align-items:center;justify-content:center;margin-left:auto;flex-shrink:0;transition:.25s;}
.gchat-attachment:hover .gchat-attach-play{background:rgba(56,239,125,0.18);}

/* emoji reaction bar */
.gchat-reactions{display:flex;gap:4px;margin-top:4px;flex-wrap:wrap;}
.gchat-react{padding:3px 8px;border-radius:20px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.07);font-size:.7rem;cursor:pointer;transition:.2s;display:flex;align-items:center;gap:3px;color:rgba(255,255,255,0.5);}
.gchat-react:hover,.gchat-react.active{background:rgba(56,239,125,0.08);border-color:rgba(56,239,125,0.2);}
.gchat-react span{font-size:.64rem;}

/* typing indicator */
.gchat-typing{display:flex;align-items:center;gap:10px;padding:0 0 6px;}
.gchat-typing-dots{display:flex;gap:4px;align-items:center;}
.gchat-typing-dots i{width:6px;height:6px;border-radius:50%;background:rgba(56,239,125,0.5);display:block;animation:gcTyping 1.2s ease-in-out infinite;}
.gchat-typing-dots i:nth-child(2){animation-delay:.2s;}
.gchat-typing-dots i:nth-child(3){animation-delay:.4s;}
@keyframes gcTyping{0%,80%,100%{transform:translateY(0);opacity:.4;}40%{transform:translateY(-5px);opacity:1;}}
.gchat-typing-label{font-size:.68rem;color:rgba(255,255,255,0.28);font-style:italic;}

/* ── Input bar ── */
.gchat-input-bar{padding:14px 18px;border-top:1px solid rgba(255,255,255,0.05);display:flex;flex-direction:column;gap:10px;flex-shrink:0;}
.gchat-input-tools{display:flex;gap:6px;}
.gchat-tool-btn{padding:6px 12px;border-radius:20px;border:1px solid rgba(255,255,255,0.07);background:rgba(255,255,255,0.03);color:rgba(255,255,255,0.4);font-size:.7rem;font-weight:600;cursor:pointer;transition:.25s;font-family:inherit;display:flex;align-items:center;gap:5px;}
.gchat-tool-btn:hover{border-color:rgba(56,239,125,0.25);background:rgba(56,239,125,0.06);color:#38ef7d;}
.gchat-input-row{display:flex;gap:10px;align-items:flex-end;}
.gchat-input-field{flex:1;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.07);border-radius:14px;padding:11px 16px;font-size:.82rem;color:#fff;font-family:inherit;outline:none;resize:none;line-height:1.5;min-height:44px;max-height:120px;transition:.25s;}
.gchat-input-field::placeholder{color:rgba(255,255,255,0.22);}
.gchat-input-field:focus{border-color:rgba(56,239,125,0.3);background:rgba(255,255,255,0.05);}
.gchat-send-btn{width:44px;height:44px;border-radius:12px;border:none;background:linear-gradient(135deg,#38ef7d,#00d4ff);color:#030a18;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.25s;flex-shrink:0;}
.gchat-send-btn:hover{transform:scale(1.07);box-shadow:0 6px 20px rgba(56,239,125,0.3);}

/* ── Features strip ── */
.gchat-features-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:72px;}
@media(max-width:900px){.gchat-features-strip{grid-template-columns:repeat(2,1fr);}}
@media(max-width:540px){.gchat-features-strip{grid-template-columns:1fr;}}
.gchat-feat-card{background:rgba(255,255,255,0.025);border:1px solid rgba(255,255,255,0.06);border-radius:20px;padding:26px 22px;transition:all .3s;}
.gchat-feat-card:hover{border-color:rgba(56,239,125,0.2);transform:translateY(-5px);background:rgba(56,239,125,0.03);}
.gchat-feat-card-icon{width:48px;height:48px;border-radius:14px;display:flex;align-items:center;justify-content:center;margin-bottom:16px;}
.gchat-feat-card h4{font-size:.9rem;font-weight:700;color:#fff;margin-bottom:8px;}
.gchat-feat-card p{font-size:.76rem;color:rgba(255,255,255,0.38);line-height:1.65;}

/* ── Collab use cases ── */
.gchat-usecases{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
@media(max-width:900px){.gchat-usecases{grid-template-columns:1fr;}}
.gchat-usecase{background:rgba(255,255,255,0.02);border:1px solid rgba(255,255,255,0.05);border-radius:20px;padding:30px 24px;position:relative;overflow:hidden;transition:.35s;}
.gchat-usecase::before{content:'';position:absolute;top:-40px;right:-40px;width:120px;height:120px;border-radius:50%;pointer-events:none;}
.gchat-usecase:hover{transform:translateY(-4px);}
.gchat-usecase-emoji{font-size:2rem;margin-bottom:14px;display:block;}
.gchat-usecase h4{font-size:.95rem;font-weight:800;color:#fff;margin-bottom:8px;}
.gchat-usecase p{font-size:.78rem;color:rgba(255,255,255,0.38);line-height:1.65;}
.gchat-usecase-tag{display:inline-block;margin-top:14px;padding:4px 12px;border-radius:20px;font-size:.64rem;font-weight:700;letter-spacing:.5px;}

/* ===================================================================
   SHORTS SECTION
   =================================================================== */
.shorts-sec{position:relative;z-index:1;padding:110px 0 100px;overflow:hidden;}
.shorts-sec::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;
  background:radial-gradient(ellipse 80% 60% at 20% 30%,rgba(123,47,247,0.1) 0%,transparent 60%),
             radial-gradient(ellipse 70% 50% at 80% 70%,rgba(255,111,216,0.08) 0%,transparent 60%);
  pointer-events:none;}

.shorts-inner{max-width:1320px;margin:0 auto;padding:0 48px;}
@media(max-width:768px){.shorts-inner{padding:0 20px;}}

/* ── Header ── */
.shorts-header{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:48px;gap:24px;flex-wrap:wrap;}
.shorts-header-left .label{margin-bottom:10px;}
.shorts-title{font-size:clamp(2rem,4vw,3rem);font-weight:900;line-height:1.1;margin-bottom:12px;}
.shorts-title span{background:linear-gradient(135deg,#ff6fd8,#7b2ff7,#00d4ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.shorts-sub{color:rgba(255,255,255,0.42);font-size:.95rem;max-width:480px;line-height:1.7;}
.shorts-header-right{display:flex;gap:8px;align-items:center;flex-shrink:0;}
.shorts-filter-btn{padding:8px 18px;border-radius:30px;border:1px solid rgba(255,255,255,0.08);background:rgba(255,255,255,0.03);color:rgba(255,255,255,0.45);font-size:.78rem;font-weight:600;cursor:pointer;font-family:inherit;transition:all .25s;white-space:nowrap;}
.shorts-filter-btn:hover{color:#fff;border-color:rgba(255,255,255,0.18);}
.shorts-filter-btn.active{background:linear-gradient(135deg,rgba(255,111,216,0.15),rgba(123,47,247,0.15));border-color:rgba(255,111,216,0.35);color:#ff6fd8;}

/* ── Grid ── */
.shorts-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;align-items:start;}
@media(max-width:1200px){.shorts-grid{grid-template-columns:repeat(4,1fr);}}
@media(max-width:900px) {.shorts-grid{grid-template-columns:repeat(3,1fr);}}
@media(max-width:600px) {.shorts-grid{grid-template-columns:repeat(2,1fr);gap:10px;}}

/* ── Card ── */
.short-card{position:relative;border-radius:18px;overflow:hidden;cursor:pointer;
  transition:transform .35s cubic-bezier(.34,1.1,.64,1),box-shadow .35s;
  background:#0a0d18;}
.short-card:hover{transform:translateY(-8px) scale(1.02);box-shadow:0 24px 60px rgba(0,0,0,0.55);}
.short-card.tall{grid-row:span 2;}

/* thumbnail */
.short-thumb{position:relative;width:100%;padding-bottom:177.78%;/* 9:16 */overflow:hidden;}
.short-thumb-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s ease;}
.short-card:hover .short-thumb-bg{transform:scale(1.06);}
/* overlay gradient */
.short-thumb::after{content:'';position:absolute;inset:0;
  background:linear-gradient(0deg,rgba(0,0,0,0.85) 0%,rgba(0,0,0,0.2) 45%,rgba(0,0,0,0.1) 100%);}
/* category badge */
.short-cat{position:absolute;top:10px;left:10px;z-index:3;
  padding:3px 10px;border-radius:20px;font-size:.6rem;font-weight:800;letter-spacing:.8px;text-transform:uppercase;
  backdrop-filter:blur(12px);}
/* duration badge */
.short-dur{position:absolute;top:10px;right:10px;z-index:3;
  background:rgba(0,0,0,0.7);backdrop-filter:blur(8px);
  padding:3px 8px;border-radius:6px;font-size:.65rem;font-weight:700;color:#fff;letter-spacing:.3px;}
/* play overlay */
.short-play-overlay{position:absolute;inset:0;z-index:4;
  display:flex;align-items:center;justify-content:center;
  opacity:0;transition:opacity .25s;}
.short-card:hover .short-play-overlay{opacity:1;}
.short-play-btn{width:52px;height:52px;border-radius:50%;background:rgba(255,255,255,0.18);
  backdrop-filter:blur(16px);border:2px solid rgba(255,255,255,0.4);
  display:flex;align-items:center;justify-content:center;transition:transform .2s;}
.short-card:hover .short-play-btn{transform:scale(1.1);}
.short-play-btn svg{width:20px;height:20px;fill:#fff;margin-left:3px;}
/* views badge */
.short-views{position:absolute;bottom:152px;right:10px;z-index:3;
  font-size:.65rem;font-weight:700;color:rgba(255,255,255,0.7);
  display:flex;align-items:center;gap:4px;}
.short-views svg{width:12px;height:12px;fill:none;stroke:rgba(255,255,255,0.7);stroke-width:2;}

/* info strip */
.short-info{position:absolute;bottom:0;left:0;right:0;z-index:3;padding:12px 12px 14px;}
.short-author{display:flex;align-items:center;gap:7px;margin-bottom:6px;}
.short-avatar{width:24px;height:24px;border-radius:50%;flex-shrink:0;border:1.5px solid rgba(255,255,255,0.3);}
.short-author-name{font-size:.72rem;font-weight:700;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.short-author-badge{font-size:.55rem;padding:1px 6px;border-radius:10px;background:rgba(0,212,255,0.2);color:#00d4ff;font-weight:700;letter-spacing:.3px;flex-shrink:0;}
.short-caption{font-size:.72rem;color:rgba(255,255,255,0.7);line-height:1.4;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
/* like counter — TikTok-style glass pill, right rail inside .short-thumb */
.short-likes{
  position:absolute;
  right:10px;
  bottom:92px;
  z-index:5;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:5px;
  background:rgba(0,0,0,0.48);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border:1px solid rgba(255,255,255,0.1);
  border-radius:28px;
  padding:9px 8px 7px;
  min-width:36px;
  transition:background .25s, border-color .25s, transform .25s;
}
.short-card:hover .short-likes{
  background:rgba(255,111,216,0.18);
  border-color:rgba(255,111,216,0.4);
  transform:scale(1.06);
}
.short-likes svg{
  width:18px;height:18px;
  fill:none;
  stroke:rgba(255,255,255,0.9);
  stroke-width:1.8;
  display:block;
  transition:stroke .2s, fill .2s, transform .2s;
}
.short-card:hover .short-likes svg{
  stroke:#ff6fd8;
  fill:rgba(255,111,216,0.4);
  transform:scale(1.18);
}
.short-likes span{
  font-size:.58rem;
  font-weight:800;
  color:rgba(255,255,255,0.9);
  letter-spacing:.2px;
  line-height:1;
}

/* ── Bottom CTA ── */
.shorts-cta{margin-top:52px;display:flex;align-items:center;justify-content:space-between;
  padding:32px 40px;border-radius:24px;
  background:linear-gradient(135deg,rgba(123,47,247,0.1) 0%,rgba(255,111,216,0.08) 50%,rgba(0,212,255,0.06) 100%);
  border:1px solid rgba(123,47,247,0.2);flex-wrap:wrap;gap:24px;}
.shorts-cta-text h3{font-size:1.3rem;font-weight:800;margin-bottom:6px;}
.shorts-cta-text p{color:rgba(255,255,255,0.42);font-size:.88rem;}
.shorts-cta-btns{display:flex;gap:12px;flex-wrap:wrap;}
.shorts-cta-btn-primary{padding:12px 28px;border-radius:50px;border:none;
  background:linear-gradient(135deg,#ff6fd8,#7b2ff7);color:#fff;
  font-size:.85rem;font-weight:700;cursor:pointer;font-family:inherit;
  box-shadow:0 6px 24px rgba(123,47,247,0.3);transition:all .25s;}
.shorts-cta-btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 32px rgba(123,47,247,0.45);}
.shorts-cta-btn-ghost{padding:12px 28px;border-radius:50px;border:1px solid rgba(255,255,255,0.14);
  background:rgba(255,255,255,0.04);color:rgba(255,255,255,0.75);
  font-size:.85rem;font-weight:600;cursor:pointer;font-family:inherit;transition:all .25s;}
.shorts-cta-btn-ghost:hover{border-color:rgba(255,111,216,0.35);color:#ff6fd8;}
/* ===================================================================
   /SHORTS SECTION
   =================================================================== */

/* ===== FAN-GATE DOWNLOAD SECTION ===== */
.fangate-sec{position:relative;z-index:1;padding:110px 48px;background:linear-gradient(180deg,rgba(4,18,36,0) 0%,rgba(10,0,30,0.6) 50%,rgba(4,18,36,0) 100%);overflow:hidden;}
.fangate-inner{max-width:1200px;margin:0 auto;}
.fangate-header{text-align:center;margin-bottom:72px;}
.fangate-header h2{font-size:clamp(2rem,4vw,3.2rem);font-weight:900;margin-bottom:14px;line-height:1.15;}
.fangate-header h2 span{background:linear-gradient(135deg,#00d4ff,#7b2ff7,#ff6fd8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.fangate-header p{color:rgba(255,255,255,0.45);font-size:.98rem;max-width:540px;margin:0 auto;line-height:1.75;}

.fangate-layout{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start;}
@media(max-width:960px){.fangate-layout{grid-template-columns:1fr;}.fangate-sec{padding:80px 24px;}}

/* Track demo card */
.fangate-demo{display:flex;flex-direction:column;align-items:center;gap:16px;}
.fangate-track-card{width:100%;background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.08);border-radius:24px;padding:24px;backdrop-filter:blur(20px);box-shadow:0 30px 80px rgba(0,0,0,0.4);}
.fangate-track-cover{display:flex;align-items:center;gap:18px;margin-bottom:20px;}
.fangate-cover-art{flex-shrink:0;border-radius:12px;overflow:hidden;box-shadow:0 8px 30px rgba(123,47,247,0.3);}
.fangate-track-title{font-size:1.1rem;font-weight:800;color:#fff;margin-bottom:4px;}
.fangate-track-artist{font-size:.82rem;color:rgba(255,255,255,0.5);margin-bottom:10px;}
.fangate-track-meta{display:flex;gap:12px;flex-wrap:wrap;}
.fangate-track-meta span{font-size:.7rem;color:rgba(255,255,255,0.35);background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.07);padding:3px 10px;border-radius:20px;}
.fangate-divider{height:1px;background:rgba(255,255,255,0.06);margin-bottom:16px;}
.fangate-gate-label{display:flex;align-items:center;gap:8px;font-size:.72rem;font-weight:700;color:#00d4ff;letter-spacing:.5px;text-transform:uppercase;margin-bottom:16px;padding:8px 14px;background:rgba(0,212,255,0.06);border:1px solid rgba(0,212,255,0.15);border-radius:10px;}

/* Steps */
.fangate-step{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:14px;border:1px solid rgba(255,255,255,0.07);background:rgba(255,255,255,0.02);margin-bottom:10px;transition:all .35s cubic-bezier(.4,0,.2,1);position:relative;}
.fangate-step.locked{opacity:.4;pointer-events:none;}
.fangate-step.done{border-color:rgba(56,239,125,0.3);background:rgba(56,239,125,0.05);}
.fangate-step.done .fangate-step-num{background:linear-gradient(135deg,#00b894,#38ef7d);color:#030a18;}
.fangate-step.hidden-step{display:none;}
.fangate-step-num{width:28px;height:28px;border-radius:50%;background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.12);display:flex;align-items:center;justify-content:center;font-size:.72rem;font-weight:800;color:rgba(255,255,255,0.5);flex-shrink:0;transition:.3s;}
.fangate-step-body{display:flex;align-items:center;gap:10px;flex:1;}
.fangate-step-emoji{width:1.5rem;height:1.5rem;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.fangate-step-emoji svg,.fangate-toggle-emoji svg{width:100%;height:100%;display:block;}
.fangate-icon-heart{color:#ff6fd8;}
.fangate-icon-user{color:#00d4ff;}
.fangate-icon-comment{color:#8b5cf6;}
.fangate-step-text strong{display:block;font-size:.85rem;font-weight:700;color:#fff;margin-bottom:2px;}
.fangate-step-text span{font-size:.72rem;color:rgba(255,255,255,0.4);}
.fangate-step-btn{padding:7px 16px;border-radius:30px;border:1px solid rgba(0,212,255,0.3);background:rgba(0,212,255,0.08);color:#00d4ff;font-size:.75rem;font-weight:700;cursor:pointer;font-family:inherit;transition:all .25s;flex-shrink:0;}
.fangate-step-btn:hover:not(:disabled){background:rgba(0,212,255,0.18);transform:scale(1.04);}
.fangate-step-btn:disabled{opacity:.4;cursor:not-allowed;}
.fangate-step-check{width:24px;height:24px;border-radius:50%;background:linear-gradient(135deg,#00b894,#38ef7d);display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:900;color:#030a18;flex-shrink:0;opacity:0;transform:scale(0);transition:all .3s cubic-bezier(.34,1.56,.64,1);}
.fangate-step-check svg{width:13px;height:13px;display:block;fill:none;stroke:#030a18;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;}
.fangate-step.done .fangate-step-check{opacity:1;transform:scale(1);}
.fangate-step.done .fangate-step-btn{display:none;}

/* Progress + download */
.fangate-download-wrap{margin-top:18px;}
.fangate-progress-bar{height:4px;border-radius:4px;background:rgba(255,255,255,0.07);margin-bottom:8px;overflow:hidden;}
.fangate-progress-fill{height:100%;background:linear-gradient(90deg,#00d4ff,#7b2ff7,#ff6fd8);border-radius:4px;transition:width .5s cubic-bezier(.4,0,.2,1);}
.fangate-progress-label{font-size:.7rem;color:rgba(255,255,255,0.35);margin-bottom:14px;text-align:center;}
.fangate-download-btn{width:100%;padding:14px;border-radius:14px;border:none;font-size:.92rem;font-weight:800;cursor:pointer;font-family:inherit;display:flex;align-items:center;justify-content:center;gap:10px;transition:all .3s;letter-spacing:.3px;}
.fangate-download-btn.locked{background:rgba(255,255,255,0.06);color:rgba(255,255,255,0.25);border:1px solid rgba(255,255,255,0.08);}
.fangate-download-btn.unlocked{background:linear-gradient(135deg,#00d4ff,#7b2ff7);color:#fff;box-shadow:0 8px 36px rgba(0,212,255,0.35);animation:fgPulse 2s ease-in-out infinite;}
@keyframes fgPulse{0%,100%{box-shadow:0 8px 36px rgba(0,212,255,0.35);}50%{box-shadow:0 12px 48px rgba(0,212,255,0.55),0 0 0 4px rgba(0,212,255,0.1);}}
.fangate-download-btn.unlocked:hover{transform:translateY(-2px);filter:brightness(1.1);}
.fangate-reset-btn{background:none;border:1px solid rgba(255,255,255,0.1);color:rgba(255,255,255,0.3);border-radius:30px;padding:7px 18px;font-size:.72rem;cursor:pointer;font-family:inherit;transition:.3s;display:inline-flex;align-items:center;justify-content:center;gap:8px;}
.fangate-reset-btn svg{width:14px;height:14px;display:block;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.fangate-reset-btn:hover{border-color:rgba(255,255,255,0.25);color:rgba(255,255,255,0.6);}

/* Config panel */
.fangate-config{display:flex;flex-direction:column;gap:20px;}
.fangate-config-card{background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.08);border-radius:24px;padding:28px;backdrop-filter:blur(20px);}
.fangate-config-header{display:flex;align-items:center;gap:10px;font-size:.78rem;font-weight:700;color:#00d4ff;letter-spacing:.5px;text-transform:uppercase;margin-bottom:24px;padding-bottom:16px;border-bottom:1px solid rgba(255,255,255,0.06);}
.fangate-toggle-list{display:flex;flex-direction:column;gap:0;}
.fangate-toggle-row{display:flex;align-items:center;justify-content:space-between;padding:14px 0;border-bottom:1px solid rgba(255,255,255,0.05);}
.fangate-toggle-row:last-child{border-bottom:none;}
.fangate-toggle-info{display:flex;align-items:center;gap:12px;flex:1;}
.fangate-toggle-emoji{width:1.35rem;height:1.35rem;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;}
.fangate-toggle-info strong{display:block;font-size:.85rem;font-weight:700;color:#fff;margin-bottom:2px;}
.fangate-toggle-info span{font-size:.72rem;color:rgba(255,255,255,0.38);}

/* Toggle switch */
.fg-switch{position:relative;display:inline-block;width:44px;height:24px;flex-shrink:0;}
.fg-switch input{opacity:0;width:0;height:0;}
.fg-slider{position:absolute;inset:0;background:rgba(255,255,255,0.1);border-radius:24px;cursor:pointer;transition:.3s;border:1px solid rgba(255,255,255,0.12);}
.fg-slider::before{content:'';position:absolute;width:18px;height:18px;left:2px;top:2px;background:rgba(255,255,255,0.4);border-radius:50%;transition:.3s;}
.fg-switch input:checked + .fg-slider{background:linear-gradient(135deg,#00d4ff,#7b2ff7);border-color:transparent;}
.fg-switch input:checked + .fg-slider::before{transform:translateX(20px);background:#fff;}

/* Stats */
.fangate-config-stats{margin-top:20px;padding-top:20px;border-top:1px solid rgba(255,255,255,0.06);display:flex;flex-direction:column;gap:10px;}
.fangate-stat-row{display:flex;align-items:center;gap:10px;font-size:.8rem;}
.fangate-stat-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;}
.fangate-stat-row span{flex:1;color:rgba(255,255,255,0.45);}
.fangate-stat-row strong{color:#fff;font-weight:700;}
.fangate-config-note{margin-top:16px;display:flex;align-items:flex-start;gap:8px;font-size:.72rem;color:rgba(255,255,255,0.35);line-height:1.55;padding:12px 14px;background:rgba(0,212,255,0.04);border-radius:10px;border:1px solid rgba(0,212,255,0.1);}

/* Benefits */
.fangate-benefits{display:flex;flex-direction:column;gap:12px;}
.fangate-benefit{display:flex;align-items:center;gap:14px;padding:16px 18px;background:rgba(255,255,255,0.02);border:1px solid rgba(255,255,255,0.06);border-radius:14px;transition:.3s;}
.fangate-benefit:hover{border-color:rgba(0,212,255,0.15);background:rgba(0,212,255,0.03);}
.fangate-benefit-icon{width:42px;height:42px;border-radius:12px;border:1px solid;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.fangate-benefit strong{display:block;font-size:.85rem;font-weight:700;color:#fff;margin-bottom:3px;}
.fangate-benefit span{font-size:.72rem;color:rgba(255,255,255,0.38);}
/* ===== /FAN-GATE ===== */

html.day-mode body.page-home .feat-sec{background:rgba(240,242,245,0.95) !important;}
html.day-mode body.page-home .feat-card,html.day-mode body.page-home .testi-card,html.day-mode body.page-home .blog-card{background:rgba(255,255,255,0.8) !important;border-color:rgba(0,0,0,0.06) !important;}
html.day-mode body.page-home .feat-card h3,html.day-mode body.page-home h2,html.day-mode body.page-home h3{color:#111 !important;}
html.day-mode body.page-home .feat-card p,html.day-mode body.page-home .testi-quote{color:rgba(0,0,0,0.5) !important;}
html.day-mode body.page-home footer{border-color:rgba(0,0,0,0.06) !important;}
html.day-mode body.page-home .cookie-banner{background:rgba(255,255,255,0.95) !important;border-color:rgba(0,0,0,0.06) !important;}
html.day-mode body.page-home .cookie-text{color:rgba(0,0,0,0.55) !important;}
html.day-mode body.page-home .mobile-menu{background:rgba(255,255,255,0.97) !important;}
html.day-mode body.page-home .mm-item{color:rgba(0,0,0,0.65) !important;}

/* ================================================
   TOAST NOTIFICATION
   ================================================ */
.toast{position:fixed;bottom:90px;left:50%;transform:translateX(-50%) translateY(30px);z-index:270;padding:14px 26px;border-radius:60px;background:rgba(6,8,15,0.9);backdrop-filter:blur(20px);border:1px solid rgba(0,212,255,0.15);display:flex;align-items:center;gap:10px;font-size:.85rem;font-weight:500;color:#fff;box-shadow:0 12px 40px rgba(0,0,0,0.4);opacity:0;visibility:hidden;transition:all .45s cubic-bezier(.4,0,.2,1);white-space:nowrap;}
.toast.show{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);}
.toast-icon{font-size:1.2rem;}
.toast-close{background:none;border:none;color:rgba(255,255,255,0.3);cursor:pointer;font-size:1rem;padding:0 0 0 8px;transition:.3s;}
.toast-close:hover{color:#fff;}

/* ================================================
   3D TILT ON CARDS
   ================================================ */
.tilt-card{transition:transform .15s ease-out;}

/* ================================================
   LABEL / RECORD LABEL MANAGEMENT
   ================================================ */
.label-sec{position:relative;z-index:1;padding:110px 24px;overflow:hidden;}
.label-inner{max-width:1100px;margin:0 auto;}
.label-header{text-align:center;margin-bottom:60px;}
.label-header .label{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:3px;color:#c97bff;margin-bottom:10px;}
.label-header h2{font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:800;margin-bottom:14px;line-height:1.15;}
.label-header h2 span{background:linear-gradient(135deg,#7b2ff7,#ff6fd8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.label-header>p{color:rgba(255,255,255,0.42);max-width:600px;margin:0 auto;font-size:.92rem;line-height:1.7;}

.label-showcase{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:48px;}
.label-card-big{grid-column:1/-1;border-radius:24px;background:linear-gradient(135deg,rgba(123,47,247,0.06),rgba(255,111,216,0.04));border:1px solid rgba(123,47,247,0.12);padding:44px 40px;display:flex;align-items:center;gap:44px;position:relative;overflow:hidden;transition:all .4s;}
.label-card-big:hover{border-color:rgba(123,47,247,0.25);transform:translateY(-3px);}
.label-card-big::before{content:'';position:absolute;top:-60px;right:-60px;width:250px;height:250px;border-radius:50%;background:radial-gradient(circle,rgba(123,47,247,0.08),transparent 70%);pointer-events:none;}
.label-card-big-visual{flex:0 0 280px;position:relative;}
.label-mockup{width:280px;height:200px;border-radius:16px;background:linear-gradient(135deg,#0d0620,#1a0a3c);border:1px solid rgba(123,47,247,0.15);overflow:hidden;position:relative;box-shadow:0 20px 60px rgba(0,0,0,0.3);}
.label-mockup-bar{height:36px;background:rgba(123,47,247,0.08);border-bottom:1px solid rgba(123,47,247,0.1);display:flex;align-items:center;padding:0 12px;gap:6px;}
.label-mockup-dot{width:8px;height:8px;border-radius:50%;}
.label-mockup-body{padding:12px;}
.label-mockup-row{display:flex;align-items:center;gap:10px;padding:7px 10px;border-radius:8px;margin-bottom:6px;transition:background .3s;}
.label-mockup-row:nth-child(1){background:rgba(123,47,247,0.1);}
.label-mockup-row:hover{background:rgba(123,47,247,0.12);}
.label-mockup-art{width:28px;height:28px;border-radius:6px;flex-shrink:0;}
.label-mockup-info{flex:1;min-width:0;}
.label-mockup-title{font-size:.65rem;font-weight:600;color:rgba(255,255,255,0.8);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.label-mockup-sub{font-size:.55rem;color:rgba(255,255,255,0.3);}
.label-mockup-badge{font-size:.5rem;padding:2px 8px;border-radius:20px;font-weight:700;letter-spacing:.5px;white-space:nowrap;}
.label-card-big-txt{flex:1;}
.label-card-big-txt h3{font-size:1.4rem;font-weight:800;margin-bottom:10px;}
.label-card-big-txt h3 span{color:#c97bff;}
.label-card-big-txt p{font-size:.9rem;color:rgba(255,255,255,0.45);line-height:1.7;margin-bottom:20px;}

.label-card{border-radius:22px;background:rgba(255,255,255,0.025);border:1px solid rgba(255,255,255,0.06);padding:32px 28px;transition:all .35s;position:relative;overflow:hidden;}
.label-card:hover{border-color:rgba(123,47,247,0.2);transform:translateY(-4px);}
.label-card-icon{width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;margin-bottom:18px;transition:.3s;}
.label-card:hover .label-card-icon{transform:scale(1.08);}
.label-card-icon svg{width:26px;height:26px;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;fill:none;}
.label-card h4{font-size:1.05rem;font-weight:700;margin-bottom:8px;}
.label-card p{font-size:.82rem;color:rgba(255,255,255,0.42);line-height:1.65;}

.label-cta{text-align:center;margin-top:48px;}
.label-cta-btn{display:inline-flex;align-items:center;gap:10px;padding:16px 40px;border-radius:60px;background:linear-gradient(135deg,#7b2ff7,#ff6fd8);color:#fff;font-weight:700;font-size:.95rem;border:none;cursor:pointer;font-family:inherit;transition:all .35s;box-shadow:0 8px 30px rgba(123,47,247,0.3);text-decoration:none;}
.label-cta-btn:hover{transform:translateY(-3px);box-shadow:0 14px 40px rgba(123,47,247,0.4);}
.label-cta-btn svg{width:18px;height:18px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.label-cta-sub{font-size:.78rem;color:rgba(255,255,255,0.3);margin-top:14px;}

@media(max-width:768px){
  .label-showcase{grid-template-columns:1fr;}
  .label-card-big{flex-direction:column;padding:32px 24px;gap:28px;text-align:center;}
  .label-card-big-visual{flex:none;}
  .label-mockup{width:100%;max-width:300px;margin:0 auto;}
  .label-card-big-txt h3{font-size:1.2rem;}
}

/* ================================================
   CLASSIFICHE LIVE
   ================================================ */
.charts-sec{position:relative;z-index:1;padding:110px 24px;overflow:hidden;}
.charts-inner{max-width:700px;margin:0 auto;}
.charts-header{text-align:center;margin-bottom:44px;}
.charts-header .label{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:3px;color:#f5a623;margin-bottom:10px;}
.charts-header h2{font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:800;margin-bottom:14px;}
.charts-header p{color:rgba(255,255,255,0.42);font-size:.92rem;line-height:1.7;}
.chart-list{display:flex;flex-direction:column;gap:10px;}
.chart-item{display:flex;align-items:center;gap:16px;padding:16px 20px;border-radius:16px;background:rgba(255,255,255,0.025);border:1px solid rgba(255,255,255,0.05);transition:all .3s;cursor:pointer;}
.chart-item:hover{border-color:rgba(245,166,35,0.2);background:rgba(245,166,35,0.03);transform:translateX(4px);}
.chart-rank{font-size:1.4rem;font-weight:900;min-width:32px;text-align:center;color:rgba(255,255,255,0.15);}
.chart-item:nth-child(1) .chart-rank{color:#f5a623;}
.chart-item:nth-child(2) .chart-rank{color:rgba(192,192,192,0.7);}
.chart-item:nth-child(3) .chart-rank{color:rgba(205,127,50,0.7);}
.chart-art{width:48px;height:48px;border-radius:10px;flex-shrink:0;}
.chart-info{flex:1;min-width:0;}
.chart-title{font-size:.92rem;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.chart-artist{font-size:.75rem;color:rgba(255,255,255,0.35);}
.chart-eq{display:flex;gap:2px;align-items:flex-end;height:20px;}
.chart-eq span{width:3px;border-radius:2px;background:linear-gradient(180deg,#f5a623,#e94560);animation:chartEq .4s ease-in-out infinite alternate;}
.chart-eq span:nth-child(2){animation-delay:.1s;}
.chart-eq span:nth-child(3){animation-delay:.2s;}
.chart-eq span:nth-child(4){animation-delay:.15s;}
@keyframes chartEq{0%{height:4px;}100%{height:18px;}}
.chart-streams{font-size:.72rem;color:rgba(255,255,255,0.3);min-width:60px;text-align:right;}

/* ================================================
   EVENTS & CONCERTS
   ================================================ */
.events-sec{position:relative;z-index:1;padding:110px 24px;text-align:center;}
.events-sec h2{font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:800;margin-bottom:14px;}
.events-sub{color:rgba(255,255,255,0.42);max-width:520px;margin:0 auto 44px;font-size:.92rem;line-height:1.7;}
.events-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;max-width:1100px;margin:0 auto;}
.event-card{border-radius:22px;overflow:hidden;background:rgba(255,255,255,0.025);border:1px solid rgba(255,255,255,0.06);text-align:left;transition:all .35s;position:relative;}
.event-card:hover{border-color:rgba(0,212,255,0.2);transform:translateY(-4px);}
.event-card-top{height:140px;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;}
.event-card-top img{width:100%;height:100%;object-fit:cover;transition:transform .5s;}
.event-card:hover .event-card-top img{transform:scale(1.06);}
.event-date-badge{position:absolute;top:12px;left:12px;background:rgba(0,0,0,0.7);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,0.08);border-radius:12px;padding:8px 12px;text-align:center;line-height:1;}
.event-date-day{font-size:1.3rem;font-weight:900;color:#fff;display:block;}
.event-date-month{font-size:.6rem;text-transform:uppercase;letter-spacing:1px;color:rgba(255,255,255,0.5);font-weight:600;}
.event-card-body{padding:18px 20px;}
.event-card-body h3{font-size:1rem;font-weight:700;margin-bottom:6px;}
.event-card-meta{display:flex;align-items:center;gap:6px;font-size:.75rem;color:rgba(255,255,255,0.35);margin-bottom:12px;}
.event-card-artists{display:flex;gap:-6px;}
.event-card-avatar{width:28px;height:28px;border-radius:50%;border:2px solid rgba(0,0,0,0.3);margin-left:-8px;display:flex;align-items:center;justify-content:center;font-size:.7rem;}
.event-card-avatar:first-child{margin-left:0;}
@media(max-width:1024px){.events-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:640px){.events-grid{grid-template-columns:1fr;}}

/* ================================================
   COMMUNITY
   ================================================ */
.community-sec{position:relative;z-index:1;padding:110px 24px;}
.community-inner{max-width:1000px;margin:0 auto;}
.community-header{text-align:center;margin-bottom:48px;}
.community-header .label{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:3px;color:#ff6fd8;margin-bottom:10px;}
.community-header h2{font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:800;margin-bottom:14px;}
.community-header p{color:rgba(255,255,255,0.42);max-width:540px;margin:0 auto;font-size:.92rem;line-height:1.7;}
.community-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.community-card{border-radius:22px;background:rgba(255,255,255,0.025);border:1px solid rgba(255,255,255,0.06);padding:28px 24px;transition:all .35s;}
.community-card:hover{border-color:rgba(255,111,216,0.2);transform:translateY(-3px);}
.community-card-head{display:flex;align-items:center;gap:12px;margin-bottom:14px;}
.community-avatar{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0;border:2px solid rgba(255,255,255,0.06);}
.community-user{font-size:.85rem;font-weight:700;}
.community-time{font-size:.68rem;color:rgba(255,255,255,0.25);}
.community-card p{font-size:.85rem;color:rgba(255,255,255,0.5);line-height:1.65;margin-bottom:14px;}
.community-actions{display:flex;gap:16px;}
.community-action{display:flex;align-items:center;gap:5px;font-size:.72rem;color:rgba(255,255,255,0.3);cursor:pointer;transition:.3s;}
.community-action:hover{color:#ff6fd8;}
@media(max-width:640px){.community-grid{grid-template-columns:1fr;}}

/* ================================================
   PODCASTER
   ================================================ */
.podcast-sec{position:relative;z-index:1;padding:110px 24px;}
.podcast-inner{max-width:1100px;margin:0 auto;}
.podcast-header{text-align:center;margin-bottom:48px;}
.podcast-header .label{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:3px;color:#38ef7d;margin-bottom:10px;}
.podcast-header h2{font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:800;margin-bottom:14px;}
.podcast-header h2 span{background:linear-gradient(135deg,#00b894,#38ef7d);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.podcast-header>p{color:rgba(255,255,255,0.42);max-width:580px;margin:0 auto;font-size:.92rem;line-height:1.7;}
.podcast-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.podcast-card{border-radius:20px;background:rgba(255,255,255,0.025);border:1px solid rgba(255,255,255,0.06);padding:28px 24px;transition:all .35s;}
.podcast-card:hover{border-color:rgba(0,184,148,0.2);transform:translateY(-4px);}
.podcast-card-icon{width:48px;height:48px;border-radius:14px;display:flex;align-items:center;justify-content:center;margin-bottom:16px;font-size:1.3rem;}
.podcast-card h4{font-size:1rem;font-weight:700;margin-bottom:8px;}
.podcast-card p{font-size:.82rem;color:rgba(255,255,255,0.42);line-height:1.65;}
@media(max-width:1024px){.podcast-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:640px){.podcast-grid{grid-template-columns:1fr;}}

/* ================================================
   ROADMAP
   ================================================ */
.roadmap-sec{position:relative;z-index:1;padding:110px 24px;text-align:center;}
.roadmap-sec h2{font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:800;margin-bottom:14px;}
.roadmap-sub{color:rgba(255,255,255,0.42);max-width:520px;margin:0 auto 48px;font-size:.92rem;line-height:1.7;}
.roadmap-timeline{max-width:700px;margin:0 auto;position:relative;padding-left:50px;}
.roadmap-timeline::before{content:'';position:absolute;left:8px;top:0;bottom:0;width:2px;background:linear-gradient(180deg,#00d4ff,#7b2ff7,#ff6fd8,rgba(255,255,255,0.05));border-radius:2px;}
.roadmap-item{position:relative;margin-bottom:40px;text-align:left;}
.roadmap-dot{position:absolute;left:-48px;top:4px;width:14px;height:14px;border-radius:50%;border:2.5px solid;background:#06080f;box-sizing:border-box;}
.roadmap-item:nth-child(1) .roadmap-dot{border-color:#00d4ff;box-shadow:0 0 10px rgba(0,212,255,0.4);}
.roadmap-item:nth-child(2) .roadmap-dot{border-color:#7b2ff7;box-shadow:0 0 10px rgba(123,47,247,0.4);}
.roadmap-item:nth-child(3) .roadmap-dot{border-color:#ff6fd8;box-shadow:0 0 10px rgba(255,111,216,0.4);}
.roadmap-item:nth-child(4) .roadmap-dot{border-color:#f5a623;box-shadow:0 0 10px rgba(245,166,35,0.4);}
.roadmap-item:nth-child(5) .roadmap-dot{border-color:#38ef7d;box-shadow:0 0 10px rgba(56,239,125,0.4);}
.roadmap-date{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:2px;margin-bottom:6px;}
.roadmap-item:nth-child(1) .roadmap-date{color:#00d4ff;}
.roadmap-item:nth-child(2) .roadmap-date{color:#7b2ff7;}
.roadmap-item:nth-child(3) .roadmap-date{color:#ff6fd8;}
.roadmap-item:nth-child(4) .roadmap-date{color:#f5a623;}
.roadmap-item:nth-child(5) .roadmap-date{color:#38ef7d;}
.roadmap-item h4{font-size:1.05rem;font-weight:700;margin-bottom:6px;}
.roadmap-item p{font-size:.82rem;color:rgba(255,255,255,0.42);line-height:1.6;}
.roadmap-badge{display:inline-block;padding:3px 10px;border-radius:20px;font-size:.6rem;font-weight:700;letter-spacing:.5px;margin-left:8px;vertical-align:middle;}

/* ================================================
   API INTEGRATION
   ================================================ */
.api-sec{position:relative;z-index:1;padding:110px 24px;}
.api-inner{max-width:1000px;margin:0 auto;display:flex;gap:48px;align-items:center;}
.api-txt{flex:1;}
.api-txt .label{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:3px;color:#00d4ff;margin-bottom:10px;}
.api-txt h2{font-size:clamp(1.8rem,3.5vw,2.4rem);font-weight:800;margin-bottom:14px;line-height:1.15;}
.api-txt>p{font-size:.92rem;color:rgba(255,255,255,0.45);line-height:1.7;margin-bottom:24px;}
.api-features{display:flex;flex-direction:column;gap:10px;margin-bottom:24px;}
.api-feat{display:flex;align-items:center;gap:10px;font-size:.84rem;color:rgba(255,255,255,0.6);}
.api-feat-dot{width:6px;height:6px;border-radius:50%;background:#00d4ff;flex-shrink:0;}
.api-code{flex:1;max-width:460px;border-radius:18px;background:#0a0e1a;border:1px solid rgba(0,212,255,0.1);overflow:hidden;}
.api-code-bar{padding:10px 16px;background:rgba(0,212,255,0.04);border-bottom:1px solid rgba(0,212,255,0.06);display:flex;align-items:center;gap:8px;}
.api-code-bar span{font-size:.7rem;color:rgba(255,255,255,0.3);font-family:monospace;}
.api-code-dot{width:8px;height:8px;border-radius:50%;}
.api-code-body{padding:18px 20px;font-family:'Courier New',monospace;font-size:.75rem;line-height:1.8;color:rgba(255,255,255,0.55);overflow-x:auto;}
.api-code-body .ck{color:#00d4ff;}
.api-code-body .cs{color:#38ef7d;}
.api-code-body .cv{color:#f5a623;}
.api-code-body .cc{color:rgba(255,255,255,0.2);}
@media(max-width:768px){.api-inner{flex-direction:column;}.api-code{max-width:100%;}}

/* ================================================
   AFFILIATE PROGRAM
   ================================================ */
.affiliate-sec{position:relative;z-index:1;padding:110px 24px;text-align:center;overflow:hidden;}
.affiliate-card{max-width:900px;margin:0 auto;border-radius:28px;background:linear-gradient(135deg,rgba(0,212,255,0.05),rgba(123,47,247,0.05),rgba(255,111,216,0.03));border:1px solid rgba(255,255,255,0.06);padding:56px 48px;position:relative;overflow:hidden;}
.affiliate-card::before{content:'';position:absolute;top:-100px;right:-100px;width:350px;height:350px;border-radius:50%;background:radial-gradient(circle,rgba(0,212,255,0.06),transparent 70%);pointer-events:none;}
.affiliate-card::after{content:'';position:absolute;bottom:-80px;left:-80px;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(255,111,216,0.05),transparent 70%);pointer-events:none;}
.affiliate-card .label{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:3px;color:#ff6fd8;margin-bottom:10px;position:relative;z-index:2;}
.affiliate-card h2{font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:800;margin-bottom:14px;position:relative;z-index:2;}
.affiliate-card>p{color:rgba(255,255,255,0.45);max-width:560px;margin:0 auto 36px;font-size:.92rem;line-height:1.7;position:relative;z-index:2;}
.affiliate-steps{display:flex;gap:24px;justify-content:center;margin-bottom:36px;position:relative;z-index:2;flex-wrap:wrap;}
.affiliate-step{flex:1;min-width:180px;max-width:240px;padding:24px 20px;border-radius:18px;background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.05);text-align:center;}
.affiliate-step-num{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#00d4ff,#7b2ff7);display:flex;align-items:center;justify-content:center;font-size:.9rem;font-weight:800;color:#fff;margin:0 auto 12px;}
.affiliate-step h4{font-size:.92rem;font-weight:700;margin-bottom:6px;}
.affiliate-step p{font-size:.75rem;color:rgba(255,255,255,0.4);line-height:1.5;}
.affiliate-reward{display:inline-flex;align-items:center;gap:8px;padding:10px 28px;border-radius:60px;background:rgba(255,111,216,0.1);border:1px solid rgba(255,111,216,0.2);font-size:1.1rem;font-weight:800;color:#ff6fd8;position:relative;z-index:2;margin-bottom:24px;}
.affiliate-cta{position:relative;z-index:2;}
.affiliate-cta a{display:inline-flex;align-items:center;gap:10px;padding:14px 36px;border-radius:60px;background:linear-gradient(135deg,#ff6fd8,#7b2ff7);color:#fff;font-weight:700;font-size:.92rem;text-decoration:none;transition:all .35s;box-shadow:0 8px 30px rgba(255,111,216,0.25);}
.affiliate-cta a:hover{transform:translateY(-3px);box-shadow:0 14px 40px rgba(255,111,216,0.35);}
@media(max-width:640px){.affiliate-card{padding:36px 20px;}.affiliate-steps{flex-direction:column;align-items:center;}}

/* ================================================
   CHI SIAMO
   ================================================ */
.about-sec{position:relative;z-index:1;padding:110px 24px;overflow:hidden;}
.about-inner{max-width:1100px;margin:0 auto;}
.about-hero{display:flex;align-items:center;gap:56px;margin-bottom:64px;}
.about-hero-txt{flex:1;}
.about-hero-txt .label{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:3px;color:#00d4ff;margin-bottom:12px;}
.about-hero-txt h2{font-size:clamp(2rem,4vw,3rem);font-weight:900;line-height:1.1;margin-bottom:18px;}
.about-hero-txt h2 span{background:linear-gradient(135deg,#00d4ff,#7b2ff7,#ff6fd8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.about-hero-txt>p{font-size:1rem;color:rgba(255,255,255,0.5);line-height:1.8;margin-bottom:20px;}
.about-hero-txt .about-mission{font-size:.88rem;color:rgba(255,255,255,0.4);line-height:1.7;padding:18px 22px;border-left:3px solid rgba(0,212,255,0.3);border-radius:0 12px 12px 0;background:rgba(0,212,255,0.03);font-style:italic;}
.about-hero-visual{flex:0 0 340px;position:relative;}
.about-logo-big{width:200px;height:200px;margin:0 auto;border-radius:50%;background:linear-gradient(135deg,rgba(0,212,255,0.08),rgba(123,47,247,0.08));border:1px solid rgba(0,212,255,0.12);display:flex;align-items:center;justify-content:center;position:relative;}
.about-logo-big svg{width:90px;height:90px;}
.about-logo-ring{position:absolute;inset:-20px;border-radius:50%;border:1px dashed rgba(0,212,255,0.1);animation:aboutRing 20s linear infinite;}
.about-logo-ring:nth-child(2){inset:-44px;border-color:rgba(123,47,247,0.08);animation-duration:30s;animation-direction:reverse;}
@keyframes aboutRing{0%{transform:rotate(0deg);}100%{transform:rotate(360deg);}}
.about-values{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:56px;}
.about-value{padding:28px 24px;border-radius:20px;background:rgba(255,255,255,0.025);border:1px solid rgba(255,255,255,0.06);transition:all .35s;text-align:center;}
.about-value:hover{border-color:rgba(0,212,255,0.15);transform:translateY(-3px);}
.about-value-icon{font-size:1.8rem;margin-bottom:12px;}
.about-value h4{font-size:1rem;font-weight:700;margin-bottom:8px;}
.about-value p{font-size:.8rem;color:rgba(255,255,255,0.4);line-height:1.6;}
.about-features{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.about-feat{display:flex;align-items:flex-start;gap:14px;padding:22px 20px;border-radius:16px;background:rgba(255,255,255,0.02);border:1px solid rgba(255,255,255,0.04);transition:all .3s;}
.about-feat:hover{border-color:rgba(0,212,255,0.1);}
.about-feat-icon{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:1.1rem;flex-shrink:0;}
.about-feat h4{font-size:.9rem;font-weight:700;margin-bottom:4px;}
.about-feat p{font-size:.78rem;color:rgba(255,255,255,0.4);line-height:1.55;}
@media(max-width:768px){
  .about-hero{flex-direction:column;text-align:center;}
  .about-hero-visual{flex:none;}
  .about-hero-txt .about-mission{text-align:left;}
  .about-values{grid-template-columns:1fr;}
  .about-features{grid-template-columns:1fr;}
}

/* ================================================
   RADIO HARMONYDROP
   ================================================ */
.radio-sec{position:relative;z-index:1;padding:80px 24px;overflow:hidden;}
.radio-card{max-width:1000px;margin:0 auto;border-radius:28px;background:linear-gradient(135deg,rgba(244,63,94,0.05),rgba(234,179,8,0.04));border:1px solid rgba(244,63,94,0.1);display:flex;align-items:center;gap:44px;padding:48px 44px;position:relative;overflow:hidden;}
.radio-card::before{content:'';position:absolute;top:-60px;right:-60px;width:250px;height:250px;border-radius:50%;background:radial-gradient(circle,rgba(244,63,94,0.08),transparent 70%);pointer-events:none;}
.radio-visual{flex:0 0 200px;text-align:center;}
.radio-eq{display:flex;gap:4px;align-items:flex-end;justify-content:center;height:80px;margin-bottom:12px;}
.radio-eq span{width:6px;border-radius:3px;background:linear-gradient(180deg,#f43f5e,#f59e0b);animation:radioEq .5s ease-in-out infinite alternate;}
.radio-eq span:nth-child(2){animation-delay:.08s;}
.radio-eq span:nth-child(3){animation-delay:.16s;}
.radio-eq span:nth-child(4){animation-delay:.12s;}
.radio-eq span:nth-child(5){animation-delay:.2s;}
.radio-eq span:nth-child(6){animation-delay:.06s;}
.radio-eq span:nth-child(7){animation-delay:.18s;}
@keyframes radioEq{0%{height:10px;}100%{height:65px;}}
.radio-live-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 16px;border-radius:50px;background:rgba(244,63,94,0.15);color:#f43f5e;font-size:.72rem;font-weight:700;letter-spacing:1px;}
.radio-live-dot{width:8px;height:8px;border-radius:50%;background:#f43f5e;animation:radioPulse 1.5s ease-in-out infinite;}
@keyframes radioPulse{0%,100%{opacity:1;transform:scale(1);}50%{opacity:.5;transform:scale(1.3);}}
.radio-txt{flex:1;}
.radio-txt .label{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:3px;color:#f43f5e;margin-bottom:10px;}
.radio-txt h3{font-size:clamp(1.4rem,2.5vw,1.8rem);font-weight:800;margin-bottom:12px;line-height:1.2;}
.radio-txt p{font-size:.88rem;color:rgba(255,255,255,0.45);line-height:1.7;margin-bottom:18px;}
.radio-schedule{display:flex;align-items:center;gap:12px;padding:12px 18px;border-radius:12px;background:rgba(244,63,94,0.06);border:1px solid rgba(244,63,94,0.1);font-size:.82rem;color:rgba(255,255,255,0.6);margin-bottom:16px;}
.radio-schedule strong{color:#f5a623;}
.radio-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 28px;border-radius:50px;background:linear-gradient(135deg,#f43f5e,#f59e0b);color:#fff;font-weight:700;font-size:.88rem;text-decoration:none;transition:all .3s;box-shadow:0 6px 24px rgba(244,63,94,0.25);}
.radio-btn:hover{transform:translateY(-2px);box-shadow:0 10px 32px rgba(244,63,94,0.35);}
@media(max-width:768px){.radio-card{flex-direction:column;text-align:center;padding:36px 24px;}.radio-visual{flex:none;}.radio-schedule{justify-content:center;}}

/* ================================================
   SPONSORS SWITCH
   ================================================ */
.sponsors-sec{position:relative;z-index:1;padding:90px 24px;text-align:center;}
.sponsors-sec h2{font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:800;margin-bottom:10px;}
.sponsors-sub{color:rgba(255,255,255,0.42);max-width:540px;margin:0 auto 14px;font-size:.92rem;line-height:1.7;}
.sponsors-contact{font-size:.8rem;color:rgba(255,255,255,0.3);margin-bottom:36px;}
.sponsors-contact a{color:#00d4ff;text-decoration:none;font-weight:600;transition:.3s;}
.sponsors-contact a:hover{color:#fff;}
.sponsors-tabs{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-bottom:32px;}
.sponsor-tab{display:inline-flex;align-items:center;gap:7px;padding:10px 22px;border-radius:60px;border:1px solid rgba(255,255,255,0.08);background:rgba(255,255,255,0.03);color:rgba(255,255,255,0.5);font-size:.85rem;font-weight:600;cursor:pointer;transition:all .35s;font-family:inherit;}
.sponsor-tab:hover{border-color:rgba(255,255,255,0.15);color:rgba(255,255,255,0.8);background:rgba(255,255,255,0.05);}
.sponsor-tab.active{border-color:rgba(0,212,255,0.4);background:rgba(0,212,255,0.1);color:#00d4ff;box-shadow:0 0 18px rgba(0,212,255,0.1);}
.sponsors-panels{position:relative;max-width:900px;margin:0 auto;min-height:200px;}
.sponsor-panel{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .4s,visibility .4s;pointer-events:none;}
.sponsor-panel.active{position:relative;opacity:1;visibility:visible;pointer-events:all;}
.sponsor-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.sponsor-card{padding:24px 20px;border-radius:18px;background:rgba(255,255,255,0.025);border:1px solid rgba(255,255,255,0.06);display:flex;flex-direction:column;align-items:center;gap:8px;transition:all .35s;cursor:pointer;text-align:center;}
.sponsor-card:hover{border-color:rgba(0,212,255,0.2);transform:translateY(-3px);background:rgba(0,212,255,0.03);}
.sponsor-avatar{width:60px;height:60px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.5rem;border:2px solid rgba(255,255,255,0.06);}
.sponsor-name{font-size:.88rem;font-weight:700;}
.sponsor-role{font-size:.66rem;color:rgba(255,255,255,0.3);text-transform:uppercase;letter-spacing:.5px;font-weight:600;}
.sponsor-desc{font-size:.75rem;color:rgba(255,255,255,0.38);line-height:1.5;margin:2px 0 6px;}
.sponsor-socials{display:flex;gap:6px;justify-content:center;flex-wrap:wrap;}
.sponsor-soc{width:30px;height:30px;border-radius:50%;border:1px solid rgba(255,255,255,0.06);display:flex;align-items:center;justify-content:center;text-decoration:none;transition:all .3s;padding:6px;}
.sponsor-soc:hover{border-color:rgba(0,212,255,0.3);background:rgba(0,212,255,0.06);transform:scale(1.1);}
.sponsor-soc img{width:16px;height:16px;object-fit:contain;filter:brightness(0) invert(0.7);transition:filter .3s;}
.sponsor-soc:hover img{filter:brightness(0) invert(1);}
.sponsor-empty{grid-column:1/-1;padding:40px;color:rgba(255,255,255,0.25);font-size:.88rem;font-style:italic;}
@media(max-width:768px){.sponsor-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:480px){.sponsor-grid{grid-template-columns:1fr;}}

/* ================================================
   INIZIAMO / GET STARTED
   ================================================ */
.getstarted-sec{position:relative;z-index:1;padding:60px 40px 110px;text-align:center;}
.getstarted-card{max-width:1360px;margin:0 auto;border-radius:32px;background:linear-gradient(135deg,rgba(0,212,255,0.05),rgba(123,47,247,0.05),rgba(255,111,216,0.04));border:1px solid rgba(0,212,255,0.12);padding:72px 80px;position:relative;overflow:hidden;}
.getstarted-glow{position:absolute;top:-120px;left:50%;transform:translateX(-50%);width:700px;height:280px;border-radius:50%;background:radial-gradient(ellipse,rgba(0,212,255,0.09),transparent 70%);pointer-events:none;}
.getstarted-icon{font-size:3rem;margin-bottom:18px;filter:drop-shadow(0 0 20px rgba(0,212,255,0.3));}
.getstarted-card h2{font-size:clamp(2rem,4vw,3.2rem);font-weight:900;margin-bottom:14px;background:linear-gradient(135deg,#00d4ff,#7b2ff7,#ff6fd8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.getstarted-card>p{font-size:1rem;color:rgba(255,255,255,0.5);line-height:1.8;max-width:680px;margin:0 auto 40px;}
.getstarted-btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-bottom:56px;}
.getstarted-btn{display:inline-flex;align-items:center;gap:8px;padding:14px 32px;border-radius:60px;font-weight:700;font-size:.92rem;text-decoration:none;transition:all .35s;}
.getstarted-primary{background:linear-gradient(135deg,#00d4ff,#7b2ff7);color:#fff;box-shadow:0 8px 30px rgba(0,212,255,0.25);}
.getstarted-primary:hover{transform:translateY(-3px);box-shadow:0 14px 40px rgba(0,212,255,0.35);}
.getstarted-secondary{background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.1);color:rgba(255,255,255,0.8);}
.getstarted-secondary:hover{border-color:rgba(0,212,255,0.3);color:#00d4ff;transform:translateY(-3px);}
.getstarted-perks{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;border-top:1px solid rgba(255,255,255,0.06);padding-top:48px;}
.getstarted-perk{display:flex;flex-direction:column;align-items:center;gap:10px;padding:24px 16px;border-radius:20px;background:rgba(255,255,255,0.025);border:1px solid rgba(255,255,255,0.05);transition:.3s;}
.getstarted-perk:hover{border-color:rgba(0,212,255,0.2);background:rgba(0,212,255,0.03);transform:translateY(-4px);}
.getstarted-perk-icon{width:48px;height:48px;border-radius:14px;display:flex;align-items:center;justify-content:center;}
.getstarted-perk h4{font-size:.88rem;font-weight:800;color:#fff;text-align:center;}
.getstarted-perk p{font-size:.72rem;color:rgba(255,255,255,0.35);line-height:1.6;text-align:center;}
@media(max-width:900px){.getstarted-perks{grid-template-columns:repeat(2,1fr);}.getstarted-card{padding:48px 36px;}}
@media(max-width:640px){.getstarted-card{padding:40px 20px;}.getstarted-perks{grid-template-columns:1fr 1fr;gap:12px;}.getstarted-sec{padding:60px 16px 80px;}}

/* ── UNDERWATER FOG ── */
.uw-fog{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;}
.uw-fog-layer{position:absolute;width:200%;height:100%;top:0;left:-50%;opacity:0;animation-timing-function:ease-in-out;animation-iteration-count:infinite;animation-fill-mode:both;}
.uw-fog-1{background:radial-gradient(ellipse 80% 50% at 25% 55%,rgba(8,80,140,0.1),transparent 65%),radial-gradient(ellipse 60% 40% at 75% 35%,rgba(5,60,120,0.08),transparent 60%),radial-gradient(ellipse 40% 30% at 50% 80%,rgba(0,100,160,0.06),transparent 55%);animation:uwFog1 22s infinite;opacity:0.7;}
.uw-fog-2{background:radial-gradient(ellipse 70% 45% at 60% 45%,rgba(10,50,100,0.09),transparent 60%),radial-gradient(ellipse 50% 35% at 20% 65%,rgba(0,80,140,0.07),transparent 55%),radial-gradient(ellipse 55% 40% at 80% 70%,rgba(5,70,130,0.06),transparent 60%);animation:uwFog2 28s infinite;opacity:0.6;}
.uw-fog-3{background:radial-gradient(ellipse 90% 35% at 40% 75%,rgba(5,60,110,0.07),transparent 55%),radial-gradient(ellipse 60% 25% at 70% 30%,rgba(0,90,150,0.05),transparent 50%);animation:uwFog3 35s infinite;opacity:0.5;}
.uw-fog-4{position:absolute;width:200%;height:100%;top:0;left:-50%;background:radial-gradient(ellipse 100% 40% at 50% 90%,rgba(0,40,80,0.12),transparent 60%);animation:uwFog4 40s ease-in-out infinite;opacity:0.4;}
@keyframes uwFog1{0%{transform:translateX(0) translateY(0);}25%{transform:translateX(5%) translateY(-2%);}50%{transform:translateX(-3%) translateY(3%);opacity:0.8;}75%{transform:translateX(4%) translateY(-1%);}100%{transform:translateX(0) translateY(0);}}
@keyframes uwFog2{0%{transform:translateX(0) translateY(0);}30%{transform:translateX(-4%) translateY(2%);}60%{transform:translateX(3%) translateY(-3%);opacity:0.7;}100%{transform:translateX(0) translateY(0);}}
@keyframes uwFog3{0%{transform:translateX(0);}50%{transform:translateX(6%) translateY(-2%);opacity:0.6;}100%{transform:translateX(0);}}
@keyframes uwFog4{0%{transform:translateX(0) translateY(0);opacity:0.4;}50%{transform:translateX(-3%) translateY(1%);opacity:0.55;}100%{transform:translateX(0) translateY(0);opacity:0.4;}}

/* ── KELP / ALGAE ── */
.uw-kelp-container{position:fixed;bottom:0;left:0;right:0;height:45vh;z-index:0;pointer-events:none;overflow:hidden;}
.uw-kelp{position:absolute;bottom:-10px;transform-origin:bottom center;}
.uw-kelp svg{display:block;}

.kelp-1{left:1%;animation:kelpSway1 6s ease-in-out infinite;}
.kelp-2{left:4%;animation:kelpSway2 7s ease-in-out infinite 0.5s;}
.kelp-3{right:2%;animation:kelpSway1 5.5s ease-in-out infinite 1s;}
.kelp-4{right:5%;animation:kelpSway2 6.5s ease-in-out infinite 0.3s;}
.kelp-5{left:7%;animation:kelpSway1 7.5s ease-in-out infinite 1.5s;}
.kelp-6{right:8%;animation:kelpSway2 6s ease-in-out infinite 0.8s;}

@keyframes kelpSway1{0%,100%{transform:rotate(-3deg);}30%{transform:rotate(4deg);}60%{transform:rotate(-2deg);}80%{transform:rotate(3deg);}}
@keyframes kelpSway2{0%,100%{transform:rotate(3deg);}25%{transform:rotate(-4deg);}55%{transform:rotate(2deg);}75%{transform:rotate(-3deg);}}


/* ================================================
   FORUM COMMUNITY
   ================================================ */
.forum-sec{position:relative;z-index:1;padding:110px 48px;overflow:hidden;}
.forum-sec::before{content:'';position:absolute;top:10%;left:-5%;width:400px;height:400px;border-radius:50%;background:rgba(0,212,255,0.06);filter:blur(120px);pointer-events:none;}
.forum-sec::after{content:'';position:absolute;bottom:10%;right:-5%;width:350px;height:350px;border-radius:50%;background:rgba(123,47,247,0.07);filter:blur(100px);pointer-events:none;}
.forum-inner{max-width:1200px;margin:0 auto;position:relative;z-index:2;}
.forum-header{text-align:center;margin-bottom:56px;}
.forum-header .label{font-size:.68rem;font-weight:700;letter-spacing:4px;text-transform:uppercase;color:var(--cyan);margin-bottom:12px;}
.forum-header h2{font-size:clamp(1.8rem,3.5vw,2.8rem);font-weight:800;margin-bottom:14px;line-height:1.15;}
.forum-header h2 span{background:linear-gradient(135deg,#00d4ff,#7b2ff7,#ff6fd8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.forum-header p{font-size:.92rem;color:var(--text2);max-width:560px;margin:0 auto;line-height:1.7;}

/* ── Stats bar ── */
.forum-stats{display:flex;background:var(--surface);border:1px solid var(--border);border-radius:20px;overflow:hidden;margin-bottom:40px;}
.forum-stat{flex:1;padding:22px 20px;text-align:center;border-right:1px solid var(--border);transition:.3s;}
.forum-stat:last-child{border-right:none;}
.forum-stat:hover{background:rgba(0,212,255,0.04);}
.forum-stat-num{display:block;font-size:1.6rem;font-weight:900;background:linear-gradient(135deg,#00d4ff,#7b2ff7);-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:4px;letter-spacing:-.02em;}
.forum-stat-lbl{font-size:.65rem;color:var(--text2);text-transform:uppercase;letter-spacing:1.5px;font-weight:500;}

/* ── Layout ── */
.forum-layout{display:grid;grid-template-columns:260px 1fr;gap:20px;align-items:start;}

/* ── Categories sidebar ── */
.forum-categories{background:var(--surface);border:1px solid var(--border);border-radius:20px;overflow:hidden;}
.forum-cat-header{padding:16px 18px;border-bottom:1px solid var(--border);}
.forum-cat-header h4{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:2px;color:var(--text2);margin:0;}
.forum-cat-item{display:flex;align-items:center;gap:12px;padding:12px 18px;cursor:pointer;transition:.3s;border-bottom:1px solid var(--border);text-decoration:none;color:inherit;}
.forum-cat-item:last-child{border-bottom:none;}
.forum-cat-item:hover{background:rgba(0,212,255,0.04);}
.forum-cat-item.active{background:rgba(0,212,255,0.06);}
.forum-cat-item.active .forum-cat-name{color:var(--cyan);}
.forum-cat-item.active .forum-cat-icon{box-shadow:0 0 14px rgba(0,212,255,0.2);}
.forum-cat-icon{width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:.95rem;flex-shrink:0;transition:.3s;}
.forum-cat-info{flex:1;min-width:0;}
.forum-cat-name{font-size:.82rem;font-weight:600;color:#fff;margin-bottom:1px;line-height:1.3;}
.forum-cat-count{font-size:.65rem;color:var(--text2);}
.forum-cat-badge{font-size:.55rem;padding:2px 8px;border-radius:20px;background:rgba(0,212,255,0.12);color:var(--cyan);font-weight:700;letter-spacing:.5px;flex-shrink:0;}

/* ── Active users widget ── */
.forum-active{background:var(--surface);border:1px solid var(--border);border-radius:20px;padding:20px;margin-top:16px;}
.forum-active-title{font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:2px;color:var(--text2);margin-bottom:14px;}
.forum-active-list{display:flex;flex-direction:column;gap:8px;}
.forum-active-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:12px;cursor:pointer;transition:.3s;}
.forum-active-item:hover{background:rgba(255,255,255,0.04);}
.forum-active-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0;}
.forum-active-dot.online{background:#38ef7d;box-shadow:0 0 7px rgba(56,239,125,0.6);}
.forum-active-dot.recent{background:#ffaa00;}
.forum-active-item-text{flex:1;min-width:0;}
.forum-active-item-name{font-size:.78rem;font-weight:600;color:rgba(255,255,255,0.7);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.forum-active-item-info{font-size:.65rem;color:var(--text2);}
.forum-active-count{font-size:.68rem;color:var(--cyan);font-weight:600;white-space:nowrap;}

/* ── Main thread area ── */
.forum-main{}
.forum-toolbar{display:flex;align-items:center;gap:10px;margin-bottom:16px;flex-wrap:wrap;}
.forum-search{flex:1;min-width:180px;position:relative;}
.forum-search input{width:100%;padding:10px 16px 10px 40px;background:var(--surface);border:1px solid var(--border);border-radius:50px;color:#fff;font-size:.82rem;font-family:'Inter',sans-serif;outline:none;transition:.3s;}
.forum-search input:focus{border-color:rgba(0,212,255,0.35);background:rgba(0,212,255,0.04);}
.forum-search input::placeholder{color:var(--text2);}
.forum-search-icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--text2);pointer-events:none;}
.forum-sort{display:flex;gap:4px;background:var(--surface);border:1px solid var(--border);border-radius:50px;padding:4px;}
.forum-sort-btn{padding:6px 14px;border-radius:50px;border:none;background:none;color:var(--text2);font-size:.75rem;font-weight:500;cursor:pointer;transition:.3s;font-family:'Inter',sans-serif;white-space:nowrap;}
.forum-sort-btn.active{background:rgba(0,212,255,0.1);color:var(--cyan);}
.forum-sort-btn:hover{color:#fff;}
.forum-new-btn{padding:9px 20px;border:none;border-radius:50px;background:linear-gradient(135deg,#00d4ff,#7b2ff7);color:#fff;font-size:.8rem;font-weight:700;cursor:pointer;font-family:'Inter',sans-serif;transition:.3s;white-space:nowrap;box-shadow:0 4px 16px rgba(0,212,255,0.2);}
.forum-new-btn:hover{transform:translateY(-1px);box-shadow:0 6px 22px rgba(0,212,255,0.32);}

/* ── Thread list ── */
.forum-threads{display:flex;flex-direction:column;gap:8px;}
.forum-thread{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:18px 20px;display:flex;align-items:flex-start;gap:14px;cursor:pointer;transition:all .25s;text-decoration:none;color:inherit;}
.forum-thread:hover{border-color:rgba(0,212,255,0.18);background:rgba(0,212,255,0.03);transform:translateX(3px);}
.forum-thread.pinned{border-color:rgba(255,111,216,0.12);background:rgba(255,111,216,0.02);}
.forum-thread.hot{border-color:rgba(255,165,0,0.1);}
.forum-thread-featured{background:linear-gradient(135deg,rgba(0,212,255,0.03),rgba(123,47,247,0.03));border-color:rgba(0,212,255,0.1) !important;}
.forum-thread-avatar{width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0;border:1px solid var(--border);}
.forum-thread-body{flex:1;min-width:0;}
.forum-thread-meta{display:flex;align-items:center;gap:7px;margin-bottom:6px;flex-wrap:wrap;}
.forum-thread-cat-tag{font-size:.58rem;padding:2px 9px;border-radius:20px;font-weight:700;text-transform:uppercase;letter-spacing:.7px;flex-shrink:0;}
.forum-thread-pin{font-size:.58rem;padding:2px 9px;border-radius:20px;background:rgba(255,111,216,0.1);color:var(--pink);font-weight:700;}
.forum-thread-hot-tag{font-size:.58rem;padding:2px 9px;border-radius:20px;background:rgba(255,165,0,0.1);color:#ffaa00;font-weight:700;}
.forum-thread-title{font-size:.9rem;font-weight:700;color:#fff;margin-bottom:5px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;}
.forum-thread:hover .forum-thread-title{color:var(--cyan);}
.forum-thread-preview{font-size:.76rem;color:var(--text2);line-height:1.5;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;}
.forum-thread-footer{display:flex;align-items:center;gap:14px;margin-top:8px;flex-wrap:wrap;}
.forum-thread-author{font-size:.7rem;color:var(--text2);}
.forum-thread-author strong{color:rgba(255,255,255,0.55);font-weight:600;}
.forum-thread-time{font-size:.68rem;color:rgba(255,255,255,0.2);}
.forum-thread-stats{display:flex;gap:12px;margin-left:auto;}
.forum-thread-stat{display:flex;align-items:center;gap:4px;font-size:.7rem;color:rgba(255,255,255,0.25);}
.forum-thread-stat svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.forum-thread-stat.likes{color:rgba(255,111,216,0.55);}
.forum-thread-stat.replies{color:rgba(0,212,255,0.45);}

/* ── Load more ── */
.forum-load-more{text-align:center;margin-top:16px;}
.forum-load-more-btn{padding:11px 32px;background:var(--surface);border:1px solid var(--border);border-radius:50px;color:var(--text2);font-size:.82rem;font-weight:500;cursor:pointer;transition:.3s;font-family:'Inter',sans-serif;}
.forum-load-more-btn:hover{border-color:rgba(0,212,255,0.25);color:#fff;background:rgba(0,212,255,0.04);}

/* ── CTA join ── */
.forum-cta{background:linear-gradient(135deg,rgba(0,212,255,0.04),rgba(123,47,247,0.04));border:1px solid rgba(0,212,255,0.1);border-radius:20px;padding:32px 28px;margin-top:20px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;}
.forum-cta-txt h3{font-size:1.05rem;font-weight:800;margin-bottom:5px;}
.forum-cta-txt p{font-size:.8rem;color:var(--text2);line-height:1.6;}
.forum-cta-btns{display:flex;gap:10px;flex-shrink:0;}
.forum-cta-primary{padding:11px 26px;border:none;border-radius:50px;background:linear-gradient(135deg,#00d4ff,#7b2ff7);color:#fff;font-size:.82rem;font-weight:700;cursor:pointer;font-family:'Inter',sans-serif;transition:.3s;box-shadow:0 4px 16px rgba(0,212,255,0.2);}
.forum-cta-primary:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,212,255,0.3);}
.forum-cta-ghost{padding:11px 26px;border:1px solid var(--border);border-radius:50px;background:none;color:#fff;font-size:.82rem;font-weight:500;cursor:pointer;font-family:'Inter',sans-serif;transition:.3s;}
.forum-cta-ghost:hover{border-color:rgba(0,212,255,0.3);background:rgba(0,212,255,0.04);}

@media(max-width:960px){.forum-layout{grid-template-columns:1fr;}}
@media(max-width:768px){
  .forum-sec{padding:80px 20px;}
  .forum-stats{flex-wrap:wrap;}
  .forum-stat{min-width:50%;border-bottom:1px solid var(--border);}
  .forum-toolbar{flex-direction:column;align-items:stretch;}
  .forum-cta{flex-direction:column;}
}

/* ═══════════════════════════════════════════════════════════════
   PALINSESTO SECTION
   ═══════════════════════════════════════════════════════════════ */
.palinsesto-sec{position:relative;z-index:1;padding:110px 0 100px;overflow:hidden;}
.palinsesto-sec::before{content:'';position:absolute;inset:0;
  background:
    radial-gradient(ellipse 70% 50% at 10% 20%,rgba(0,212,255,0.07) 0%,transparent 60%),
    radial-gradient(ellipse 60% 45% at 90% 70%,rgba(123,47,247,0.09) 0%,transparent 60%);
  pointer-events:none;}
.pal-inner{max-width:1360px;margin:0 auto;padding:0 40px;}
@media(max-width:768px){.pal-inner{padding:0 16px;}}
.pal-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:40px;gap:24px;flex-wrap:wrap;}
.pal-header-left .label{margin-bottom:10px;}
.pal-title{font-size:clamp(2rem,4vw,3rem);font-weight:900;line-height:1.08;margin-bottom:8px;}
.pal-title span{background:linear-gradient(135deg,#00d4ff,#7b2ff7,#ff6fd8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.pal-sub{font-size:.9rem;color:rgba(255,255,255,0.38);max-width:440px;line-height:1.65;}
.pal-clock-wrap{display:flex;flex-direction:column;align-items:flex-end;gap:4px;flex-shrink:0;}
.pal-clock{font-size:2.6rem;font-weight:900;letter-spacing:-.04em;background:linear-gradient(135deg,#00d4ff,#7b2ff7);-webkit-background-clip:text;-webkit-text-fill-color:transparent;line-height:1;font-variant-numeric:tabular-nums;}
.pal-date{font-size:.78rem;color:rgba(255,255,255,0.4);font-weight:600;text-align:right;letter-spacing:.5px;}
.pal-live-badge{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;background:rgba(255,40,40,0.12);border:1px solid rgba(255,40,40,0.28);border-radius:20px;font-size:.62rem;font-weight:800;color:#ff4040;letter-spacing:1.5px;margin-top:4px;}
.pal-live-dot{width:6px;height:6px;border-radius:50%;background:#ff4040;animation:palDotPulse 1.6s ease-in-out infinite;display:inline-block;}
@keyframes palDotPulse{0%,100%{opacity:1;transform:scale(1);}50%{opacity:.3;transform:scale(.6);}}
.pal-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;gap:16px;flex-wrap:wrap;}
.pal-week-label{font-size:.9rem;font-weight:700;color:rgba(255,255,255,0.7);letter-spacing:.5px;}
.pal-week-btns{display:flex;gap:8px;align-items:center;}
.pal-week-btn{width:38px;height:38px;border-radius:10px;border:1px solid rgba(255,255,255,0.08);background:rgba(255,255,255,0.03);color:rgba(255,255,255,0.55);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.25s;}
.pal-week-btn:hover{background:rgba(0,212,255,0.08);border-color:rgba(0,212,255,0.25);color:#00d4ff;}
.pal-today-btn{padding:8px 18px;border-radius:20px;border:1px solid rgba(0,212,255,0.25);background:rgba(0,212,255,0.07);color:#00d4ff;font-size:.75rem;font-weight:700;cursor:pointer;transition:.25s;font-family:inherit;white-space:nowrap;}
.pal-today-btn:hover{background:rgba(0,212,255,0.14);}
.pal-days{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-bottom:20px;}
.pal-day-tab{padding:10px 6px;border-radius:14px;border:1px solid rgba(255,255,255,0.05);background:rgba(255,255,255,0.02);cursor:pointer;text-align:center;transition:.25s;position:relative;}
.pal-day-tab:hover{background:rgba(255,255,255,0.05);border-color:rgba(255,255,255,0.1);}
.pal-day-tab.active{background:linear-gradient(135deg,rgba(0,212,255,0.1),rgba(123,47,247,0.1));border-color:rgba(0,212,255,0.3);}
.pal-day-tab.today{box-shadow:0 0 0 1px rgba(0,212,255,0.35) inset;}
.pal-day-name{font-size:.62rem;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:rgba(255,255,255,0.3);margin-bottom:4px;}
.pal-day-tab.active .pal-day-name,.pal-day-tab.today .pal-day-name{color:#00d4ff;}
.pal-day-num{font-size:1.25rem;font-weight:800;color:rgba(255,255,255,0.55);}
.pal-day-tab.active .pal-day-num,.pal-day-tab.today .pal-day-num{color:#fff;}
.pal-day-dot{width:5px;height:5px;border-radius:50%;background:#00d4ff;margin:5px auto 0;opacity:0;transition:.2s;}
.pal-day-tab.today .pal-day-dot{opacity:1;}
.pal-grid-wrap{display:flex;gap:0;overflow:hidden;border-radius:22px;border:1px solid rgba(255,255,255,0.06);background:rgba(255,255,255,0.015);}
.pal-time-axis{width:60px;flex-shrink:0;border-right:1px solid rgba(255,255,255,0.05);}
.pal-time-slot{height:88px;display:flex;align-items:flex-start;justify-content:flex-end;padding:8px 10px 0 0;border-bottom:1px solid rgba(255,255,255,0.03);}
.pal-time-slot:last-child{border-bottom:none;}
.pal-time-slot span{font-size:.6rem;font-weight:700;color:rgba(255,255,255,0.18);letter-spacing:.5px;}
.pal-schedule{flex:1;min-width:0;}
.pal-slot{min-height:88px;border-bottom:1px solid rgba(255,255,255,0.04);display:flex;align-items:stretch;padding:8px 12px;}
.pal-slot:last-child{border-bottom:none;}
.pal-card{flex:1;border-radius:14px;padding:12px 14px;cursor:pointer;border:1px solid rgba(255,255,255,0.06);background:rgba(255,255,255,0.025);display:grid;grid-template-columns:52px 1fr;gap:12px;align-items:center;transition:all .3s;position:relative;overflow:hidden;}
.pal-card::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;border-radius:3px 0 0 3px;}
.pal-card:hover{transform:translateY(-2px);border-color:rgba(255,255,255,0.12);box-shadow:0 14px 40px rgba(0,0,0,0.4);}
.pal-card.on-air{border-color:rgba(0,212,255,0.25);background:linear-gradient(135deg,rgba(0,212,255,0.06),rgba(123,47,247,0.04));}
.pal-card.on-air::before{background:linear-gradient(180deg,#00d4ff,#7b2ff7);}
.pal-card.cat-djset::before{background:#7b2ff7;}
.pal-card.cat-podcast::before{background:#38ef7d;}
.pal-card.cat-live::before{background:#ff4040;}
.pal-card.cat-tutorial::before{background:#00d4ff;}
.pal-card.cat-news::before{background:#ffd166;}
.pal-card.cat-charts::before{background:#ff6fd8;}
.pal-card.cat-radio::before{background:#ff9f40;}
.pal-card.cat-interview::before{background:#c97bff;}
.pal-card.on-air::after{content:'';position:absolute;inset:0;border-radius:14px;background:radial-gradient(ellipse 80% 60% at 50% 50%,rgba(0,212,255,0.04),transparent);animation:palCardGlow 3s ease-in-out infinite;}
@keyframes palCardGlow{0%,100%{opacity:.5;}50%{opacity:1;}}
.pal-card-cover{width:52px;height:52px;border-radius:10px;object-fit:cover;flex-shrink:0;border:1px solid rgba(255,255,255,0.07);}
.pal-card-cover-placeholder{width:52px;height:52px;border-radius:10px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:1.5rem;border:1px solid rgba(255,255,255,0.07);}
.pal-card-meta{display:flex;align-items:center;gap:6px;margin-bottom:3px;flex-wrap:wrap;}
.pal-card-time{font-size:.64rem;font-weight:700;color:rgba(255,255,255,0.35);letter-spacing:.5px;white-space:nowrap;}
.pal-card-cat{font-size:.54rem;font-weight:800;padding:2px 8px;border-radius:10px;letter-spacing:.8px;text-transform:uppercase;white-space:nowrap;}
.pal-on-air-tag{display:inline-flex;align-items:center;gap:4px;font-size:.58rem;font-weight:800;color:#ff4040;letter-spacing:1px;background:rgba(255,40,40,0.1);border:1px solid rgba(255,40,40,0.2);padding:2px 7px;border-radius:10px;}
.pal-on-air-tag i{width:5px;height:5px;border-radius:50%;background:#ff4040;display:block;animation:palDotPulse 1.4s ease-in-out infinite;}
.pal-card-title{font-size:.88rem;font-weight:800;color:#fff;margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.pal-card-desc{font-size:.7rem;color:rgba(255,255,255,0.3);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.pal-card-tooltip{position:absolute;bottom:calc(100% + 10px);left:50%;transform:translateX(-50%) scale(.92);background:rgba(8,6,22,0.98);border:1px solid rgba(255,255,255,0.1);border-radius:16px;padding:16px 18px;min-width:260px;max-width:320px;opacity:0;pointer-events:none;transition:all .22s;z-index:200;box-shadow:0 24px 60px rgba(0,0,0,0.7);}
.pal-card:hover .pal-card-tooltip{opacity:1;transform:translateX(-50%) scale(1);}
.pal-tooltip-title{font-size:.88rem;font-weight:800;color:#fff;margin-bottom:6px;}
.pal-tooltip-row{display:flex;gap:8px;align-items:center;font-size:.7rem;color:rgba(255,255,255,0.4);margin-bottom:3px;}
.pal-tooltip-desc{font-size:.73rem;color:rgba(255,255,255,0.45);line-height:1.6;margin-top:8px;border-top:1px solid rgba(255,255,255,0.06);padding-top:8px;}
.pal-empty{flex:1;border-radius:10px;background:repeating-linear-gradient(45deg,rgba(255,255,255,0.01) 0px,rgba(255,255,255,0.01) 1px,transparent 1px,transparent 10px);border:1px dashed rgba(255,255,255,0.04);display:flex;align-items:center;justify-content:center;}
.pal-empty span{font-size:.65rem;color:rgba(255,255,255,0.12);letter-spacing:1px;}
.pal-legend{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px;align-items:center;}
.pal-legend-label{font-size:.65rem;font-weight:700;color:rgba(255,255,255,0.22);letter-spacing:2px;text-transform:uppercase;margin-right:4px;}
.pal-legend-item{display:flex;align-items:center;gap:6px;padding:4px 11px;border-radius:20px;background:rgba(255,255,255,0.025);border:1px solid rgba(255,255,255,0.05);}
.pal-legend-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0;}
.pal-legend-item span{font-size:.65rem;color:rgba(255,255,255,0.32);font-weight:600;}
@media(max-width:900px){.pal-days{grid-template-columns:repeat(4,1fr);}}
@media(max-width:600px){.pal-header{flex-direction:column;}.pal-clock-wrap{align-items:flex-start;}.pal-days{grid-template-columns:repeat(4,1fr);}.pal-card{grid-template-columns:38px 1fr;}.pal-card-cover,.pal-card-cover-placeholder{width:38px;height:38px;font-size:1.1rem;}.pal-card-tooltip{display:none;}}

/* BATTLE CSS */
.battle-sec{position:relative;z-index:1;padding:110px 0 100px;overflow:hidden;}
.battle-sec::before{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 60% 50% at 20% 30%,rgba(255,40,40,0.08) 0%,transparent 60%),radial-gradient(ellipse 55% 45% at 80% 70%,rgba(123,47,247,0.1) 0%,transparent 60%);}
.battle-inner{max-width:1360px;margin:0 auto;padding:0 40px;}
@media(max-width:768px){.battle-inner{padding:0 16px;}}
.battle-header{text-align:center;margin-bottom:64px;}
.battle-header .label{color:#ff4040;margin-bottom:12px;display:flex;align-items:center;justify-content:center;gap:8px;}
.battle-title{font-size:clamp(2.2rem,5vw,4rem);font-weight:900;line-height:1.05;margin-bottom:16px;letter-spacing:-.02em;}
.battle-title .vs{background:linear-gradient(135deg,#ff4040,#ff6fd8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.battle-title .dj{background:linear-gradient(135deg,#00d4ff,#7b2ff7);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.battle-sub{font-size:.96rem;color:rgba(255,255,255,0.4);max-width:560px;margin:0 auto;line-height:1.75;}
.battle-arena{display:grid;grid-template-columns:1fr auto 1fr;gap:0;align-items:center;margin-bottom:64px;background:rgba(255,255,255,0.015);border:1px solid rgba(255,255,255,0.06);border-radius:28px;overflow:hidden;}
.battle-fighter{padding:40px 36px;display:flex;flex-direction:column;align-items:center;gap:16px;position:relative;}
.battle-fighter.left{border-right:1px solid rgba(255,255,255,0.05);}
.battle-fighter.right{border-left:1px solid rgba(255,255,255,0.05);}
.battle-fighter.winner{background:linear-gradient(135deg,rgba(0,212,255,0.06),rgba(123,47,247,0.04));}
.battle-fighter-avatar{width:96px;height:96px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:2.6rem;position:relative;flex-shrink:0;border:3px solid transparent;}
.battle-fighter.left  .battle-fighter-avatar{border-color:rgba(0,212,255,0.35);box-shadow:0 0 30px rgba(0,212,255,0.15);}
.battle-fighter.right .battle-fighter-avatar{border-color:rgba(255,111,216,0.35);box-shadow:0 0 30px rgba(255,111,216,0.15);}
.battle-fighter-name{font-size:1.3rem;font-weight:900;color:#fff;}
.battle-fighter-genre{font-size:.7rem;color:rgba(255,255,255,0.32);font-weight:600;letter-spacing:1.5px;text-transform:uppercase;}
.battle-fighter-stats{display:flex;gap:24px;margin-top:4px;}
.battle-stat{text-align:center;}
.battle-stat-num{font-size:1.1rem;font-weight:800;display:block;}
.battle-stat-lbl{font-size:.58rem;color:rgba(255,255,255,0.25);text-transform:uppercase;letter-spacing:1px;}
.battle-fighter.left  .battle-stat-num{color:#00d4ff;}
.battle-fighter.right .battle-stat-num{color:#ff6fd8;}
.battle-vote-wrap{width:100%;margin-top:4px;}
.battle-vote-track{height:6px;border-radius:3px;background:rgba(255,255,255,0.06);overflow:hidden;}
.battle-vote-fill{height:100%;border-radius:3px;transition:width 1.2s cubic-bezier(.4,0,.2,1);}
.battle-fighter.left  .battle-vote-fill{background:linear-gradient(90deg,#00d4ff,#7b2ff7);width:62%;}
.battle-fighter.right .battle-vote-fill{background:linear-gradient(90deg,#7b2ff7,#ff6fd8);width:38%;}
.battle-vote-pct{font-size:.75rem;font-weight:800;margin-top:5px;display:block;}
.battle-fighter.left  .battle-vote-pct{color:#00d4ff;}
.battle-fighter.right .battle-vote-pct{color:#ff6fd8;}
.battle-vote-btn{display:inline-flex;align-items:center;gap:8px;padding:11px 26px;border-radius:50px;border:none;font-size:.84rem;font-weight:700;cursor:pointer;font-family:inherit;transition:all .3s;}
.battle-fighter.left  .battle-vote-btn{background:rgba(0,212,255,0.12);color:#00d4ff;border:1px solid rgba(0,212,255,0.3);}
.battle-fighter.right .battle-vote-btn{background:rgba(255,111,216,0.12);color:#ff6fd8;border:1px solid rgba(255,111,216,0.3);}
.battle-vote-btn:hover{transform:scale(1.06);filter:brightness(1.15);}
.battle-vote-btn:disabled{opacity:.4;cursor:not-allowed;transform:none;}
.battle-vote-btn.voted{box-shadow:0 0 22px rgba(0,212,255,0.25);}
.battle-total-votes{display:flex;align-items:center;gap:5px;font-size:.68rem;color:rgba(255,255,255,0.22);}
.battle-total-votes strong{color:rgba(255,255,255,0.45);}
.battle-track-pill{display:flex;align-items:center;gap:8px;padding:7px 12px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.07);border-radius:30px;font-size:.7rem;color:rgba(255,255,255,0.5);cursor:pointer;transition:.25s;width:100%;}
.battle-track-pill:hover{border-color:rgba(0,212,255,0.2);color:#fff;}
.battle-track-name{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.battle-track-play{width:22px;height:22px;border-radius:50%;background:linear-gradient(135deg,#00d4ff,#7b2ff7);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.battle-vs{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0 28px;gap:14px;}
.battle-vs-badge{font-size:2.4rem;font-weight:900;background:linear-gradient(135deg,#ff4040,#ff6fd8,#7b2ff7);-webkit-background-clip:text;-webkit-text-fill-color:transparent;line-height:1;}
.battle-timer-digits{font-size:1.5rem;font-weight:900;color:#fff;letter-spacing:.06em;font-variant-numeric:tabular-nums;text-align:center;}
.battle-timer-lbl{font-size:.57rem;color:rgba(255,255,255,0.22);text-transform:uppercase;letter-spacing:2px;text-align:center;}
.battle-live-pill{display:inline-flex;align-items:center;gap:5px;padding:4px 12px;background:rgba(255,40,40,0.12);border:1px solid rgba(255,40,40,0.28);border-radius:20px;font-size:.6rem;font-weight:800;color:#ff4040;letter-spacing:1.5px;}
.battle-live-dot{width:5px;height:5px;border-radius:50%;background:#ff4040;display:inline-block;animation:btlPulse 1.4s ease-in-out infinite;}
@keyframes btlPulse{0%,100%{opacity:1;transform:scale(1);}50%{opacity:.3;transform:scale(.5);}}
@media(max-width:900px){.battle-arena{grid-template-columns:1fr;}.battle-fighter.left,.battle-fighter.right{border:none;border-bottom:1px solid rgba(255,255,255,0.05);}.battle-vs{padding:20px;flex-direction:row;justify-content:space-evenly;flex-wrap:wrap;gap:10px;}}
.battle-grid-title{font-size:.95rem;font-weight:800;color:rgba(255,255,255,0.65);margin-bottom:18px;display:flex;align-items:center;gap:10px;}
.battle-grid-title span{font-size:.65rem;font-weight:700;padding:3px 10px;border-radius:20px;background:rgba(255,40,40,0.1);color:#ff6060;border:1px solid rgba(255,40,40,0.2);}
.battle-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:48px;}
@media(max-width:900px){.battle-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:540px){.battle-grid{grid-template-columns:1fr;}}
.battle-card{background:rgba(255,255,255,0.025);border:1px solid rgba(255,255,255,0.06);border-radius:20px;padding:20px 18px;cursor:pointer;transition:.3s;position:relative;overflow:hidden;}
.battle-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;}
.battle-card.active-battle::before{background:linear-gradient(90deg,#ff4040,#ff6fd8,#7b2ff7);}
.battle-card.upcoming-battle::before{background:linear-gradient(90deg,#ffd166,#ff9f40);}
.battle-card.ended-battle::before{background:rgba(255,255,255,0.07);}
.battle-card:hover{transform:translateY(-4px);border-color:rgba(255,255,255,0.1);box-shadow:0 16px 40px rgba(0,0,0,0.35);}
.battle-card-status{display:inline-flex;align-items:center;gap:5px;font-size:.6rem;font-weight:800;letter-spacing:1px;padding:3px 9px;border-radius:20px;margin-bottom:14px;}
.bc-live{background:rgba(255,40,40,0.1);color:#ff6060;border:1px solid rgba(255,40,40,0.2);}
.bc-live i{width:5px;height:5px;border-radius:50%;background:#ff4040;display:block;animation:btlPulse 1.4s ease-in-out infinite;}
.bc-soon{background:rgba(255,214,0,0.1);color:#ffd166;border:1px solid rgba(255,214,0,0.2);}
.bc-ended{background:rgba(255,255,255,0.04);color:rgba(255,255,255,0.28);border:1px solid rgba(255,255,255,0.06);}
.battle-card-fighters{display:flex;align-items:center;gap:8px;margin-bottom:12px;}
.bc-avatar{width:38px;height:38px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:1.1rem;flex-shrink:0;}
.bc-name{font-size:.8rem;font-weight:700;color:#fff;}
.bc-genre{font-size:.63rem;color:rgba(255,255,255,0.28);}
.bc-vs{font-size:.7rem;font-weight:900;color:rgba(255,255,255,0.18);padding:0 2px;flex-shrink:0;}
.battle-card-bar{height:4px;border-radius:2px;background:rgba(255,255,255,0.05);overflow:hidden;margin-bottom:10px;display:flex;gap:2px;}
.bcb-left{height:100%;border-radius:2px;background:linear-gradient(90deg,#00d4ff,#7b2ff7);transition:width 1.2s;}
.bcb-right{flex:1;height:100%;border-radius:2px;background:linear-gradient(90deg,#7b2ff7,#ff6fd8);}
.battle-card-footer{display:flex;justify-content:space-between;align-items:center;}
.bc-votes{font-size:.66rem;color:rgba(255,255,255,0.22);}
.bc-votes strong{color:rgba(255,255,255,0.45);}
.bc-time{font-size:.63rem;color:rgba(255,255,255,0.2);font-weight:600;}
.bc-join-btn{padding:5px 13px;border-radius:20px;border:1px solid rgba(0,212,255,0.22);background:rgba(0,212,255,0.07);color:#00d4ff;font-size:.68rem;font-weight:700;cursor:pointer;font-family:inherit;transition:.25s;}
.bc-join-btn:hover{background:rgba(0,212,255,0.14);}
.battle-bottom{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
@media(max-width:768px){.battle-bottom{grid-template-columns:1fr;}}
.battle-lb,.battle-xp{background:rgba(255,255,255,0.02);border:1px solid rgba(255,255,255,0.06);border-radius:22px;padding:28px 24px;}
.battle-lb-title,.battle-xp-title{font-size:.88rem;font-weight:800;color:#fff;margin-bottom:20px;display:flex;align-items:center;gap:8px;}
.battle-lb-row{display:flex;align-items:center;gap:12px;padding:9px 10px;border-radius:12px;transition:.2s;}
.battle-lb-row:hover{background:rgba(255,255,255,0.03);}
.battle-lb-row.top1{background:linear-gradient(135deg,rgba(255,214,0,0.07),rgba(255,159,64,0.04));border:1px solid rgba(255,214,0,0.1);}
.lb-rank{width:26px;font-size:.88rem;font-weight:900;text-align:center;flex-shrink:0;}
.lb-rank.r1{color:#ffd166;}.lb-rank.r2{color:rgba(200,200,200,0.6);}.lb-rank.r3{color:#ff9f40;}.lb-rank.rn{color:rgba(255,255,255,0.2);font-size:.72rem;}
.lb-avatar{width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:.95rem;flex-shrink:0;}
.lb-info{flex:1;min-width:0;}
.lb-name{font-size:.8rem;font-weight:700;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.lb-wins{font-size:.63rem;color:rgba(255,255,255,0.26);}
.lb-pts{font-size:.88rem;font-weight:900;color:#ffd166;white-space:nowrap;}
.lb-trend{font-size:.58rem;font-weight:700;padding:2px 6px;border-radius:8px;}
.lb-trend.up{color:#38ef7d;background:rgba(56,239,125,0.1);}.lb-trend.same{color:rgba(255,255,255,0.18);background:rgba(255,255,255,0.04);}
.lb-divider{height:1px;background:rgba(255,255,255,0.04);margin:4px 0;}
.xp-profile{display:flex;align-items:center;gap:14px;padding:14px;background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.06);border-radius:14px;margin-bottom:18px;}
.xp-avatar{width:50px;height:50px;border-radius:13px;display:flex;align-items:center;justify-content:center;font-size:1.4rem;flex-shrink:0;}
.xp-username{font-size:.9rem;font-weight:800;color:#fff;margin-bottom:3px;}
.xp-level{display:inline-flex;align-items:center;gap:4px;font-size:.63rem;font-weight:700;padding:2px 8px;background:rgba(255,214,0,0.12);border:1px solid rgba(255,214,0,0.22);border-radius:20px;color:#ffd166;}
.xp-bar-wrap{margin-top:6px;}
.xp-bar-track{height:5px;border-radius:3px;background:rgba(255,255,255,0.06);overflow:hidden;}
.xp-bar-fill{height:100%;border-radius:3px;background:linear-gradient(90deg,#ffd166,#ff9f40);}
.xp-bar-label{display:flex;justify-content:space-between;font-size:.58rem;color:rgba(255,255,255,0.2);margin-top:3px;}
.xp-pts-big{font-size:1.5rem;font-weight:900;color:#ffd166;}
.xp-pts-sub{font-size:.63rem;color:rgba(255,255,255,0.22);}
.xp-rewards-title{font-size:.68rem;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:rgba(255,255,255,0.18);margin:18px 0 10px;}
.xp-rewards{display:flex;flex-direction:column;gap:7px;}
.xp-reward{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,0.025);border:1px solid rgba(255,255,255,0.05);transition:.2s;}
.xp-reward:hover{border-color:rgba(255,214,0,0.18);}
.xp-reward-icon{width:32px;height:32px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:.95rem;flex-shrink:0;}
.xp-reward-info{flex:1;}
.xp-reward-name{font-size:.76rem;font-weight:700;color:#fff;margin-bottom:1px;}
.xp-reward-req{font-size:.62rem;color:rgba(255,255,255,0.26);}
.xp-reward-pts{font-size:.7rem;font-weight:800;color:#ffd166;white-space:nowrap;}
.xp-reward.locked{opacity:.4;}
.xp-reward.unlocked .xp-reward-icon{box-shadow:0 0 10px rgba(255,214,0,0.25);}
.battle-how{margin-top:48px;display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
@media(max-width:800px){.battle-how{grid-template-columns:1fr 1fr;}}
.battle-how-card{background:rgba(255,255,255,0.02);border:1px solid rgba(255,255,255,0.05);border-radius:18px;padding:22px 18px;text-align:center;transition:.3s;}
.battle-how-card:hover{border-color:rgba(255,64,64,0.2);transform:translateY(-4px);}
.bhc-step{width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,#ff4040,#ff6fd8);color:#fff;font-size:.78rem;font-weight:900;display:flex;align-items:center;justify-content:center;margin:0 auto 12px;}
.bhc-icon{font-size:1.7rem;margin-bottom:8px;}
.bhc-title{font-size:.82rem;font-weight:800;color:#fff;margin-bottom:5px;}
.bhc-desc{font-size:.7rem;color:rgba(255,255,255,0.3);line-height:1.6;}