/* Project-led landing page: the examples open possibilities, the enquiry stays simple. */
.island-home{--project-blue:#006fad;--project-ink:#151515;--project-muted:#595959}
.island-home ::selection{background:#32a9ff;color:#071019}
.island-home .shell{width:calc(100% - 80px);max-width:1200px}
:is(.island-home,.island-contact) .site-header .nav-inner{width:calc(100% - 80px);max-width:1200px;height:80px;gap:54px;padding:0}
:is(.island-home,.island-contact) .desktop-nav{display:flex;gap:36px;font-size:15px;white-space:nowrap}
:is(.island-home,.island-contact) .nav-project{font-size:14px;padding:15px 19px;gap:14px;min-height:50px}
.island-home .island-hero{padding:56px 0 64px;background:#000;text-align:center}
.island-hero h1{max-width:1050px;margin:0 auto;font:500 clamp(48px,5.55vw,80px)/1.03 Aeonik,sans-serif;letter-spacing:-.03em;text-wrap:balance;color:#fff}
.island-hero p{max-width:600px;margin:20px auto 24px;font:18px/1.5 Hellix,sans-serif;color:#bdbdbd;text-wrap:pretty}
.island-home .island-hero .button,.island-home .island-closing .button{min-height:56px;font-size:16px;padding:17px 24px;gap:22px}
.ref-selected-project{display:flex;align-items:center;justify-content:space-between;gap:24px;border-block:1px solid var(--enquiry-line);padding:16px 0;margin:0 0 26px;text-align:left}
.ref-selected-project[hidden],.ref-step-track li[hidden]{display:none!important}
.ref-selected-project-label{display:block;font:14px/1.5 Hellix,sans-serif;color:var(--enquiry-muted);margin-bottom:4px}
#ref-selected-project-title{display:block;font:500 21px/1.25 Aeonik,sans-serif;color:var(--enquiry-ink)}
#change-project{min-height:44px;padding:10px 0 10px 16px;border:0;background:transparent;color:var(--enquiry-ink);font:15px Hellix,sans-serif;text-decoration:underline;text-underline-offset:4px;cursor:pointer}
#change-project:focus-visible{outline:2px solid var(--enquiry-accent);outline-offset:4px}
.island-home .project-ideas{position:relative;background:#fff;color:var(--project-ink);padding:48px 0 64px;scroll-margin-top:105px}
.section-alias{position:absolute;top:0;scroll-margin-top:105px}
.ideas-heading{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:32px}
.ideas-heading h2{font:500 clamp(32px,3vw,44px)/1.08 Aeonik,sans-serif;letter-spacing:-.025em;margin:0;color:var(--project-ink)}
.ideas-heading p{font:16px/1.5 Hellix,sans-serif;color:var(--project-muted);margin:16px 0 0}
.ideas-controls{display:flex;gap:8px;padding-bottom:2px}
.ideas-controls[hidden]{display:none}
.ideas-controls button{display:grid;place-items:center;width:46px;height:46px;padding:0;border:1px solid #bcbcbc;border-radius:0;background:#fff;color:#151515;cursor:pointer;transition:background .2s,color .2s}
.ideas-controls button:hover{background:#151515;border-color:#151515;color:#fff}
.ideas-controls button:focus-visible{outline:2px solid #006fad;outline-offset:4px}
.ideas-controls button:disabled{opacity:.35;cursor:default;background:#fff;border-color:#bcbcbc;color:#151515}
.ideas-controls .ideas-play{display:none}
.ideas-controls [aria-pressed=true] .ideas-play{display:block}
.ideas-controls [aria-pressed=true] .ideas-pause{display:none}
.ideas-window{overflow-x:auto;overflow-y:hidden;scrollbar-width:none;overscroll-behavior-x:contain;scroll-padding-inline:max(40px,calc((100vw - 1200px)/2));padding:4px 0 20px;outline-offset:-3px}
.ideas-window::-webkit-scrollbar{display:none;width:0;height:0}
.ideas-window:focus-visible{outline:2px solid #006fad}
.ideas-track{display:flex;gap:28px;width:max-content;margin:0;padding:0 max(40px,calc((100vw - 1200px)/2));list-style:none}
.project-idea{width:clamp(360px,36vw,500px);flex-shrink:0}
.project-idea-link{display:block;color:#151515;text-decoration:none;outline-offset:4px}
.project-idea-link>img{display:block;width:100%;height:auto;aspect-ratio:16/11;object-fit:cover;background:#edf1f2}
.project-idea-caption{display:flex;align-items:start;justify-content:space-between;gap:20px;margin-top:20px;font:500 26px/1.15 Aeonik,sans-serif;letter-spacing:-.015em}
.project-idea-caption>span{max-width:340px}
.project-idea-caption .icon{width:22px;height:22px;margin-top:3px;transition:transform .24s cubic-bezier(.16,1,.3,1)}
.project-idea-link:hover .project-idea-caption{color:#006fad}
.project-idea-link:hover .icon{transform:translate(3px,-3px)}
.project-idea-link:focus-visible{outline:2px solid #006fad}
.project-idea-description{display:block;margin-top:12px;max-width:42ch;font:16px/1.45 Hellix,sans-serif;color:#595959}
.island-process{padding:88px 0 72px;background:#000;color:#fff;scroll-margin-top:105px}
.island-process h2{margin:0 0 42px;font:500 clamp(38px,4vw,56px)/1.08 Aeonik,sans-serif;letter-spacing:-.025em}
.island-process ol{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;list-style:none;margin:0;padding:0}
.island-process li{border-top:1px solid #444;padding-top:22px}
.island-step-number{display:block;color:#72c4ff;font:15px/1.4 Hellix,sans-serif;font-variant-numeric:tabular-nums;margin-bottom:26px}
.island-process h3{margin:0 0 14px;max-width:290px;font:500 28px/1.15 Aeonik,sans-serif;letter-spacing:-.015em}
.island-process p{margin:0;max-width:34ch;color:#b2b2b2;font:17px/1.5 Hellix,sans-serif}
.island-closing{padding:76px 0 80px;text-align:center;border-bottom:1px solid #292929;background:#000;color:#fff}
.island-closing h2{margin:0;font:500 clamp(38px,4vw,56px)/1.08 Aeonik,sans-serif;letter-spacing:-.025em;text-wrap:balance}
.island-closing p{margin:20px auto 28px;max-width:560px;font:18px/1.5 Hellix,sans-serif;color:#b2b2b2}
.island-home .studio-reference-footer{padding-top:88px}
@media(min-width:800px) and (max-width:1100px){
 :is(.island-home,.island-contact) .site-header .nav-inner{gap:28px;width:calc(100% - 48px)}
 :is(.island-home,.island-contact) .desktop-nav{gap:24px;font-size:14px}
 :is(.island-home,.island-contact) .nav-project{font-size:13px;padding-inline:14px;gap:10px}
 :is(.island-home,.island-contact) .wordmark>span{font-size:21px}
 :is(.island-home,.island-contact) .wordmark img{width:21px;height:27px}
}
@media(max-width:799px){
 .island-home .shell{width:calc(100% - 40px)}
 :is(.island-home,.island-contact) .site-header .nav-inner{width:calc(100% - 40px);height:58px;gap:20px}
 :is(.island-home,.island-contact) .desktop-nav,:is(.island-home,.island-contact) .nav-project{display:none}
 .island-home .island-hero{padding:36px 0 40px}
 .island-hero h1{font-size:clamp(40px,10.3vw,60px);line-height:1.06;letter-spacing:-.03em;max-width:590px}
 .island-hero h1 br{display:initial}
 .island-hero p{font-size:17px;line-height:1.5;max-width:470px;margin:20px auto 24px}
 .island-home .island-hero .button,.island-home .island-closing .button{font-size:15px;padding-inline:20px;gap:16px}
 .island-home .project-ideas{padding:32px 0 44px;scroll-margin-top:82px}
 .section-alias{scroll-margin-top:82px}
 .ideas-heading{display:block;margin-bottom:22px}
 .ideas-heading h2{font-size:34px}
 .ideas-heading p{font-size:15px;margin-top:14px}
 .ideas-controls{justify-content:flex-end;margin-top:22px;gap:8px}
 .ideas-controls [data-ideas-motion]{display:none}
 .ideas-controls button{width:44px;height:44px}
 .ideas-window{scroll-snap-type:x mandatory;scroll-padding-inline:20px;padding-bottom:16px}
 .ideas-track{padding-inline:20px;gap:16px}
 .project-idea{width:84vw;max-width:470px;scroll-snap-align:start}
 .project-idea-caption{font-size:24px;margin-top:18px;gap:12px}
 .project-idea-caption .icon{width:20px;height:20px}
 .project-idea-description{font-size:16px;margin-top:10px}
 .island-process{padding:54px 0;scroll-margin-top:82px}
 .island-process h2{font-size:38px;margin-bottom:30px}
 .island-process ol{grid-template-columns:1fr;gap:24px}
 .island-process li{display:grid;grid-template-columns:30px 1fr;gap:18px;padding-top:24px}
 .island-step-number{margin:3px 0 0}
 .island-process h3{font-size:25px;max-width:none;margin-bottom:10px}
 .island-process p{font-size:16px;max-width:40ch}
 .island-closing{padding:54px 0 60px}
 .island-closing h2{font-size:38px}
 .island-closing p{font-size:17px;max-width:320px}
 .island-home .studio-reference-footer{padding-top:60px}
 .ref-selected-project{gap:15px}
 #ref-selected-project-title{font-size:19px}
}
@media(prefers-reduced-motion:reduce){
 .ideas-window{scroll-snap-type:x mandatory}
 .project-idea{scroll-snap-align:start}
 .ideas-controls [data-ideas-motion]{display:none}
 .project-idea-caption .icon{transition:none}
}

/* Native anchor padding already clears the sticky header; avoid doubling that gap. */
.island-home #services,.island-home #process,.island-home #contact,.island-home #platforms,.island-home #work{scroll-margin-top:0}
.reference-enquiry.ref-simple #start{scroll-margin-top:0}
@media(max-width:799px){html:has(.island-home),html:has(.island-contact){scroll-padding-top:78px}}

/* One enquiry, opened only after a visitor chooses to begin. */
html.enquiry-open{overflow:hidden;scrollbar-gutter:stable}
html.enquiry-open body{overscroll-behavior:none}
.reference-enquiry.enquiry-dialog{--enquiry-accent:#66b7ff;--enquiry-muted:#a2afbf;--enquiry-line:#596a7d;--enquiry-surface:#111b28;--enquiry-ink:#f1f6fc;box-sizing:border-box;width:min(640px,calc(100% - 48px));max-width:none;max-height:calc(100dvh - 64px);margin:auto;padding:20px 40px 36px;border:0;border-radius:0;background:#090f17;color:var(--enquiry-ink);color-scheme:dark;overflow-y:auto;overscroll-behavior:contain;scrollbar-color:#596a7d #111b28;scrollbar-width:thin;box-shadow:0 20px 70px rgb(0 0 0 / .22)}
.enquiry-dialog:not([open]){display:none}
.enquiry-dialog::backdrop{background:rgb(0 0 0 / .72)}
.enquiry-dialog-toolbar{position:sticky;top:-20px;z-index:2;display:flex;justify-content:flex-end;margin:0 -20px 8px 0;background:#090f17}
.enquiry-close{display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:0;background:transparent;color:#151515;cursor:pointer;padding:10px}
.enquiry-close:hover{background:#243b52}
.enquiry-close:focus-visible{outline:2px solid #006fad;outline-offset:2px}
.enquiry-close .icon{width:24px;height:24px}
.reference-enquiry.enquiry-dialog .ref-form-wrap{width:100%;max-width:none;padding:0;margin:0;scroll-margin:0}
.enquiry-dialog .ref-step-overview{margin-bottom:28px}
.reference-enquiry.enquiry-dialog .ref-question-header{margin-bottom:28px}
.reference-enquiry.enquiry-dialog .ref-question-header>p{font-size:32px;color:var(--enquiry-ink)}
.reference-enquiry.enquiry-dialog .ref-question{min-height:0}
.reference-enquiry.enquiry-dialog .ref-option{background:var(--enquiry-surface);color:var(--enquiry-ink);border-color:var(--enquiry-line);box-shadow:none}
.reference-enquiry.enquiry-dialog .ref-option[aria-pressed=true]{border-color:#66b7ff;color:#f1f6fc;box-shadow:inset 0 0 0 1px #66b7ff}
@media(hover:hover){.reference-enquiry.enquiry-dialog .ref-option:hover{background:#172538;color:#f1f6fc}}
.enquiry-dialog .ref-primary-action{background:#006fad;color:#fff;font-size:17px;min-height:56px}
.enquiry-dialog .ref-primary-action:hover{background:#005b91;color:#fff}
.enquiry-dialog .ref-simple-input[aria-invalid=true]{border-color:#ffb1b1}
.enquiry-dialog .ref-error{color:#ffb1b1}
.reference-enquiry.enquiry-dialog #enquiry-status{color:var(--enquiry-ink);margin:24px 0 0}
.reference-enquiry.enquiry-dialog .enquiry-preview{color:var(--enquiry-muted);margin:20px 0 0}
.enquiry-dialog #enquiry-back:hover:not(:disabled){color:var(--enquiry-accent)}
.enquiry-dialog .ref-form-note{margin-top:16px}
.enquiry-no-script{max-width:620px;padding:24px;margin:auto;text-align:center;font:17px/1.5 Hellix,sans-serif}
.contact-invitation{padding:80px 20px 88px;border:0}
.contact-invitation .ref-intro{margin-bottom:28px;padding:0}
.contact-invitation .ref-intro h1{font-size:clamp(38px,5vw,64px);line-height:1.08;margin-bottom:20px}
.contact-invitation .ref-intro p{font-size:18px;max-width:460px}
.contact-invitation .ref-hand-raise{max-width:355px;font-size:16px}
:is(.island-home,.island-contact) .studio-footer-grid{width:calc(100% - 80px);max-width:1200px;grid-template-columns:1.5fr 1fr .65fr;gap:48px}
:is(.island-home,.island-contact) .studio-footer-intro{padding:0}
:is(.island-home,.island-contact) .studio-footer-intro p{font-size:clamp(24px,2.2vw,32px);max-width:410px}
:is(.island-home,.island-contact) .studio-footer-grid nav{padding:0;gap:14px}
:is(.island-home,.island-contact) .studio-footer-grid nav a{min-height:44px}
:is(.island-home,.island-contact) .studio-footer-outline{margin-top:20px}
@media(max-width:799px){
 .reference-enquiry.enquiry-dialog{width:100%;height:100dvh;max-height:none;margin:0;padding:max(12px,env(safe-area-inset-top)) 24px max(32px,env(safe-area-inset-bottom));box-shadow:none}
 .enquiry-dialog-toolbar{top:0;margin:0 -8px 12px 0}
 .reference-enquiry.enquiry-dialog .ref-question-header>p{font-size:28px}
 .reference-enquiry.enquiry-dialog .ref-options{grid-template-columns:1fr;gap:12px}
 .reference-enquiry.enquiry-dialog .ref-option{min-height:70px;padding:20px;font-size:21px}
 .enquiry-dialog .ref-simple-input{font-size:18px}
 .enquiry-dialog .ref-step-overview{margin-bottom:24px}
 .contact-invitation{padding:48px 20px 56px}
 .contact-invitation .ref-intro p{font-size:17px}
 :is(.island-home,.island-contact) .studio-footer-grid{width:calc(100% - 40px);grid-template-columns:1.2fr 1fr;gap:32px 22px}
 :is(.island-home,.island-contact) .studio-footer-grid nav{grid-row:auto;grid-column:auto;gap:10px}
 :is(.island-home,.island-contact) .studio-footer-outline{margin-top:40px}
}
/* Native anchor padding already accounts for the fixed navigation. */
.island-home #services,.island-home #process,.island-home #contact,.island-home #work{scroll-margin-top:0}

/* A single opening gesture; content is present and readable throughout. */
.island-hero h1>span{display:inline-block;animation:hero-word-arrive .8s cubic-bezier(.16,1,.3,1) both;animation-delay:calc(var(--word) * 45ms)}
@keyframes hero-word-arrive{from{transform:translateY(.2em);filter:blur(5px);opacity:.55}to{transform:none;filter:blur(0);opacity:1}}
html.enquiry-open .island-hero h1>span{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.island-hero h1>span{animation:none;filter:none;transform:none}}

/* Mix-and-match project choices: selection stays put until Continue. */
.ref-choice-intro{margin:-12px 0 24px;text-align:center;font:16px/1.45 Hellix,sans-serif;color:var(--enquiry-muted)}
.reference-enquiry.enquiry-dialog .ref-multiselect .ref-option{gap:14px;padding:16px;min-height:76px;font-size:20px;transition:background-color .18s,border-color .18s,color .18s,transform .18s cubic-bezier(.16,1,.3,1)}
.reference-enquiry.enquiry-dialog .ref-multiselect .ref-option[aria-pressed=true]{background:#102f50;border-color:#66b7ff;color:#f1f6fc;box-shadow:inset 0 0 0 1px #66b7ff}
.ref-choice-toggle{display:grid;place-items:center;flex:0 0 28px;width:28px;height:28px;border:1px solid #6d8097;color:#b5c6d8;transition:background-color .18s,border-color .18s,color .18s}
.ref-choice-toggle svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ref-choice-plus{transform-origin:center;transition:opacity .15s,transform .22s cubic-bezier(.16,1,.3,1)}
.ref-choice-check{opacity:0;stroke-dasharray:1;stroke-dashoffset:1;transition:opacity .15s,stroke-dashoffset .25s cubic-bezier(.16,1,.3,1)}
.ref-option[aria-pressed=true] .ref-choice-toggle{background:#66b7ff;border-color:#66b7ff;color:#071523}
.ref-option[aria-pressed=true] .ref-choice-plus{opacity:0;transform:rotate(90deg) scale(.6)}
.ref-option[aria-pressed=true] .ref-choice-check{opacity:1;stroke-dashoffset:0}
.reference-enquiry.enquiry-dialog .ref-multiselect .ref-option:active{transform:scale(.98)}
.ref-selection-status{margin:12px 0 0;font:14px/1.4 Hellix,sans-serif;color:var(--enquiry-muted);font-variant-numeric:tabular-nums}
.ref-selection-status[data-selected=true]{color:#92cbff;font-weight:600}
:root .reference-site #budget-continue:disabled{cursor:default;background:#1b2735;color:#a2afbf;border-color:#3c4d61;opacity:1}
.ref-reply-fields{margin-top:18px}
.ref-reply-label{display:block;margin-bottom:8px;font:15px/1.4 Hellix,sans-serif;color:var(--enquiry-ink)}
.ref-reply-fields>.ref-simple-input{min-height:54px;padding:13px 16px}
.ref-simple .ref-reply-fields .ref-project-details{margin-top:16px}
.ref-reply-fields .ref-project-details summary{min-height:48px;padding-block:12px;font-size:15px}
.ref-reply-fields #contact-submit{margin-top:18px}
.ref-reply-fields .ref-form-note{margin-top:12px;font-size:13px}
.ref-simple .ref-budget-step .ref-budget{padding-top:0;border:0}
.ref-simple .ref-budget-step .ref-budget output{font-size:clamp(28px,5vw,38px);margin:32px 0 22px;min-height:46px}
.ref-budget-step .ref-budget-actions{margin-top:32px}
.ref-budget-step .ref-budget-scale{margin-top:10px}
@media(hover:hover){.reference-enquiry.enquiry-dialog .ref-multiselect .ref-option:hover{border-color:#66b7ff;background:#172538;color:#f1f6fc}.reference-enquiry.enquiry-dialog .ref-multiselect .ref-option[aria-pressed=true]:hover{background:#183c61}}
@media(max-width:799px){.reference-enquiry.enquiry-dialog .ref-multiselect{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.reference-enquiry.enquiry-dialog .ref-multiselect .ref-option{min-height:88px;padding:14px;font-size:18px;gap:10px}.ref-choice-toggle{flex-basis:24px;width:24px;height:24px}.ref-choice-toggle svg{width:20px;height:20px}.ref-choice-intro{font-size:15px;margin-bottom:18px}.ref-budget-step .ref-budget-actions{gap:16px}}
@media(prefers-reduced-motion:reduce){.reference-enquiry.enquiry-dialog .ref-multiselect .ref-option,.ref-choice-toggle,.ref-choice-plus,.ref-choice-check{transition:none}.reference-enquiry.enquiry-dialog .ref-multiselect .ref-option:active{transform:none}}