:root{color-scheme:dark;--background: #060606;--text-main: #f4f4f4;--text-muted: #b6b6b6}*{box-sizing:border-box}html,body{margin:0;width:100%;min-height:100%;font-family:Inter,SF Pro Display,Segoe UI,sans-serif;color:var(--text-main);background:radial-gradient(circle at top,#0f0f0f 0%,var(--background) 62%)}body{overflow:hidden;touch-action:pan-y}#app{width:100vw;min-height:100dvh}.scene{position:relative;width:100%;min-height:100dvh;padding:clamp(1.1rem,2.5vw,2.8rem);display:flex;align-items:stretch}.photo-background{position:fixed;inset:0;z-index:0;background-size:cover;background-position:64% center;filter:grayscale(1) brightness(.72) contrast(1.06);transform:scale(1.06);opacity:0;will-change:transform,opacity}.photo-background:after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,#0000001f,#0000006b)}.photo-background.is-active{opacity:1}.readability-layer{position:fixed;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(0,0,0,.74) 0%,rgba(0,0,0,.55) 33%,rgba(0,0,0,.18) 56%,transparent 74%),radial-gradient(circle at 72% 48%,transparent 0%,rgba(0,0,0,.1) 46%,rgba(0,0,0,.36) 100%)}.rain-layer{position:fixed;inset:0;pointer-events:none;z-index:2;opacity:.38}.composition{position:relative;z-index:3;width:min(880px,78vw);display:flex;flex-direction:column;justify-content:space-between;padding:clamp(.8rem,2vw,1.6rem) 0}.hero-meta{max-width:760px}.kicker{margin:0;letter-spacing:.18em;font-size:.68rem;color:var(--text-muted)}.title{margin:.34rem 0 0;font-size:clamp(1.5rem,2.3vw,2.45rem);line-height:1.02;text-wrap:balance}.subtitle{margin:.34rem 0 0;color:var(--text-muted);font-size:clamp(.83rem,1.2vw,1rem)}.page-content{width:min(760px,78vw);margin-top:clamp(3rem,10vh,9rem);transform-origin:center;text-shadow:0 6px 18px rgba(0,0,0,.65)}.page-content h2{margin:0;font-size:clamp(2rem,5vw,4rem);line-height:.95;letter-spacing:-.02em;text-wrap:balance}.page-subtitle{margin:.85rem 0 1.45rem;color:#d7d7d7;max-width:64ch;font-size:clamp(.9rem,1.35vw,1.08rem)}.page-content ul{margin:0;padding:0;list-style:none;max-width:72ch;display:grid;gap:.75rem}.page-content li{position:relative;padding-left:1.22rem;line-height:1.45;font-size:clamp(.88rem,1.15vw,1rem);color:#ececec;overflow-wrap:anywhere;word-break:break-word}.page-content li:before{content:"";position:absolute;left:0;top:.56em;width:.5rem;height:1px;background:#ffffffc7}.composition-footer{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:1.5rem}.scroll-hint{margin:0;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted)}.nav-item{display:inline-flex;align-items:center;margin-left:.44rem;text-transform:uppercase;letter-spacing:.11em;font-size:.6rem;color:#ffffff8f;transition:color .22s ease,opacity .22s ease}.nav-item.active{color:#fff}@media(max-width:900px){.scene{min-height:100dvh;padding:max(.9rem,env(safe-area-inset-top)) max(.85rem,env(safe-area-inset-right)) max(1rem,env(safe-area-inset-bottom)) max(.85rem,env(safe-area-inset-left))}.photo-background{background-position:center}.readability-layer{background:linear-gradient(180deg,#0000009e,#0000006b 45%,#0000008f)}.composition{width:100%}.page-content{width:100%;margin-top:2.5rem}.page-content h2{font-size:clamp(1.75rem,8.8vw,2.6rem);line-height:.98}.page-content li{font-size:clamp(.86rem,3.8vw,.98rem);line-height:1.4}.composition-footer{flex-direction:row;align-items:center;justify-content:space-between;margin-top:1rem}.navigation{display:flex;gap:.2rem}.page-content[data-page-id=contact]{margin-top:clamp(1rem,7vh,2.2rem);min-height:48dvh;display:grid;align-content:center}.page-content[data-page-id=contact] .page-subtitle{margin-bottom:1.05rem}.page-content[data-page-id=contact] ul{max-width:100%}}
