*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;font-family:Helvetica,Arial,sans-serif;color:#071019;background:#d4dbe6}[hidden]{display:none!important}#stage,#error-preview{position:absolute;inset:0}#error-preview{width:100%;height:100%;object-fit:contain;display:none}canvas{display:block;touch-action:none}button,input,select,textarea{font:inherit}button{font-size:12px;border:1px solid #20344740;background:#ffffffad;border-radius:24px;padding:11px 16px;color:#101b23;cursor:pointer;backdrop-filter:blur(12px)}button:hover{background:#fff}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:3px solid #0066b8;outline-offset:3px}button[aria-pressed=true]{background:#12212b;color:#fff}button:disabled{opacity:.4;cursor:wait}header{position:absolute;z-index:2;top:26px;left:30px;pointer-events:none;transition:opacity .2s}header p{margin:0 0 10px;font-size:10px;letter-spacing:.11em}header h1{font-size:25px;letter-spacing:-.8px;margin:0;font-weight:500}header .note{font-size:12px;letter-spacing:0;line-height:1.45;margin-top:10px}.view-controls{position:absolute;top:26px;right:28px;display:flex;gap:7px;flex-wrap:wrap;max-width:260px;justify-content:flex-end;transition:opacity .2s}footer{position:absolute;bottom:24px;left:18px;right:18px;display:flex;align-items:center;flex-direction:column;gap:13px;transition:opacity .2s}nav{display:flex;gap:6px;justify-content:center;flex-wrap:wrap}footer p{font-size:11px;margin:0;text-align:center}#status{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:13px;text-align:center;max-width:80vw}body:not([data-state=idle]):not([data-state=loading]) header,body:not([data-state=idle]):not([data-state=loading]) .view-controls,body:not([data-state=idle]):not([data-state=loading]) footer{opacity:0;pointer-events:none}#glass-page{position:fixed;z-index:5;display:flex;flex-direction:column;border:1px solid #fff3d87a;border-radius:32px;background:linear-gradient(125deg,#fff2d420,#d99a482b 70%,#fff3da20);box-shadow:inset 1px 1px 0 #fff9,inset -1px -1px 0 #6d3c1220,0 24px 90px #a7621612;backdrop-filter:blur(7px) saturate(1.06);opacity:0;transform:translateY(10px);transition:opacity .23s,transform .23s;overflow:hidden;pointer-events:none}#glass-page.is-readable{opacity:1;transform:none;pointer-events:auto}.page-topbar{flex:none;padding:19px 32px 17px;display:flex;gap:18px;align-items:center;justify-content:space-between;border-bottom:1px solid #6a471e2e;background:#ffe5af2b;font-size:10px;letter-spacing:.11em}.page-topbar button{background:#fff2cc67;padding:9px 12px;font-size:10px;letter-spacing:.04em}#page-scroll{overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#66431760 transparent;min-height:0;flex:1;padding:42px 56px 58px;scroll-behavior:smooth}.page-kicker{font-size:10px!important;letter-spacing:.12em;line-height:1.5!important;margin:0 0 18px!important}#page-title{font-size:clamp(40px,5.2vw,72px);line-height:.95;letter-spacing:-.055em;margin:0 0 30px;font-weight:700}.page-lead{font-size:clamp(25px,3vw,39px)!important;line-height:1.08!important;letter-spacing:-.035em;margin:0 0 32px!important;font-weight:500}#page-scroll p{font-size:17px;line-height:1.6;max-width:650px;margin:0 0 18px}#page-scroll section{margin-top:44px;padding-top:32px;border-top:1px solid #76501e38}#page-scroll h2{font-size:26px;line-height:1.13;letter-spacing:-.025em;margin:10px 0 18px;max-width:600px}#page-scroll h3{font-size:11px;letter-spacing:.1em;margin:25px 0 10px}#page-scroll ul{padding-left:19px;line-height:1.7;font-size:16px}.section-number{font-size:10px;letter-spacing:.11em}.page-action{border:1px solid #83572557;background:#ffe5b445;padding:15px 20px;border-radius:13px;display:flex;align-items:center;justify-content:space-between;width:100%;text-align:left;gap:20px;margin-top:24px;font-size:14px}.fine-print,.preview-note{font-size:12px!important;line-height:1.55!important}.preview-note{padding:13px 15px;border:1px solid #80531c35;border-radius:12px;background:#ffdfaa3b}.price-note{border:1px solid #81501f3d;border-radius:20px;padding:28px;margin:36px 0;background:#ffe7bb30}.price-note span{display:block;font-size:10px;letter-spacing:.13em;margin-bottom:20px}.price-note strong{font-size:26px;line-height:1.1;display:block;margin-bottom:18px;letter-spacing:-.025em}#brief-form{margin-top:32px}#brief-form label{display:block;font-size:12px;font-weight:600;margin-bottom:20px}#brief-form input,#brief-form select,#brief-form textarea{display:block;width:100%;color:#0a1c25;border:1px solid #87613452;background:#fff3d848;border-radius:10px;padding:13px 14px;margin-top:8px;font-size:15px;line-height:1.4;box-shadow:inset 0 1px 2px #fff5}#brief-form input::placeholder,#brief-form textarea::placeholder{color:#725432d4}#brief-form textarea{resize:vertical;min-height:130px}.field-pair{display:grid;grid-template-columns:1fr 1fr;gap:18px}#brief-result{margin-top:28px;padding-top:20px;border-top:1px solid #76501e38}#brief-summary{white-space:pre-wrap;word-break:break-word;font:13px/1.7 Helvetica,Arial,sans-serif;background:#fff0ce38;padding:18px;border-radius:12px}#reading-track{height:3px;flex:none;background:#ffffff25}#reading-progress{height:100%;background:#79470e75;transform:scaleX(0);transform-origin:0 50%}body[data-state=fallback] #glass-page{background:#eac38cbd}
@media(max-width:620px){header{top:18px;left:18px}header h1{font-size:20px;max-width:210px}header p{font-size:8px}header .note{font-size:11px;max-width:150px}.view-controls{top:18px;right:15px;max-width:119px}button{font-size:10px;padding:9px 11px}footer{bottom:18px;left:12px;right:12px}footer p{font-size:9px;max-width:290px}nav{max-width:365px;gap:5px}#glass-page{border-radius:24px}.page-topbar{padding:14px 18px 13px;gap:8px;font-size:8px}.page-topbar button{font-size:8px;padding:8px 10px}#page-scroll{padding:26px 23px 38px}#page-title{font-size:39px;margin-bottom:25px}.page-lead{font-size:27px!important}#page-scroll p{font-size:15px;line-height:1.6}#page-scroll h2{font-size:23px}#page-scroll section{margin-top:32px;padding-top:24px}#page-scroll ul{font-size:14px}.field-pair{grid-template-columns:1fr;gap:0}.price-note{padding:22px 20px}.price-note strong{font-size:23px}.page-action{font-size:13px;padding:13px 15px}#brief-form input,#brief-form select,#brief-form textarea{font-size:16px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}

/* The inset tube continues as a warm edge around the readable glass page. */
#glass-page{border-color:#fff0bbb8;box-shadow:inset 0 0 0 1px #fff2c6b0,inset 0 0 12px #ffc66345,0 0 8px #ffcb7752,0 0 24px #eba44d33,0 24px 90px #6c3d1a1c}
#glass-page:after{content:"";position:absolute;inset:7px;border:1px solid #fff1c8b8;border-radius:25px;box-shadow:0 0 5px #ffd7897d,inset 0 0 5px #ffd78945;pointer-events:none}
@media(max-width:620px){#glass-page:after{inset:5px;border-radius:19px}}

/* V10: orange frosted reading glass and white type throughout the page. */
#glass-page{color:#fff;background:linear-gradient(130deg,#bd4b14e8,#8e300ae6 65%,#b94c13e6);backdrop-filter:blur(14px) saturate(1.1)}
#glass-page :is(button,a[data-go]),#glass-page input,#glass-page textarea,#glass-page select{color:#fff;border-color:#ffffff55;background:#ffffff12}
#glass-page :is(button,a[data-go]):hover{background:#ffffff25}#glass-page select option{color:#fff;background:#92380e}
#glass-page input::placeholder,#glass-page textarea::placeholder{color:#ffffffb8}
#glass-page :focus-visible{outline-color:#fff}#glass-page .page-topbar{background:#ffffff0c;border-color:#ffffff35}
#page-scroll{scrollbar-color:#ffffff85 transparent}#page-scroll section,#brief-result{border-color:#ffffff35}
#glass-page .preview-note,#glass-page .price-note,#brief-summary{background:#ffffff0a;border-color:#ffffff38}
#reading-progress{background:#fff}body[data-state=fallback] #glass-page{background:#94380ef5}

/* V12: a single day/night fade drives DOM colours and physical scene lighting. */
:root{--night:0%}
html,body{background:color-mix(in srgb,#d4dbe6,#03091a var(--night));color:color-mix(in srgb,#071019,#f3f5ff var(--night))}
.view-controls{padding-top:0;padding-right:49px;max-width:315px;min-height:44px}
.theme-toggle,.sound-toggle{width:44px;height:44px;min-width:44px;padding:0!important;display:grid;place-items:center;border:0!important;background:transparent!important;backdrop-filter:none!important;color:color-mix(in srgb,#050708,#f3f5ff var(--night))!important;border-radius:50%;touch-action:manipulation}
.view-controls>.theme-toggle{position:absolute;right:0;top:-3px}
.theme-toggle .moon-cutout{transform:translate(-14px,12px);transition:transform .3s cubic-bezier(.2,.7,.2,1)}
body[data-theme=night] .theme-toggle .moon-cutout{transform:translate(0,0)}
.theme-toggle:focus-visible{outline-color:currentColor}
#tower-controls>button:not(.theme-toggle),#tower-navigation button{background:color-mix(in srgb,#ffffffad,#0b1429d9 var(--night));color:inherit;border-color:color-mix(in srgb,#20344740,#d4e3ff55 var(--night))}
#tower-controls>button:not(.theme-toggle):hover,#tower-navigation button:hover{background:color-mix(in srgb,#fff,#253550 var(--night))}
#tower-controls>button[aria-pressed=true]:not(.theme-toggle){background:color-mix(in srgb,#12212b,#dce8ff var(--night));color:color-mix(in srgb,#fff,#0a1528 var(--night))}
#glass-page{background:linear-gradient(130deg,color-mix(in srgb,#bd4b14e8,#702605f2 var(--night)),color-mix(in srgb,#8e300ae6,#3c1306f0 var(--night)) 65%,color-mix(in srgb,#b94c13e6,#722905ed var(--night)))}
.page-tools{display:flex;gap:9px;align-items:center}.page-tools .theme-toggle{color:#fff!important;width:36px;height:36px;min-width:36px}
@media(max-width:620px){.view-controls{padding-right:0;padding-top:48px;max-width:119px}.view-controls>.theme-toggle{top:-7px;right:-5px}.page-tools{gap:4px}}
@media(prefers-reduced-motion:reduce){.theme-toggle .moon-cutout{transition:none}}

/* V13: the reading pages carry the colour and ink of their printed billboard. */
#glass-page{--paper:#ff782f;--ink:#24251b;color:var(--ink);background:var(--paper);backdrop-filter:none;border:1px solid var(--ink);box-shadow:0 18px 80px #07121b30;}
#glass-page[data-page=about]{--paper:#95aa43;--ink:#043b24}
#glass-page[data-page=services]{--paper:#98d0b5;--ink:#144e86}
#glass-page[data-page=pricing]{--paper:#ffda36;--ink:#38210d}
#glass-page:after{display:none}
#glass-page :is(button,a[data-go]),#glass-page input,#glass-page textarea,#glass-page select{color:var(--ink);border-color:color-mix(in srgb,var(--ink),transparent 65%);background:transparent}
#glass-page :is(button,a[data-go]):hover{background:#ffffff2a}
#glass-page .page-topbar{background:transparent;border-color:color-mix(in srgb,var(--ink),transparent 75%);font-family:'Courier New',monospace}
#glass-page .page-tools .theme-toggle{color:var(--ink)!important}
#glass-page input::placeholder,#glass-page textarea::placeholder{color:color-mix(in srgb,var(--ink),transparent 30%)}
#glass-page select option{color:var(--ink);background:var(--paper)}
#glass-page :focus-visible{outline-color:var(--ink)}
#glass-page .preview-note,#glass-page .price-note,#glass-page #brief-summary{border-color:color-mix(in srgb,var(--ink),transparent 75%);background:#ffffff12}
#glass-page #page-scroll{scrollbar-color:var(--ink) transparent}
#glass-page #page-scroll section,#glass-page #brief-result{border-color:color-mix(in srgb,var(--ink),transparent 75%)}
#glass-page #reading-progress{background:var(--ink)}
#glass-page .page-kicker,#glass-page .section-number,#glass-page h3{font-family:'Courier New',monospace}
#glass-page[data-page=about] #page-title{font-family:'Bodoni 72','Times New Roman',serif;font-weight:400;font-style:italic;letter-spacing:-.05em}
#glass-page[data-page=pricing] #page-title{font-family:'Snell Roundhand','Apple Chancery',cursive;font-weight:700;letter-spacing:-.025em}
#glass-page[data-page=services] #page-title{font-weight:400;letter-spacing:-.05em}
body[data-state=fallback] #glass-page{background:var(--paper)}

/* V15: a clear, gently blue-tinted glass capsule with a bright rounded rim. */
.glass-hover-action{--hover-glass-fill:linear-gradient(155deg,#ffffff72 0%,#d9f0ff36 42%,#a9d3eb50 100%);position:fixed;z-index:4;display:flex;align-items:center;gap:18px;min-height:48px;padding:12px 18px;border-radius:999px;border:1px solid #ffffffa8;background:transparent;color:#102934;font-size:13px;font-weight:500;letter-spacing:-.015em;white-space:nowrap;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:inset 0 2px 2px #ffffffb5,inset 0 -2px 4px #e3f5ff70,0 8px 20px #193b5726,0 2px 4px #21435a1c;opacity:0;transform:scale(.06,.14);transform-origin:50% 0;visibility:hidden;pointer-events:none;transition:transform .32s cubic-bezier(.45,0,.2,1),opacity .22s ease-in-out,visibility 0s .32s;isolation:isolate;}
.glass-hover-action:before{content:'';position:absolute;inset:2px;border:1px solid #ffffff52;border-bottom-color:#ffffff20;border-radius:inherit;pointer-events:none;z-index:-1;background:var(--hover-glass-fill);backdrop-filter:blur(13px) saturate(1.3);-webkit-backdrop-filter:blur(13px) saturate(1.3);clip-path:inset(0 round 999px);}
.glass-hover-action.is-visible{opacity:1;transform:scale(1);visibility:visible;pointer-events:auto;transition-delay:0s;}
.glass-hover-action:hover{--hover-glass-fill:linear-gradient(155deg,#ffffff8c,#e0f4ff48 44%,#b7dff267);background:transparent;}
.glass-hover-action:active{transform:scale(.97);}
.glass-hover-action:focus-visible{outline:2px solid currentColor;outline-offset:4px;}
body[data-theme=night] .glass-hover-action{color:#f4faff;border-color:#edf7ff83;--hover-glass-fill:linear-gradient(145deg,#f0f8ff32,#8cc6e924 48%,#28496263);background:transparent;box-shadow:inset 0 2px 2px #f3fbff85,inset 0 -2px 4px #c8e8ff38,0 8px 24px #0005;}
body:not([data-state=idle]) #billboard-action{opacity:0;visibility:hidden;pointer-events:none;}
@media(prefers-reduced-motion:reduce){.glass-hover-action{transition:none;}}

/* V16: the swap controller owns opacity; labels change only between fades. */
.glass-hover-action{transition:visibility 0s;}
.glass-hover-action.is-visible{transition:none;}

/* V16: retain each section's pigment with only a small amount of sky showing through. */
#glass-page{background:color-mix(in srgb,var(--paper) 93%,transparent);backdrop-filter:blur(16px) saturate(1.12);-webkit-backdrop-filter:blur(16px) saturate(1.12);border:1px solid color-mix(in srgb,var(--paper) 56%,white);box-shadow:inset 0 1px 2px #fff8,inset 0 -1px 2px #fff3,0 18px 80px #07121b35;transition:opacity .30s ease,transform .30s ease;}
#glass-page .page-topbar,#glass-page #page-scroll,#glass-page #reading-track{opacity:0;transform:translateY(7px);transition:opacity .32s ease,transform .40s ease;}
#glass-page.is-readable .page-topbar,#glass-page.is-readable #page-scroll,#glass-page.is-readable #reading-track{opacity:1;transform:none;transition-delay:.10s;}
@media(prefers-reduced-motion:reduce){#glass-page,#glass-page .page-topbar,#glass-page #page-scroll,#glass-page #reading-track{transition:none;}}

/* V17: the reference blue and a flat, frame-stepped pixel silhouette loader. */
#loading-screen{position:fixed;inset:0;z-index:1000;background:#38afde;color:#162b33;isolation:isolate;cursor:wait}
#loading-art{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
#loading-caption{position:absolute;z-index:1;top:calc(46% + min(19.5vh,155px) + 38px);left:50%;transform:translateX(-50%);display:flex;justify-content:space-between;gap:36px;min-width:200px;font:13px/1.4 'Courier New',monospace;letter-spacing:-.025em;font-variant-numeric:tabular-nums}
#loading-number{display:inline-block;min-width:4ch;text-align:right}
body[data-loader=cycling] #tower-heading,body[data-loader=cycling] #tower-controls,body[data-loader=cycling] #tower-navigation,body[data-loader=settling] #tower-heading,body[data-loader=settling] #tower-controls,body[data-loader=settling] #tower-navigation{opacity:0;pointer-events:none}
body[data-loader=revealing] #tower-heading,body[data-loader=revealing] #tower-controls,body[data-loader=revealing] #tower-navigation{transition:opacity .7s ease .15s}
@media(max-height:550px){#loading-caption{top:auto;bottom:28px}}

/* V20: stationary stores on a circular camera route, with glass triangles. */
#work-ui{position:fixed;inset:0;z-index:4;pointer-events:none;color:var(--scene-ink,#101b23)}
.work-topline{position:absolute;top:25px;left:28px;right:28px;display:flex;align-items:center;justify-content:space-between}
.work-topline button{pointer-events:auto}
#work-back{font-size:10px;letter-spacing:.07em;padding:12px 18px}
.work-caption{position:absolute;left:5%;right:5%;bottom:8%;text-align:center;transition:opacity .35s ease,transform .5s ease}
.work-title-row{display:grid;grid-template-columns:64px minmax(0,1fr) 64px;gap:18px;align-items:center}
.project-arrow{position:relative;width:64px;height:64px;padding:0;border:0;background:transparent!important;box-shadow:none;backdrop-filter:none;pointer-events:auto;color:#112d3a;filter:drop-shadow(0 4px 6px #173c544d);transition:transform .28s ease,opacity .22s ease}
.project-arrow:before{content:'';position:absolute;inset:0;clip-path:url(#project-triangle-clip);background:linear-gradient(145deg,#ffffff80,#cfefff40);backdrop-filter:blur(14px) saturate(1.15);-webkit-backdrop-filter:blur(14px) saturate(1.15)}
.glass-arrow-shape{position:absolute;inset:0;width:100%;height:100%;fill:#e7f6ff26;stroke:#fff;stroke-width:1.5;filter:drop-shadow(0 1px 1px #ffffff6b)}
.project-arrow:hover{transform:scale(1.08)}
.project-arrow:hover .glass-arrow-shape{fill:#ffffff4d}
.project-arrow:focus-visible{outline:2px solid currentColor;outline-offset:3px;border-radius:16px}
#work-previous:before,#work-previous .glass-arrow-shape{transform:scaleX(-1)}
#work-counter{font:11px/1.3 'Courier New',monospace;letter-spacing:.1em;margin:0 0 9px}
#work-title{font-size:clamp(27px,3vw,43px);font-weight:500;letter-spacing:-.045em;line-height:1.05;margin:0}
#work-status{font-size:12px;margin:13px 0 0}
#work-status:empty{display:none}
#work-ui.is-travelling .work-caption{opacity:0;transform:translateY(8px);transition-duration:.22s}
#work-ui.is-travelling .project-arrow{pointer-events:none}
body[data-theme=night] #work-ui{color:#f4f2e8}
body[data-theme=night] .project-arrow{color:#fff9ed;filter:drop-shadow(0 4px 8px #0005)}
body[data-theme=night] .project-arrow:before{background:linear-gradient(145deg,#829caf80,#36506b70)}
body[data-theme=night] .glass-arrow-shape{fill:#d9ecff18;stroke:#f3faff}
@media(max-width:620px){.work-topline{top:18px;left:18px;right:18px}.work-caption{bottom:12%;left:18px;right:18px}.work-title-row{grid-template-columns:48px minmax(0,1fr) 48px;gap:8px}.project-arrow{width:48px;height:48px}#work-title{font-size:clamp(25px,6vw,30px)}#work-back{font-size:9px;padding:10px 13px}}
@media(prefers-reduced-motion:reduce){.project-arrow,.work-caption{transition:none}.project-arrow:hover{transform:none}}
#work-title:focus{outline:none}

.contact-trap{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
#brief-result{padding:18px 0;line-height:1.5}#brief-form button:disabled{opacity:.65;cursor:wait}

/* Direct contact details use the same orange reading plate as the brief. */
#page-scroll .contact-direct{margin-top:30px;padding-top:25px;}
.contact-direct-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:25px;}
#page-scroll .contact-direct-heading>h2{font-size:24px;font-weight:500;letter-spacing:-.035em;margin:0;}
.contact-people{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:30px;}
.contact-people address{min-width:0;font-style:normal;}
#page-scroll .contact-people h3{font:500 22px/1.2 Helvetica,Arial,sans-serif;letter-spacing:-.03em;margin:0 0 5px;}
#page-scroll .contact-people .contact-role{font:11px/1.5 'Courier New',monospace;margin:0 0 18px;}
.contact-people a{display:block;width:fit-content;max-width:100%;color:inherit;text-decoration-thickness:1px;text-underline-offset:4px;}
.contact-phone{font-size:20px;letter-spacing:-.025em;margin-bottom:12px;}
.contact-email{font-size:13px;line-height:1.6;overflow-wrap:anywhere;}
.contact-people a:hover{text-decoration-thickness:2px;}
.contact-people a:focus-visible{outline:2px solid currentColor;outline-offset:5px;}
#page-scroll .contact-form-heading{border-top:1px solid #76501e38;padding-top:28px;margin:34px 0 0;font-size:24px;font-weight:500;}
@media(max-width:620px){.contact-people{grid-template-columns:1fr;gap:28px;}.contact-email{font-size:14px;}.contact-phone{font-size:22px;}#page-scroll .contact-people .contact-role{margin-bottom:13px;}}

/* A black PNG glyph with a comfortable touch target on both reader pages. */
.instagram-link{display:inline-flex;align-items:center;justify-content:center;flex:0 0 44px;width:44px;height:44px;padding:8px;border-radius:8px;color:#000;text-decoration:none;}
.instagram-link img{display:block;width:28px;height:28px;object-fit:contain;}
.instagram-link:focus-visible{outline:2px solid #000;outline-offset:3px;}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 .instagram-link img{transition:transform .85s cubic-bezier(.65,0,.35,1);}
 .instagram-link:hover img{transform:rotate(720deg);}
}