/* DIYIA v31 — unified film system, editorial rhythm and reliable video layout */
:root{--film-ink:#090c0b;--film-paper:#f0eee8;--film-orange:#f58220}
/* A hero is one full-frame video with a single text overlay. Avoid poster image composition while playing. */
.hero-cinematic,.page-hero{position:relative!important;display:flex!important;align-items:flex-end!important;isolation:isolate!important;min-height:clamp(670px,100svh,1080px)!important;padding:clamp(110px,12vh,160px) 0 72px!important;background:#090c0b!important;overflow:hidden!important}
.page-hero{min-height:clamp(640px,93svh,960px)!important}
.hero-media,.page-hero-media{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;overflow:hidden!important;z-index:0!important;background:#0b0e0e!important;pointer-events:none!important}
.hero-media>.cinematic-video,.page-hero-media>.cinematic-video{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important;transform:none!important;filter:none!important;max-width:none!important;opacity:0!important;z-index:1!important;display:block!important}
.hero-media>.cinematic-video.is-ready,.page-hero-media>.cinematic-video.is-ready{opacity:1!important}
.hero-media>.hero-photo,.page-hero-media>.page-hero-photo{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;transform:none!important;z-index:0!important;display:block!important}
.hero-media>.hero-photo img,.page-hero-media>.page-hero-photo img{width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important;opacity:1!important;filter:none!important}
.hero-media.video-playing>.hero-photo,.page-hero-media.video-playing>.page-hero-photo{display:none!important}
.hero-media::after,.page-hero-media::after{content:'';position:absolute;inset:0;z-index:3;background:linear-gradient(90deg,rgba(5,8,8,.81),rgba(5,8,8,.45) 52%,rgba(5,8,8,.15)),linear-gradient(0deg,rgba(5,8,8,.78),transparent 68%)!important;pointer-events:none}
.hero-panel,.page-hero-panel{position:relative!important;z-index:4!important;width:var(--container)!important;max-width:100%!important;margin-inline:auto!important;padding:0 0 30px!important;align-items:end!important}
.hero-copy,.page-hero-copy{max-width:min(900px,100%)!important}
.hero-copy h1,.page-hero-copy h1{font-size:clamp(3.05rem,6vw,6rem)!important;line-height:1.04!important;letter-spacing:-.065em!important;font-weight:400!important;max-width:870px!important}
.page-hero-copy h1{font-size:clamp(3rem,5.25vw,5.7rem)!important;max-width:880px!important}
.hero-copy .lead,.page-hero-copy .lead{color:#e0e5e1!important;max-width:660px!important;line-height:1.62!important}
.hero-bottom-line{z-index:5!important}
/* Respect optical continuity: text overlays do not use a second static frame. */
.hero-media .hero-grid,.hero-media .hero-rings,.hero-media .hero-beam,.hero-media .hero-noise,.page-hero-media .page-grid,.page-hero-media .page-rings,.page-hero-media .page-beam,.page-hero-media .hero-noise{display:none!important}

/* Editorial silence between cinematic hero and paired services. */
.editorial-bridge{background:#eae9e2;color:#111714;padding:clamp(82px,10vw,158px) 0;overflow:hidden}
.editorial-grid{display:grid;grid-template-columns:minmax(0,.27fr) minmax(0,1fr);gap:clamp(24px,5vw,90px);align-items:start}
.editorial-identity{display:flex;flex-direction:column;gap:16px;color:#536057;font-size:.7rem;letter-spacing:.17em}
.editorial-line{height:2px;width:36px;background:#ed7c29;display:block}
.editorial-identity .overline{color:#536057!important}
.editorial-body{max-width:980px}
.editorial-body h2{font-size:clamp(3.2rem,6.2vw,7rem);line-height:1.04;letter-spacing:-.075em;font-weight:400;text-wrap:balance}
.editorial-body h2 em{font-style:normal;color:#c76621}
.editorial-body>p{max-width:630px;margin-top:clamp(22px,3vw,40px);color:#455047;font-size:clamp(1rem,1.4vw,1.23rem);line-height:1.7}
.editorial-pillars{margin-top:clamp(40px,6vw,90px);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.editorial-pillars span{padding:18px 0 0;border-top:1px solid #b0b8ad;color:#39463f;letter-spacing:.06em;font-size:clamp(.7rem,1vw,.88rem)}

/* Perfectly paired service stories: equal geometry, synchronized motion, equal hierarchy. */
.services-gateway{background:#101310!important;padding:clamp(76px,10vw,132px) 0!important}
.gateway-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;align-items:stretch!important;gap:clamp(14px,1.6vw,24px)!important}
.gateway-card{width:100%!important;min-width:0!important;min-height:clamp(600px,57vw,800px)!important;height:auto!important;aspect-ratio:4 / 5!important;border-radius:16px!important;display:flex!important;align-items:flex-end!important;overflow:hidden!important;transform:none!important;background:#111813!important;border:1px solid rgba(255,255,255,.14)!important;isolation:isolate!important}
.gateway-card .gateway-media{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;overflow:hidden!important;z-index:0!important}
.gateway-media .cinema-poster,.gateway-media .gateway-video{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important;transform:none!important;filter:none!important}
.gateway-media .cinema-poster{opacity:1!important;z-index:0!important}
.gateway-media .gateway-video{opacity:0!important;z-index:1!important;display:block!important}
.gateway-media .gateway-video.is-ready{opacity:1!important}
.gateway-media.video-playing>.cinema-poster{display:none!important}
.gateway-card::before{z-index:2!important;pointer-events:none!important;background:linear-gradient(0deg,rgba(2,5,4,.96) 0%,rgba(2,5,4,.72) 33%,rgba(2,5,4,.13) 76%,rgba(2,5,4,.04) 100%)!important}
.gateway-card .gateway-grid-overlay{display:none!important}
.gateway-content{position:relative!important;z-index:3!important;display:flex!important;flex-direction:column!important;justify-content:flex-end!important;align-items:flex-start!important;gap:clamp(12px,1.5vw,22px)!important;width:100%!important;max-width:100%!important;height:auto!important;min-height:355px!important;padding:clamp(28px,3.4vw,56px)!important;box-sizing:border-box!important}
.gateway-index{margin-bottom:auto!important;font-size:.69rem!important;letter-spacing:.19em!important;color:#e9a16b!important}
.gateway-content h3{font-size:clamp(2.1rem,3.1vw,3.8rem)!important;line-height:1.09!important;font-weight:400!important;letter-spacing:-.056em!important;min-height:2.18em!important;max-width:620px!important;margin:0!important;text-wrap:balance}
.gateway-content p{color:#dde1dc!important;max-width:520px!important;font-size:clamp(.91rem,1vw,1.03rem)!important;line-height:1.6!important;min-height:3.2em!important;margin:0!important}
.gateway-link{font-size:.78rem!important;letter-spacing:.065em!important;margin:6px 0 0!important;padding-bottom:9px!important;font-weight:600!important;border-bottom:1px solid rgba(255,255,255,.70)!important}
.gateway-card:hover{border-color:rgba(246,148,63,.45)!important}
.gateway-card:focus-visible{outline:3px solid #fca34f;outline-offset:4px}

/* Every cinematic surface uses exact same poster/video paint; no invisible frozen adjacent frame. */
.cinema-media,.feature-video-shell,.film-interlude-media,.solar-craft-media,.electric-film-media{overflow:hidden!important;isolation:isolate!important;background:#101310!important}
.cinema-poster{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;opacity:1!important;filter:none!important;z-index:0!important}
.cinematic-video{filter:none!important;transform:none!important;transition:opacity .28s ease!important}
.feature-video,.cinema-video,.solar-detail-video,.electric-film-video,.solar-interlude-video{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important;opacity:0!important;display:block!important;z-index:1!important}
.feature-video.is-ready,.cinema-video.is-ready,.solar-detail-video.is-ready,.electric-film-video.is-ready,.solar-interlude-video.is-ready{opacity:1!important}
.video-playing>.cinema-poster,.video-playing>img.cinema-poster{display:none!important}
/* Electrical interlude: a SINGLE full-bleed video, text above, never a top-half movie and lower poster. */
.electric-film{position:relative!important;min-height:clamp(580px,85svh,940px)!important;display:flex!important;align-items:flex-end!important;overflow:hidden!important;isolation:isolate!important;background:#0a0c0b!important;padding:120px 0 clamp(68px,8vw,120px)!important}
.electric-film-media{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;z-index:0!important;overflow:hidden!important}
.electric-film-media>.cinema-poster,.electric-film-media>.electric-film-video{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important;max-width:none!important}
.electric-film-media>.electric-film-video{opacity:0!important}
.electric-film-media>.electric-film-video.is-ready{opacity:1!important}
.electric-film-media.video-playing>.cinema-poster{display:none!important}
.electric-film-shade{position:absolute!important;inset:0!important;z-index:2!important;background:linear-gradient(90deg,rgba(4,7,7,.84),rgba(4,7,7,.30) 72%,rgba(4,7,7,.18)),linear-gradient(0deg,rgba(4,7,7,.87),transparent 60%)!important;pointer-events:none!important}
.electric-film-copy{position:relative!important;z-index:3!important;padding:0!important;width:var(--container)!important;max-width:100%!important;margin-inline:auto!important}
.electric-film-copy .overline{color:#ffaf6b!important;font-size:.7rem!important;letter-spacing:.18em!important}
.electric-film-copy h2{max-width:1000px!important;font-size:clamp(3rem,6.4vw,7rem)!important;line-height:1.03!important;letter-spacing:-.068em!important;font-weight:400!important;margin-top:20px!important}
.electric-film-copy>p{max-width:690px!important;color:#dde1dc!important;font-size:clamp(1rem,1.35vw,1.2rem)!important;line-height:1.7!important;margin-top:22px!important}
.electric-film-copy .button-ghost{margin-top:30px!important;display:inline-flex!important;background:rgba(0,0,0,.48)!important;border:1px solid rgba(255,255,255,.46)!important}

/* Solar: one contextualized film with text, never two empty video tiles in succession. */
.solar-footage-section{padding:clamp(75px,10vw,142px) 0!important;background:#eae9e3!important;color:#101613!important}
.solar-craft-grid{display:grid;grid-template-columns:minmax(0,.84fr) minmax(0,1.16fr);gap:clamp(35px,6vw,100px);align-items:center}
.solar-craft-copy{padding:clamp(20px,4vw,45px) 0}
.solar-craft-copy .overline{color:#b45e25!important;font-size:.7rem;letter-spacing:.16em}
.solar-craft-copy h2{color:#111613!important;font-size:clamp(3.1rem,5vw,6rem)!important;line-height:1.05!important;letter-spacing:-.07em!important;font-weight:400!important;margin:26px 0!important}
.solar-craft-copy>p{font-size:clamp(1rem,1.25vw,1.2rem);color:#48534b;line-height:1.75;max-width:490px}
.solar-craft-principles{display:grid;gap:0;margin:36px 0 42px;color:#29382f}
.solar-craft-principles span{padding:13px 0;border-top:1px solid #b6bdb4;font-size:.86rem;letter-spacing:.035em}
.solar-craft-principles span:last-child{border-bottom:1px solid #b6bdb4}
.solar-craft-copy .button{border-radius:6px}
.solar-craft-visual{margin:0!important;min-width:0}
.solar-craft-media{position:relative!important;aspect-ratio:4/5!important;width:100%;max-height:790px;border-radius:16px!important}
.solar-craft-index{position:absolute;bottom:20px;left:20px;z-index:3;background:rgba(0,0,0,.74);border:1px solid rgba(255,255,255,.2);color:#fff;padding:11px 14px;border-radius:5px;font-size:.65rem;letter-spacing:.12em}
.solar-craft-visual figcaption{color:#6a746e;margin-top:12px;font-size:.73rem;letter-spacing:.04em}
/* No need for a decorative second film immediately after the context section. */

@media(max-width:980px){
 .editorial-grid{grid-template-columns:1fr;gap:24px}
 .gateway-content{min-height:335px!important;padding:28px!important}
 .gateway-content h3{font-size:clamp(1.9rem,3.2vw,3rem)!important}
 .solar-craft-grid{grid-template-columns:1fr;gap:42px}
 .solar-craft-media{aspect-ratio:16/10!important;max-height:none!important}
}
@media(max-width:760px){
 .hero-cinematic,.page-hero{min-height:100svh!important;padding:110px 0 70px!important}
 .hero-panel,.page-hero-panel{width:calc(100% - 36px)!important;margin-inline:auto!important;padding:0 0 30px!important}
 .hero-copy h1,.page-hero-copy h1{font-size:clamp(2.75rem,11vw,4.2rem)!important;line-height:1.07!important}
 .hero-copy .lead,.page-hero-copy .lead{font-size:.97rem!important;line-height:1.55!important}
 .editorial-bridge{padding:74px 0}
 .editorial-body h2{font-size:clamp(2.8rem,11vw,4.8rem)}
 .editorial-pillars{grid-template-columns:1fr;gap:12px;margin-top:40px}
 .editorial-pillars span{padding-top:12px}
 .services-gateway{padding:68px 0!important}
 .gateway-grid{grid-template-columns:1fr!important;gap:16px!important}
 .gateway-card{min-height:clamp(545px,155vw,680px)!important;aspect-ratio:auto!important;border-radius:14px!important}
 .gateway-content{padding:26px!important;min-height:350px!important}
 .gateway-content h3{font-size:clamp(2.05rem,8vw,3.3rem)!important;min-height:0!important}
 .gateway-content p{min-height:0!important;font-size:.9rem!important;line-height:1.54!important}
 .electric-film{min-height:clamp(630px,94svh,800px)!important;padding:110px 0 78px!important}
 .electric-film-copy{width:calc(100% - 36px)!important}
 .electric-film-copy h2{font-size:clamp(2.7rem,11vw,4.65rem)!important}
 .electric-film-copy>p{font-size:.98rem!important}
 .solar-craft-grid{gap:35px}
 .solar-craft-copy h2{font-size:clamp(3rem,10.8vw,4.6rem)!important}
 .solar-craft-media{aspect-ratio:4/5!important}
 .solar-craft-index{bottom:14px;left:14px;right:14px;text-align:center;font-size:.58rem}
}
@media(prefers-reduced-motion:reduce){
 .cinematic-video{display:none!important}
 .hero-photo,.page-hero-photo,.cinema-poster{display:block!important}
 .gateway-card,.cinematic-video{transition:none!important}
}