.streamit-featured-spotlight {
    --spotlight-accent: #e50914;
    position: relative;
    display: grid;
    grid-template-columns: 50% 50%;
    width: 100%;
    max-width: 1765px;
    margin-inline: auto;
    overflow: hidden;
    min-height: 400px;
    color: #fff;
    background: #1c141d;
    border: 1px solid var(--spotlight-accent);
    border-color: color-mix(in srgb, var(--spotlight-accent) 75%, transparent);
    border-radius: 9px;
}

/* The collection widget is intentionally separate from the original widget. */
.streamit-featured-spotlight--collection {
    isolation: isolate;
    overflow: hidden;
}

/* 1 – Split Editorial */
.streamit-featured-spotlight--split {
    grid-template-columns: minmax(0, 48%) minmax(0, 52%);
    background: linear-gradient(120deg, #090b0f 0%, #11151b 100%);
    border-width: 2px;
}
.streamit-featured-spotlight--split .streamit-featured-spotlight__visual::after {
    background: linear-gradient(90deg, transparent 68%, #10141a 100%);
}
.streamit-featured-spotlight--split .streamit-featured-spotlight__title {
    text-transform: uppercase;
    letter-spacing: -.04em;
}

/* 2 – Full Cinematic */
.streamit-featured-spotlight--cinematic {
    display: block;
    min-height: 470px;
    background: #07090c;
}
.streamit-featured-spotlight--cinematic .streamit-featured-spotlight__visual {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}
.streamit-featured-spotlight--cinematic .streamit-featured-spotlight__visual::after {
    background: linear-gradient(90deg, rgba(4,6,9,.96) 0%, rgba(4,6,9,.7) 38%, rgba(4,6,9,.08) 72%), linear-gradient(0deg, rgba(4,6,9,.9), transparent 45%);
}
.streamit-featured-spotlight--cinematic .streamit-featured-spotlight__content {
    position: relative;
    z-index: 4;
    width: min(47%, 680px);
    min-height: 470px;
    justify-content: flex-end;
    padding: 52px;
}
.streamit-featured-spotlight--cinematic .streamit-featured-spotlight__title {
    font-size: clamp(46px, 5vw, 82px);
}

/* 3 – Floating Glass Panel */
.streamit-featured-spotlight--glass {
    display: block;
    min-height: 500px;
    background: #080b0f;
}
.streamit-featured-spotlight--glass .streamit-featured-spotlight__visual {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}
.streamit-featured-spotlight--glass .streamit-featured-spotlight__visual::after {
    background: linear-gradient(90deg, transparent 25%, rgba(3,5,8,.5) 100%);
}
.streamit-featured-spotlight--glass .streamit-featured-spotlight__content {
    position: relative;
    z-index: 4;
    width: min(42%, 600px);
    min-height: 390px;
    margin: 55px 52px 55px auto;
    padding: 38px;
    border: 1px solid rgba(255,255,255,.2);
    border-radius: 18px;
    background: rgba(8,11,15,.78);
    box-shadow: 0 24px 70px rgba(0,0,0,.5);
    -webkit-backdrop-filter: blur(18px);
    backdrop-filter: blur(18px);
}

/* 4 – Diagonal Poster */
.streamit-featured-spotlight--diagonal {
    grid-template-columns: 44% 56%;
    background: #080a0e;
}
.streamit-featured-spotlight--diagonal::after {
    content: '';
    position: absolute;
    z-index: 3;
    top: -15%;
    bottom: -15%;
    left: 43%;
    width: 9px;
    background: var(--spotlight-accent);
    box-shadow: 0 0 24px color-mix(in srgb, var(--spotlight-accent), transparent 35%);
    transform: rotate(-10deg);
    transform-origin: center;
    pointer-events: none;
}
.streamit-featured-spotlight--diagonal .streamit-featured-spotlight__visual {
    grid-column: 2;
    grid-row: 1;
    clip-path: polygon(10% 0, 100% 0, 100% 100%, 0 100%);
}
.streamit-featured-spotlight--diagonal .streamit-featured-spotlight__visual::after {
    background: linear-gradient(90deg, rgba(8,10,14,.65), transparent 38%);
}
.streamit-featured-spotlight--diagonal .streamit-featured-spotlight__content {
    grid-column: 1;
    grid-row: 1;
    z-index: 4;
    padding: 48px 28px 48px 48px;
}
.streamit-featured-spotlight--diagonal .streamit-featured-spotlight__title {
    text-transform: uppercase;
    letter-spacing: -.035em;
}

@media (max-width: 991px) {
    .streamit-featured-spotlight--cinematic .streamit-featured-spotlight__content,
    .streamit-featured-spotlight--glass .streamit-featured-spotlight__content {
        width: min(68%, 600px);
    }
}

@media (max-width: 767px) {
    .streamit-featured-spotlight--split,
    .streamit-featured-spotlight--diagonal {
        display: flex;
        flex-direction: column;
    }
    .streamit-featured-spotlight--diagonal::after { display: none; }
    .streamit-featured-spotlight--diagonal .streamit-featured-spotlight__visual {
        clip-path: none;
        order: 0;
    }
    .streamit-featured-spotlight--diagonal .streamit-featured-spotlight__content { order: 1; padding: 28px 22px; }
    .streamit-featured-spotlight--cinematic,
    .streamit-featured-spotlight--glass { min-height: 560px; }
    .streamit-featured-spotlight--cinematic .streamit-featured-spotlight__visual,
    .streamit-featured-spotlight--glass .streamit-featured-spotlight__visual { height: 100%; }
    .streamit-featured-spotlight--cinematic .streamit-featured-spotlight__visual::after,
    .streamit-featured-spotlight--glass .streamit-featured-spotlight__visual::after {
        background: linear-gradient(0deg, rgba(4,6,9,.98) 0%, rgba(4,6,9,.72) 48%, rgba(4,6,9,.05) 78%);
    }
    .streamit-featured-spotlight--cinematic .streamit-featured-spotlight__content,
    .streamit-featured-spotlight--glass .streamit-featured-spotlight__content {
        width: auto;
        min-height: 560px;
        margin: 0;
        padding: 220px 22px 28px;
        justify-content: flex-end;
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
    }
}

.streamit-featured-spotlight__ribbon-wrap {
    position: absolute;
    z-index: 20;
    top: -6px;
    right: -5px;
    display: block;
    width: 255px;
    max-width: 24%;
    height: auto;
    padding: 0;
    border: 0;
    object-fit: contain;
    pointer-events: none;
}

.streamit-featured-spotlight__ribbon {
    display: block;
    width: 100%;
    height: auto;
    border: 0;
}

.streamit-featured-spotlight__ribbon-tint {
    position: absolute;
    inset: 0;
    background: var(--spotlight-accent);
    -webkit-mask: url('../img/yustream-number-one-ribbon.png') center / contain no-repeat;
    mask: url('../img/yustream-number-one-ribbon.png') center / contain no-repeat;
    mix-blend-mode: color;
    pointer-events: none;
}

.streamit-featured-spotlight__visual {
    position: relative;
    display: block;
    min-height: 100%;
    overflow: hidden;
    background: #120d13;
}

.streamit-featured-spotlight__visual::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent 65%, #1c141d 100%);
    z-index: 2;
    pointer-events: none;
}

.streamit-featured-spotlight__visual img {
    width: 100%;
    height: 100%;
    min-height: 400px;
    display: block;
    object-fit: cover;
    transition: transform .65s ease;
}

.streamit-featured-spotlight:hover .streamit-featured-spotlight__visual img {
    transform: scale(1.025);
}

.streamit-featured-spotlight__trailer {
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    min-width: 100%;
    min-height: 100%;
    border: 0;
    object-fit: cover;
    pointer-events: none;
    transform: translate(-50%, -50%) scale(1.04);
}

.streamit-featured-spotlight__visual iframe.streamit-featured-spotlight__trailer {
    transform: translate(-50%, -50%) scale(1.2);
}

.streamit-featured-spotlight__visual.trailer-ended .streamit-featured-spotlight__trailer {
    opacity: 0;
    visibility: hidden;
}

.streamit-featured-spotlight__visual-link {
    position: absolute;
    z-index: 3;
    inset: 0;
}

.streamit-featured-spotlight__replay {
    position: absolute;
    z-index: 6;
    right: 70px;
    bottom: 18px;
    display: none;
    align-items: center;
    gap: 10px;
    min-height: 42px;
    padding: 0 17px;
    color: #fff;
    background: rgba(12, 10, 12, .82);
    border: 2px solid var(--spotlight-accent);
    border-radius: 6px;
    box-shadow: 0 5px 24px rgba(0, 0, 0, .45);
    cursor: pointer;
    font-size: 14px;
    font-weight: 800;
    text-transform: uppercase;
    transform: none;
    transition: background .2s ease, transform .2s ease;
}

.streamit-featured-spotlight__visual.trailer-ended .streamit-featured-spotlight__replay {
    display: inline-flex;
}

.streamit-featured-spotlight__replay:hover,
.streamit-featured-spotlight__replay:focus {
    color: #fff;
    background: var(--spotlight-accent);
    outline: none;
    transform: scale(1.04);
}

.streamit-featured-spotlight__visual.trailer-ended .streamit-featured-spotlight__progress {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.streamit-featured-spotlight__mute {
    position: absolute;
    z-index: 4;
    right: 18px;
    bottom: 18px;
    display: inline-flex;
    width: 42px;
    height: 42px;
    align-items: center;
    justify-content: center;
    padding: 0;
    color: #fff;
    background: rgba(10, 8, 10, .72);
    border: 2px solid var(--spotlight-accent);
    border-radius: 50%;
    box-shadow: 0 4px 18px rgba(0, 0, 0, .35);
    cursor: pointer;
    font-size: 17px;
    line-height: 1;
    transition: background .2s ease, transform .2s ease;
}

.streamit-featured-spotlight__mute:hover,
.streamit-featured-spotlight__mute:focus {
    color: #fff;
    background: var(--spotlight-accent);
    outline: none;
    transform: scale(1.06);
}

.streamit-featured-spotlight__progress {
    position: absolute;
    z-index: 5;
    right: 76px;
    bottom: 29px;
    left: 18px;
    height: 20px;
    overflow: visible;
    opacity: 0;
    visibility: hidden;
    background: transparent;
    cursor: pointer;
    pointer-events: none;
    touch-action: none;
    transform: translateY(5px);
    transition: opacity .25s ease, visibility .25s ease, transform .25s ease;
}

.streamit-featured-spotlight__visual.show-trailer-progress .streamit-featured-spotlight__progress {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}

.streamit-featured-spotlight__visual.trailer-ended .streamit-featured-spotlight__progress,
.streamit-featured-spotlight__visual.trailer-ended.show-trailer-progress .streamit-featured-spotlight__progress {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(5px);
}

.streamit-featured-spotlight__progress::before {
    content: "";
    position: absolute;
    right: 0;
    bottom: 7px;
    left: 0;
    height: 6px;
    background: rgba(255, 255, 255, .42);
}

.streamit-featured-spotlight__progress-fill {
    position: absolute;
    z-index: 1;
    bottom: 7px;
    left: 0;
    width: 0;
    height: 6px;
    background: var(--spotlight-accent);
    box-shadow: 0 0 8px color-mix(in srgb, var(--spotlight-accent) 70%, transparent);
    transition: width .2s linear;
}

.streamit-featured-spotlight__progress-dot {
    position: absolute;
    z-index: 2;
    bottom: 3px;
    left: 0;
    width: 14px;
    height: 14px;
    background: var(--spotlight-accent);
    border: 2px solid #fff;
    border-radius: 50%;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .55);
    transform: translateX(-50%);
    transition: left .2s linear, transform .15s ease;
}

.streamit-featured-spotlight__progress:hover .streamit-featured-spotlight__progress-dot,
.streamit-featured-spotlight__progress.is-dragging .streamit-featured-spotlight__progress-dot {
    transform: translateX(-50%) scale(1.18);
}

.streamit-featured-spotlight__content {
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: clamp(28px, 3.2vw, 58px);
}

.streamit-featured-spotlight__title {
    margin: 0 0 17px;
    color: #fff;
    font-size: clamp(40px, 4vw, 68px);
    font-weight: 800;
    line-height: .98;
    letter-spacing: -0.035em;
}

.streamit-featured-spotlight__meta,
.streamit-featured-spotlight__genres,
.streamit-featured-spotlight__highlight,
.streamit-featured-spotlight__actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.streamit-featured-spotlight__meta {
    gap: 0;
    margin-bottom: 17px;
    color: #b9b1ba;
    font-size: 15px;
    font-weight: 600;
}

.streamit-featured-spotlight__meta span + span::before {
    content: "•";
    margin: 0 12px;
    color: #817781;
}

.streamit-featured-spotlight__genres {
    gap: 7px;
    margin-bottom: 15px;
}

.streamit-featured-spotlight__genres span {
    padding: 6px 10px;
    color: #e7e0e8;
    background: #3b323d;
    border: 1px solid #4c414e;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 700;
}

.streamit-featured-spotlight__highlight {
    gap: 12px;
    margin: 0 0 15px;
    color: #f4eef5;
    font-size: clamp(15px, 1.15vw, 19px);
    font-weight: 700;
}

.streamit-featured-spotlight__highlight-badge {
    display: block;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    object-fit: contain;
    border: 0;
    filter: drop-shadow(0 4px 7px rgba(0, 0, 0, .42));
}

.streamit-featured-spotlight__highlight-dot {
    box-sizing: border-box;
    background: var(--spotlight-accent);
    background: radial-gradient(circle at 34% 28%, color-mix(in srgb, var(--spotlight-accent) 58%, white) 0%, var(--spotlight-accent) 42%, color-mix(in srgb, var(--spotlight-accent) 68%, black) 100%);
    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 50%;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--spotlight-accent) 18%, transparent), 0 5px 12px rgba(0, 0, 0, .42);
}

