/* ALOBI interaction layer — immersive, responsive, and progressive */
:root{--fx-x:50vw;--fx-y:50vh;--fx-velocity:0;--fx-scroll:0;--fx-accent:#0071e3;--shell-edge:max(var(--pad),calc((100vw - var(--max))/2))}
body{--fx-contrast:#1d1d1f}
@media(pointer:fine){body.fx-ready,body.fx-ready a,body.fx-ready button,body.fx-ready [role="button"]{cursor:none!important}}

/* Preserve the original personal-mark tile proportions from the first site. */
.logo-tile{width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;flex:0 0 44px!important;aspect-ratio:1/1;border-radius:3px!important}.logo-initials{font-size:15px!important}.personal-mark{width:32px!important;height:32px!important}

.fx-counter{position:fixed;z-index:145;right:16px;top:50%;display:grid;justify-items:end;gap:6px;opacity:0;visibility:hidden;transform:translate3d(12px,-50%,0);mix-blend-mode:difference;color:#fff;pointer-events:none;transition:opacity .35s ease,transform .55s cubic-bezier(.16,1,.3,1),visibility 0s .55s}.fx-counter.is-visible{opacity:1;visibility:visible;transform:translate3d(0,-50%,0);transition-delay:0s}.fx-counter strong{font:600 11px/1 -apple-system,BlinkMacSystemFont,sans-serif;letter-spacing:.08em}.fx-counter i{display:block;width:1px;height:52px;background:rgba(255,255,255,.35);position:relative}.fx-counter i:after{content:"";position:absolute;left:0;top:0;width:1px;height:calc(var(--fx-scroll) * 100%);background:#fff}.fx-counter span{font:500 8px/1 -apple-system,BlinkMacSystemFont,sans-serif;letter-spacing:.08em}

.fx-cursor{position:fixed;z-index:500;left:0;top:0;width:52px;height:52px;border:1px solid rgba(255,255,255,.72);border-radius:50%;pointer-events:none;opacity:0;transform:translate3d(calc(var(--cursor-x, -100px) - 26px),calc(var(--cursor-y, -100px) - 26px),0) scale(var(--cursor-scale,1));transition:width .2s cubic-bezier(.16,1,.3,1),height .2s cubic-bezier(.16,1,.3,1),margin .2s cubic-bezier(.16,1,.3,1),background-color .2s,color .2s,border-color .2s,opacity .15s .65s;will-change:transform;contain:layout paint;display:grid;place-items:center;color:#fff;background:transparent;box-shadow:none;mix-blend-mode:difference}.loader.is-complete~.fx-cursor,.fx-no-loader .fx-cursor{opacity:1}.fx-no-loader .fx-cursor{transition-delay:0s}.fx-cursor:before{content:"";width:4px;height:4px;border-radius:50%;background:currentColor}.fx-cursor span{position:absolute;font:650 8px/1 -apple-system,BlinkMacSystemFont,sans-serif;letter-spacing:.08em;opacity:0;transform:scale(.75);transition:opacity .2s,transform .25s}.fx-cursor.is-action{width:78px;height:78px;margin:-13px;background:#fff;border-color:#fff}.fx-cursor.is-action:before{opacity:0}.fx-cursor.is-action span{opacity:1;transform:none;color:#000}.fx-cursor.is-down{--cursor-scale:.78}

.fx-aura{position:fixed;z-index:3;left:var(--fx-x);top:var(--fx-y);width:42vw;aspect-ratio:1;border-radius:50%;pointer-events:none;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(0,113,227,.10),rgba(110,92,255,.045) 38%,transparent 70%);filter:blur(16px);mix-blend-mode:multiply;transition:opacity .4s}
.fx-grid{position:fixed;z-index:2;inset:0;pointer-events:none;opacity:.14;background-image:linear-gradient(rgba(29,29,31,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(29,29,31,.12) 1px,transparent 1px);background-size:64px 64px;mask-image:radial-gradient(280px at var(--fx-x) var(--fx-y),#000,transparent);-webkit-mask-image:radial-gradient(280px at var(--fx-x) var(--fx-y),#000,transparent)}

.fx-section{position:relative}.fx-section:after{content:"";position:absolute;z-index:20;inset:0;background:var(--fx-section-cover,#f5f5f7);transform-origin:bottom;transform:scaleY(1);pointer-events:none;transition:transform 1.15s cubic-bezier(.77,0,.175,1)}.fx-section.fx-seen:after{transform:scaleY(0)}
.fx-heading{will-change:transform;transform:translate3d(calc(var(--fx-heading-x,0) * 1px),calc(var(--fx-heading-y,0) * 1px),0);transition:transform .65s cubic-bezier(.16,1,.3,1)}

.fx-tilt{position:relative;transform-style:preserve-3d;will-change:transform;transform:perspective(1000px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)) translateZ(0);transition:transform .65s cubic-bezier(.16,1,.3,1),box-shadow .65s cubic-bezier(.16,1,.3,1)!important}.fx-tilt:before{content:"";position:absolute;z-index:8;inset:0;border-radius:inherit;background:radial-gradient(circle at var(--glare-x,50%) var(--glare-y,50%),rgba(255,255,255,.28),transparent 34%);opacity:0;pointer-events:none;transition:opacity .4s}.fx-tilt:hover:before{opacity:1}.fx-tilt:hover{box-shadow:0 35px 80px rgba(0,0,0,.16)!important}
.fx-magnetic{will-change:transform;transform:translate3d(var(--mag-x,0),var(--mag-y,0),0);transition:transform .55s cubic-bezier(.16,1,.3,1)}

.fx-image{overflow:hidden;clip-path:inset(0 0 100% 0 round 18px);transition:clip-path 1.05s cubic-bezier(.77,0,.175,1);transition-delay:calc(var(--fx-image-index,0) * 90ms)}.fx-section.fx-seen .fx-image{clip-path:inset(0 round 18px)}.fx-image img{will-change:transform;transform:scale(1.04) translate3d(0,var(--image-shift,0),0);transition:filter .8s ease,transform 1s cubic-bezier(.16,1,.3,1)!important}.fx-image:hover img{filter:saturate(1.12) contrast(1.03)}
.fx-image:after{content:"";position:absolute;z-index:6;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.32) 48%,transparent 61%);transform:translateX(-120%);transition:transform 1.1s cubic-bezier(.16,1,.3,1)}.fx-image:hover:after{transform:translateX(120%)}

.fx-kinetic-copy .fx-word{display:inline-block;opacity:0;filter:blur(8px);transform:translate3d(0,.6em,0) rotate(1.5deg);transform-origin:left bottom;transition:opacity .62s ease,filter .7s ease,transform .78s cubic-bezier(.16,1,.3,1);transition-delay:var(--fx-word-delay,0ms)}
.fx-section.fx-seen .fx-kinetic-copy .fx-word{opacity:1;filter:none;transform:none}

/* A horizontal visual archive. Each screen is one rectangular composition;
   together they form a draggable wall that continues beyond the viewport. */
.portfolio-showcase{--wall-progress:0;box-sizing:border-box;width:100%;height:auto;margin:0;padding:clamp(58px,7vw,104px) 0 clamp(42px,5vw,76px);display:block!important;overflow:hidden;background:var(--paper)}
.photo-wall-heading,.photo-wall-status{width:min(1320px,calc(100% - clamp(56px,9vw,168px)));margin-inline:auto}.photo-wall-heading{display:flex;align-items:end;justify-content:space-between;margin-bottom:18px}.photo-wall-heading p{margin:0;display:grid;gap:5px}.photo-wall-heading p span,.photo-wall-heading>span,.photo-wall-status{font:600 10px/1.2 -apple-system,BlinkMacSystemFont,"SF Pro Text",sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#6e6e73}.photo-wall-heading p strong{font:650 clamp(24px,2.5vw,38px)/1 -apple-system,BlinkMacSystemFont,"SF Pro Display",sans-serif;letter-spacing:-.045em;color:var(--ink)}.photo-wall-heading>span{display:flex;align-items:center;gap:10px}.photo-wall-heading>span i{width:31px;height:31px;display:grid;place-items:center;border:1px solid #c7c7cc;border-radius:50%;color:#0071e3;font-size:13px;font-style:normal;animation:wall-cue 2.4s cubic-bezier(.16,1,.3,1) infinite}
.photo-wall-viewport{width:100%;overflow-x:auto;overflow-y:hidden;scroll-snap-type:none;scrollbar-width:none;overscroll-behavior-x:contain;touch-action:pan-y;user-select:none;cursor:grab;outline:0}.photo-wall-viewport::-webkit-scrollbar{display:none}.photo-wall-viewport:focus-visible{box-shadow:inset 0 0 0 2px #0071e3}.photo-wall-viewport.is-dragging{cursor:grabbing}.photo-wall-track{width:max-content;padding-inline:max(28px,calc((100vw - 1320px)/2));display:flex;align-items:stretch;gap:18px}
.photo-wall-panel{flex:0 0 min(1320px,calc(100vw - clamp(56px,9vw,168px)));aspect-ratio:2/1;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:repeat(6,minmax(0,1fr));gap:12px}.photo-wall-panel figure{position:relative;min-width:0;min-height:0;margin:0!important;overflow:hidden;border-radius:clamp(13px,1.5vw,24px)!important;background:#fff;cursor:zoom-in}.photo-wall-viewport.is-dragging figure{cursor:grabbing}.photo-wall-panel img{box-sizing:border-box;width:100%!important;height:100%!important;padding:0!important;display:block;object-fit:cover!important;object-position:center;background:#fff!important;-webkit-user-drag:none}.photo-wall-panel figcaption{position:absolute;z-index:7;left:10px;bottom:10px;padding:6px 8px;border-radius:999px;background:rgba(20,20,22,.7);color:#fff;backdrop-filter:blur(12px);font:650 8px/1 -apple-system,BlinkMacSystemFont,sans-serif;letter-spacing:.08em;opacity:0;transform:translateY(7px);transition:opacity .3s ease,transform .4s cubic-bezier(.16,1,.3,1)}.photo-wall-panel figure:hover figcaption,.photo-wall-panel figure:focus-visible figcaption{opacity:1;transform:none}
.photo-wall-panel:nth-child(1) figure:nth-child(1){grid-column:1/9;grid-row:1/7}.photo-wall-panel:nth-child(1) figure:nth-child(2){grid-column:9/13;grid-row:1/4}.photo-wall-panel:nth-child(1) figure:nth-child(3){grid-column:9/11;grid-row:4/7}.photo-wall-panel:nth-child(1) figure:nth-child(4){grid-column:11/13;grid-row:4/7}
.photo-wall-panel:nth-child(2) figure:nth-child(1){grid-column:1/5;grid-row:1/5}.photo-wall-panel:nth-child(2) figure:nth-child(2){grid-column:5/13;grid-row:1/5}.photo-wall-panel:nth-child(2) figure:nth-child(3){grid-column:1/4;grid-row:5/7}.photo-wall-panel:nth-child(2) figure:nth-child(4){grid-column:4/13;grid-row:5/7}.photo-wall-panel:nth-child(2) figure:nth-child(4) img{object-position:center 58%}
.photo-wall-panel:nth-child(3) figure:nth-child(1){grid-column:1/7;grid-row:1/7}.photo-wall-panel:nth-child(3) figure:nth-child(2){grid-column:7/10;grid-row:1/4}.photo-wall-panel:nth-child(3) figure:nth-child(3){grid-column:7/13;grid-row:4/7}.photo-wall-panel:nth-child(3) figure:nth-child(4){grid-column:10/13;grid-row:1/4}.photo-wall-panel:nth-child(3) figure:nth-child(2) img{filter:contrast(1.32) brightness(.97)}
.photo-wall-panel:nth-child(4) figure:nth-child(1){grid-column:1/5;grid-row:1/7;background:#050505}.photo-wall-panel:nth-child(4) figure:nth-child(2){grid-column:5/13;grid-row:1/3}.photo-wall-panel:nth-child(4) figure:nth-child(3){grid-column:5/13;grid-row:3/5}.photo-wall-panel:nth-child(4) figure:nth-child(4){grid-column:5/13;grid-row:5/7}.photo-wall-panel:nth-child(4) figure:nth-child(1) img{object-fit:contain!important;background:#050505!important;transform:none!important}.photo-wall-panel:nth-child(4) figure:nth-child(n+2) img{object-fit:contain!important;transform:none!important;filter:contrast(1.16) brightness(.98)}
.photo-wall-panel figure.fx-image{clip-path:inset(0 round clamp(13px,1.5vw,24px))!important;transition:none!important}.photo-wall-panel figure.fx-image img{transform:none!important}
.photo-wall-status{margin-top:17px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:18px}.photo-wall-status>span{height:2px;overflow:hidden;border-radius:99px;background:#d2d2d7}.photo-wall-status>span i{display:block;width:100%;height:100%;background:#0071e3;transform:scaleX(var(--wall-progress));transform-origin:left;transition:transform .1s linear}.photo-wall-status b{min-width:48px;text-align:right;font:650 10px/1 -apple-system,BlinkMacSystemFont,sans-serif;color:var(--ink)}
@keyframes wall-cue{0%,18%,75%,100%{transform:translateX(0)}35%{transform:translateX(-5px)}52%{transform:translateX(5px)}}

/* A single, first-screen scroll invitation. The marker runs its own quiet loop
   while the page retains native scrolling and the right-edge progress readout. */
.hero{padding-inline:max(var(--pad),calc((100vw - var(--max))/2));padding-bottom:116px;-webkit-user-select:none;user-select:none}
.hero .hero-intro{margin-bottom:28px}
.hero .scale-map{width:min(860px,100%);margin-inline:auto;align-self:center;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;transform-origin:center}
.hero .scale{min-width:0;min-height:68px;padding:11px 18px;text-align:center}
.hero .scale span{font-size:14px!important}.hero .scale small{margin-top:4px;font-size:10px!important}
.hero-scroll-prompt{position:absolute;z-index:12;left:50%;right:auto;bottom:20px;width:max-content;display:flex;flex-direction:row;align-items:center;gap:12px;color:var(--ink);text-decoration:none;transform:translateX(-50%);font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text",Manrope,Arial,sans-serif}
.scroll-marker{position:relative;width:52px;height:42px;display:block}
.scroll-marker-rail{position:absolute;left:2px;right:2px;top:23px;height:1px;background:linear-gradient(90deg,transparent,rgba(29,29,31,.3) 18% 82%,transparent);transform:rotate(-7deg)}
.scroll-marker-body{position:absolute;left:17px;top:3px;width:20px;height:31px;display:grid;place-items:center;border:1px solid rgba(29,29,31,.2);border-radius:7px;background:rgba(255,255,255,.92);box-shadow:0 8px 20px rgba(0,0,0,.12);transform:translate3d(0,0,0) rotate(-4deg);animation:scroll-marker-slip 3.4s cubic-bezier(.16,1,.3,1) infinite;will-change:transform}
.scroll-marker-body:before{content:"";position:absolute;left:4px;right:4px;top:5px;height:2px;border-radius:9px;background:#1d1d1f}
.scroll-marker-body>span{position:absolute;left:4px;right:4px;bottom:4px;height:16px;display:grid;place-items:center;border-radius:4px;background:#0071e3;color:#fff;font:650 11px/1 -apple-system,BlinkMacSystemFont,sans-serif}
.scroll-message{display:grid;gap:3px;text-align:left;text-transform:uppercase}.scroll-message strong{font-size:10px;line-height:1;letter-spacing:.1em;font-weight:650}.scroll-message small{font-size:8px;line-height:1.2;letter-spacing:.08em;color:#6e6e73}
.hero-scroll-prompt:hover .scroll-marker-body{background:#0071e3;border-color:#0071e3;box-shadow:0 10px 26px rgba(0,113,227,.22);animation-duration:2.2s}.hero-scroll-prompt:hover .scroll-marker-body:before{background:#fff}.hero-scroll-prompt:hover .scroll-marker-body>span{background:#fff;color:#0071e3}
@keyframes scroll-marker-slip{0%,14%,72%,100%{transform:translate3d(0,0,0) rotate(-4deg)}28%{transform:translate3d(-9px,2px,0) rotate(-10deg)}43%{transform:translate3d(14px,4px,0) rotate(9deg)}55%{transform:translate3d(5px,1px,0) rotate(1deg)}63%{transform:translate3d(8px,2px,0) rotate(4deg)}}

.fx-ripple{position:fixed;z-index:490;width:12px;height:12px;border:1px solid currentColor;border-radius:50%;color:#0071e3;pointer-events:none;transform:translate(-50%,-50%) scale(0);animation:fx-ripple .85s cubic-bezier(.16,1,.3,1) forwards}.fx-spark{position:fixed;z-index:490;width:5px;height:5px;border-radius:50%;background:#0071e3;pointer-events:none;animation:fx-spark .72s cubic-bezier(.2,.8,.2,1) forwards}
@keyframes fx-ripple{to{transform:translate(-50%,-50%) scale(12);opacity:0}}@keyframes fx-spark{to{transform:translate(var(--spark-x),var(--spark-y)) scale(0);opacity:0}}

.fx-lightbox{position:fixed;z-index:600;inset:0;padding:70px;display:grid;place-items:center;background:rgba(5,5,7,.88);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);opacity:0;visibility:hidden;transition:opacity .45s ease,visibility .45s}.fx-lightbox.is-open{opacity:1;visibility:visible}.fx-lightbox img{max-width:min(1500px,100%);max-height:calc(100svh - 140px);object-fit:contain;border-radius:18px;box-shadow:0 30px 100px rgba(0,0,0,.5);transform:scale(.92);transition:transform .65s cubic-bezier(.16,1,.3,1);will-change:transform,opacity,filter}.fx-lightbox.is-open img{transform:none}.fx-lightbox.is-switching img{transition:none}.fx-lightbox button{position:absolute;width:46px;height:46px;border:1px solid rgba(255,255,255,.22);border-radius:50%;background:rgba(255,255,255,.08);color:#fff;backdrop-filter:blur(12px);font-size:19px}.fx-lightbox-close{right:20px;top:20px}.fx-lightbox-prev{left:20px;top:50%}.fx-lightbox-next{right:20px;top:50%}.fx-lightbox-meta{position:absolute;left:24px;bottom:22px;color:#fff;font:600 10px/1 -apple-system,BlinkMacSystemFont,sans-serif;letter-spacing:.1em}.fx-lightbox-count{position:absolute;right:24px;bottom:22px;color:#fff;font:600 10px/1 -apple-system,BlinkMacSystemFont,sans-serif;letter-spacing:.1em}

/* Intensify existing hero and menu interactions */
.hero h1,.category-hero h1,.about-hero h1,.project-gateway h1{background:linear-gradient(115deg,#1d1d1f 0 38%,#59595d 48%,#1d1d1f 58% 100%);background-size:230% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:fx-type-sheen 8s ease-in-out infinite}.hero .period,.category-hero h1 i{background:none;color:#0071e3;-webkit-text-fill-color:#0071e3}.project-gateway-heading h1{-webkit-text-fill-color:transparent}.about-hero h1 span:last-child{background:none!important;-webkit-text-fill-color:#0071e3}
.hero h1{position:relative;top:clamp(7px,1.4vh,18px)!important;max-width:1080px!important;margin:auto 0 0!important;padding:.1em 0 .16em;overflow:visible;line-height:.96!important;font-family:"SF Pro Display",-apple-system,BlinkMacSystemFont,"Helvetica Neue",Helvetica,Arial,sans-serif!important;font-optical-sizing:auto;font-synthesis:none;font-size:clamp(54px,6.35vw,98px)!important;font-weight:650!important;letter-spacing:-.055em!important;background:none!important;color:#1d1d1f!important;-webkit-text-fill-color:#1d1d1f!important;animation:none!important}.hero h1 .line{display:block;width:100%;margin:0!important;padding-left:0!important;overflow:visible;line-height:inherit;text-align:center!important;white-space:nowrap}.hero h1 .line+.line{margin-top:.1em!important}.hero h1 em{font:inherit;font-style:normal}.hero h1 .period{color:#0071e3!important;-webkit-text-fill-color:#0071e3!important}.hero .edition{color:#86868b!important;font-weight:500!important}.hero .hero-intro{align-self:center!important;max-width:760px!important;margin:clamp(62px,6.2vh,84px) 0 34px!important;color:#6e6e73!important;text-align:center;font-family:"SF Pro Display",-apple-system,BlinkMacSystemFont,"Helvetica Neue",Helvetica,Arial,sans-serif!important;font-size:clamp(22px,2vw,29px)!important;font-weight:500!important;letter-spacing:-.03em!important}
.hero .scale-map{width:min(720px,100%)!important;padding:6px!important;gap:0!important;background:rgba(225,225,230,.82)!important;border:1px solid rgba(0,0,0,.045);border-radius:999px!important;box-shadow:inset 0 1px 2px rgba(0,0,0,.04);backdrop-filter:blur(18px)}.hero .scale{min-height:58px!important;padding:9px 18px!important;border:0!important;border-radius:999px!important;background:transparent!important;color:#1d1d1f!important;box-shadow:none!important;transform:none!important;transition:background-color .28s ease,box-shadow .35s cubic-bezier(.16,1,.3,1),color .28s ease!important}.hero .scale:before,.hero .scale:after{display:none!important}.hero .scale.active{background:#fff!important;color:#1d1d1f!important;box-shadow:0 2px 7px rgba(0,0,0,.1),0 8px 22px rgba(0,0,0,.05)!important}.hero .scale:hover,.hero .scale:focus-visible{background:rgba(255,255,255,.58)!important;color:#1d1d1f!important;outline:0}.hero .scale.active:hover,.hero .scale.active:focus-visible{background:#fff!important}.hero .scale b,.hero .scale small,.hero .scale:hover b,.hero .scale:hover small{color:#6e6e73!important}.hero .scale span{color:#1d1d1f!important;font-weight:650!important;letter-spacing:0!important}
@keyframes fx-type-sheen{0%,25%{background-position:100% 50%}65%,100%{background-position:-100% 50%}}
.index-panel{--menu-accent:#2997ff;--menu-x:50%;--menu-y:50%;overflow:hidden;display:grid!important;grid-template-columns:minmax(0,1.15fr) minmax(330px,.85fr);grid-template-rows:1fr auto auto;gap:0 clamp(42px,6vw,96px)}
.index-panel:before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(255,255,255,.025),transparent 45%),repeating-linear-gradient(90deg,transparent 0 calc(12.5% - 1px),rgba(255,255,255,.045) calc(12.5% - 1px) 12.5%);opacity:0;transform:translateY(-5%);transition:opacity .6s ease,transform 1s cubic-bezier(.16,1,.3,1);pointer-events:none}.index-panel.open:before{opacity:1;transform:none}
.index-panel nav{position:relative;z-index:2;grid-column:1;grid-row:1/4;align-self:center;margin:0!important;display:grid!important;grid-template-columns:1fr!important}
.index-panel nav a,.index-panel nav button{--menu-delay:180ms;position:relative;min-height:clamp(64px,8.2vh,88px)!important;padding:0 14px!important;display:grid!important;grid-template-columns:52px 1fr auto!important;align-items:center;border-bottom-color:rgba(255,255,255,.14)!important;opacity:0;transform:translateY(28px);transition:opacity .5s var(--menu-delay) ease,transform .65s var(--menu-delay) cubic-bezier(.16,1,.3,1),background-color .35s ease,padding .45s cubic-bezier(.16,1,.3,1)!important}
.index-panel.open nav a,.index-panel.open nav button{opacity:1;transform:none}
.index-panel nav>*:nth-child(1){--menu-delay:180ms}.index-panel nav>*:nth-child(2){--menu-delay:235ms}.index-panel nav>*:nth-child(3){--menu-delay:290ms}.index-panel nav>*:nth-child(4){--menu-delay:345ms}.index-panel nav>*:nth-child(5){--menu-delay:400ms}.index-panel nav>*:nth-child(6){--menu-delay:455ms}
.index-panel nav a:after,.index-panel nav button:after{content:"↗";font-size:17px;opacity:0;transform:translate(-12px,10px);transition:opacity .3s ease,transform .5s cubic-bezier(.16,1,.3,1)}.index-panel nav a:hover:after,.index-panel nav button:hover:after,.index-panel nav a:focus-visible:after,.index-panel nav button:focus-visible:after{opacity:1;transform:none}
.index-panel nav a:hover,.index-panel nav button:hover,.index-panel nav a:focus-visible,.index-panel nav button:focus-visible{padding-left:24px!important;background:rgba(255,255,255,.055);outline:0}.index-panel nav b{font-size:clamp(38px,4.8vw,72px)!important;font-weight:520!important;letter-spacing:-.065em!important}.index-panel nav a:hover b,.index-panel nav button:hover b,.index-panel nav a:focus-visible b,.index-panel nav button:focus-visible b{color:#fff!important;text-shadow:-7px 3px 0 var(--menu-accent)!important}.index-panel nav a:hover>span,.index-panel nav button:hover>span,.index-panel nav a:focus-visible>span,.index-panel nav button:focus-visible>span{color:var(--menu-accent)!important;-webkit-text-fill-color:var(--menu-accent)!important}
.index-panel>p{position:relative;z-index:2;grid-column:2;grid-row:2;width:min(430px,100%)!important;margin:24px 0 0!important}.index-panel .index-socials{position:relative;z-index:2;grid-column:2;grid-row:3;margin-top:20px!important}
.fx-index-preview{position:relative;z-index:2;grid-column:2;grid-row:1;min-height:330px;align-self:stretch;overflow:hidden;border:1px solid rgba(255,255,255,.16);border-radius:30px;background:radial-gradient(circle at var(--menu-x) var(--menu-y),color-mix(in srgb,var(--menu-accent) 36%,transparent),transparent 38%),#18181b;opacity:0;transform:translateX(45px) scale(.96);transition:opacity .55s .34s ease,transform .85s .34s cubic-bezier(.16,1,.3,1),background .4s ease}.index-panel.open .fx-index-preview{opacity:1;transform:none}
.fx-index-preview small{position:absolute;left:24px;top:22px;font:600 9px/1 -apple-system,BlinkMacSystemFont,sans-serif;letter-spacing:.12em;color:rgba(255,255,255,.58)}.fx-index-preview strong{position:absolute;left:18px;right:18px;bottom:22px;color:#fff;font:650 clamp(70px,9vw,142px)/.72 -apple-system,BlinkMacSystemFont,sans-serif;letter-spacing:-.09em;overflow-wrap:anywhere}.fx-index-preview i{position:absolute;right:22px;top:18px;color:var(--menu-accent);font:650 clamp(38px,5vw,72px)/1 -apple-system,BlinkMacSystemFont,sans-serif;font-style:normal;letter-spacing:-.07em}.fx-index-preview.is-changing strong{animation:fx-index-type .58s cubic-bezier(.16,1,.3,1)}.fx-index-preview.is-changing i{animation:fx-index-number .5s cubic-bezier(.16,1,.3,1)}
.fx-index-orbit{position:absolute;width:min(31vw,420px);aspect-ratio:1;left:50%;top:48%;border:1px solid color-mix(in srgb,var(--menu-accent) 60%,transparent);border-radius:50%;transform:translate(-50%,-50%);animation:fx-index-orbit 9s linear infinite}.fx-index-orbit:before,.fx-index-orbit:after{content:"";position:absolute;inset:12%;border:1px solid rgba(255,255,255,.12);transform:rotate(45deg)}.fx-index-orbit:after{inset:31%;border-radius:50%;background:var(--menu-accent);filter:blur(28px);opacity:.42}
.index-panel[data-fx-preview="home"]{--menu-accent:#2997ff}.index-panel[data-fx-preview="about"]{--menu-accent:#bf5af2}.index-panel[data-fx-preview="architecture"]{--menu-accent:#ff453a}.index-panel[data-fx-preview="pm"]{--menu-accent:#f5f5f7}.index-panel[data-fx-preview="hci"]{--menu-accent:#5e5ce6}.index-panel[data-fx-preview="contact"]{--menu-accent:#30d158}
@keyframes fx-index-type{0%{opacity:0;transform:translateY(70%) rotate(3deg);filter:blur(12px)}100%{opacity:1;transform:none;filter:none}}@keyframes fx-index-number{0%{opacity:0;transform:translateX(25px)}100%{opacity:1;transform:none}}@keyframes fx-index-orbit{to{transform:translate(-50%,-50%) rotate(360deg)}}

@media(max-width:900px),(pointer:coarse){.fx-cursor,.fx-grid,.fx-counter{display:none}.fx-aura{width:90vw}.fx-lightbox{padding:58px 12px}.fx-lightbox img{max-height:calc(100svh - 116px);border-radius:10px}.fx-lightbox-prev,.fx-lightbox-next{top:auto;bottom:16px}.fx-lightbox-prev{left:50%;margin-left:-56px}.fx-lightbox-next{right:50%;margin-right:-56px}.fx-lightbox-meta{display:none}}
@media(max-width:900px){.hero{padding-right:18px;padding-left:18px;padding-bottom:88px}.hero h1{font-size:clamp(32px,10.5vw,74px)!important;line-height:1.04!important;padding-bottom:.16em}.hero h1 .line+.line{margin-top:.06em!important}.hero .hero-intro{margin-top:clamp(34px,5vh,52px)!important;margin-bottom:24px!important}.hero .scale-map{width:100%}.hero .scale{min-height:58px;padding:9px 8px}.hero-scroll-prompt{display:flex!important;bottom:10px;gap:8px}.scroll-marker{transform:scale(.88);transform-origin:right center}.scroll-message small{display:none}.portfolio-showcase{width:100%;height:auto;margin:0;padding:34px 18px;grid-template-columns:1fr;grid-template-rows:auto;gap:12px}.portfolio-showcase .showcase-wide{grid-row:auto}.portfolio-showcase figure:nth-child(3){width:min(72%,420px)}.index-panel{display:flex!important;padding:76px 20px 24px!important}.index-panel nav{width:100%;margin:auto 0!important}.index-panel nav a,.index-panel nav button{min-height:62px!important;padding:0 8px!important;grid-template-columns:40px 1fr auto!important}.index-panel nav b{font-size:clamp(34px,10vw,54px)!important}.fx-index-preview{display:none}.index-panel>p{width:min(340px,100%)!important;margin-top:auto!important}.index-panel .index-socials{width:100%}.logo-tile{width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;flex-basis:40px!important}.logo-initials{font-size:14px!important}.personal-mark{width:29px!important;height:29px!important}}
@media(max-width:900px){.portfolio-showcase{padding:58px 0 36px;display:block!important}.photo-wall-heading,.photo-wall-status{width:calc(100% - 36px)}.photo-wall-heading{margin-bottom:14px}.photo-wall-heading p strong{font-size:25px}.photo-wall-heading>span{font-size:8px}.photo-wall-track{padding-inline:18px;gap:12px}.photo-wall-panel{flex-basis:calc(100vw - 36px);aspect-ratio:4/5;grid-template-rows:repeat(12,minmax(0,1fr));gap:8px}.photo-wall-panel figure{width:auto!important;aspect-ratio:auto!important;justify-self:stretch!important}.photo-wall-panel:nth-child(1) figure:nth-child(1){grid-column:1/13;grid-row:1/7}.photo-wall-panel:nth-child(1) figure:nth-child(2){grid-column:1/8;grid-row:7/10}.photo-wall-panel:nth-child(1) figure:nth-child(3){grid-column:8/13;grid-row:7/13}.photo-wall-panel:nth-child(1) figure:nth-child(4){grid-column:1/8;grid-row:10/13}.photo-wall-panel:nth-child(2) figure:nth-child(1){grid-column:1/6;grid-row:1/13}.photo-wall-panel:nth-child(2) figure:nth-child(2){grid-column:6/13;grid-row:1/6}.photo-wall-panel:nth-child(2) figure:nth-child(3){grid-column:6/13;grid-row:6/10}.photo-wall-panel:nth-child(2) figure:nth-child(4){grid-column:6/13;grid-row:10/13}.photo-wall-panel:nth-child(3) figure:nth-child(1){grid-column:1/13;grid-row:1/6}.photo-wall-panel:nth-child(3) figure:nth-child(2){grid-column:8/13;grid-row:6/13}.photo-wall-panel:nth-child(3) figure:nth-child(3){grid-column:1/4;grid-row:6/13}.photo-wall-panel:nth-child(3) figure:nth-child(4){grid-column:4/8;grid-row:6/13}.photo-wall-panel:nth-child(4) figure:nth-child(1){grid-column:1/6;grid-row:1/6}.photo-wall-panel:nth-child(4) figure:nth-child(2){grid-column:6/13;grid-row:1/6}.photo-wall-panel:nth-child(4) figure:nth-child(3){grid-column:1/5;grid-row:6/13}.photo-wall-panel:nth-child(4) figure:nth-child(4){grid-column:5/13;grid-row:6/13}.photo-wall-panel figcaption{display:none}}
@media(prefers-reduced-motion:reduce){.fx-aura,.fx-grid,.fx-cursor,.fx-ripple,.fx-spark{display:none!important}.fx-section:after{display:none}.fx-heading,.fx-tilt,.fx-magnetic,.fx-image,.fx-image img,.fx-word{opacity:1!important;filter:none!important;clip-path:none!important;transform:none!important;transition:none!important}.hero h1,.category-hero h1,.about-hero h1,.project-gateway h1{animation:none}}
@media(prefers-reduced-motion:reduce){.scroll-marker,.scroll-marker-body,.fx-index-orbit,.fx-index-preview strong,.fx-index-preview i,.photo-wall-heading>span i{animation:none}.scroll-marker-body{transition:none}.index-panel nav a,.index-panel nav button,.fx-index-preview{opacity:1;transform:none;transition:none!important}}

/* Keep architecture card hover clean: the generic tilt/glare layers can
   spill outside the artwork and obscure the project drawings. */
.category-architecture-archive .arch-work-card.fx-tilt{transform:none!important;transform-style:flat!important}
.category-architecture-archive .arch-work-card.fx-tilt:before,
.category-architecture-archive .arch-work-image.fx-image:after,
.category-architecture-archive .arch-work-image:before,
.category-architecture-archive .arch-work-image:after{display:none!important}
.category-architecture-archive .arch-work-image img{position:relative;z-index:1}

/* Contact layout: respond to both viewport width and viewport height. */
.contact-page{min-width:0;min-height:100svh;min-height:100dvh;overflow-x:hidden}
.contact-page .contact-gateway{box-sizing:border-box;min-width:0;min-height:100svh;min-height:100dvh;padding-top:52px;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);align-items:stretch}
.contact-page .contact-form-panel,.contact-page .contact-studio-panel{box-sizing:border-box;min-width:0;min-height:calc(100svh - 52px);min-height:calc(100dvh - 52px);padding:clamp(28px,5.5vh,74px) clamp(24px,4vw,64px) clamp(22px,3vh,34px)}
.contact-page .contact-form-panel h1{margin:clamp(18px,3vh,44px) 0 clamp(14px,2.3vh,26px);font-size:clamp(48px,min(7vw,8vh),112px)!important;line-height:.88}
.contact-page .contact-lead{margin-bottom:clamp(14px,2.4vh,28px);font-size:clamp(14px,min(1.15vw,2vh),17px)}
.contact-page .contact-compose{gap:clamp(8px,1.25vh,14px) 16px}
.contact-page .contact-compose label{gap:clamp(4px,.7vh,7px)}
.contact-page .contact-compose input,.contact-page .contact-compose textarea{min-height:clamp(42px,5vh,52px);padding-block:clamp(9px,1.35vh,14px)}
.contact-page .contact-compose button{height:clamp(44px,5vh,48px)}
.contact-page .contact-qr-dock{padding-top:clamp(12px,2vh,24px)}
.contact-page .contact-qr-dock img{width:clamp(38px,5.4vh,58px);height:clamp(38px,5.4vh,58px)}
.contact-page .contact-studio-panel{margin:clamp(10px,1.7vh,18px) clamp(10px,1.2vw,18px) clamp(10px,1.7vh,18px) 0;min-height:calc(100svh - 52px - clamp(20px,3.4vh,36px));min-height:calc(100dvh - 52px - clamp(20px,3.4vh,36px))}
.contact-page .contact-methods{margin-top:clamp(16px,3vh,42px)}
.contact-page .contact-methods a{min-height:clamp(68px,9.5vh,102px)}
.contact-page .studio-message{margin-top:clamp(16px,3vh,40px);padding:clamp(13px,2vh,20px) clamp(15px,2vw,22px)}
.contact-page .studio-illustration{min-height:clamp(230px,34vh,350px);margin-top:clamp(12px,2vh,22px)}

@media(max-width:1100px){.contact-page .contact-gateway{grid-template-columns:1fr}.contact-page .contact-form-panel,.contact-page .contact-studio-panel{min-height:auto;padding:clamp(76px,11vh,110px) clamp(20px,6vw,58px) clamp(32px,5vh,52px)}.contact-page .contact-form-panel{min-height:calc(100svh - 52px);min-height:calc(100dvh - 52px)}.contact-page .contact-form-panel h1{font-size:clamp(58px,12vw,104px)!important}.contact-page .contact-compose{grid-template-columns:1fr}.contact-page .contact-compose button,.contact-page .form-status{grid-column:1}.contact-page .contact-qr-dock{margin-top:clamp(30px,6vh,56px)}.contact-page .contact-studio-panel{margin:0 18px 18px;min-height:clamp(680px,100svh,920px);min-height:clamp(680px,100dvh,920px)}.contact-page .studio-illustration{min-height:clamp(340px,48vh,500px)}}
@media(max-width:900px){.contact-page .contact-gateway{padding-top:48px}.contact-page .contact-form-panel{min-height:calc(100svh - 48px);min-height:calc(100dvh - 48px)}}
@media(max-width:600px){.contact-page .contact-form-panel,.contact-page .contact-studio-panel{padding-right:20px;padding-left:20px}.contact-page .contact-form-panel h1{font-size:clamp(52px,17vw,82px)!important}.contact-page .contact-studio-panel{margin:0;min-height:680px;border-radius:0!important}.contact-page .contact-qr-dock{overflow-x:auto}.contact-page .studio-illustration{min-height:360px}}
@media(min-width:1101px) and (max-height:720px){.contact-page .contact-form-panel,.contact-page .contact-studio-panel{padding:clamp(18px,3.5vh,26px) clamp(28px,3.5vw,52px) clamp(14px,2.5vh,22px)}.contact-page .contact-form-panel h1{margin:clamp(10px,2vh,16px) 0 clamp(8px,1.6vh,12px);font-size:clamp(34px,7vh,52px)!important}.contact-page .contact-lead{margin-bottom:clamp(8px,1.7vh,12px);font-size:clamp(12px,1.7vh,14px);line-height:1.35}.contact-page .contact-compose{gap:clamp(5px,1vh,8px) 12px}.contact-page .contact-compose label{gap:3px}.contact-page .contact-compose input,.contact-page .contact-compose textarea{min-height:34px;padding:7px 13px;font-size:13px}.contact-page .contact-compose button{height:36px}.contact-page .contact-compose button i{width:28px;height:28px}.contact-page .contact-qr-dock{padding-top:clamp(6px,1.2vh,10px)}.contact-page .contact-qr-dock img{width:clamp(28px,5.5vh,38px);height:clamp(28px,5.5vh,38px)}.contact-page .contact-methods{margin-top:clamp(10px,2vh,16px)}.contact-page .contact-methods a{min-height:clamp(52px,10vh,70px);padding:10px}.contact-page .studio-message{margin-top:clamp(10px,2vh,16px);padding:10px 14px}.contact-page .studio-illustration{min-height:clamp(180px,32vh,230px);margin-top:10px}.contact-page .screen-smile{width:clamp(50px,11vh,72px)}}

/* One shared opening edge: every subpage label begins under the logo tile. */
.category-page .category-hero,.about-page .about-hero,.project-page .project-gateway{padding-left:var(--shell-edge)!important;padding-right:var(--shell-edge)!important}
.contact-page .contact-form-panel{padding-left:var(--shell-edge)}
@media(max-width:900px){:root{--shell-edge:18px}.category-page .category-hero,.about-page .about-hero,.project-page .project-gateway{padding-left:var(--shell-edge)!important;padding-right:var(--shell-edge)!important}.contact-page .contact-form-panel{padding-left:var(--shell-edge)}}

/* Keep architecture card hover clean: generic tilt and glare layers can
   spill outside the artwork and obscure the project drawings. */
.category-architecture-archive .arch-work-card.fx-tilt{transform:none!important;transform-style:flat!important}
.category-architecture-archive .arch-work-card.fx-tilt:before,
.category-architecture-archive .arch-work-image.fx-image:after,
.category-architecture-archive .arch-work-image:before,
.category-architecture-archive .arch-work-image:after{display:none!important}
.category-architecture-archive .arch-work-image img{position:relative;z-index:1}