:root { --c-night:#050506; --c-paper:#f3f1ea; --c-ink:#171a1c; --c-red:#ff0037; --c-cyan:#69cdd8; --c-blue:#347fd1; }
html { scroll-behavior:smooth; }
body.c-journey { margin:0; overflow-x:hidden; background:var(--c-night); color:#f9faf8; font-family:Montserrat,Arial,sans-serif; }
.c-journey * { box-sizing:border-box; }
.c-journey a { color:inherit; }
.c-wrap { width:min(100% - 10vw,1480px); margin:auto; }
.c-dark,.c-light { position:relative; isolation:isolate; overflow:clip; }
.c-dark { background:var(--c-night); }
.c-light { background:var(--c-paper); color:var(--c-ink); }
.c-speckles { position:absolute; z-index:-1; inset:0; width:100%; height:100%; object-fit:cover; opacity:.32; mix-blend-mode:screen; pointer-events:none; }
.c-light>.c-speckles { filter:invert(1); mix-blend-mode:multiply; opacity:.15; }
.c-header { position:fixed; z-index:70; top:0; left:0; right:0; min-height:76px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:20px; padding:12px clamp(20px,4vw,70px); border-bottom:1px solid #ffffff2a; background:#080a0acb; backdrop-filter:blur(16px); font-size:13px; }
.c-header a { text-decoration:none; }
.c-header a:first-child:hover { color:var(--c-cyan); }
.c-header>span { justify-self:end; color:#aaa; font-size:11px; letter-spacing:.15em; text-transform:uppercase; }
.c-brand { white-space:nowrap; font-size:23px; font-weight:300; letter-spacing:-.06em; }
.c-brand strong { color:var(--c-red); font:700 1.5em/.7 Vollkorn,Georgia,serif; }
.c-eyebrow,.c-chapter>span,.c-work-label,.c-segue-top { color:var(--c-red); font-size:11px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; }
.c-hero { min-height:100svh; padding:150px 0 34px; }
.c-hero-content { position:relative; display:grid; grid-template-columns:1.03fr .97fr; align-items:center; gap:30px 5vw; min-height:calc(100svh - 184px); }
.c-hero-heading { position:relative; z-index:2; }
.c-hero h1 { max-width:800px; margin:25px 0 35px; font:400 clamp(64px,7vw,117px)/.9 Vollkorn,Georgia,serif; letter-spacing:-.06em; }
.c-hero h1 em,.c-chapter h2 em,.c-position h2 em,.c-identity h2 em,.c-digital h2 em { color:var(--c-cyan); font-weight:400; }
.c-hero-heading>p:not(.c-eyebrow) { max-width:630px; margin:0; color:#e2e7e6; font-size:clamp(18px,1.35vw,22px); line-height:1.68; }
.c-follow { display:inline-flex; gap:36px; align-items:center; margin-top:50px; padding-bottom:12px; border-bottom:1px solid #fff9; text-decoration:none; font-size:13px; }
.c-follow span { color:var(--c-cyan); font-size:25px; }
.c-hero-image { position:relative; z-index:2; min-width:0; margin:0; transform:rotate(2deg); }
.c-hero-image img { display:block; width:100%; max-height:610px; object-fit:contain; border-radius:30px; box-shadow:0 30px 90px #000a; }
.c-hero-image figcaption { margin-top:14px; color:#babfc0; font-size:11px; letter-spacing:.13em; text-transform:uppercase; }
.c-hero-ink { position:absolute; z-index:3; left:2%; top:12%; width:96%; height:74%; pointer-events:none; stroke:var(--c-cyan); stroke-width:2.5; stroke-linecap:round; opacity:.9; }
.c-hero-ink path { stroke-dasharray:1; stroke-dashoffset:1; animation:c-draw 2.5s .5s ease forwards; }
@keyframes c-draw { to { stroke-dashoffset:0; } }
.c-hero-facts { grid-column:1/-1; display:flex; flex-wrap:wrap; gap:12px 35px; align-self:end; padding-top:23px; border-top:1px solid #ffffff72; color:#c2c8c8; font-size:11px; text-transform:uppercase; letter-spacing:.12em; }
.c-challenge { padding:clamp(100px,11vw,180px) 0 150px; }
.c-chapter { display:grid; grid-template-columns:.6fr 1.4fr; align-items:end; gap:30px; padding-bottom:35px; border-bottom:1px solid currentColor; }
.c-chapter h2 { margin:0; font:400 clamp(55px,6.5vw,105px)/.95 Vollkorn,Georgia,serif; letter-spacing:-.05em; }
.c-large-copy { max-width:1000px; margin:90px 0 75px auto; font:400 clamp(31px,3.5vw,55px)/1.22 Vollkorn,Georgia,serif; }
.c-challenge-intro { display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,7vw,110px); max-width:1080px; margin:0 0 120px auto; }
.c-challenge-intro p,.c-challenge-close { margin:0; color:#dce0e0; font-size:clamp(17px,1.22vw,20px); line-height:1.75; }
.c-audiences { display:grid; grid-template-columns:1fr 220px 1fr; align-items:center; gap:25px; }
.c-audiences article { min-height:300px; padding:clamp(28px,3vw,52px); border:1px solid #ffffff65; border-radius:32px; background:#ffffff08; }
.c-audiences article>span { color:var(--c-cyan); font-size:11px; letter-spacing:.17em; text-transform:uppercase; }
.c-audiences h3 { margin:25px 0; font:400 clamp(39px,3.8vw,60px)/1 Vollkorn,Georgia,serif; }
.c-audiences p { margin:0; color:#d2d7d7; line-height:1.7; }
.c-audience-link { color:var(--c-cyan); text-align:center; font:500 30px Caveat,cursive; }
.c-audience-link svg { display:block; width:100%; stroke:currentColor; stroke-width:3; stroke-linecap:round; }
.c-challenge-close { max-width:800px; margin:110px 0 0 auto; }
.c-segue { padding:80px 0 120px; }
.c-segue-top { display:flex; justify-content:space-between; border-top:1px solid #fff8; padding-top:24px; }
.c-segue-stage { position:relative; height:clamp(350px,42vw,580px); display:grid; place-items:center; }
.c-segue-stage svg { width:min(100%,1050px); height:100%; stroke:var(--c-cyan); stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }
.c-segue-stage svg path { stroke-dasharray:1; stroke-dashoffset:1; transition:stroke-dashoffset 2s ease; }
.c-segue-stage.is-visible svg path { stroke-dashoffset:0; }
.c-segue-start,.c-segue-end { position:absolute; font:400 clamp(30px,4vw,60px)/1 Vollkorn,Georgia,serif; }
.c-segue-start { left:0; bottom:4%; }
.c-segue-end { right:0; bottom:4%; }
.c-hand { color:var(--c-cyan); font:500 clamp(27px,3.4vw,48px)/1 Caveat,cursive; }
.c-segue .c-hand { position:absolute; top:12%; left:35%; transform:rotate(-7deg); }
.c-segue p { max-width:650px; margin:0 auto; text-align:center; color:#dfe5e5; font-size:18px; line-height:1.6; }
.theme-bridge { height:clamp(690px,100vh,1120px); }
.theme-bridge--final .horizon-fill { filter:url(#horizon-feather-final); }
.theme-bridge--final .horizon-haze { filter:url(#horizon-haze-final); }
.c-direction { padding:clamp(110px,12vw,190px) 0 130px; }
.c-direction-intro { max-width:800px; margin:75px 0 85px auto; font:400 clamp(29px,3vw,48px)/1.25 Vollkorn,Georgia,serif; }
.c-principles { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.c-principles article { position:relative; display:flex; flex-direction:column; min-height:580px; padding:clamp(30px,3vw,50px); border:1px solid #262e3066; border-radius:32px; background:#fff9; overflow:hidden; }
.c-principle-heading { display:flex; align-items:baseline; gap:15px; }
.c-principle-heading span { color:var(--c-blue); font-size:14px; }
.c-principles h3 { margin:0; font:400 clamp(42px,4vw,65px)/1 Vollkorn,Georgia,serif; }
.c-principles p { margin:42px 0 50px; font-size:clamp(16px,1.1vw,18px); line-height:1.75; }
.c-principles svg { width:140px; height:75px; margin-top:auto; stroke:var(--c-blue); stroke-width:3; stroke-linecap:round; }
.c-principles svg path { stroke-dasharray:1; stroke-dashoffset:1; }
.c-principles article.is-visible svg path { animation:c-draw 1.6s ease forwards; }
.c-position { padding:100px 0 145px; }
.c-work-label { display:flex; justify-content:space-between; gap:25px; padding:22px 0 50px; border-top:1px solid currentColor; }
.c-position-grid { display:grid; grid-template-columns:1.2fr .8fr; gap:clamp(50px,9vw,150px); }
.c-position h2,.c-identity h2,.c-digital h2 { margin:0 0 55px; font:400 clamp(49px,5.6vw,90px)/.98 Vollkorn,Georgia,serif; letter-spacing:-.048em; }
.c-position h2 em { color:var(--c-blue); }
.c-position-grid p { max-width:740px; margin:0 0 30px; font-size:clamp(17px,1.2vw,20px); line-height:1.78; }
.c-keywords { position:relative; align-self:center; display:grid; justify-items:center; gap:35px; padding:80px 25px; }
.c-keywords>span { position:relative; z-index:1; font:400 clamp(28px,3vw,48px)/1.05 Vollkorn,Georgia,serif; text-align:center; }
.c-keywords>span:first-child { color:var(--c-blue); }
.c-keywords svg { position:absolute; inset:0; width:100%; height:100%; stroke:var(--c-blue); stroke-width:3; transform:rotate(-5deg); }
.c-keywords svg path { stroke-dasharray:1; stroke-dashoffset:1; }
.c-keywords.is-visible svg path { animation:c-draw 2s ease forwards; }
.c-exploration { display:grid; grid-template-columns:minmax(0,1fr) minmax(300px,.78fr); align-items:center; gap:clamp(45px,8vw,130px); margin-top:clamp(110px,13vw,205px); padding-top:clamp(50px,6vw,95px); border-top:1px solid #171a1c65; }
.c-exploration-label,.c-route-study-top,.c-route-study-bottom,.c-route-study figcaption { font-size:11px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; }
.c-exploration-label { color:var(--c-blue); }
.c-exploration h3 { margin:30px 0 40px; font:400 clamp(48px,5.2vw,82px)/.99 Vollkorn,Georgia,serif; letter-spacing:-.045em; }
.c-exploration h3 em { color:var(--c-blue); font-weight:400; }
.c-exploration-copy p { max-width:700px; margin:0 0 26px; font-size:clamp(17px,1.2vw,20px); line-height:1.78; }
.c-exploration-copy .c-exploration-note { max-width:570px; margin-top:43px; padding-left:23px; border-left:2px solid var(--c-blue); color:#5b6466; font-size:clamp(15px,1vw,17px); line-height:1.6; }
.c-route-study { width:100%; max-width:590px; margin:0 0 0 auto; }
.c-route-study-frame { aspect-ratio:4/5; min-height:430px; display:flex; flex-direction:column; justify-content:space-between; padding:clamp(28px,3.2vw,48px); border:1px solid #9aa4a088; border-radius:30px; background:linear-gradient(145deg,#e7eee9 0%,#d8e6e2 55%,#cbdcde 100%); color:var(--c-ink); }
.c-route-study-top,.c-route-study-bottom { display:flex; justify-content:space-between; gap:20px; color:#596b6c; }
.c-route-study-centre { display:grid; place-items:center; gap:20px; text-align:center; }
.c-route-study-centre>span { color:var(--c-blue); font:400 clamp(70px,8vw,130px)/.8 Vollkorn,Georgia,serif; letter-spacing:-.08em; }
.c-route-study-centre strong { font:400 clamp(34px,3.7vw,58px)/.95 Vollkorn,Georgia,serif; letter-spacing:-.035em; }
.c-route-study figcaption { display:flex; justify-content:space-between; gap:20px; margin-top:16px; color:#5d6563; font-weight:500; }
.c-identity { padding:clamp(110px,13vw,205px) 0 145px; }
.c-identity-layout { display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(35px,6vw,100px); }
.c-identity-copy { position:sticky; top:130px; align-self:start; }
.c-identity-copy p { max-width:550px; margin:0 0 27px; color:#d7dddd; font-size:clamp(16px,1.12vw,19px); line-height:1.75; }
.c-identity-copy .c-hand { display:block; margin-top:45px; transform:rotate(-5deg); }
.c-gallery { display:grid; gap:38px; }
.c-gallery figure { margin:0; }
.c-gallery img { display:block; width:100%; max-height:720px; object-fit:contain; border-radius:28px; background:#0c0e10; }
.c-gallery figcaption { display:flex; justify-content:space-between; padding:15px 0; border-bottom:1px solid #ffffff5c; font-size:11px; letter-spacing:.14em; text-transform:uppercase; }
.c-gallery figcaption span { color:var(--c-cyan); }
.c-digital { padding:70px 0 165px; }
.c-digital-heading { display:flex; justify-content:space-between; gap:40px; align-items:center; }
.c-digital-heading svg { width:min(28%,300px); stroke:var(--c-cyan); stroke-width:3; stroke-linecap:round; }
.c-digital-heading svg path { stroke-dasharray:1; stroke-dashoffset:1; }
.c-digital-heading.is-visible svg path { animation:c-draw 2s ease forwards; }
.c-digital-copy { display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(25px,4vw,68px); margin:30px 0 80px; }
.c-digital-copy p { margin:0; color:#d3dada; font-size:clamp(16px,1.1vw,18px); line-height:1.75; }
.c-mobile-board { margin:0; }
.c-mobile-board img { display:block; width:100%; max-height:850px; object-fit:contain; border-radius:34px; background:#050607; }
.c-mobile-board figcaption { margin-top:16px; color:#c7cece; font-size:11px; text-transform:uppercase; letter-spacing:.14em; }
.c-preview-slots { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:75px; }
.c-preview-slots>div { min-height:270px; display:flex; flex-direction:column; justify-content:space-between; gap:24px; padding:clamp(25px,3vw,50px); border:1px dashed #ffffff94; border-radius:28px; }
.c-preview-slots span,.c-preview-slots small { color:var(--c-cyan); font-size:11px; text-transform:uppercase; letter-spacing:.16em; }
.c-preview-slots strong { font:400 clamp(31px,3.3vw,54px)/1.05 Vollkorn,Georgia,serif; }
.c-preview-slots small { color:#b2baba; }
.c-impact { padding:clamp(120px,13vw,205px) 0 150px; }
.c-impact-grid { display:grid; grid-template-columns:1fr 1fr; gap:clamp(50px,9vw,145px); padding:100px 0; border-bottom:1px solid #19202472; }
.c-impact-grid h3 { margin:0 0 38px; font:400 clamp(37px,4vw,60px)/1 Vollkorn,Georgia,serif; }
.c-impact-grid ul { list-style:none; padding:0; margin:0; }
.c-impact-grid li { position:relative; padding:18px 0 18px 29px; border-top:1px solid #1a26284a; font-size:clamp(16px,1.1vw,18px); line-height:1.6; }
.c-impact-grid li::before { content:'↗'; position:absolute; left:0; color:var(--c-blue); }
.c-reflection { max-width:1120px; margin:110px auto 0; text-align:center; }
.c-reflection>span { color:var(--c-red); font-size:11px; text-transform:uppercase; letter-spacing:.18em; }
.c-reflection blockquote { margin:30px 0 35px; font:400 clamp(32px,3.7vw,58px)/1.22 Vollkorn,Georgia,serif; }
.c-reflection p { max-width:820px; margin:0 auto 22px; font-size:clamp(16px,1.15vw,19px); line-height:1.8; }
.c-footer { padding:clamp(100px,11vw,175px) 0 45px; }
.c-footer-links { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin:40px 0 100px; }
.c-footer-links a { min-height:215px; display:flex; flex-direction:column; justify-content:space-between; padding:clamp(28px,3vw,50px); border:1px solid #ffffffaa; border-radius:32px; text-decoration:none; transition:background .25s,transform .25s; }
.c-footer-links a:hover,.c-footer-links a:focus-visible { background:#14202a; transform:translateY(-5px); }
.c-footer-links span { color:var(--c-cyan); font-size:11px; text-transform:uppercase; letter-spacing:.16em; }
.c-footer-links strong { font:400 clamp(44px,4.7vw,74px)/1 Vollkorn,Georgia,serif; }
.c-footer-bottom { display:flex; justify-content:space-between; gap:25px; padding-top:30px; border-top:1px solid #ffffff6c; }
.c-footer-bottom a { text-decoration:none; font-size:13px; }
@media(max-width:1000px){ .c-wrap { width:min(100% - 50px,850px); } .c-hero-content { grid-template-columns:1fr; } .c-hero-image { max-width:650px; margin:auto; } .c-hero-ink { display:none; } .c-audiences { grid-template-columns:1fr 130px 1fr; } .c-exploration { grid-template-columns:1fr; } .c-route-study { width:min(100%,590px); margin:0 auto; } .c-identity-layout { grid-template-columns:1fr; } .c-identity-copy { position:static; } .c-gallery { grid-template-columns:repeat(3,1fr); gap:12px; } .c-gallery img { aspect-ratio:.75; object-fit:cover; } }
@media(max-width:700px){ .c-header { grid-template-columns:1fr auto; min-height:68px; } .c-header>span { display:none; } .c-brand { font-size:19px; } .c-wrap { width:min(100% - 36px,560px); } .c-hero { padding-top:115px; } .c-hero h1 { font-size:clamp(54px,12vw,76px); } .c-hero-image { margin-top:25px; } .c-chapter { grid-template-columns:1fr; gap:18px; } .c-chapter h2 { font-size:clamp(48px,11vw,75px); } .c-large-copy { margin:55px 0; } .c-challenge-intro,.c-principles,.c-position-grid,.c-digital-copy,.c-impact-grid,.c-footer-links,.c-preview-slots { grid-template-columns:1fr; } .c-audiences { grid-template-columns:1fr; } .c-audiences article { min-height:auto; } .c-audience-link { width:150px; justify-self:center; transform:rotate(90deg); } .c-challenge-close { margin-top:70px; } .c-segue-stage { height:360px; } .c-segue-start,.c-segue-end { font-size:30px; } .c-segue .c-hand { top:2%; left:11%; } .theme-bridge { height:760px; } .c-direction,.c-identity,.c-impact { padding:100px 0; } .c-principles article { min-height:430px; } .c-position { padding:80px 0 100px; } .c-keywords { min-height:340px; } .c-gallery { grid-template-columns:1fr; gap:35px; } .c-gallery img { aspect-ratio:auto; object-fit:contain; } .c-digital { padding:80px 0 110px; } .c-digital-heading svg { display:none; } .c-digital-copy { margin:5px 0 60px; } .c-impact-grid { gap:65px; padding:75px 0; } .c-reflection { margin-top:85px; } .c-footer-links { margin-bottom:70px; } .c-footer-links a { min-height:170px; } .c-footer-bottom { flex-direction:column; } }
@media(prefers-reduced-motion:reduce){ html { scroll-behavior:auto; } .c-speckles { display:none; } .c-hero-ink path,.c-principles svg path,.c-keywords svg path,.c-digital-heading svg path,.c-segue-stage svg path { animation:none!important; stroke-dashoffset:0!important; transition:none!important; } .c-footer-links a { transition:none; } }

/* The founder-to-position drawing descends into the following chapter. */
.c-segue { position:relative; z-index:2; overflow:visible; --illustration-progress:0; }
.c-segue>.c-wrap { position:relative; z-index:2; }
.c-illustration-flow { position:absolute; z-index:1; left:50%; top:80px; bottom:-45vh; width:min(45vw,500px); height:calc(100% + 45vh - 80px); overflow:visible; transform:translateX(-50%); pointer-events:none; -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 calc(100% - 13.5vh),transparent 100%); mask-image:linear-gradient(to bottom,#000 0%,#000 calc(100% - 13.5vh),transparent 100%); }
.c-illustration-flow path { stroke:var(--c-cyan); stroke-width:2.6; stroke-linecap:round; stroke-linejoin:round; stroke-dasharray:1; stroke-dashoffset:1; vector-effect:non-scaling-stroke; }
.c-illustration-flow .c-continuing-thought { stroke:url(#c-line-fade); stroke-width:3.5; }
.c-segue-stage { height:80svh; min-height:560px; }
.c-segue-stage svg { width:min(45vw,350px); height:76%; overflow:visible; }
.c-segue-end { bottom:1%; right:50%; transform:translateX(50%); white-space:nowrap; }
.c-segue-end { z-index:4; padding:.34em .8em .42em; background:radial-gradient(ellipse at center,rgba(5,6,8,.96) 0%,rgba(5,6,8,.9) 52%,rgba(5,6,8,.45) 74%,transparent 100%); text-align:center; }
.c-segue p { position:relative; z-index:4; width:min(92%,850px); max-width:none; padding:22px 55px; background:radial-gradient(ellipse at center,rgba(5,6,8,.96) 0%,rgba(5,6,8,.88) 55%,rgba(5,6,8,.4) 76%,transparent 100%); }
.c-segue .c-hand { top:45%; left:calc(50% + 105px); white-space:nowrap; }
.c-thought { position:absolute; z-index:3; color:var(--c-cyan); font:500 clamp(22px,2.2vw,34px)/1 Caveat,cursive; white-space:nowrap; }
.c-thought--one { top:7%; left:12%; transform:rotate(-7deg); }
.c-thought--two { top:23%; right:8%; transform:rotate(5deg); }
.c-thought--three { top:39%; left:4%; transform:rotate(4deg); }
.c-thought--four { top:53%; right:2%; transform:rotate(-6deg); }
.c-thought--five { top:66%; left:15%; transform:rotate(-3deg); }
.c-segue-stage svg path { transition:none!important; }
@media(max-width:700px){ .c-segue-stage { height:67svh; min-height:470px; } .c-segue-stage svg { width:min(68vw,310px); height:72%; } .c-illustration-flow { width:min(72vw,380px); } .c-segue .c-hand { left:53%; top:70%; font-size:26px; } .c-thought { font-size:22px; } .c-thought--one,.c-thought--three,.c-thought--five { left:0; } .c-thought--two,.c-thought--four { right:0; } }