/* Isolated campaign styles. No changes to the institutional page sections. */
/* 14-second opening film: chaos > EVA assembly > connected system > invitation. */
.energy-tech-open { overflow:hidden; }
#energy-tech { position:fixed; inset:0; margin:auto; width:min(1100px,94vw); max-width:none; max-height:94dvh; padding:0; overflow:auto; border:1px solid #326778; border-radius:24px; background:#051423; color:#edf8ff; box-shadow:0 35px 130px #000a; }
#energy-tech::backdrop { background:#00101bda; backdrop-filter:blur(9px); }
.et-film { --et-duration:14s; position:relative; height:min(650px,90dvh); min-height:430px; overflow:hidden; padding:26px 34px; font-family:Inter,sans-serif; background:radial-gradient(ellipse at 50% 65%,#00677944,transparent 60%),linear-gradient(125deg,#07172a,#061726 55%,#082f3a); }
.et-film-top { position:relative; z-index:5; display:flex; justify-content:space-between; align-items:center; gap:12px; }
.et-brand { font-size:1.2rem; font-weight:800; letter-spacing:-.05em; }.et-brand b { color:#63e9da; }.et-brand small { display:block; font-size:.56rem; font-weight:500; letter-spacing:.12em; color:#a2c0d4; margin-top:5px; }
.et-film-controls { display:flex; gap:8px; }.et-film-controls button { cursor:pointer; border:1px solid #8ac7d43d; border-radius:22px; padding:8px 13px; background:#061b2cbf; color:#d1e7f4; font:inherit; font-size:.72rem; }
.et-film-controls button:focus-visible,.et-cta:focus-visible { outline:3px solid #5deada; outline-offset:4px; }
.et-sr { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.et-captions { position:absolute; z-index:3; top:105px; left:22px; right:22px; height:105px; text-align:center; pointer-events:none; }
.et-caption { position:absolute; inset:0; opacity:0; }.et-caption small { display:block; color:#72e6db; font-size:.62rem; letter-spacing:.18em; margin-bottom:11px; }.et-caption strong { font-size:clamp(1.55rem,3.4vw,2.5rem); color:#edf9ff; line-height:1.12; letter-spacing:-.045em; font-weight:650; }
.et-stage { position:absolute; inset:225px 65px 55px; perspective:1100px; }
.et-stage-grid { position:absolute; inset:0 -80px -100px; background-image:linear-gradient(#55e4da15 1px,transparent 1px),linear-gradient(90deg,#55e4da15 1px,transparent 1px); background-size:40px 40px; transform:rotateX(65deg) translateY(40px); mask-image:radial-gradient(ellipse,black,transparent 70%); }
.et-connections { position:absolute; inset:0; width:100%; height:100%; overflow:visible; opacity:0; }.et-connections path { fill:none; stroke:#54ecdc; stroke-width:2; stroke-dasharray:1800; stroke-dashoffset:1800; filter:drop-shadow(0 0 5px #54ecdc); }
.et-puzzle { position:absolute; width:660px; max-width:100%; height:270px; left:50%; top:25px; transform:translateX(-50%) rotateX(13deg); transform-style:preserve-3d; }
.et-piece { --x:0px; --y:0px; --r:0deg; --d:0s; position:absolute; width:calc(100% / 3 - 9px); height:118px; border:1px solid #6fa4c563; border-radius:15px; background:linear-gradient(145deg,#264958e8,#11283de8); box-shadow:0 9px 0 #06101b,0 14px 28px #0005,inset 0 1px 0 #b2f8ed25; display:grid; place-items:center; text-align:center; transform-style:preserve-3d; }
.et-piece::before { content:''; position:absolute; right:-13px; top:44px; width:24px; height:24px; border-radius:50%; background:#15374a; border-right:1px solid #67c6c866; box-shadow:6px 3px 8px #0003; }
.et-piece:nth-child(3n)::before { display:none; }.et-piece-1 { left:0; top:0; --x:-100px; --y:-28px; --r:-22deg; }.et-piece-2 { left:33.333%; top:0; --x:26px; --y:-35px; --r:18deg; --d:.1s; }.et-piece-3 { left:66.666%; top:0; --x:95px; --y:-5px; --r:25deg; --d:.2s; }.et-piece-4 { left:0; top:136px; --x:-75px; --y:55px; --r:17deg; --d:.3s; }.et-piece-5 { left:33.333%; top:136px; --x:22px; --y:48px; --r:-18deg; --d:.4s; }.et-piece-6 { left:66.666%; top:136px; --x:92px; --y:45px; --r:-24deg; --d:.5s; }
.et-problem { font-size:.82rem; color:#edc0a9; padding:10px; }.et-solution { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; flex-direction:column; opacity:0; color:#dffcf8; font-size:1rem; font-weight:650; }.et-solution i { color:#65edda; font-size:.55rem; font-style:normal; letter-spacing:.15em; margin-bottom:6px; }.et-solution small { font-weight:400; font-size:.62rem; color:#a0c6d7; margin-top:6px; }
.et-eva { position:absolute; z-index:4; width:160px; left:calc(50% - 80px); top:55px; display:flex; align-items:center; flex-direction:column; }.et-eva img { position:relative; width:140px; height:140px; object-fit:contain; filter:drop-shadow(0 0 25px #00d4e980); }.et-eva span { color:#8afbed; font-size:.75rem; font-weight:800; letter-spacing:.1em; text-align:center; white-space:nowrap; }.et-eva small { display:block; color:#9ec3d7; font-size:.5rem; font-weight:400; letter-spacing:0; margin-top:3px; }
.et-eva-ring { position:absolute; top:-10px; width:170px; height:170px; border:1px solid #70ffeb77; border-radius:50%; box-shadow:0 0 30px #00c4cd44,inset 0 0 30px #00c4cd22; transform:rotateX(55deg); }
.et-finale { position:absolute; inset:130px 30px 70px; display:flex; align-items:center; justify-content:center; flex-direction:column; text-align:center; z-index:4; opacity:0; visibility:hidden; transform:translateY(25px) scale(.94); }
.et-kicker { color:#72e6db; font-size:.61rem; letter-spacing:.13em; line-height:1.7; }.et-finale h3 { font-size:clamp(1.7rem,4vw,3.15rem); font-weight:650; letter-spacing:-.055em; line-height:1.17; color:#edfaff; margin:20px 0; }.et-finale h3 em { color:#67e8d8; font-style:normal; }.et-finale p { color:#a7c9da; font-size:.75rem; line-height:1.8; margin:0 0 24px; }
.et-cta { display:inline-flex; align-items:center; gap:22px; padding:16px 23px; border-radius:10px; color:#032b36; background:#70e8d7; font-size:.85rem; font-weight:800; text-decoration:none; box-shadow:0 8px 35px #32ddca30; }.et-cta:hover { background:#a2fff0; }
.et-film-footer { position:absolute; bottom:22px; left:34px; right:34px; display:flex; justify-content:space-between; gap:15px; color:#83a7bc; font-size:.57rem; line-height:1.5; z-index:5; }.et-film-progress { position:absolute; height:3px; background:linear-gradient(90deg,#237af4,#6ff5dc); bottom:0; left:0; width:100%; transform:scaleX(0); transform-origin:left; }
.et-playing .et-caption-chaos { animation:et-chaos-caption var(--et-duration) both linear; }.et-playing .et-caption-build { animation:et-build-caption var(--et-duration) both linear; }.et-playing .et-caption-connected { animation:et-connected-caption var(--et-duration) both linear; }
.et-playing .et-piece { animation:et-assemble var(--et-duration) both cubic-bezier(.25,.7,.3,1); animation-delay:var(--d); }.et-playing .et-problem { animation:et-problem var(--et-duration) both linear; }.et-playing .et-solution { animation:et-solution var(--et-duration) both linear; }.et-playing .et-puzzle { animation:et-board var(--et-duration) both ease-in-out; }.et-playing .et-eva { animation:et-eva-direct var(--et-duration) both ease-in-out; }.et-playing .et-eva-ring { animation:et-scan 2s linear infinite; }.et-playing .et-connections { animation:et-circuit var(--et-duration) both linear; }.et-playing .et-connections path { animation:et-draw var(--et-duration) both linear; }.et-playing .et-finale { animation:et-finale var(--et-duration) both ease-out; }.et-playing .et-film-progress { animation:et-progress var(--et-duration) both linear; }
.et-paused *, .et-paused *::before { animation-play-state:paused!important; }
@keyframes et-chaos-caption { 0%,18% { opacity:1; transform:translateY(0); } 23%,100% { opacity:0; transform:translateY(-12px); } }
@keyframes et-build-caption { 0%,22% { opacity:0; transform:translateY(12px); } 27%,43% { opacity:1; transform:translateY(0); } 48%,100% { opacity:0; transform:translateY(-12px); } }
@keyframes et-connected-caption { 0%,47% { opacity:0; transform:translateY(12px); } 52%,63% { opacity:1; transform:translateY(0); } 68%,100% { opacity:0; transform:translateY(-12px); } }
@keyframes et-assemble { 0% { opacity:0; transform:translate3d(var(--x),var(--y),-200px) rotateZ(var(--r)) rotateY(35deg) scale(.8); } 7%,20% { opacity:1; transform:translate3d(var(--x),var(--y),55px) rotateZ(var(--r)) rotateY(-18deg); } 28% { transform:translate3d(var(--x),calc(var(--y) - 18px),130px) rotateZ(var(--r)) rotateY(20deg); } 44%,100% { opacity:1; transform:translate3d(0,0,0) rotateZ(0) rotateY(0); background:linear-gradient(145deg,#164d5a,#0d2940); border-color:#5de8d599; } }
@keyframes et-problem { 0%,26% { opacity:1; } 37%,100% { opacity:0; } }
@keyframes et-solution { 0%,34% { opacity:0; transform:translateY(8px); } 44%,100% { opacity:1; transform:translateY(0); } }
@keyframes et-board { 0%,18% { transform:translateX(-50%) rotateX(13deg) rotateY(-8deg); opacity:1; } 46%,62% { transform:translateX(-50%) rotateX(22deg) rotateY(0) scale(.9); opacity:1; } 70%,100% { transform:translateX(-50%) rotateX(45deg) scale(.65); opacity:0; } }
@keyframes et-eva-direct { 0%,17% { opacity:0; transform:translateY(20px) scale(.35) rotateY(-80deg); } 24%,32% { opacity:1; transform:translateY(0) scale(1.1) rotateY(0); } 45%,61% { opacity:1; transform:translateY(210px) scale(.62); } 70%,100% { opacity:0; transform:translateY(190px) scale(.3); } }
@keyframes et-scan { to { transform:rotateX(55deg) rotateZ(360deg); } }
@keyframes et-circuit { 0%,25% { opacity:0; } 32%,60% { opacity:.8; } 68%,100% { opacity:0; } }
@keyframes et-draw { 0%,25% { stroke-dashoffset:1800; } 55%,100% { stroke-dashoffset:0; } }
@keyframes et-finale { 0%,66% { opacity:0; visibility:hidden; transform:translateY(25px) scale(.94); } 74%,100% { opacity:1; visibility:visible; transform:translateY(0) scale(1); } }
@keyframes et-progress { to { transform:scaleX(1); } }
@media (max-width:768px) { .et-film { padding:20px 18px; height:min(680px,90dvh); min-height:480px; }.et-brand { font-size:1rem; }.et-brand small { font-size:.44rem; }.et-film-controls { gap:5px; }.et-film-controls button { padding:8px 10px; font-size:.63rem; }.et-captions { top:105px; height:100px; }.et-caption small { font-size:.5rem; line-height:1.6; letter-spacing:.08em; }.et-caption strong { font-size:1.65rem; }.et-stage { inset:240px 27px 60px; }.et-puzzle { height:220px; top:0; }.et-piece { height:90px; width:calc(100% / 3 - 5px); border-radius:9px; }.et-piece-4,.et-piece-5,.et-piece-6 { top:106px; }.et-piece::before { width:15px; height:15px; right:-8px; top:35px; }.et-piece-1 { --x:-13px; --y:-25px; }.et-piece-2 { --x:0px; --y:-25px; }.et-piece-3 { --x:12px; --y:-10px; }.et-piece-4 { --x:-12px; --y:25px; }.et-piece-5 { --x:3px; --y:40px; }.et-piece-6 { --x:12px; --y:22px; }.et-problem { font-size:.63rem; padding:6px; }.et-solution { font-size:.7rem; }.et-solution small { font-size:.48rem; padding:0 3px; }.et-eva { top:25px; }.et-eva img { width:105px; height:105px; }.et-eva-ring { width:125px; height:125px; }.et-finale { inset:115px 22px 65px; }.et-finale h3 { font-size:2.05rem; }.et-finale p { font-size:.7rem; }.et-kicker { font-size:.5rem; }.et-film-footer { left:18px; right:18px; bottom:15px; font-size:.49rem; }.et-film-footer > span:first-child { max-width:50%; } }
@media (prefers-reduced-motion:reduce) { .et-playing *, .et-playing *::before { animation:none!important; }.et-captions,.et-stage { display:none; }.et-finale { opacity:1; visibility:visible; transform:none; }.et-film-progress { display:none; } }
.header .nav-menu { gap: clamp(.85rem, 1.7vw, 2rem); }
.energy-tech-link { display:inline-flex; align-items:center; gap:.55rem; margin-left:1rem; padding:.7rem 0 .7rem 1.2rem; border-left:1px solid #96b2c655; color:#006d87; font-weight:800; white-space:nowrap; font-size:1.12rem; }
.energy-tech-link .et-word { color:inherit; }.energy-tech-link b { color:#0066cc; }
.energy-tech-link::before { content:''; width:8px; height:8px; border-radius:50%; background:#0bbdb8; box-shadow:0 0 0 5px #0bbdb81a,0 0 18px #0bbdb866; }
.energy-tech-link small { font-size:.58rem; letter-spacing:.1em; color:var(--text-secondary); }
[data-theme=dark] .energy-tech-link { color:#65e7e0; }
.energy-tech-link:focus-visible,.et-shell a:focus-visible,.et-shell button:focus-visible { outline:3px solid #42e3dc; outline-offset:5px; }
@media (max-width:1150px) and (min-width:769px) { .header .nav-container { padding:0 1rem; gap:12px; }.header .logo-img { max-width:150px; }.header .nav-menu { gap:12px; font-size:.8rem; }.energy-tech-link { margin-left:0; padding-left:12px; }.energy-tech-link small { display:none; } }
@media (max-width:768px) { .header .nav-container { padding:0 14px; gap:10px; }.header .logo-img { max-width:120px; height:auto; }.header .nav-container > div { gap:10px!important; }.header .theme-toggle { width:30px; height:30px; padding:0; }.header .energy-tech-link { margin:0 0 0 auto; gap:3px; font-size:.94rem; }.header .energy-tech-link::before { width:6px; height:6px; margin-right:5px; } }