.video-background { position:relative;isolation:isolate;min-height:680px;min-height:clamp(540px,80svh,900px);display:flex;align-items:center;background:#080808;color:#fff;overflow:hidden; }
.video-background-poster,.video-background-media { position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-3; }
.video-background-media { z-index:-2;opacity:0; }
.video-background[data-playing] .video-background-media { opacity:1; }
.video-background::after { content:"";position:absolute;inset:0;background:rgb(0 0 0 / var(--video-overlay,.45));z-index:-1;pointer-events:none; }
.video-background :focus-visible { outline:3px solid white;outline-offset:5px; }
.video-background-editor { position:relative;margin-left:auto;margin-right:20px; }
.video-background-editor summary { display:flex;align-items:center;gap:12px;min-height:44px;cursor:pointer;list-style:none; }
.video-background-editor summary::-webkit-details-marker { display:none; }
.video-background-editor svg { width:16px;height:16px; }
.video-background-settings { position:absolute;right:0;top:calc(100% + 6px);width:min(340px,calc(100vw - 32px));padding:20px;background:#f7f7f3;border:1px solid #ccc;box-shadow:0 16px 40px #0003;max-height:calc(100dvh - 76px);overflow:auto; }
.video-background-settings p { margin:0 0 20px;font-size:13px;line-height:1.5; }
.video-background-settings label { display:block;margin:0 0 20px;font-size:14px; }
.video-background-settings input { display:block;margin-top:10px;width:100%;max-width:100%;accent-color:var(--accent); }
.video-background-settings input[type=file] { font-size:12px; }
.video-background-settings output { float:right; }
.video-background-settings button { padding:10px 14px;min-height:44px;border:1px solid #aaa;background:transparent;font:inherit;cursor:pointer; }
.video-background-settings>a { display:flex;align-items:center;gap:12px;margin-top:20px;min-height:44px; }
@media(max-width:760px) {
 .template-toolbar>span:first-child { display:none; }
 .video-background-editor { margin-left:0;margin-right:12px;position:static; }
 .video-background-settings { right:16px;top:56px; }
 .video-background { min-height:640px;min-height:80svh; }
}
@media(prefers-reduced-motion:reduce) { .video-background-media { opacity:0!important; } }

/* Keep the existing headline/project composition above the full-width film. */
.video-background-hero { display:block;min-height:0;overflow:clip; }
.video-background-layers { position:absolute;inset:0;z-index:-2;overflow:hidden;mask-image:linear-gradient(to bottom,transparent,#000 22%,#000 74%,transparent);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 22%,#000 74%,transparent); }
.video-background-layers .video-background-poster,.video-background-layers .video-background-media { z-index:0; }
.video-background-layers .video-background-media { z-index:1; }
.video-background-edge { position:absolute;left:0;right:0;height:28%;z-index:2;pointer-events:none;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px); }
.video-background-edge-top { top:0;mask-image:linear-gradient(#000,transparent);-webkit-mask-image:linear-gradient(#000,transparent); }
.video-background-edge-bottom { bottom:0;mask-image:linear-gradient(transparent,#000);-webkit-mask-image:linear-gradient(transparent,#000); }
.video-background-hero .hero-kicker { text-shadow:0 2px 18px #0008; }
@media(max-width:760px) { .video-background-hero { min-height:0; }.video-background-hero .home-hero-bottom { min-height:48px; } }
