.island-films{max-width:1400px;margin:auto;padding:120px 5vw;color:var(--ink)}
.films-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;margin-bottom:42px}
.films-heading .eyebrow{color:var(--aqua);font-size:10px;letter-spacing:.2em}
.films-heading h2{font:500 clamp(38px,4.5vw,64px)/1.04 var(--serif);letter-spacing:-.045em;margin:0}
.films-heading>p{max-width:310px;font-size:13px;line-height:1.9;color:#667c80;margin:0}
.film-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.film-card{min-width:0}.film-screen{position:relative;background:#082f38;border-radius:14px;overflow:hidden;aspect-ratio:9/16;box-shadow:0 16px 40px #102d3612}
.film-screen video{display:block;width:100%;height:100%;object-fit:contain;background:#082f38}
.film-copy{padding:24px 0 0}.film-category{display:block;color:var(--aqua);font-size:9px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;margin-bottom:12px}
.film-copy h3{font:500 clamp(24px,2.3vw,32px)/1.15 var(--serif);letter-spacing:-.035em;margin:0 0 14px;min-height:2.3em}
.film-copy p{font-size:12px;line-height:1.85;color:#687e82;margin:0 0 23px;min-height:3.7em}
.film-read{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:15px 0;border-top:1px solid #102d3626;color:var(--ink);font-size:11px;font-weight:700;text-decoration:none}
.film-read span{display:grid;place-items:center;width:30px;height:30px;border:1px solid #102d3640;border-radius:50%;font-size:17px;transition:background .2s,color .2s}
.film-read:hover span{background:var(--teal);color:white}.film-read:focus-visible{outline:2px solid var(--aqua);outline-offset:5px}
.film-card{display:flex;flex-direction:column;background:#0d3942;border:1px solid #164d57;border-radius:18px;overflow:hidden;box-shadow:0 16px 35px #102d3614;transition:transform .25s,box-shadow .25s}
.film-card:hover{transform:translateY(-5px);box-shadow:0 24px 45px #102d3626}
.film-card .film-screen{border-radius:0;box-shadow:none;flex-shrink:0}
.film-card .film-copy{display:flex;flex-direction:column;flex:1;padding:27px 25px 25px;background:linear-gradient(140deg,#124650,#092f38)}
.film-card .film-category{color:#a9cfc9;font-size:9px;letter-spacing:.15em}
.film-card .film-copy h3{color:#faf8f2;font-size:clamp(24px,2.2vw,31px)}
.film-card .film-copy p{color:#c0d2d4;font-size:12px;line-height:1.9}
.film-card .film-read{margin-top:auto;padding:12px 16px;border:1px solid #e4ebdf;border-radius:7px;background:#eef1e7;color:#123840;font-size:12px;min-height:52px;transition:background .2s}
.film-card .film-read span{width:28px;height:28px;border:0;background:#0d465012;color:#0d4650}
.film-card .film-read:hover{background:#fff}.film-card .film-read:hover span{background:var(--teal);color:#fff}
.film-sound{position:absolute;right:14px;bottom:14px;z-index:2;display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 14px;border:1px solid #ffffff60;border-radius:30px;background:#082f38d9;backdrop-filter:blur(12px);color:#fff;font:600 10px/1.4 var(--sans);letter-spacing:.04em;cursor:pointer;box-shadow:0 4px 14px #0002}
.film-sound svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.film-sound:hover{background:#0d4650}.film-sound:focus-visible{outline:3px solid #fff;outline-offset:3px}
@media(prefers-reduced-motion:reduce){.film-card{transition:none}.film-card:hover{transform:none}}
.film-hero{background:radial-gradient(ellipse at top right,#24656a80,transparent 70%),#082f38;color:var(--cream);padding:170px max(5vw,calc((100vw - 1250px)/2)) 70px;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(260px,.7fr);align-items:center;gap:8vw}
.film-hero-copy .eyebrow{color:#a9ced0}.film-hero h1{font:500 clamp(44px,5.5vw,78px)/1.04 var(--serif);letter-spacing:-.045em;margin:0 0 28px;max-width:730px}
.film-hero h1 em{color:#bdd6ce;font-weight:500}.film-hero-copy>p:not(.eyebrow){font-size:15px;line-height:1.9;color:#c2d4d5;max-width:520px}
.film-breadcrumb{display:flex;flex-wrap:wrap;gap:12px;font-size:10px;color:#acc6c9;margin-bottom:45px}.film-breadcrumb a{text-decoration:none}
.film-hero .film-screen{width:100%;max-width:340px;justify-self:center;border:1px solid #ffffff30;border-radius:18px;box-shadow:0 28px 70px #00151c66}
.film-hero .film-scroll{display:inline-block;margin-top:24px;padding-bottom:10px;border-bottom:1px solid #ffffff55;color:var(--cream);font-size:11px;text-decoration:none}
.film-article{max-width:1200px;margin:auto;padding:100px 5vw;display:grid;grid-template-columns:230px minmax(0,1fr);gap:80px}
.film-article aside{align-self:start;position:sticky;top:110px;border-top:1px solid var(--line);padding-top:22px}
.film-article aside .eyebrow{color:var(--aqua)}.film-article aside a{display:block;padding:10px 0;color:#61777c;font-size:12px;text-decoration:none;line-height:1.6}.film-article aside a:hover{color:var(--aqua)}
.film-prose section{margin-bottom:42px;scroll-margin-top:110px}.film-prose h2{font:500 clamp(28px,3vw,40px)/1.15 var(--serif);letter-spacing:-.035em;margin:0 0 20px}.film-prose p{font-size:14px;line-height:1.95;color:#60767a;margin:0 0 18px}
.film-prose .film-intro{font:500 25px/1.5 var(--serif);color:var(--ink);margin-bottom:40px}
.film-next{background:var(--sand);padding:32px;border-radius:12px;margin-top:45px}.film-next h2{font-size:30px}.film-next a{display:inline-block;padding:14px 22px;background:var(--teal);color:white;font-size:12px;text-decoration:none;border-radius:4px}
.film-related{border-top:1px solid var(--line);padding-top:60px}.film-related .film-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.film-related .film-copy h3{min-height:0}.film-related .film-copy p{min-height:0}
@media(min-width:1500px){.island-films{padding-inline:40px}}
@media(max-width:900px){.film-grid{gap:18px}.film-copy h3{font-size:25px;min-height:3.45em}.film-hero{gap:35px}.film-article{gap:35px;grid-template-columns:180px minmax(0,1fr)}}
@media(max-width:650px){.island-films{padding:75px 24px}.films-heading{display:block;margin-bottom:30px}.films-heading>p{margin-top:22px;max-width:100%}.film-grid{grid-template-columns:1fr;gap:40px}.film-card{max-width:390px;width:100%;margin:auto}.film-copy h3,.film-copy p{min-height:0}.film-hero{grid-template-columns:1fr;padding:150px 24px 50px;gap:34px}.film-hero h1{font-size:45px}.film-breadcrumb{margin-bottom:30px}.film-hero .film-screen{max-width:310px}.film-article{display:block;padding:60px 24px}.film-article aside{position:static;margin-bottom:36px}.film-prose .film-intro{font-size:23px}.film-related .film-grid{grid-template-columns:1fr}.film-next{padding:25px}}