/* Two film intertitles: unhurried sans text and a quiet, italic emphasis. */
.opening-thought{left:clamp(28px,9vw,160px);right:clamp(28px,9vw,160px);max-width:1180px;top:49%;color:#f8f4eb}
.opening-thought .thought-marker{font-family:'DM Sans',Arial,sans-serif;display:flex;gap:17px;font-size:10px;line-height:1.4;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:#d7d9cc;margin-bottom:33px}
.opening-thought .thought-marker:before{display:none}
.thought-number{display:grid;place-items:center;width:36px;height:36px;border:1px solid #f3f0e04d;border-radius:50%;font:italic 400 17px/1 'Newsreader',Georgia,serif;letter-spacing:0;color:#e4c7a9}
.opening-thought h2{font:400 clamp(45px,5.1vw,78px)/1.25 'DM Sans',Arial,sans-serif;letter-spacing:-.045em;text-wrap:pretty}
.opening-thought h2 em{font:italic 400 1.18em/.9 'Newsreader',Georgia,serif;letter-spacing:-.035em;color:#efd3b2;font-optical-sizing:auto}
.opening-thought .thought-line{padding:0 .07em .18em;margin-left:-.035em;margin-bottom:-.10em;overflow:hidden}
.opening-thought .thought-line>span{display:block;transform-origin:left bottom}
.thought-measure{width:112px;height:1px;margin-top:38px;background:#f0ecda26;overflow:hidden}
.thought-measure i{display:block;width:100%;height:100%;background:#e3c29c;transform-origin:left center}
.thought-veil{background:linear-gradient(90deg,#07100cde 0%,#07100c99 58%,#07100c42 100%)}
.opening-top #skip-opening{background:#fff8edee;color:#294e40;border:1px solid #fff4dc7a;box-shadow:0 4px 18px #06140d1c;gap:18px}
.opening-top #skip-opening b{color:#355e4a;font-weight:400;transition:translate .3s var(--motion-out)}
.opening-bottom #play-opening{background:#101e1680;color:#f2eedf;border:1px solid #e4ead33d;box-shadow:none;backdrop-filter:blur(8px);font-weight:600}
@media(hover:hover) and (pointer:fine){.opening-top #skip-opening:hover b{translate:2px -2px}.opening-bottom #play-opening:hover{background:#f4f0e8;color:#284733}}
@media(min-width:1500px){.opening-thought h2{font-size:84px}}
@media(max-width:760px){
 .opening-thought{left:29px;right:29px;top:47%;max-width:none}
 .opening-thought h2{font-size:clamp(32px,9.6vw,57px);line-height:1.31;letter-spacing:-.04em}
 .opening-thought h2 em{font-size:1.2em;line-height:1}
 .opening-thought .thought-marker{font-size:9px;gap:13px;margin-bottom:27px;letter-spacing:.13em}
 .thought-number{width:32px;height:32px;font-size:15px}
 .opening-thought .thought-line{padding-bottom:.16em;margin-bottom:-.035em}
 .thought-measure{width:80px;margin-top:29px}
 .thought-veil{background:linear-gradient(90deg,#07100cdc,#07100c8c)}
}
@media(max-width:350px){.opening-thought{left:25px;right:25px}.opening-thought h2{font-size:31px}.opening-thought .thought-marker{margin-bottom:23px}}
@media(max-height:540px){
 .opening-thought{left:8vw;right:8vw;top:49%}
 .opening-thought h2{font-size:clamp(24px,6.6vh,36px);line-height:1.2}
 .opening-thought .thought-marker{font-size:8px;margin-bottom:13px;gap:10px}
 .thought-number{width:24px;height:24px;font-size:13px}.thought-measure{margin-top:14px}
}
/* Both thoughts remain readable without motion or a long pinned sequence. */
.opening-reduced .opening-thought h2{font-size:clamp(21px,3.2vw,40px);line-height:1.25}
.opening-reduced .opening-thought .thought-marker{margin-bottom:12px;font-size:8px}
.opening-reduced .thought-measure{display:none}
.opening-reduced .opening-thought .thought-line>span{opacity:1!important;transform:none!important}
@media(max-width:760px){.opening-reduced .opening-thought h2{font-size:clamp(20px,6.2vw,32px)}}
@media(max-height:540px){.opening-reduced .opening-thought h2{font-size:21px}.opening-reduced .thought-number{width:22px;height:22px}}