.streamit-featured-spotlight__top {
    display: inline-flex;
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: #fff;
    background: var(--spotlight-accent);
    background: linear-gradient(145deg, color-mix(in srgb, var(--spotlight-accent) 72%, white), color-mix(in srgb, var(--spotlight-accent) 82%, black));
    border-radius: 50%;
    line-height: .8;
}

.streamit-featured-spotlight__top small {
    font-size: 8px;
    font-weight: 900;
}

.streamit-featured-spotlight__top strong {
    font-size: 19px;
}

.streamit-featured-spotlight__excerpt {
    max-width: 780px;
    margin: 0 0 18px;
    color: #bdb5be;
    font-size: 15px;
    line-height: 1.6;
}

.streamit-featured-spotlight__actions {
    gap: 10px;
}

.streamit-featured-spotlight__play,
.streamit-featured-spotlight__info {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    color: #fff !important;
    text-decoration: none !important;
    border-radius: 6px;
    transition: transform .2s ease, filter .2s ease, background .2s ease;
}

.streamit-featured-spotlight__play {
    gap: 10px;
    padding: 0 20px;
    background: var(--spotlight-accent);
    font-size: 15px;
    font-weight: 800;
    text-transform: uppercase;
}

.streamit-featured-spotlight__info {
    width: 44px;
    border: 1px solid #6b606d;
    background: #312833;
    font-family: Georgia, serif;
    font-size: 20px;
    font-weight: 700;
}

