.compost-film{background:radial-gradient(ellipse at 80% 8%,#345f48 0,transparent 39%),#0d3029;color:#f7f4e8;padding:110px 0 125px;overflow:hidden}.film-heading{max-width:870px;margin-bottom:44px}.film-heading h2{font:clamp(63px,7.3vw,108px)/.97 Georgia,serif;letter-spacing:-.06em;margin:17px 0 23px}.film-heading h2 em{color:#e6c38b}.film-heading p{font-size:19px;line-height:1.6;color:#d2e1d5;max-width:630px}.film-shell{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);align-items:start;gap:18px}.film-theatre{aspect-ratio:960/620;position:relative;overflow:hidden;border:8px solid #d8e3c8;border-radius:24px 5px 24px 5px;box-shadow:0 27px 70px #001c14ad;background:#1b4738;isolation:isolate}.film-frames,.film-lights{position:absolute;inset:0}.film-frame{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.035);transition:opacity 1.45s ease,transform 7s ease;pointer-events:none}.film-frame.active{opacity:1;transform:scale(1)}.film-lights{z-index:2;background:radial-gradient(circle at 50% 42%,transparent 38%,#092e268c 100%);pointer-events:none}.film-theatre:after{content:'';position:absolute;z-index:3;inset:0;background:repeating-linear-gradient(0deg,transparent 0 4px,#ffffff05 5px 6px);pointer-events:none}.film-corner{position:absolute;z-index:5;left:25px;top:24px;color:white;display:flex;align-items:baseline;text-shadow:0 2px 8px #001b16}.film-corner span{writing-mode:vertical-rl;transform:rotate(180deg);font-size:9px;letter-spacing:.18em;font-weight:900;margin-right:13px}.film-corner strong{font:76px Georgia,serif;line-height:.9}.film-corner small{font-size:16px}.film-scene-caption{position:absolute;z-index:5;left:26px;bottom:50px;color:white;text-shadow:0 2px 12px #002b20;max-width:74%}.film-scene-caption small{display:block;font-size:10px;font-weight:900;letter-spacing:.15em;color:#e9c894;margin-bottom:9px}.film-scene-caption strong{display:block;font:clamp(31px,3.1vw,51px)/1.03 Georgia,serif;letter-spacing:-.045em}.film-scene-caption span{display:block;font-size:14px;line-height:1.5;margin-top:7px}.film-bottom{position:absolute;z-index:5;bottom:0;left:0;right:0;padding:14px 22px;border-top:1px solid #ffffff5c;background:#082b23a0;display:flex;justify-content:space-between;gap:10px;color:#e9f0dd;font-size:9px;font-weight:900;letter-spacing:.14em}.film-float{position:absolute;z-index:4;color:#f3d293;text-shadow:0 0 20px #e7a04a;pointer-events:none;opacity:0}.film-float-a{left:52%;top:40%;font-size:19px;animation:filmFloat 7s ease-in-out infinite}.film-float-b{left:61%;top:55%;font-size:12px;animation:filmFloat 6s 1.5s ease-in-out infinite}.film-theatre[data-step="2"] .film-float,.film-theatre[data-step="3"] .film-float{opacity:.8}.film-reader{background:#f8f4e8;color:#163d30;border-radius:5px 24px 5px 24px;padding:26px 29px 30px;box-shadow:0 24px 60px #031c1663}.film-reader-top{display:flex;justify-content:space-between;gap:15px;border-bottom:1px solid #d6d7c7;padding-bottom:17px;color:#49705b;font-size:10px;font-weight:900;letter-spacing:.16em}.film-story{min-height:340px;padding-top:29px}.film-story>small{font-size:10px;letter-spacing:.19em;font-weight:900;color:#a0704b}.film-story h3{font:clamp(32px,3.3vw,51px)/1.05 Georgia,serif;letter-spacing:-.04em;margin:19px 0}.film-story>p{color:#4e6958;font-size:16px;line-height:1.65}.film-science{background:#e5eddf;border-left:3px solid #78a67b;padding:17px 19px;margin-top:25px}.film-science span{font-size:9px;letter-spacing:.13em;font-weight:900;color:#4c805b}.film-science p{font-size:13px;line-height:1.55;margin:8px 0 0}.film-controls{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}.film-controls button{min-height:50px;border:1px solid #6d9c77;border-radius:28px;background:#1e5840;color:white;font-size:12px;font-weight:800;cursor:pointer}.film-controls button:last-child{background:white;color:#1e5840}.film-controls button:hover{filter:brightness(1.16)}.film-controls button:focus-visible,.film-chapters button:focus-visible,.film-seek input:focus-visible{outline:3px solid #d99554;outline-offset:3px}.film-controls button[aria-pressed=true]{background:#a46e45}.film-seek{margin-top:22px}.film-seek label{display:flex;justify-content:space-between;color:#7a846f;font-size:10px;letter-spacing:.13em;font-weight:900}.film-seek input{width:100%;margin:13px 0 18px;accent-color:#347c58;cursor:pointer}.film-chapters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.film-chapters button{border:1px solid #cdd4c5;background:#f6f6e9;color:#3e684d;border-radius:8px;padding:10px 7px;text-align:left;cursor:pointer;font-size:10px;font-weight:900}.film-chapters button span{display:block;color:#617365;font-size:9px;font-weight:600;margin-top:5px}.film-chapters button[aria-current=step]{background:#245b43;color:white;border-color:#245b43}.film-chapters button[aria-current=step] span{color:#d4e3d2}.film-note{max-width:930px;font-size:12px;line-height:1.7;color:#d5e3d5;margin:23px 0 0}.film-theatre[data-step="1"] .film-frames:after{content:'';position:absolute;inset:20% 26%;background:radial-gradient(#c4e5d14d,transparent 69%);animation:filmBreath 3s ease-in-out infinite}.film-theatre[data-step="2"] .film-frames:after{content:'';position:absolute;inset:17% 29%;background:radial-gradient(#e9ae625e,transparent 70%);animation:filmBreath 3s ease-in-out infinite}@keyframes filmBreath{50%{opacity:.35;transform:scale(1.08)}}@keyframes filmFloat{0%,100%{transform:translate(0,9px);opacity:.3}45%{transform:translate(12px,-15px);opacity:.8}}@media(max-width:950px){.film-shell{grid-template-columns:1fr}.film-theatre{max-width:760px;width:100%;margin:auto}.film-reader{max-width:760px;width:100%;margin:auto}.film-story{min-height:260px}}@media(max-width:570px){.compost-film{padding:78px 0}.film-heading h2{font-size:65px}.film-heading p{font-size:16px}.film-heading{margin-bottom:28px}.film-shell{gap:0}.film-theatre{position:sticky;top:4px;z-index:4;border-width:4px;border-radius:12px 3px 12px 3px;box-shadow:0 15px 35px #00180f99}.film-corner{left:12px;top:10px}.film-corner span{font-size:6px;margin-right:7px}.film-corner strong{font-size:36px}.film-corner small{font-size:10px}.film-scene-caption{left:13px;bottom:26px;max-width:78%}.film-scene-caption small{font-size:7px;margin-bottom:4px}.film-scene-caption strong{font-size:25px}.film-scene-caption span{font-size:9px;margin-top:3px}.film-bottom{padding:6px 9px;font-size:6px}.film-bottom span{display:none}.film-reader{border-radius:0 0 17px 17px;padding:26px 20px 24px}.film-story{min-height:330px}.film-story h3{font-size:39px}.film-controls button{font-size:11px}.film-chapters button{font-size:9px}.film-note{font-size:11px}}@media(prefers-reduced-motion:reduce){.compost-film *,.compost-film *:before,.compost-film *:after{animation:none!important;transition:none!important}}

.film-question{border-top:1px solid #d4d8c8;padding:15px 0 0;margin-top:18px}.film-question span{font-size:9px;letter-spacing:.14em;font-weight:900;color:#9a704d}.film-question p{font-size:13px;line-height:1.5;color:#436750;margin:7px 0 0}
/* Väčšie pozorovacie okno na telefóne: zachová stred nádoby a viac detailu. */
@media(max-width:570px){.film-theatre{width:calc(100vw - 16px);max-width:none;margin-left:calc(50% - 50vw + 8px);aspect-ratio:4/3}.film-frame{object-position:center center}.film-scene-caption{bottom:28px}}