/* Preserve the proportions of the actual TV output, including on phones. */
.sample-screen-shell.screen-shell { border:8px solid #17232d;border-radius:14px;background:#17232d;padding:0;overflow:hidden; }
.sample-screen-shell .sample-slides.slides { position:relative;aspect-ratio:16/9;height:auto;min-height:0;overflow:hidden; }
.sample-screen-shell .sample-slide.demo-slide { display:block;position:relative;inset:auto;min-height:0;height:auto;padding:0;margin:0;background:transparent; }
.sample-screen-shell .sample-slide[hidden] { display:none; }
.sample-open { display:block;position:relative;color:#fff; }
.sample-open img { display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;filter:none; }
.sample-enlarge { position:absolute;right:12px;bottom:12px;padding:9px 14px;background:#111d2def;border:1px solid #ffffff80;border-radius:5px;color:#fff;font:700 14px Arial,sans-serif;opacity:0;transition:opacity .15s; }
.sample-open:hover .sample-enlarge,.sample-open:focus-visible .sample-enlarge { opacity:1; }
.sample-open:focus-visible { outline:4px solid #fff;outline-offset:-4px; }
.sample-transcripts { margin:20px 0 0;border:1px solid var(--line,#abb8bf);padding:18px;border-radius:8px; }
.sample-transcripts summary { cursor:pointer;font-weight:700;min-height:44px;display:flex;align-items:center; }
.sample-transcripts section { padding:18px 0;border-top:1px solid var(--line,#abb8bf); }
.sample-transcripts h3 { font-size:22px; }
.sample-transcript { white-space:pre-line;line-height:1.6; }
.sample-dialog { width:min(96vw,1800px);max-width:96vw;max-height:94dvh;padding:16px;border:0;border-radius:12px;background:#fff;color:#17232d;box-sizing:border-box; }
.sample-dialog::backdrop { background:#08111bea; }
.sample-dialog-toolbar,.sample-dialog-actions { display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap; }
.sample-dialog-toolbar { margin-bottom:12px; }
.sample-dialog-toolbar h2 { margin:0;font:700 22px/1.25 Arial,sans-serif; }
.sample-dialog button,.sample-dialog-actions a { font:700 15px Arial,sans-serif;min-height:44px;padding:10px 16px;border:1px solid #bcc8d1;border-radius:6px;background:#f0f4f7;color:#17232d;cursor:pointer; }
.sample-dialog button:focus-visible,.sample-dialog a:focus-visible { outline:3px solid #185bad;outline-offset:2px; }
.sample-dialog-scroll { overflow:auto;max-height:66dvh;background:#101820; }
.sample-dialog-scroll img { width:100%;height:auto;display:block; }
.sample-dialog.is-zoomed .sample-dialog-scroll img { width:1920px;max-width:none; }
.sample-dialog-description { line-height:1.5; }
@media(max-width:600px) { .sample-screen-shell.screen-shell{border-width:4px;border-radius:8px}.sample-enlarge{opacity:1;font-size:11px;padding:5px 8px;right:5px;bottom:5px}.sample-dialog{padding:12px}.sample-dialog-toolbar h2{font-size:18px} }
@media(prefers-reduced-motion:reduce) { .sample-enlarge{transition:none} }

/* Six examples remain individually selectable at every viewport width. */
body[class] .demo-controls { display:flex;align-items:flex-start;gap:12px; }
body[class] .demo-controls[hidden] { display:none; }
body[class] .slide-buttons { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;flex:1;min-width:0; }
body[class] .slide-buttons button { width:100%;min-width:0;white-space:normal;text-align:left;min-height:52px; }
body[class] .slide-buttons button>span { display:inline; }
@media(max-width:600px) { body[class] .slide-buttons { grid-template-columns:repeat(2,minmax(0,1fr)); } body[class] .demo-controls { flex-wrap:wrap; } body[class] .slide-buttons { flex-basis:100%; } }

/* Show the existing screen examples in the first section of every homepage. */
body[class] .campaign-hero { min-height:0;overflow:visible; }
body[class] .campaign-layout,body[class] .sector-hero { grid-template-columns:minmax(0,2fr) minmax(0,3fr);align-items:start;gap:36px;min-height:0;padding-block:40px; }
body[class] .campaign-layout>*,body[class] .sector-hero>* { min-width:0; }
body[class] .campaign-copy h1 { font-size:clamp(44px,4.3vw,64px);letter-spacing:-.04em; }
body[class] .sector-hero h1 { font-size:clamp(48px,5vw,72px); }
body[class] .hero-slideshow.demo-section { width:100%;min-width:0;padding:0;background:transparent;scroll-margin-top:24px; }
body[class] .hero-slideshow .demo-heading { flex-direction:row;align-items:center;gap:12px;margin:0 0 12px; }
body[class] .hero-slideshow .demo-heading h2 { max-width:none;font:700 14px/1.4 Arial,Helvetica,sans-serif;letter-spacing:.04em;margin:0; }
body[class] .hero-slideshow .demo-index { display:block;flex-shrink:0;margin:0; }
body[class] .hero-slideshow .demo-controls { gap:8px;padding:12px;margin-top:16px; }
body[class] .hero-slideshow .slide-buttons button { padding:10px; }
body[class] .hero-slideshow .demo-caption { margin-top:12px; }
@media(max-width:900px) {
 body[class] .campaign-layout,body[class] .sector-hero { grid-template-columns:minmax(0,1fr);gap:32px;padding-block:24px; }
 body[class] .hero-slideshow { grid-row:1; }
}