.streamit-featured-spotlight__play:hover,
.streamit-featured-spotlight__info:hover {
    color: #fff;
    filter: brightness(1.12);
    transform: translateY(-2px);
}

.streamit-featured-spotlight-empty {
    padding: 28px;
    color: #fff;
    background: #1c141d;
    border: 1px dashed #76547c;
    border-radius: 8px;
}

@media (max-width: 900px) {
    .streamit-featured-spotlight {
        grid-template-columns: 1fr;
    }

    .streamit-featured-spotlight__visual,
    .streamit-featured-spotlight__visual img {
        min-height: 330px;
        max-height: 440px;
    }

    .streamit-featured-spotlight__visual::after {
        background: linear-gradient(180deg, transparent 60%, #1c141d 100%);
    }

    .streamit-featured-spotlight__content {
        margin-top: -45px;
        padding: 28px;
    }
}

@media (max-width: 520px) {
    .streamit-featured-spotlight__ribbon-wrap {
        width: 190px;
        max-width: 42%;
    }

    .streamit-featured-spotlight__visual,
    .streamit-featured-spotlight__visual img {
        min-height: 230px;
    }

    .streamit-featured-spotlight__content {
        padding: 22px 18px 26px;
    }

    .streamit-featured-spotlight__title {
        font-size: 36px;
    }

    .streamit-featured-spotlight__excerpt {
        display: none;
    }
}

/* 5 – Minimal Luxury */
.streamit-featured-spotlight--luxury {
    grid-template-columns: 46% 54%;
    background: #06080b;
    border-color: rgba(255,255,255,.16);
}
.streamit-featured-spotlight--luxury .streamit-featured-spotlight__visual { grid-column: 2; grid-row: 1; }
.streamit-featured-spotlight--luxury .streamit-featured-spotlight__content { grid-column: 1; grid-row: 1; padding: 42px 46px; z-index: 4; }
.streamit-featured-spotlight--luxury .streamit-featured-spotlight__title { font-size: clamp(64px,7vw,112px); line-height: .82; letter-spacing: -.075em; }
.streamit-featured-spotlight--luxury .streamit-featured-spotlight__visual::after { background: linear-gradient(90deg,#06080b 0%,transparent 28%); }

/* 6 – Layered Frames */
.streamit-featured-spotlight--layered { grid-template-columns: 52% 48%; background: radial-gradient(circle at 25% 50%,#202732,#080a0e 64%); }
.streamit-featured-spotlight--layered .streamit-featured-spotlight__visual { margin: 28px 0 28px 34px; border: 1px solid rgba(255,255,255,.3); border-radius: 10px; transform: rotate(-1.2deg); box-shadow: -18px 14px 0 -5px #141922,-32px 25px 0 -10px #0e1218,0 28px 55px rgba(0,0,0,.55); overflow: hidden; }
.streamit-featured-spotlight--layered .streamit-featured-spotlight__content { padding-left: 58px; z-index: 4; }
.streamit-featured-spotlight--layered .streamit-featured-spotlight__title { text-transform: uppercase; }

/* 7 – Red Control Rail */
.streamit-featured-spotlight--sidebar { grid-template-columns: 18% 35% 47%; background: #07090d; }
.streamit-featured-spotlight--sidebar::before { content:'YUSTREAM\A FEATURED\A NOW PLAYING'; white-space:pre; display:flex; align-items:center; justify-content:center; text-align:center; font-weight:800; letter-spacing:.16em; line-height:2.2; color:#fff; background:linear-gradient(145deg,var(--spotlight-accent),color-mix(in srgb,var(--spotlight-accent),#580000 55%)); }
.streamit-featured-spotlight--sidebar .streamit-featured-spotlight__content { grid-column:2; grid-row:1; padding:34px 24px 34px 38px; z-index:4; }
.streamit-featured-spotlight--sidebar .streamit-featured-spotlight__visual { grid-column:3; grid-row:1; }
.streamit-featured-spotlight--sidebar .streamit-featured-spotlight__visual::after { background:linear-gradient(90deg,#07090d,transparent 34%); }

/* 8 – Curved Panorama */
.streamit-featured-spotlight--curved { display:block; min-height:500px; border-radius:42px 42px 18px 18px; background:#07090c; }
.streamit-featured-spotlight--curved .streamit-featured-spotlight__visual { position:absolute; inset:0 0 70px; width:100%; height:auto; border-radius:0 0 48% 48% / 0 0 16% 16%; overflow:hidden; }
.streamit-featured-spotlight--curved .streamit-featured-spotlight__visual::after { background:linear-gradient(0deg,rgba(5,7,10,.8),transparent 45%); }
.streamit-featured-spotlight--curved .streamit-featured-spotlight__content { position:absolute; z-index:5; left:5%; right:5%; bottom:22px; padding:22px 28px; display:grid; grid-template-columns:auto 1fr auto; gap:12px 24px; align-items:center; border:1px solid rgba(255,255,255,.18); border-radius:16px; background:rgba(5,8,12,.88); backdrop-filter:blur(16px); }
.streamit-featured-spotlight--curved .streamit-featured-spotlight__title { grid-row:1/4; }
.streamit-featured-spotlight--curved .streamit-featured-spotlight__excerpt { display:none; }

/* 9 – Modular Grid */
.streamit-featured-spotlight--modular { grid-template-columns:30% 30% 40%; background:#07090c; gap:8px; padding:8px; border-color:#222932; }
.streamit-featured-spotlight--modular .streamit-featured-spotlight__content { grid-column:1; grid-row:1; padding:28px; border:1px solid #242b34; border-radius:8px; }
.streamit-featured-spotlight--modular .streamit-featured-spotlight__visual { grid-column:2; grid-row:1; border-radius:8px; overflow:hidden; }
.streamit-featured-spotlight--modular::after { content:'2026  •  9 EPISODES  •  2 SEASONS\A\A CRIME  /  COMEDY  /  MYSTERY'; white-space:pre-wrap; grid-column:3; grid-row:1; display:flex; align-items:center; justify-content:center; padding:36px; color:#fff; text-align:center; font-weight:700; letter-spacing:.08em; line-height:2; border:1px solid #242b34; border-radius:8px; background:linear-gradient(145deg,#141922,#090b0f); }
.streamit-featured-spotlight--modular .streamit-featured-spotlight__meta,.streamit-featured-spotlight--modular .streamit-featured-spotlight__genres { display:none; }

/* 10 – Cinema Marquee */
.streamit-featured-spotlight--marquee { display:block; min-height:500px; background:#050608; box-shadow:inset 0 0 90px #000; }
.streamit-featured-spotlight--marquee::before,.streamit-featured-spotlight--marquee::after { content:''; position:absolute; z-index:5; top:0; bottom:0; width:68px; background:repeating-linear-gradient(180deg,#7c090d 0 18px,#b51a20 18px 36px); box-shadow:0 0 25px rgba(229,9,20,.45); pointer-events:none; }
.streamit-featured-spotlight--marquee::before { left:0; } .streamit-featured-spotlight--marquee::after { right:0; }
.streamit-featured-spotlight--marquee .streamit-featured-spotlight__visual { position:absolute; inset:0 68px; height:100%; width:auto; }
.streamit-featured-spotlight--marquee .streamit-featured-spotlight__visual::after { background:linear-gradient(0deg,rgba(3,4,6,.88),transparent 55%); }
.streamit-featured-spotlight--marquee .streamit-featured-spotlight__content { position:relative; z-index:6; align-items:center; justify-content:flex-end; min-height:500px; padding:220px 100px 35px; text-align:center; }
.streamit-featured-spotlight--marquee .streamit-featured-spotlight__excerpt { display:none; }

/* 11 – Filmstrip */
.streamit-featured-spotlight--filmstrip { grid-template-columns:40% 60%; padding:24px 72px; background:#080a0d; border-radius:4px; }
.streamit-featured-spotlight--filmstrip::before,.streamit-featured-spotlight--filmstrip::after { content:''; position:absolute; z-index:5; left:0; right:0; height:16px; background:repeating-linear-gradient(90deg,#252a31 0 14px,transparent 14px 26px); pointer-events:none; }
.streamit-featured-spotlight--filmstrip::before { top:5px; } .streamit-featured-spotlight--filmstrip::after { bottom:5px; }
.streamit-featured-spotlight--filmstrip .streamit-featured-spotlight__content { grid-column:1; grid-row:1; z-index:4; padding:34px 26px; }
.streamit-featured-spotlight--filmstrip .streamit-featured-spotlight__visual { grid-column:2; grid-row:1; border-left:1px solid rgba(255,255,255,.16); }
.streamit-featured-spotlight--filmstrip .streamit-featured-spotlight__visual::after { background:linear-gradient(90deg,#080a0d,transparent 30%); }

/* 12 – Red Glow */
.streamit-featured-spotlight--glow { display:block; min-height:470px; border:1px solid var(--spotlight-accent); background:#06080b; box-shadow:0 0 10px var(--spotlight-accent),0 0 38px color-mix(in srgb,var(--spotlight-accent),transparent 65%),inset 0 0 28px color-mix(in srgb,var(--spotlight-accent),transparent 82%); }
.streamit-featured-spotlight--glow .streamit-featured-spotlight__visual { position:absolute; inset:0; width:100%; height:100%; }
.streamit-featured-spotlight--glow .streamit-featured-spotlight__visual::after { background:linear-gradient(90deg,rgba(3,4,7,.98),rgba(3,4,7,.5) 40%,transparent 75%); }
.streamit-featured-spotlight--glow .streamit-featured-spotlight__content { position:relative; z-index:4; width:42%; min-height:470px; justify-content:center; padding:48px; }

/* 13 – Bold Editorial */
.streamit-featured-spotlight--editorial { grid-template-columns:52% 48%; background:#05070a; }
.streamit-featured-spotlight--editorial .streamit-featured-spotlight__content { grid-column:1; grid-row:1; z-index:4; padding:40px 48px; border-right:1px solid var(--spotlight-accent); }
.streamit-featured-spotlight--editorial .streamit-featured-spotlight__visual { grid-column:2; grid-row:1; clip-path:polygon(14% 0,100% 0,100% 100%,0 100%); }
.streamit-featured-spotlight--editorial .streamit-featured-spotlight__title { font-size:clamp(72px,8vw,126px); line-height:.8; letter-spacing:-.08em; }
.streamit-featured-spotlight--editorial .streamit-featured-spotlight__visual::after { background:linear-gradient(90deg,#05070a,transparent 30%); }

/* 14 – Immersive Control Dock */
.streamit-featured-spotlight--dock { display:block; min-height:510px; background:#05070a; }
.streamit-featured-spotlight--dock .streamit-featured-spotlight__visual { position:absolute; inset:0; width:100%; height:100%; }
.streamit-featured-spotlight--dock .streamit-featured-spotlight__visual::after { background:linear-gradient(0deg,rgba(3,5,8,.92),transparent 48%),linear-gradient(90deg,rgba(3,5,8,.7),transparent 35%); }
.streamit-featured-spotlight--dock .streamit-featured-spotlight__content { position:absolute; z-index:5; left:28px; bottom:28px; width:360px; padding:24px; background:rgba(4,6,9,.5); border-radius:14px; backdrop-filter:blur(10px); }
.streamit-featured-spotlight--dock .streamit-featured-spotlight__excerpt { display:none; }
.streamit-featured-spotlight--dock .streamit-featured-spotlight__progress { left:420px; right:150px; bottom:39px; width:auto; transform:none; }
.streamit-featured-spotlight--dock .streamit-featured-spotlight__mute { right:82px; bottom:24px; }

@media (max-width: 991px) {
    .streamit-featured-spotlight--sidebar { grid-template-columns:14% 42% 44%; }
    .streamit-featured-spotlight--sidebar::before { font-size:10px; }
    .streamit-featured-spotlight--modular { grid-template-columns:40% 60%; }
    .streamit-featured-spotlight--modular::after { display:none; }
    .streamit-featured-spotlight--luxury .streamit-featured-spotlight__title,.streamit-featured-spotlight--editorial .streamit-featured-spotlight__title { font-size:64px; }
}

@media (max-width: 767px) {
    .streamit-featured-spotlight--luxury,.streamit-featured-spotlight--layered,.streamit-featured-spotlight--sidebar,.streamit-featured-spotlight--modular,.streamit-featured-spotlight--filmstrip,.streamit-featured-spotlight--editorial { display:flex; flex-direction:column; padding:0; }
    .streamit-featured-spotlight--sidebar::before,.streamit-featured-spotlight--filmstrip::before,.streamit-featured-spotlight--filmstrip::after { display:none; }
    .streamit-featured-spotlight--luxury .streamit-featured-spotlight__visual,.streamit-featured-spotlight--layered .streamit-featured-spotlight__visual,.streamit-featured-spotlight--sidebar .streamit-featured-spotlight__visual,.streamit-featured-spotlight--modular .streamit-featured-spotlight__visual,.streamit-featured-spotlight--filmstrip .streamit-featured-spotlight__visual,.streamit-featured-spotlight--editorial .streamit-featured-spotlight__visual { order:0; margin:0; transform:none; clip-path:none; border-radius:0; }
    .streamit-featured-spotlight--luxury .streamit-featured-spotlight__content,.streamit-featured-spotlight--layered .streamit-featured-spotlight__content,.streamit-featured-spotlight--sidebar .streamit-featured-spotlight__content,.streamit-featured-spotlight--modular .streamit-featured-spotlight__content,.streamit-featured-spotlight--filmstrip .streamit-featured-spotlight__content,.streamit-featured-spotlight--editorial .streamit-featured-spotlight__content { order:1; padding:28px 22px; border:0; }
    .streamit-featured-spotlight--curved { min-height:auto; border-radius:18px; }
    .streamit-featured-spotlight--curved .streamit-featured-spotlight__visual,.streamit-featured-spotlight--curved .streamit-featured-spotlight__content { position:relative; inset:auto; left:auto; right:auto; bottom:auto; border-radius:0; }
    .streamit-featured-spotlight--curved .streamit-featured-spotlight__content { display:flex; margin-top:-35px; padding:28px 22px; }
    .streamit-featured-spotlight--marquee::before,.streamit-featured-spotlight--marquee::after { width:22px; }
    .streamit-featured-spotlight--marquee .streamit-featured-spotlight__visual { inset:0 22px; }
    .streamit-featured-spotlight--marquee .streamit-featured-spotlight__content { padding:220px 30px 30px; }
    .streamit-featured-spotlight--glow .streamit-featured-spotlight__content { width:auto; padding:220px 22px 28px; }
    .streamit-featured-spotlight--dock .streamit-featured-spotlight__content { left:16px; right:16px; bottom:55px; width:auto; }
    .streamit-featured-spotlight--dock .streamit-featured-spotlight__progress { left:24px; right:80px; bottom:24px; }
    .streamit-featured-spotlight--dock .streamit-featured-spotlight__mute { right:18px; bottom:10px; }
}