/* Compact homepage video shelf: equal thumbnails and titles below. */
.editorial-video.video-showcase{
    --video-surface:#102d3c;
    --video-accent:#ff7075;
    padding:26px 0 28px;
    background:var(--video-surface);
    border-radius:0;
    box-shadow:0 0 0 100vmax var(--video-surface);
    clip-path:inset(0 -100vmax);
    overflow:visible;
    isolation:isolate;
}
.video-showcase:before{content:'';position:absolute;z-index:-1;inset-block:0;inset-inline:calc(50% - 50vw);pointer-events:none;background:radial-gradient(ellipse at 85% 0%,#39678338,transparent 65%)}
.editorial-home .video-showcase .video-heading{margin-bottom:20px;gap:18px}
.video-showcase .video-heading-identity{display:flex;align-items:center;gap:12px;min-width:0}
.video-showcase .video-heading-icon{display:grid;place-items:center;width:44px;height:44px;flex-shrink:0;border:1px solid #ff707545;border-radius:13px;background:#e9484d14;color:var(--video-accent)}
.video-showcase .video-heading-icon svg{width:23px;height:23px;fill:currentColor}
.editorial-home .video-showcase .video-heading h2{padding:0;font-size:29px;line-height:1.3;letter-spacing:0}
.editorial-home .video-showcase .video-heading h2:after{content:none}
.editorial-home .video-showcase .editorial-kicker{color:#b5cbd6;font-size:11px;margin-bottom:4px}
.editorial-home .video-showcase .video-archive-link{padding:8px 12px;gap:12px;border:1px solid #ffffff26;border-radius:9px;color:#eef5f8;background:#ffffff04;flex-shrink:0}
.editorial-home .video-showcase .video-archive-link span{background:transparent;width:auto;height:auto;font-size:20px}
.editorial-home .video-showcase .video-archive-link:hover{background:#ffffff0c;border-color:#ff707580;color:#fff}
.editorial-home .video-showcase .video-archive-link:hover span{background:transparent;color:var(--video-accent)}
.video-showcase .video-card-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;align-items:start}
.video-showcase .story-video-card{min-width:0}
.video-showcase .story-video-card .story-link{display:block;height:auto}
.video-showcase .story-video-card .story-image{position:relative;width:100%;height:auto;min-height:0;aspect-ratio:16/9;border-radius:11px;background:#071924}
.video-showcase .story-video-card .story-image img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}
.video-showcase .story-video-card .story-copy{position:static;padding:10px 0 0}
.video-showcase .story-video-card .story-meta{font-size:11px;gap:6px;color:#b5cbd6;margin-bottom:5px;flex-wrap:wrap}
.video-showcase .story-video-card h3{font-size:18px;line-height:1.7;font-weight:800;color:#f6f9fb;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.video-showcase .story-video-card .video-play{inset:auto;top:auto;bottom:10px;left:auto;right:auto;inset-inline-start:10px;margin:0;width:36px;height:36px;border:1px solid #ffffff50;background:#e9484d;box-shadow:0 2px 10px #0003}
.video-showcase .story-video-card .video-play svg{width:17px;height:17px}
.video-showcase .story-video-card .video-duration{bottom:11px;inset-inline-start:auto;inset-inline-end:10px;font-size:10px;padding:3px 6px}
.video-showcase .demo-label{background:#ffffff0d;border:1px solid #ffffff24;color:#d7e4eb;border-radius:4px}
.video-showcase .story-link:hover h3,.video-showcase .story-link:focus-visible h3{color:var(--video-accent);text-decoration:none}
.video-showcase .story-link:focus-visible{outline:2px solid #fff;outline-offset:5px;border-radius:11px}
.video-showcase .editorial-empty{background:#ffffff08;color:#c3d6e0}
@media(max-width:1000px){
    .video-showcase .video-card-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 20px}
}
@media(max-width:600px){
    .editorial-video.video-showcase{padding-block:22px}
    .editorial-home .video-showcase .video-heading{margin-bottom:16px;gap:10px}
    .video-showcase .video-heading-identity{gap:8px}
    .video-showcase .video-heading-icon{width:36px;height:36px;border-radius:10px}
    .video-showcase .video-heading-icon svg{width:20px;height:20px}
    .editorial-home .video-showcase .video-heading h2{font-size:24px}
    .editorial-home .video-showcase .editorial-kicker{font-size:9px}
    .editorial-home .video-showcase .video-archive-link{padding:7px 9px;font-size:10px;gap:7px}
    .video-showcase .video-card-grid{gap:18px 14px}
    .video-showcase .story-video-card .story-copy{padding-top:8px}
    .video-showcase .story-video-card h3{font-size:14px;line-height:1.7}
    .video-showcase .story-video-card .story-meta{font-size:10px;gap:4px}
    .video-showcase .story-video-card .video-play{width:29px;height:29px;bottom:8px;inset-inline-start:8px}
    .video-showcase .story-video-card .video-play svg{width:14px;height:14px}
    .video-showcase .story-video-card .video-duration{bottom:9px;inset-inline-end:8px;font-size:9px;padding:2px 4px}
}
@media(prefers-reduced-motion:reduce){
    .video-showcase .story-video-card .story-image img,.video-showcase .story-video-card .video-play{transition:none}
    .video-showcase .story-link:hover .story-image img,.video-showcase .story-link:hover .video-play{transform:none}
}

/* Match the opinion band's white dots, behind the video content. */
.editorial-video.video-showcase:after{
    content:"";
    position:absolute;
    inset-block:0;
    inset-inline:calc(50% - 50vw);
    z-index:-1;
    pointer-events:none;
    background-image:url(opinion-white-dots-wide.svg);
    background-position:center;
    background-size:100% 100%;
    background-repeat:no-repeat;
    opacity:.22;
}
/* Keep dots round on mobile and fade them away from the titles. */
@media(max-width:1000px){
    .editorial-video.video-showcase:after{
        background-image:radial-gradient(circle,#fff 1px,transparent 1.4px);
        background-size:10px 10px;
        background-repeat:repeat;
        background-position:left top;
        opacity:.18;
        -webkit-mask-image:linear-gradient(to bottom,#000,transparent 220px),linear-gradient(to right,#000,transparent 70px,transparent calc(100% - 70px),#000);
        mask-image:linear-gradient(to bottom,#000,transparent 220px),linear-gradient(to right,#000,transparent 70px,transparent calc(100% - 70px),#000);
    }
}

/* The second video band shares the compact cards and white-dot texture. */
.editorial-video.video-showcase-black{--video-surface:#000}
.video-showcase-black:before{background:none}
.video-showcase-black .story-video-card .story-image{background:#111}
.editorial-home .video-showcase-tv{margin-block-end:0}
.editorial-home .video-showcase-black{margin-block-start:0}

/* One continuous backdrop for both video rubrics, with a soft black-to-blue fade. */
.home-video-bands{
    position:relative;
    isolation:isolate;
    clip-path:inset(0 -100vmax);
    margin-block:0 40px;
}
.home-video-bands:before,.home-video-bands:after{
    content:"";
    position:absolute;
    inset-block:0;
    inset-inline:calc(50% - 50vw);
    z-index:-1;
    pointer-events:none;
}
.home-video-bands:before{
    background:
        radial-gradient(ellipse at 55% 6%,#60151d24,transparent 44%),
        linear-gradient(0deg,#19354b 0%,#162e42 35%,#111923 60%,#0b0e14 80%,#08080b 100%);
}
.home-video-bands:after{
    background:radial-gradient(circle,#fff 1px,transparent 1.5px) left top/18px 18px repeat;
    opacity:.13;
}
.editorial-home .home-video-bands .editorial-video.video-showcase{
    background:transparent;
    box-shadow:none;
    clip-path:none;
    isolation:auto;
    margin-block:0;
}
.home-video-bands .editorial-video.video-showcase:before,
.home-video-bands .editorial-video.video-showcase:after{
    content:none;
    display:none;
}
@media(max-width:600px){
    .home-video-bands{margin-block-end:32px}
    .home-video-bands:after{background-size:16px 16px;opacity:.12}
}

/* Watch/listen now flows into opinion on the shared black-to-red backdrop. */
.home-video-bands-opinion:before{
    background:linear-gradient(180deg,#08080b 0%,#170d13 30%,#4b1425 52%,#9d1830 74%,#d71935 100%);
}
.editorial-home .home-video-bands-opinion .opinion-band{
    background:transparent;
    box-shadow:none;
    clip-path:none;
    isolation:auto;
    margin-block:0;
    padding-block:24px 28px;
}
.home-video-bands-opinion .opinion-band:after{content:none;display:none}
.editorial-home>.video-showcase-tv{margin-block-end:30px}
.mobile-editorial-home .mobile-opinion-gradient{margin-block:0 26px}
@media(max-width:600px){
    .editorial-home .home-video-bands-opinion .opinion-band{padding-block:20px 22px}
}

/* Reference backdrop: quiet charcoal dots, then a sloping striped red opinion surface. */
.home-video-bands.home-video-bands-opinion:before{
 background:
  radial-gradient(circle,#ffffff12 .65px,transparent .9px) left top/15px 15px repeat,
  radial-gradient(ellipse at 66% 6%,#7b241c26,transparent 48%),
  radial-gradient(ellipse at 20% 85%,#294c6120,transparent 46%),
  #0d1115;
}
.home-video-bands.home-video-bands-opinion:after{content:none;display:none}
.editorial-home .editorial-video.video-showcase-black{--video-surface:#0d1115}
.editorial-video.video-showcase-black:before{background:radial-gradient(ellipse at 66% 6%,#7b241c26,transparent 48%),radial-gradient(ellipse at 20% 85%,#294c6120,transparent 46%)}
.editorial-video.video-showcase-black:after{
 background:radial-gradient(circle,#fff .65px,transparent .9px) left top/15px 15px repeat;
 opacity:.07;-webkit-mask-image:none;mask-image:none;
}
.editorial-home .home-video-bands.home-video-bands-opinion .opinion-band{isolation:isolate}
.editorial-home .home-video-bands.home-video-bands-opinion .opinion-band:after{
 content:"";display:block;position:absolute;top:-28px;bottom:0;inset-inline:calc(50% - 50vw);z-index:-2;pointer-events:none;
 background:repeating-linear-gradient(135deg,transparent 0 20px,#ffffff07 20px 22px),linear-gradient(135deg,#851a15 0%,#a9241b 52%,#c52c22 100%);
 background-size:auto;background-repeat:repeat;background-position:center;opacity:1;
 -webkit-mask-image:none;mask-image:none;
 clip-path:polygon(0 28px,100% 0,100% 100%,0 100%);
}
