/* Shared Optical Plus controls. Loaded last on every page. */
:root{--control-radius:999px;--control-height:48px;--control-border:#e9e9e750;--control-ease:cubic-bezier(.2,.7,.2,1)}
header .header-work{margin-left:auto;margin-right:160px;padding:12px 0;font:12px var(--font-body)}
header .signature{align-self:center}
.page-intro h1 em{color:var(--coral)}
.menu-button,.close-menu,.viewer-close,.work-filters button{border-radius:var(--control-radius);min-height:44px}
.menu-button{min-height:var(--control-height);transition:border-color .25s,background .25s}
.menu-button:hover,.menu-button:focus-visible{border-color:var(--coral);background:#25272be8}
.close-menu{border:1px solid var(--control-border);padding:10px 18px;font-size:12px;white-space:nowrap}
.close-menu:hover,.viewer-close:hover{border-color:var(--coral);color:var(--coral)}
.menu{height:100dvh;overflow:auto;overscroll-behavior:contain;padding-top:max(24px,env(safe-area-inset-top));padding-bottom:max(24px,env(safe-area-inset-bottom))}
.menu[open]{display:flex;flex-direction:column}
.menu-top{min-height:44px;flex:none}
.menu nav{margin:clamp(16px,4dvh,50px) 0;flex:none}
.menu nav a{font-size:clamp(30px,min(6.5vw,9dvh),95px);padding:clamp(10px,1.6dvh,18px) 0;min-height:54px}
.menu nav a[aria-current]{color:var(--coral)}
.menu-bottom{margin-top:auto;flex:none;line-height:1.7}
.menu-button[aria-expanded=true] i{transform:rotate(45deg)}
.primary-button,.secondary-button,.contact-actions>a:first-child,.mobile-contact .mobile-contact-whatsapp,.mobile-contact-options a{min-height:var(--control-height);border-radius:var(--control-radius);padding:14px 22px;display:inline-flex;align-items:center;justify-content:space-between;gap:22px;font:12px/1.5 var(--font-body);border:1px solid var(--control-border);transition:background .25s,color .25s,border-color .25s,transform .25s}
.primary-button,.contact-actions>a:first-child,.mobile-contact .mobile-contact-whatsapp{background:var(--coral);border-color:var(--coral);color:var(--bg)}
.primary-button:hover,.contact-actions>a:first-child:hover,.mobile-contact .mobile-contact-whatsapp:hover{background:#ffa095;border-color:#ffa095}
.secondary-button,.mobile-contact-options a{background:transparent;color:var(--ink)}
.secondary-button:hover,.mobile-contact-options a:hover{border-color:var(--coral);color:var(--coral)}
.primary-button:active,.secondary-button:active,.contact-actions>a:first-child:active{transform:translateY(1px)}
.primary-button span,.contact-actions>a:first-child b{font-weight:400;transition:transform .25s}
.primary-button:hover span,.contact-actions>a:first-child:hover b{transform:translate(3px,-3px)}
.text-link,.project-caption>a,.mobile-contact-details{transition:color .25s,border-color .25s;min-height:44px;align-items:center}
.text-link:hover,.project-caption>a:hover,.mobile-contact-details:hover{color:var(--coral);border-color:var(--coral)}
.text-link:hover b{transform:translate(4px,-4px)}
:is(a,button,summary):focus-visible{outline:2px solid var(--coral);outline-offset:5px}
body.cursor-ready dialog{cursor:auto}body.cursor-ready dialog :is(a,button,summary){cursor:pointer}
.contact-actions-visible .mobile-contact-trigger,body:has(#enquiry-form:focus-within) .mobile-contact-trigger{visibility:hidden;pointer-events:none}
@media(max-width:600px){header .header-work{display:none}.menu nav a{font-size:clamp(30px,min(11vw,9dvh),52px);gap:18px}.menu-top>span{font-size:9px;line-height:1.6;max-width:180px}.menu-bottom{gap:14px;font-size:11px}.send-actions{align-items:stretch;gap:12px}.send-actions .primary-button,.send-actions .secondary-button{width:100%}}
@media(max-height:500px){.menu nav{margin:12px 0}.menu nav a{padding:9px 0;font-size:30px;min-height:48px}.menu-bottom{flex-direction:row;align-items:end;font-size:9px}.menu-bottom p{line-height:1.5}}
@media(prefers-reduced-motion:reduce){.menu-button,.close-menu,.primary-button,.secondary-button,.text-link,.text-link b,.project-caption>a,.mobile-contact a{transition:none}}

/* Named chapter map: shared Optical Plus controls, homepage journey only. */
.optical-chapter{align-items:center;gap:24px}
.optical-chapter .chapter-map-toggle{display:inline-flex;align-items:center;gap:16px;max-width:calc(100% - 160px);min-height:44px;padding:8px 0;border:0;color:var(--ink);text-align:left;letter-spacing:.08em;font:10px/1.4 var(--font-body);transform:none;margin-right:0}
.chapter-map-toggle small{flex:none;border:1px solid var(--control-border);border-radius:999px;padding:8px 12px;font-size:10px;letter-spacing:0;transition:color .2s,border-color .2s}
.chapter-map-toggle:hover small,.chapter-map-toggle:focus-visible small{color:var(--coral);border-color:var(--coral)}
.chapter-map-toggle[aria-disabled=true]{opacity:.5;cursor:default}
.chapter-map{position:fixed;inset:auto auto calc(80px + env(safe-area-inset-bottom)) var(--pad);margin:0;width:min(430px,calc(100vw - var(--pad)*2));max-width:none;max-height:calc(100dvh - 120px - env(safe-area-inset-top) - env(safe-area-inset-bottom));padding:24px;border:1px solid #e9e9e730;border-radius:24px;background:#181a1df5;color:var(--ink);box-shadow:0 24px 90px #0009;overflow:auto;overscroll-behavior:contain}
.chapter-map::backdrop{background:#090b0d80;backdrop-filter:blur(6px)}
.chapter-map[open]{animation:chapter-map-reveal .32s cubic-bezier(.2,.7,.2,1) both}
.chapter-map-head{position:sticky;top:0;z-index:1;background:#181a1d;display:flex;align-items:start;justify-content:space-between;gap:16px;margin-bottom:18px}
.chapter-map-head .eyebrow{font:9px/1.5 var(--font-body);letter-spacing:.12em;color:#bfc0c3}
.chapter-map h2{font:34px/1.05 var(--font-editorial);letter-spacing:-.02em;margin:10px 0 0}
.chapter-map h2 em{color:var(--coral)}
.chapter-map-close{flex:none;min-width:44px;min-height:44px;border:1px solid var(--control-border);border-radius:999px;font:22px var(--font-body)}
.chapter-map nav{display:grid}
.chapter-map nav a{display:flex;align-items:center;gap:18px;min-height:46px;padding:10px 4px;border-top:1px solid #e9e9e71c;color:var(--ink);text-decoration:none;transition:color .2s,background .2s}
.chapter-map nav small{width:20px;flex:none;font:9px var(--font-body);color:#a9abb0}
.chapter-map nav span{font:19px/1.2 var(--font-display);letter-spacing:.01em;text-transform:uppercase}
.chapter-map nav b{margin-left:auto;font:16px var(--font-body);opacity:0;transition:opacity .2s}
.chapter-map nav a:hover,.chapter-map nav a:focus-visible,.chapter-map nav a[aria-current]{color:var(--coral);background:#f36f6408}
.chapter-map nav a:is(:hover,:focus-visible,[aria-current]) b{opacity:1}
.chapter-map-foot{margin:18px 0 0;color:#a9abb0;font:10px/1.6 var(--font-body)}
.chapter-map-open .mobile-contact-trigger{visibility:hidden;pointer-events:none}
@keyframes chapter-map-reveal{from{opacity:0;clip-path:inset(0 100% 0 0 round 24px);transform:translateY(8px)}to{opacity:1;clip-path:inset(0 0 0 0 round 24px);transform:translateY(0)}}
@media(max-width:900px){.has-mobile-contact .optical-chapter .chapter-map-toggle{display:inline-flex;max-width:calc(100% - 145px);margin-right:0;transform:none}.chapter-map-toggle>span{font-size:8px}.chapter-map-toggle small{padding:8px 10px}.optical-chapter .chapter-map-toggle{gap:10px}}
@media(max-width:450px){.chapter-map-toggle>span{max-width:100px}.chapter-map{padding:20px}.chapter-map h2{font-size:31px}.chapter-map nav a{min-height:44px}.chapter-map-toggle small{font-size:9px}}
@media(prefers-reduced-motion:reduce){.chapter-map[open]{animation:none}.chapter-map nav a,.chapter-map nav b,.chapter-map-toggle small{transition:none}}
