:root{--pink:#ff2daa;--purple:#7a2cff;--teal:#18d7d1;--navy:#070a20;--panel:#0c102d;--white:#fff;--muted:#abb1ce;--line:rgba(255,255,255,.11)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--navy);color:#fff;font-family:Montserrat,Arial,sans-serif;overflow-x:hidden}body:before{content:"";position:fixed;inset:0;background:radial-gradient(circle at 10% 20%,rgba(255,45,170,.11),transparent 30%),radial-gradient(circle at 90% 30%,rgba(24,215,209,.08),transparent 28%),linear-gradient(180deg,#06081c,#090c25 55%,#050719);z-index:-2}.noise{position:fixed;inset:0;opacity:.03;pointer-events:none;z-index:30;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E")}.site-header{height:84px;display:flex;align-items:center;justify-content:space-between;max-width:1280px;margin:auto;padding:0 34px;position:relative;z-index:20}.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:#fff;font-family:Poppins;font-size:22px;font-weight:800}.brand img{width:48px;height:48px;border-radius:50%;object-fit:cover}.brand span span{color:var(--teal)}.nav{display:flex;gap:28px;align-items:center}.nav a{color:#d8dcf3;text-decoration:none;font-size:14px;font-weight:600}.nav a:hover{color:#fff}.nav-cta{padding:12px 19px;border:1px solid rgba(24,215,209,.55);border-radius:999px;background:rgba(24,215,209,.08)}.menu-toggle{display:none;background:none;border:0}.menu-toggle span{display:block;width:25px;height:2px;background:#fff;margin:5px}.hero{min-height:720px;max-width:1280px;margin:auto;padding:72px 34px 80px;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:55px;position:relative}.hero-copy{z-index:2}.eyebrow,.kicker{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:2px;color:var(--teal)}.eyebrow{display:flex;align-items:center;gap:10px}.eyebrow span{width:34px;height:2px;background:linear-gradient(90deg,var(--pink),var(--teal))}.hero h1{font-family:Poppins;font-size:clamp(52px,7vw,91px);line-height:.99;letter-spacing:-4px;margin:22px 0}.hero h1 em{font-style:normal;background:linear-gradient(90deg,var(--pink),var(--purple) 45%,var(--teal));-webkit-background-clip:text;color:transparent}.hero-copy>p{font-size:18px;line-height:1.75;color:#c4c8df;max-width:650px}.hero-actions{display:flex;gap:13px;margin:30px 0}.button{display:inline-flex;align-items:center;justify-content:center;padding:15px 23px;border-radius:10px;font-weight:700;font-size:14px;text-decoration:none;border:0;cursor:pointer}.primary{color:white;background:linear-gradient(100deg,var(--pink),var(--purple),var(--teal));box-shadow:0 10px 35px rgba(122,44,255,.23)}.ghost{color:#fff;border:1px solid var(--line);background:rgba(255,255,255,.035)}.hero-stats{display:flex;gap:42px;margin-top:45px}.hero-stats div{display:flex;flex-direction:column}.hero-stats strong{font-family:Poppins;font-size:20px}.hero-stats span{font-size:12px;color:var(--muted);margin-top:3px}.hero-visual{position:relative;display:grid;place-items:center;min-height:500px}.hero-card{width:min(440px,90%);aspect-ratio:1;border-radius:50%;padding:8px;background:linear-gradient(130deg,var(--pink),var(--purple),var(--teal));box-shadow:0 0 80px rgba(122,44,255,.3);animation:float 5s ease-in-out infinite}.hero-card img{width:100%;height:100%;border-radius:50%;object-fit:cover}.live-pill{position:absolute;bottom:50px;right:0;background:#fff;color:#091026;padding:10px 14px;border-radius:8px;font-size:11px;font-weight:800;letter-spacing:1px}.orbit{position:absolute;width:520px;height:300px;border:1px solid rgba(24,215,209,.3);border-radius:50%;transform:rotate(-24deg);box-shadow:0 0 45px rgba(255,45,170,.12)}.float-card{position:absolute;padding:13px 16px;border:1px solid var(--line);border-radius:12px;background:rgba(12,16,45,.8);backdrop-filter:blur(12px);font-size:12px}.note-card{top:16%;left:-2%}.vibe-card{right:-1%;top:30%}.social-strip{max-width:1210px;margin:0 auto 70px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:25px;display:flex;align-items:center;justify-content:space-between}.social-strip p{font-size:13px;color:#c5c9de}.social-links{display:flex;gap:24px;flex-wrap:wrap}.social-links a{color:white;text-decoration:none;font-size:13px;font-weight:700}.social-links a span{color:var(--teal)}.section{max-width:1210px;margin:auto;padding:90px 25px}.section-heading{display:flex;align-items:end;justify-content:space-between;margin-bottom:35px}.section h2,.newsletter h2{font-family:Poppins;font-size:clamp(32px,4vw,52px);margin:7px 0 0;letter-spacing:-2px}.text-link{color:#fff;text-decoration:none;font-size:13px}.video-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:22px}.video-card{background:rgba(255,255,255,.035);border:1px solid var(--line);border-radius:18px;overflow:hidden}.video-card.featured{grid-row:span 2}.video-thumb{height:230px;position:relative;display:grid;place-items:center;background-size:200% 200%;animation:shift 8s ease infinite}.featured .video-thumb{height:395px}.gradient-one{background-image:radial-gradient(circle at 30% 30%,#ff58bc,transparent 25%),linear-gradient(135deg,#381063,#0c5b7b)}.gradient-two{background-image:radial-gradient(circle at 60% 30%,#18d7d1,transparent 22%),linear-gradient(135deg,#34064f,#0d163f)}.gradient-three{background-image:radial-gradient(circle at 20% 70%,#7a2cff,transparent 30%),linear-gradient(135deg,#4d0d37,#071a37)}.play{width:62px;height:62px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.9);color:#071026;padding-left:4px;box-shadow:0 10px 35px #0005}.duration{position:absolute;bottom:14px;right:14px;background:#050719d9;padding:6px 8px;border-radius:5px;font-size:11px}.thumb-label{position:absolute;top:15px;left:15px;font-size:10px;letter-spacing:1.4px;background:var(--pink);padding:7px 9px;border-radius:5px;font-weight:800}.card-copy{padding:22px}.card-copy span,.blog-card span{font-size:10px;letter-spacing:1.3px;color:var(--teal);font-weight:700}.card-copy h3,.blog-card h3{font-family:Poppins;margin:8px 0;font-size:21px}.card-copy p,.blog-card p{font-size:13px;color:var(--muted);line-height:1.7}.music-panel{display:grid;grid-template-columns:.8fr 1.2fr;gap:55px;padding:40px;border:1px solid var(--line);border-radius:26px;background:linear-gradient(135deg,rgba(255,45,170,.08),rgba(122,44,255,.06),rgba(24,215,209,.08))}.album-art{position:relative}.album-art img{width:100%;border-radius:22px}.album-art span{position:absolute;top:17px;left:17px;background:white;color:#0b102a;font-size:10px;font-weight:800;padding:8px 10px;border-radius:5px}.music-copy{align-self:center}.music-copy h2{font-size:54px}.music-copy>p{color:var(--muted);line-height:1.8}.player{display:flex;align-items:center;gap:14px;padding:18px 0}.player button{border:0;background:none;color:#fff;font-size:15px}.player .main-play{width:45px;height:45px;border-radius:50%;background:var(--pink)}.track{height:4px;flex:1;background:#ffffff18;border-radius:5px}.track span{display:block;width:34%;height:100%;background:linear-gradient(90deg,var(--pink),var(--teal))}.player time{font-size:10px;color:var(--muted)}.stream-links{display:flex;gap:12px;flex-wrap:wrap}.stream-links a,.partner-tags span{padding:9px 11px;border:1px solid var(--line);border-radius:7px;color:#fff;text-decoration:none;font-size:11px}.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.product-image{height:290px;border-radius:15px;display:grid;place-items:center;overflow:hidden;position:relative}.product-image:before{content:"";width:170px;height:210px;position:absolute;background:linear-gradient(145deg,#13172d,#23294a);filter:drop-shadow(0 20px 25px #0007)}.hoodie:before{clip-path:polygon(25% 10%,40% 0,60% 0,75% 10%,100% 30%,85% 55%,74% 45%,74% 100%,26% 100%,26% 45%,15% 55%,0 30%)}.tee:before{clip-path:polygon(25% 5%,40% 0,60% 0,75% 5%,100% 25%,85% 45%,75% 38%,75% 100%,25% 100%,25% 38%,15% 45%,0 25%)}.journal:before{border-radius:7px;width:155px}.cap:before{clip-path:ellipse(48% 32% at 50% 50%);height:150px}.product-image span{z-index:1;font-family:Poppins;font-weight:800;text-align:center;background:linear-gradient(90deg,var(--pink),var(--teal));-webkit-background-clip:text;color:transparent}.product h3{font-size:14px;margin:14px 0 6px}.product p{font-size:13px;color:var(--teal);margin:0}.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.blog-card{border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#ffffff06}.blog-image{height:210px}.bg-a{background:radial-gradient(circle,#ff2daa55,transparent 40%),linear-gradient(135deg,#35136e,#071a36)}.bg-b{background:radial-gradient(circle,#18d7d155,transparent 40%),linear-gradient(135deg,#260a4e,#11253c)}.bg-c{background:radial-gradient(circle,#7a2cff77,transparent 35%),linear-gradient(135deg,#60113f,#071a36)}.blog-card>div:last-child{padding:21px}.blog-card a{color:#fff;font-size:12px;text-decoration:none;font-weight:700}.partner-section{display:grid;grid-template-columns:1.35fr .65fr;gap:28px;align-items:stretch}.partner-copy,.media-kit{padding:44px;border:1px solid var(--line);border-radius:24px;background:rgba(255,255,255,.025)}.partner-copy>p{max-width:760px;color:var(--muted);line-height:1.8}.partner-tags{display:flex;gap:8px;flex-wrap:wrap;margin:25px 0}.media-kit{background:linear-gradient(150deg,#271052,#0a2637);display:flex;flex-direction:column}.media-kit>span{font-size:11px;color:var(--teal);letter-spacing:2px}.media-kit h3{font-family:Poppins;font-size:26px}.metric{display:flex;flex-direction:column;border-top:1px solid var(--line);padding:17px 0}.metric strong{font-family:Poppins}.metric small{color:var(--muted);margin-top:3px}.media-kit a{margin-top:auto;color:#fff;text-decoration:none;font-size:12px}.newsletter{max-width:1160px;margin:50px auto 100px;padding:55px;border:1px solid var(--line);border-radius:26px;background:linear-gradient(110deg,rgba(255,45,170,.13),rgba(122,44,255,.12),rgba(24,215,209,.11));display:grid;grid-template-columns:1fr .8fr;gap:50px;align-items:center}.newsletter p{color:var(--muted)}.newsletter form{display:flex;gap:9px}.newsletter input{flex:1;background:#050719;border:1px solid var(--line);border-radius:10px;padding:15px;color:white;min-width:0}.form-message{grid-column:2;font-size:12px;margin:0}footer{max-width:1210px;margin:auto;padding:40px 25px;display:grid;grid-template-columns:1fr auto;gap:30px;border-top:1px solid var(--line)}.footer-brand{display:flex;gap:12px;align-items:center}.footer-brand img{width:52px;border-radius:50%}.footer-brand div{display:flex;flex-direction:column}.footer-brand span{font-size:11px;color:var(--muted)}.footer-links{display:flex;gap:20px;align-items:center}.footer-links a{color:#cbd0e4;text-decoration:none;font-size:12px}.copyright{grid-column:1/-1;font-size:11px;color:#777f9f}.reveal{opacity:0;transform:translateY(22px);transition:.8s ease}.reveal.visible{opacity:1;transform:none}

/* ===================================
   BLOG EMPTY STATE STYLING
=================================== */

.blog-empty-state {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 400px;
    padding: 60px 20px;
}

.empty-state-content {
    text-align: center;
    max-width: 500px;
}

.empty-state-icon {
    margin: 0 auto 30px;
    width: 80px;
    height: 80px;
    color: var(--muted);
    opacity: 0.6;
}

.empty-state-content h3 {
    font-family: Poppins, sans-serif;
    font-size: 28px;
    color: var(--white);
    margin: 0 0 15px;
    font-weight: 700;
}

.empty-state-content p {
    color: var(--muted);
    font-size: 16px;
    line-height: 1.6;
    margin: 0 0 30px;
}

.empty-state-content strong {
    color: var(--teal);
    font-weight: 600;
}

.empty-state-actions {
    display: flex;
    gap: 15px;
    justify-content: center;
    flex-wrap: wrap;
}

.empty-state-actions .button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 15px 25px;
    border-radius: 10px;
    font-weight: 700;
    font-size: 14px;
    text-decoration: none;
    border: 0;
    cursor: pointer;
    transition: all 0.3s ease;
}

