/* Public navigation: centered floating bar on home, compact corner menu on projects. */
.header.header{position:fixed;inset:14px 0 auto;width:min(990px,calc(100% - 48px));margin-inline:auto;z-index:40;background:#fffffff2!important;color:#111!important;border:1px solid #1111!important;border-radius:20px;box-shadow:0 8px 35px #0000000d;backdrop-filter:blur(18px);visibility:visible!important;opacity:1!important;pointer-events:auto!important}
.header .header-inner{width:100%;min-height:76px!important;padding:10px 22px;gap:22px}.header .brand img{filter:none!important}.header .brand>span{font-size:25px}.header .brand small{font-size:6px;letter-spacing:3px}.header .desktop-nav{gap:23px;font-size:12px}.header .header-cta{background:#111;color:#fff;border:0;border-radius:12px;padding:12px 17px;font-size:12px;gap:22px}.header .header-cta:hover{background:#333}.header .mobile-nav summary{border-color:#1114;color:#111}.header .mobile-nav nav{background:#fff;color:#111;border-radius:16px;box-shadow:0 12px 40px #0002}.hero .hero-content{padding-top:130px}.hero.hero{min-height:calc(100svh - 24px)}
.projects-page .project-header{position:fixed;inset:32px clamp(24px,5vw,75px) auto;display:flex;align-items:flex-start;justify-content:space-between;gap:20px;width:auto;max-width:none;margin:0;padding:0;min-height:0;z-index:40;pointer-events:none;background:none;border:0}.projects-page .project-brand,.corner-menu{pointer-events:auto}.projects-page .project-brand{display:flex;align-items:center;gap:9px;padding:13px 16px;background:#141414e8;color:#fff;border:1px solid #ffffff12;border-radius:14px;backdrop-filter:blur(18px);font-size:24px;line-height:1}.projects-page .project-brand img{width:30px;height:30px;filter:invert(1)!important}.projects-page .project-brand>span{font-size:24px}.projects-page .project-brand small{font-size:6px;letter-spacing:3px;margin-top:6px}.corner-menu{width:210px;border:1px solid #ffffff12;border-radius:15px;background:#161616ed;color:#fff;backdrop-filter:blur(22px);overflow:hidden;box-shadow:0 10px 35px #0002}.corner-toggle{display:flex;align-items:center;justify-content:space-between;gap:30px;width:100%;min-height:57px;padding:14px 18px;border:0;background:none;color:#fff;font:inherit;font-size:14px;font-weight:600;cursor:pointer}.corner-toggle svg{width:22px;height:22px;stroke-width:1.4;transition:transform .35s cubic-bezier(.22,1,.36,1)}.menu-open .corner-toggle svg{transform:rotate(45deg)}.projects-page .project-header nav{display:flex;flex-direction:column;align-items:stretch;gap:0;margin:0;overflow:hidden;padding:0 18px}.projects-page .project-header nav[hidden]{display:none}.projects-page .project-header nav>a{padding:10px 0;color:#aaa;font-size:15px;font-weight:550;line-height:1.5;min-height:42px;border:0;transform:none}.projects-page .project-header nav>a:last-child{margin-bottom:14px}.projects-page .project-header nav>a:hover,.projects-page .project-header nav>a[aria-current]{color:#fff;text-decoration:underline;text-underline-offset:6px}.corner-toggle:focus-visible,.project-header a:focus-visible{outline:2px solid #fff;outline-offset:-5px}
.projects-page .project-intro{display:flex;flex-direction:column;justify-content:center;min-height:100svh;margin:0 0 90px;border-radius:0;padding:160px clamp(28px,7vw,110px) 140px;background:#080808;overflow:hidden}.project-liquid-background{position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 80% 30%,#333,#080808 70%)}.liquid-canvas{display:block;width:100%;height:100%;position:absolute;inset:0}.projects-page .project-intro h1{font-size:clamp(62px,8.2vw,144px);max-width:1250px;line-height:1.07;font-weight:450;letter-spacing:-.06em;margin-bottom:50px}.projects-page .project-intro h1>span{font-family:Georgia,'Times New Roman',serif;font-style:italic;font-weight:400;letter-spacing:-.045em;color:#e2e2e2}.projects-page .project-intro-bottom{display:flex;justify-content:space-between;align-items:end;gap:45px;max-width:1100px}.projects-page .project-intro-bottom p{max-width:560px;margin-bottom:0;font-size:18px;color:#d3d3d3}.project-scroll-cue{display:flex;align-items:center;gap:30px;position:absolute;bottom:38px;left:clamp(28px,7vw,110px);color:#c7c7c7;font-size:12px}.project-scroll-cue svg{width:20px;height:20px}.project-detail{transform-origin:center center}.project-detail:focus{outline:none}
@media(max-width:1000px){.header .desktop-nav{gap:15px}.header .header-inner{gap:15px;padding-inline:18px}.header .brand>span{font-size:23px}.header .header-cta{gap:12px}.projects-page .project-intro h1{font-size:clamp(60px,8.6vw,100px)}}
@media(max-width:800px){.header.header{width:calc(100% - 32px);top:16px;border-radius:16px}.header .desktop-nav{display:none}.header .mobile-nav{display:block;margin-left:0}.header .header-cta{margin-left:auto;font-size:11px;padding:10px 13px;min-height:43px}.header .header-inner{min-height:65px!important}.header .mobile-nav summary{min-height:43px;padding:9px 10px;font-size:12px}.header .brand img{width:28px}.header .brand>span{font-size:21px}.header .brand{gap:7px}.header .brand small{font-size:5px}.projects-page .project-intro-bottom{display:block}.projects-page .project-intro-bottom p{font-size:16px;max-width:440px;margin-bottom:28px}.projects-page .project-intro h1{font-size:clamp(50px,9vw,75px)}.projects-page .project-intro{padding:145px 30px 125px}.project-scroll-cue{left:30px}.projects-page .project-header{inset:24px 24px auto}.corner-menu{width:180px}.corner-toggle{font-size:13px;min-height:55px}.projects-page .project-brand{padding:13px 12px}}
@media(max-width:400px){.header .header-inner{gap:9px;padding-inline:12px}.header .brand img{width:24px}.header .brand>span{font-size:19px}.header .header-cta{padding:10px;font-size:10px;gap:8px}.header .mobile-nav summary{font-size:11px;padding-inline:7px}.projects-page .project-header{inset:18px 18px auto}.projects-page .project-brand>span{font-size:20px}.projects-page .project-brand img{width:25px}.corner-menu{width:155px}.corner-toggle{padding-inline:13px;min-height:52px}.projects-page .project-intro{padding-inline:24px}.projects-page .project-intro h1{font-size:clamp(42px,10vw,48px)}.project-scroll-cue{left:24px}}
@media(prefers-reduced-motion:reduce){.corner-toggle svg{transition:none}}

.projects-page .project-intro h1>span{display:block}
/* Attached notch: its top joins the page surround, with concave shoulders. */
.header.header{inset:0 0 auto;width:min(800px,calc(100% - 96px));background:var(--color-surface-canvas,#fafafa)!important;border:0!important;border-radius:0 0 25px 25px;box-shadow:none;backdrop-filter:none}
.header.header::before,.header.header::after{content:'';position:absolute;top:0;width:25px;height:25px;pointer-events:none;background:radial-gradient(circle at 0 100%,transparent 25px,var(--color-surface-canvas,#fafafa) 25.5px)}
.header.header::before{left:-25px}.header.header::after{right:-25px;transform:scaleX(-1)}
.header .header-inner{min-height:68px!important;padding:12px 20px;gap:18px}.header .brand>span{font-size:23px}.header .brand img{width:30px;height:32px}.header .desktop-nav{gap:18px;font-size:11px}.header .header-cta{min-height:42px;font-size:11px;padding:10px 14px;gap:14px}
@media(max-width:850px){.header.header{width:calc(100% - 80px)}.header .header-inner{gap:13px;padding-inline:16px}.header .desktop-nav{gap:13px}.header .brand>span{font-size:21px}}
@media(max-width:800px){.header.header{top:0;width:calc(100% - 56px);border-radius:0 0 20px 20px}.header .header-inner{min-height:64px!important;padding:11px 13px;gap:10px}.header .header-cta{font-size:10px;padding:10px;gap:8px}.header .brand img{width:25px;height:28px}.header .brand>span{font-size:20px}.header .mobile-nav summary{padding-inline:7px;font-size:11px}}
@media(max-width:360px){.header.header{width:calc(100% - 40px)}.header .header-inner{padding-inline:10px;gap:7px}.header .brand{gap:5px}.header .brand>span{font-size:18px}.header .brand img{width:22px}.header .header-cta{font-size:9px;padding-inline:8px;gap:5px}.header .mobile-nav summary{font-size:10px;padding-inline:5px}}

.header .brand{height:40px;min-height:0}.header .brand img{max-height:32px;object-fit:contain}.header .brand>span{line-height:1}
/* Compact, opaque notch joined to the same white surround as the hero. */
.site-viewport-frame{position:fixed;inset:12px;z-index:38;border-radius:24px;box-shadow:0 0 0 26px #fafafa;pointer-events:none}
.header.header::before,.header.header::after{top:11px;width:24px;height:24px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M0 0C13.255 0 24 10.745 24 24V0Z' fill='%23fafafa'/%3E%3C/svg%3E") center/100% 100% no-repeat}
.header.header::before{left:-23px}.header.header::after{right:-23px}
.header.header{width:min(660px,calc(100% - 72px));background:#fafafa!important;border-radius:0 0 23px 23px;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.header.header:before,.header.header:after{top:12px;background:radial-gradient(circle at 0 100%,transparent 24px,#fafafa 24.5px);height:25px;width:25px}
.header .header-inner{min-height:62px!important;padding:10px 17px;gap:14px}.header.header .brand img{width:30px;height:32px;max-height:32px}.header .brand>span{font-size:20px}.header .brand small{font-size:5px;letter-spacing:2.5px}.header .desktop-nav{gap:14px;font-size:10px}.header .header-cta{font-size:10px;min-height:39px;padding:9px 12px;gap:11px}.public-scroll-line{display:none}
@media(max-width:800px){.header.header{width:min(420px,calc(100% - 48px))}.header .header-inner{min-height:62px!important;padding:10px 13px;gap:9px}.header .header-cta{font-size:10px}.header .brand>span{font-size:20px}}
@media(max-width:360px){.header.header{width:calc(100% - 36px)}.header .header-inner{padding-inline:9px;gap:7px}.header .brand>span{font-size:18px}.header.header .brand img{width:24px}.header .header-cta{font-size:9px;padding-inline:8px}.header .mobile-nav summary{font-size:10px;padding-inline:5px}}
/* Exact quarter-curve, overlapped by one pixel to seal the frame seam. */
.header.header::before,.header.header::after{top:11px;width:24px;height:24px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M0 0C13.255 0 24 10.745 24 24V0Z' fill='%23fafafa'/%3E%3C/svg%3E") center/100% 100% no-repeat}
.header.header::before{left:-23px}.header.header::after{right:-23px}