@font-face{font-family:Barlow;src:url(assets/barlow-0.ttf);font-weight:500;font-display:swap}@font-face{font-family:Barlow;src:url(assets/barlow-1.ttf);font-weight:600;font-display:swap}@font-face{font-family:Barlow;src:url(assets/barlow-2.ttf);font-weight:700;font-display:swap}
:root{color-scheme:dark;--bg:#111210;--ink:#f3f1e9;--muted:#aaa9a2;--pink:#ff4da6;--line:#393a35}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.5 Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}a:hover,button:hover{color:var(--pink)}a:focus-visible,button:focus-visible{outline:2px solid var(--pink);outline-offset:6px}img{max-width:100%;display:block}button{border:0;background:none}p,h1,h2,h3,figure{margin:0}button img{width:100%}a,button{-webkit-tap-highlight-color:transparent}.skip{position:absolute;top:-80px;left:30px;background:var(--bg);padding:12px;z-index:10}.skip:focus{top:40px}.draft{font:10px/1.4 Arial,sans-serif;letter-spacing:.13em;border-bottom:1px solid #38352f;padding:9px 3.5%;display:flex;justify-content:space-between;color:#b5b2a9}.draft span:first-child::before{content:' ';display:inline-block;background:var(--pink);width:5px;height:5px;margin-right:9px;vertical-align:2px}.site-header,main,footer{width:93%;max-width:1760px;margin:auto}.site-header{display:flex;justify-content:space-between;align-items:center;padding:23px 0 26px;gap:30px}.site-header img{width:62px;height:65px;object-fit:contain}.site-header nav{display:flex;gap:33px;align-items:center}.site-header nav a{font:500 clamp(20px,2.2vw,35px)/1 Barlow,Arial,sans-serif;text-transform:uppercase;padding:12px 0;white-space:nowrap}.site-header nav a[aria-current]{color:var(--pink)}.eyebrow{font:11px/1.5 Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}.pink{color:var(--pink)}.intro{padding:52px 0 38px;display:grid;grid-template-columns:1fr 310px;gap:38px;align-items:end}.intro h1{font:600 clamp(64px,9vw,160px)/.87 Barlow,Arial,sans-serif;letter-spacing:-.027em;text-transform:uppercase}.intro h1 span{color:var(--pink)}.intro .intro-copy{font-size:16px;color:#c6c5bd;max-width:310px;padding-bottom:3px}.intro-copy p+p{margin-top:18px}.small-link{display:inline-block;border-bottom:1px solid var(--ink);padding:10px 0 4px;color:var(--ink);font-size:14px}.hero-link{display:block;position:relative;overflow:hidden;background:#232521}.hero-link img{width:100%;aspect-ratio:2.23;object-fit:cover;transition:transform .6s}.hero-link:hover img{transform:scale(1.018)}.hero-caption{display:flex;justify-content:space-between;align-items:center;padding:19px 0 0;gap:20px}.hero-caption h2{font:500 34px/1.1 Barlow,Arial,sans-serif;text-transform:uppercase;letter-spacing:-.01em}.hero-caption p{font-size:12px;color:var(--muted);margin-top:7px}.hero-caption .text-arrow{font-size:24px;color:var(--pink);padding:8px 10px}.section-heading{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid var(--line);padding-top:19px;margin:94px 0 27px;gap:20px}.section-heading h2{font:500 clamp(34px,4vw,62px)/1 Barlow,Arial,sans-serif;text-transform:uppercase}.section-heading .eyebrow{color:var(--pink)}.project-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px}.project-grid article:nth-child(2){padding-top:90px}.project-image{display:block;overflow:hidden}.project-image img{width:100%;aspect-ratio:1.53;object-fit:cover;transition:transform .6s}.project-image:hover img{transform:scale(1.02)}.project-grid article:nth-child(2) .project-image img{aspect-ratio:1.77}.project-caption{display:flex;justify-content:space-between;gap:20px;padding-top:16px}.project-caption h3{font:500 clamp(26px,2.6vw,40px)/1.1 Barlow,Arial,sans-serif;text-transform:uppercase}.project-caption p{font-size:12px;color:var(--muted);margin-top:8px}.project-caption span{color:var(--pink);font-size:23px}.process-feature{margin-top:110px;padding:40px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:grid;grid-template-columns:.75fr 1.25fr;gap:70px;align-items:center}.process-feature h2{font:600 clamp(45px,5.7vw,86px)/.93 Barlow,Arial,sans-serif;text-transform:uppercase;letter-spacing:-.02em;margin:25px 0}.process-feature .description{max-width:340px;color:#b9b9b1;font-size:16px}.process-feature .process-teaser{padding:0;width:100%;text-align:left}.process-teaser .process-window{height:380px;overflow:hidden;border:1px solid #40434b;background:#212832}.process-teaser img{width:100%;height:100%;object-fit:cover;object-position:center 60%;transition:transform .6s}.process-teaser:hover img{transform:scale(1.02)}.process-teaser .image-caption{display:flex;justify-content:space-between;font-size:12px;margin-top:12px;color:var(--muted)}.notebook{display:grid;grid-template-columns:1.35fr 1fr 1.35fr;gap:25px;align-items:start}.notebook figure:nth-child(2){padding-top:68px}.notebook figure:nth-child(3){padding-top:134px}.notebook button{display:block;padding:0;width:100%;overflow:hidden}.notebook button img{transition:transform .5s}.notebook button:hover img{transform:scale(1.02)}.notebook figcaption{font-size:12px;color:var(--muted);margin-top:13px}.back{display:inline-block;font-size:14px;border-bottom:1px solid var(--line);padding:10px 0;margin-top:28px}.case-head{padding:32px 0 34px;display:grid;grid-template-columns:1.4fr .6fr;gap:50px;align-items:end}.case-head h1{font:600 clamp(60px,8vw,130px)/.9 Barlow,Arial,sans-serif;text-transform:uppercase;letter-spacing:-.02em;margin:16px 0 0}.case-head .description{color:#bbbcb5;font-size:16px;max-width:360px}.film{background:#080908;width:100%;aspect-ratio:16/9;object-fit:contain;display:block;max-height:78vh}.film:fullscreen{max-height:none}.film-wrap{position:relative}.film-overlay{position:absolute;inset:0;width:100%;height:100%;display:flex;align-items:flex-end;padding:25px;background:linear-gradient(transparent 65%,#0008);text-align:left}.film-overlay span{display:inline-block;background:var(--bg);border:1px solid #76786f;color:var(--ink);padding:14px 22px;font-size:14px}.film-overlay[hidden]{display:none}.film-tabs{display:flex;gap:25px;border-bottom:1px solid var(--line);flex-wrap:wrap;padding:0 0 1px}.film-tabs button{font-size:13px;padding:20px 0 17px;border-bottom:2px solid transparent;color:var(--muted);min-height:44px}.film-tabs button[aria-pressed=true]{border-color:var(--pink);color:var(--ink)}.film-info{font-size:12px;color:var(--muted);margin-top:16px;min-height:36px}.case-steps{display:grid;grid-template-columns:1fr 1fr 1fr;gap:45px;margin:64px 0 75px}.case-steps .eyebrow{color:var(--pink)}.case-steps h2{font:500 30px/1.1 Barlow,Arial,sans-serif;text-transform:uppercase;margin:14px 0}.case-steps p:last-child{font-size:15px;color:var(--muted)}.case-hero img{width:100%;aspect-ratio:1.95;object-fit:cover}.stills{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin:30px 0 55px}.stills button{width:100%;padding:0;text-align:left}.stills figcaption{font-size:12px;color:var(--muted);margin-top:10px}.workflow-block{border-top:1px solid var(--line);padding-top:32px;margin-top:70px}.workflow-intro{display:flex;justify-content:space-between;gap:35px;align-items:end;margin-bottom:30px}.workflow-intro h2{font:500 clamp(38px,5vw,70px)/.95 Barlow,Arial,sans-serif;text-transform:uppercase}.workflow-intro p{max-width:380px;font-size:15px;color:var(--muted)}.workflow-tabs{display:flex;gap:26px;flex-wrap:wrap;margin-bottom:24px}.workflow-tabs button{font-size:14px;color:var(--muted);padding:12px 0;border-bottom:1px solid transparent}.workflow-tabs button[aria-pressed=true]{color:var(--ink);border-color:var(--pink)}.workflow-stage{background:#202731;display:flex;justify-content:center;border:1px solid #3c424b}.workflow-stage button{width:100%;padding:0}.workflow-stage img{height:510px;object-fit:contain;width:100%}.workflow-caption{display:flex;justify-content:space-between;color:var(--muted);font-size:12px;margin-top:13px;gap:20px}.next-project{display:flex;justify-content:space-between;gap:25px;align-items:end;border-top:1px solid var(--line);padding-top:25px;margin-top:95px}.next-project h2{font:500 clamp(35px,5vw,70px)/1 Barlow,Arial,sans-serif;text-transform:uppercase;margin-top:12px}.next-project>a{color:var(--pink);font-size:45px;padding:0 10px}.notebook-large{display:grid;grid-template-columns:1fr 1fr;gap:28px}.notebook-large button{padding:0;width:100%}.notebook-large img{width:100%;height:300px;object-fit:contain;background:#1a1b19}.notebook-large figcaption{font-size:12px;color:var(--muted);margin-top:12px}footer{margin-top:130px;padding:35px 0 25px;border-top:1px solid var(--line)}footer>a{display:block;font:500 clamp(46px,6.7vw,100px)/.97 Barlow,Arial,sans-serif;text-transform:uppercase;letter-spacing:-.02em;margin-top:30px}footer>a span{color:var(--pink)}.footer-bottom{border-top:1px solid var(--line);margin-top:45px;padding-top:24px;font-size:11px;color:var(--muted);display:flex;justify-content:space-between;gap:20px}dialog{background:var(--bg);color:var(--ink);border:1px solid var(--line);width:min(1440px,96vw);max-height:94vh;padding:16px}dialog::backdrop{background:#000d;backdrop-filter:blur(6px)}.dialog-bar{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:15px;font-size:14px}.dialog-bar button{min-height:44px;padding:9px 12px;border:1px solid var(--line)}.image-scroll{overflow:auto;max-height:78vh;background:#202731}.image-scroll img{max-width:none;width:100%;min-width:800px;margin:auto}body:has(dialog[open]){overflow:hidden}
@media(min-width:1700px){.intro{grid-template-columns:1fr 350px}.intro-copy{max-width:350px}}
@media(max-width:1050px){.site-header nav{gap:20px}.intro{grid-template-columns:1fr 250px;gap:25px}.intro-copy{font-size:14px!important}.process-feature{gap:35px}.process-teaser .process-window{height:310px}.project-grid{gap:24px}.case-head{grid-template-columns:1.2fr .8fr;gap:25px}}
@media(max-width:700px){.site-header,main,footer{width:calc(100% - 36px)}.draft{padding:9px 18px;font-size:9px}.draft span:last-child{display:none}.site-header{align-items:flex-start;padding:20px 0;gap:22px}.site-header img{width:46px;height:52px}.site-header nav{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:0 17px;max-width:290px}.site-header nav a{font-size:18px;padding:10px 0}.intro{display:block;padding:34px 0 25px}.intro h1{font-size:clamp(55px,11.8vw,82px)}.intro .intro-copy{margin-top:24px;max-width:380px;font-size:15px!important}.intro-copy p+p{margin-top:10px}.hero-link img{aspect-ratio:1.5}.hero-caption{padding-top:15px;align-items:flex-start}.hero-caption h2{font-size:27px}.hero-caption p{font-size:11px}.section-heading{margin-top:65px;display:block}.section-heading h2{font-size:40px;margin-top:12px}.project-grid{grid-template-columns:1fr;gap:38px}.project-grid article:nth-child(2){padding-top:0}.project-image img,.project-grid article:nth-child(2) .project-image img{aspect-ratio:1.77}.project-caption h3{font-size:30px}.process-feature{grid-template-columns:1fr;gap:28px;margin-top:65px;padding:30px 0}.process-feature h2{font-size:58px;margin:20px 0}.process-feature .description{max-width:100%}.process-teaser .process-window{height:300px}.notebook{grid-template-columns:1fr 1fr;gap:24px 16px}.notebook figure:nth-child(2){padding-top:45px}.notebook figure:nth-child(3){grid-column:1/-1;padding-top:0}.case-head{display:block;padding:24px 0}.case-head h1{font-size:clamp(53px,11.8vw,82px)}.case-head .description{margin-top:24px;max-width:100%;font-size:15px}.film{aspect-ratio:16/10;max-height:none}.film-overlay{padding:15px}.film-overlay span{padding:12px 18px}.film-tabs{gap:0 20px}.film-tabs button{padding:15px 0 11px;font-size:12px}.case-steps{grid-template-columns:1fr;gap:26px;margin:42px 0}.case-steps h2{margin:8px 0}.stills{gap:15px;grid-template-columns:1fr}.case-hero img{aspect-ratio:16/9}.workflow-intro{display:block}.workflow-intro p{margin-top:20px}.workflow-tabs{gap:18px}.workflow-stage img{height:300px}.workflow-caption{font-size:11px}.notebook-large{grid-template-columns:1fr}.notebook-large img{height:auto;max-height:500px}.next-project{margin-top:60px}.next-project h2{font-size:40px}footer{margin-top:75px}.footer-bottom{flex-direction:column;gap:12px}.dialog-bar{font-size:12px}dialog{padding:10px}.image-scroll img{min-width:740px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}
.image-scroll.zoomed img{width:auto;min-width:100%;max-width:none}

/* Keep the preview balanced while the football project is temporarily excluded. */
.project-grid:has(>article:only-child){grid-template-columns:minmax(0,1fr)}
.project-grid>article:only-child .project-image img{aspect-ratio:16/9}
.notebook:has(>figure:last-child:nth-child(2)){grid-template-columns:1fr 1.35fr}

/* Selected films supplied and prioritised by the author, 26 October. */
.featured-film>.film-info{display:none}
.featured-film .film{max-height:none;aspect-ratio:16/9}
.selected-films-grid{row-gap:54px}
.selected-films-grid .project-image img{aspect-ratio:16/9}
.selected-films-grid .square-study img{object-fit:contain;background:#090a09}
.reference-sheet{max-width:800px;margin:64px auto}
.reference-sheet .eyebrow{margin-bottom:18px}
.reference-sheet button{padding:0;width:100%;cursor:zoom-in}
.maritime-case{max-width:850px;margin:auto}
.maritime-case .film{aspect-ratio:1;max-height:80vh}
@media(max-width:700px){.featured-film .hero-caption{display:block}.featured-film .hero-caption>.small-link{margin-top:13px}.selected-films-grid{row-gap:38px}.reference-sheet{margin:42px auto}.maritime-case .film{max-height:none}}

/* Restore the previous image-led proposal; Coastal Motion is an addition. */
.coastal-addition{margin-top:76px}
.study-links{display:flex;gap:28px;flex-wrap:wrap;margin-top:22px}
@media(max-width:700px){.coastal-addition{margin-top:52px}.study-links{gap:8px 20px}.study-links .small-link{font-size:12px}}

/* Full-width process images retain the complete canvas, at its original aspect ratio. */
.process-feature{display:block;padding:34px 0 0;margin-top:86px}
.process-feature-heading{display:grid;grid-template-columns:1.3fr 1fr;gap:60px;align-items:end;margin-bottom:34px}
.process-feature-heading h2{font-size:clamp(54px,7vw,112px);margin:16px 0 0}
.process-feature-heading .description{max-width:430px}
.process-feature-heading .small-link{margin-top:12px}
.process-canvas{width:100%;margin:0 0 68px}
.process-canvas>button{display:block;width:100%;padding:0;cursor:zoom-in;border:1px solid #40434b;background:#212832}
.process-canvas img{width:100%;height:auto;max-height:none;object-fit:contain}
.process-canvas figcaption{display:flex;justify-content:space-between;align-items:baseline;gap:22px;margin-top:14px;font-size:13px;color:var(--muted)}
.process-canvas figcaption>span{display:flex;gap:22px;align-items:baseline}
.process-canvas .process-number{font-size:10px;letter-spacing:.12em;color:var(--pink);white-space:nowrap}
.process-canvas figcaption button{padding:8px 0;font-size:12px;white-space:nowrap;min-height:44px}
.process-studies-heading{display:flex;justify-content:space-between;align-items:baseline;gap:28px;margin:30px 0 28px;padding-top:28px;border-top:1px solid var(--line)}
.process-studies-heading h3{font:500 clamp(32px,4vw,60px)/1 Barlow,Arial,sans-serif;text-transform:uppercase}
.process-feature .process-canvas:last-child{margin-bottom:28px}
.workflow-stage img{width:100%;height:auto;max-height:none;object-fit:contain}
.workflow-stage button{cursor:zoom-in}
.image-scroll:not(.zoomed) img{width:100%;min-width:0;max-width:100%;height:auto}
.image-scroll.zoomed img{width:auto;min-width:0;max-width:none;height:auto;margin:0}
@media(max-width:700px){
 .process-feature{margin-top:60px;padding-top:28px}
 .process-feature-heading{display:block;margin-bottom:26px}
 .process-feature-heading h2{font-size:56px;margin:15px 0 22px}
 .process-feature-heading .description{max-width:100%;font-size:15px}
 .process-canvas{margin-bottom:40px}
 .process-canvas figcaption{gap:14px;font-size:11px;margin-top:10px}
 .process-canvas figcaption>span{display:block}
 .process-canvas .process-number{display:block;margin-bottom:5px;font-size:9px}
 .process-canvas figcaption button{font-size:11px}
 .process-studies-heading{display:block;margin-top:18px;padding-top:22px}
 .process-studies-heading h3{margin-top:12px;font-size:40px}
}

/* The supplied reference canvas leads; the second capture supports it. */
.process-canvas-secondary{width:76%;margin-left:auto}
@media(max-width:700px){.process-canvas-secondary{width:100%}}

/* A sequence of films at different scales; keep the case pages unchanged. */
main:focus{outline:none}
.film-sequence .section-heading{margin-bottom:46px}
.film-story{display:grid;grid-template-columns:minmax(0,3fr) minmax(180px,1fr);gap:clamp(24px,4vw,76px);align-items:center}
.film-story+.film-story{margin-top:clamp(72px,8vw,140px)}
.film-story-coast{grid-template-columns:minmax(180px,1fr) minmax(0,3.5fr)}
.film-story-coast .story-image{grid-column:2;grid-row:1}
.film-story-coast .story-copy{grid-column:1;grid-row:1}
.story-image{position:relative;display:block;overflow:hidden;aspect-ratio:16/9;background:#1a1b19}
.story-image img{width:100%;height:100%;object-fit:contain;transition:transform .6s}
.story-image:hover img{transform:scale(1.015)}
.story-image::after{content:'';position:absolute;inset:60% 0 0;background:linear-gradient(transparent,#0005);pointer-events:none}
.story-watch{position:absolute;bottom:22px;left:24px;z-index:1;display:flex;align-items:center;gap:24px;background:var(--bg);border:1px solid #76786f;padding:13px 19px;color:var(--ink);font-size:14px;transition:border-color .2s}
.story-watch>span{color:var(--pink);font-size:19px;line-height:1}
.story-image:hover .story-watch{border-color:var(--pink)}
.story-copy h3{font:600 clamp(48px,5.2vw,84px)/.95 Barlow,Arial,sans-serif;text-transform:uppercase;letter-spacing:-.02em;margin:21px 0 24px}
.story-description{font-size:clamp(14px,1.2vw,18px);line-height:1.55;color:#d3d2ca}
.story-credit{margin-top:28px;color:var(--muted);font-size:12px;line-height:1.65}
.exploration-links{display:flex;align-items:baseline;justify-content:flex-end;gap:36px;margin-top:52px}
.exploration-links .small-link{display:inline-flex;gap:30px;min-height:44px}
.exploration-links .small-link span{color:var(--pink)}
.film-sequence+.process-feature{margin-top:100px}
.camera-process{margin-top:100px;padding-top:30px;border-top:1px solid var(--line)}
.camera-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:35px;margin-bottom:34px}
.camera-heading h2{font:600 clamp(44px,5.5vw,88px)/.95 Barlow,Arial,sans-serif;text-transform:uppercase;letter-spacing:-.02em;margin-top:20px}
.camera-heading>p{font-size:15px;color:var(--muted);max-width:360px;line-height:1.65}
.camera-pair{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.camera-stage figcaption{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-bottom:14px;font-size:17px}
.camera-stage figcaption>span:last-child{font-size:11px;color:var(--muted)}
.camera-number{color:var(--pink);font-size:11px;letter-spacing:.1em;margin-right:12px}
.camera-media{position:relative;background:#080908;aspect-ratio:16/9}
.camera-media video{display:block;width:100%;height:100%;object-fit:contain}
.camera-media .film-overlay{padding:18px}
.camera-media .film-overlay span{font-size:13px;padding:12px 18px}
.camera-process+.process-feature{margin-top:84px}
@media(max-width:1050px){
 .film-story,.film-story-coast{gap:28px}
 .story-copy h3{font-size:clamp(42px,5.4vw,62px);margin:15px 0 18px}
 .story-copy .eyebrow{font-size:10px;letter-spacing:.09em}
 .story-credit{margin-top:18px;font-size:11px}
 .exploration-links{gap:24px}
}
@media(max-width:760px){
 .film-sequence .section-heading{margin-bottom:28px}
 .film-story,.film-story-coast{display:flex;flex-direction:column;align-items:stretch;gap:19px}
 .film-story+.film-story{margin-top:58px}
 .story-copy{display:grid;grid-template-columns:1fr 1fr;gap:12px 20px;align-items:start}
 .story-copy .eyebrow{grid-column:1/-1}
 .story-copy h3{font-size:44px;margin:0;grid-row:2/4}
 .story-description{font-size:13px}
 .story-credit{margin:0;font-size:10px}
 .story-watch{left:14px;bottom:14px;font-size:12px;padding:10px 14px;gap:20px}
 .exploration-links{flex-wrap:wrap;justify-content:flex-start;gap:8px 26px;margin-top:38px}
 .exploration-links .eyebrow{width:100%}
 .exploration-links .small-link{font-size:12px;gap:12px}
 .film-sequence+.process-feature{margin-top:64px}
 .camera-process{margin-top:64px;padding-top:24px}
 .camera-heading{display:block;margin-bottom:28px}
 .camera-heading h2{font-size:44px;margin-top:14px}
 .camera-heading>p{font-size:14px;margin-top:20px}
 .camera-pair{grid-template-columns:1fr;gap:30px}
 .camera-stage figcaption{font-size:15px;margin-bottom:12px}
 .camera-media .film-overlay{padding:12px}
 .camera-media .film-overlay span{font-size:12px;padding:10px 14px}
 .camera-process+.process-feature{margin-top:58px}
}