.empty-state-actions .button.primary {
    color: white;
    background: linear-gradient(100deg, var(--pink), var(--purple), var(--teal));
    box-shadow: 0 10px 35px rgba(122, 44, 255, .23);
}

.empty-state-actions .button.primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 15px 45px rgba(122, 44, 255, .35);
}

.empty-state-actions .button.ghost {
    color: #fff;
    border: 1px solid var(--line);
    background: rgba(255, 255, 255, .035);
}

.empty-state-actions .button.ghost:hover {
    background: rgba(24, 215, 209, .1);
    border-color: var(--teal);
    color: var(--teal);
}

/* Responsive empty state */
@media (max-width: 600px) {
    .blog-empty-state {
        min-height: 300px;
        padding: 40px 15px;
    }
    
    .empty-state-content h3 {
        font-size: 22px;
    }
    
    .empty-state-content p {
        font-size: 14px;
    }
    
    .empty-state-actions {
        flex-direction: column;
        align-items: center;
    }
    
    .empty-state-actions .button {
        width: 200px;
    }
}@keyframes float{50%{transform:translateY(-13px)}}@keyframes shift{50%{background-position:100% 100%}}@media(max-width:900px){.menu-toggle{display:block}.nav{display:none;position:absolute;top:76px;left:20px;right:20px;flex-direction:column;background:#0a0e29;border:1px solid var(--line);padding:24px;border-radius:15px}.nav.open{display:flex}.hero{grid-template-columns:1fr;padding-top:35px}.hero-copy{text-align:center}.eyebrow{justify-content:center}.hero-copy>p{margin-inline:auto}.hero-actions,.hero-stats{justify-content:center}.hero-visual{min-height:420px}.video-grid,.music-panel,.partner-section,.newsletter{grid-template-columns:1fr}.video-card.featured{grid-row:auto}.product-grid{grid-template-columns:repeat(2,1fr)}.blog-grid{grid-template-columns:1fr}.newsletter form{grid-row:auto}.form-message{grid-column:auto}.social-strip{flex-direction:column;gap:16px}.footer-links{flex-wrap:wrap}}@media(max-width:560px){.site-header{padding:0 18px}.brand{font-size:18px}.hero{padding:35px 18px 65px}.hero h1{letter-spacing:-2.5px}.hero-copy>p{font-size:15px}.hero-stats{gap:20px}.hero-visual{min-height:350px}.orbit{width:350px;height:220px}.section{padding:65px 18px}.section-heading{align-items:start}.section-heading .text-link{display:none}.featured .video-thumb,.video-thumb{height:250px}.music-panel{padding:22px}.music-copy h2{font-size:38px}.player{flex-wrap:wrap}.track{min-width:130px}.product-grid{grid-template-columns:1fr 1fr}.product-image{height:220px}.partner-copy,.media-kit{padding:25px}.newsletter{margin:25px 18px 75px;padding:27px}.newsletter form{flex-direction:column}.footer-links{display:none}.float-card{display:none}}
/* =========================================
   DYNAMIC VIDEO IMAGE
========================================= */

.video-thumb {
    position: relative;
    overflow: hidden;
}

/* Make uploaded image fill exactly the thumbnail */
.video-thumb .video-cover {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;
    object-position: center;

    z-index: 1;

    transition: transform 0.4s ease;
}

/* Keep existing gradient/background behind image */
.video-thumb.gradient-one,
.video-thumb.gradient-two,
.video-thumb.gradient-three {
    overflow: hidden;
}


/* Slight zoom on hover */
.video-card:hover .video-cover {
    transform: scale(1.04);
}


/* =========================================
   PLAY BUTTON
========================================= */
.video-play-button {
    pointer-events: auto !important;
    cursor: pointer;
}
.video-thumb .video-play-button {
    position: absolute;

    left: 50%;
    top: 50%;

    transform: translate(-50%, -50%);

    z-index: 20;

    cursor: pointer;

    pointer-events: auto !important;
}


/* Keep labels above image */
.video-thumb .duration,
.video-thumb .thumb-label {
    position: absolute;
    z-index: 10;
}
/* =========================================
   VIDEO POPUP / MODAL
========================================= */

.video-modal {
    position: fixed;
    inset: 0;
    z-index: 99999;

    display: none;
    align-items: center;
    justify-content: center;

    padding: 20px;
}

.video-modal.active {
    display: flex;
}


/* Dark blurred background */
.video-modal-overlay {
    position: absolute;
    inset: 0;

    background: rgba(7, 10, 32, 0.90);

    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}


/* Popup box */
.video-modal-content {
    position: relative;
    z-index: 2;

    width: 100%;
    max-width: 950px;

    background: #0c102d;

    border: 1px solid rgba(255, 255, 255, 0.11);

    border-radius: 18px;

    overflow: hidden;

    box-shadow:
        0 25px 80px rgba(0, 0, 0, 0.65),
        0 0 40px rgba(122, 44, 255, 0.15);

    animation: videoPopupShow 0.3s ease;
}


/* Popup opening animation */
@keyframes videoPopupShow {

    from {
        opacity: 0;
        transform: translateY(25px) scale(0.96);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }

}


/* =========================================
   VIDEO PLAYER
========================================= */

.video-modal-player {
    position: relative;

    width: 100%;

    aspect-ratio: 16 / 9;

    background: #000;
}

.video-modal-player iframe {
    position: absolute;

    inset: 0;

    width: 100%;
    height: 100%;

    border: 0;
}


/* =========================================
   CLOSE BUTTON
========================================= */

.video-modal-close {
    position: absolute;

    top: 12px;
    right: 12px;

    z-index: 10;

    width: 42px;
    height: 42px;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 0;

    border: 1px solid rgba(255, 255, 255, 0.20);

    border-radius: 50%;

    background: rgba(7, 10, 32, 0.85);

    color: #fff;

    font-size: 28px;
    line-height: 1;

    cursor: pointer;

    transition:
        background 0.25s ease,
        transform 0.25s ease,
        border-color 0.25s ease;
}

.video-modal-close:hover {
    background: #ff2daa;

    border-color: #ff2daa;

    transform: rotate(90deg);
}


/* =========================================
   VIDEO INFORMATION
========================================= */

.video-modal-info {
    padding: 20px 24px 24px;

    background:
        linear-gradient(
            135deg,
            rgba(122, 44, 255, 0.10),
            rgba(255, 45, 170, 0.05)
        );
}

.video-modal-info span {
    display: block;

    margin-bottom: 7px;

    color: #18d7d1;

    font-size: 12px;
    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: 0.08em;
}

.video-modal-info h3 {
    margin: 0;

    color: #fff;

    font-family: 'Poppins', sans-serif;

    font-size: 24px;
    font-weight: 700;

    line-height: 1.35;
}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 768px) {

    .video-modal {
        padding: 12px;
    }

    .video-modal-content {
        max-width: 100%;

        border-radius: 14px;
    }

    .video-modal-close {
        top: 8px;
        right: 8px;

        width: 38px;
        height: 38px;

        font-size: 24px;
    }

    .video-modal-info {
        padding: 16px 18px 20px;
    }

    .video-modal-info h3 {
        font-size: 18px;
    }

}


/* Smaller phones */
@media (max-width: 480px) {

    .video-modal {
        padding: 8px;
    }

    .video-modal-content {
        border-radius: 12px;
    }

    .video-modal-info {
        padding: 14px 15px 17px;
    }

    .video-modal-info span {
        font-size: 10px;
    }

    .video-modal-info h3 {
        font-size: 16px;
    }

}
.product-image:before {
    content: "";
    width: 170px;
    height: 210px;
    position: absolute;
    background: unset;
    filter: drop-shadow(0 20px 25px #0007);
}