@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500&display=swap');
:root{--ink:#f6f4ef;--muted:rgba(246,244,239,.62);--line:rgba(255,255,255,.18)}*{box-sizing:border-box}html,body{min-height:100%}body{margin:0;background:#0d0d0d;color:var(--ink);font-family:Inter,Arial,sans-serif}a{color:inherit;text-decoration:none}main{min-height:100vh;padding:0 clamp(18px,2.2vw,38px) clamp(18px,2.2vw,38px)}.landing-header{height:96px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;flex-direction:column;gap:3px}.brand strong{font-size:1.25rem;line-height:1;letter-spacing:-.04em;text-transform:uppercase}.brand span,.landing-header p,.choice-label,.choice-number,.choice-action{font:400 .66rem/1.3 Arial,sans-serif;letter-spacing:.17em;text-transform:uppercase}.brand span,.landing-header p{color:var(--muted)}.landing-header p{margin:0}.portfolio-choice{display:grid;grid-template-columns:1fr 1fr;gap:12px;min-height:calc(100vh - 116px)}.choice{position:relative;display:flex;min-height:650px;overflow:hidden;padding:clamp(26px,3vw,52px);border:1px solid var(--line);isolation:isolate}.choice::before{content:"";position:absolute;inset:0;z-index:-2;transition:transform .8s cubic-bezier(.2,.7,.2,1),filter .5s ease}.choice::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(0,0,0,.05),rgba(0,0,0,.82))}.choice-static::before{background:url('project_page/assets/SpaceAccident.jpg') center/cover;filter:grayscale(1) brightness(.55)}.choice-3d::before{background:radial-gradient(circle at 68% 27%,#7b7894 0,#292936 25%,#111 62%)}.choice:hover::before{transform:scale(1.035);filter:grayscale(.15) brightness(.7)}.choice-number{position:absolute;top:clamp(26px,3vw,52px);right:clamp(26px,3vw,52px);color:var(--muted)}.choice-copy{width:min(100%,620px);margin-top:auto}.choice-label{color:var(--muted)}.choice h1{margin:22px 0 24px;font-size:clamp(4rem,7.5vw,9rem);font-weight:300;line-height:.78;letter-spacing:-.075em}.choice p{max-width:500px;margin:0 0 38px;color:rgba(255,255,255,.75);font-size:clamp(.95rem,1.1vw,1.12rem);line-height:1.6}.choice-action{display:flex;justify-content:space-between;padding:18px 0 0;border-top:1px solid var(--line)}.choice-action b{font-size:1rem;transition:transform .2s ease}.choice:hover .choice-action b{transform:translate(4px,-4px)}.choice-orbit{position:absolute;top:13%;right:8%;width:min(28vw,390px);aspect-ratio:1;border:1px solid rgba(255,255,255,.16);border-radius:50%;animation:spin 18s linear infinite}.choice-orbit::before,.choice-orbit::after{content:"";position:absolute;inset:17%;border:1px solid rgba(255,255,255,.13);border-radius:50%;transform:rotate(55deg) scaleY(.36)}.choice-orbit::after{transform:rotate(-35deg) scaleY(.55)}.choice-orbit i{position:absolute;width:7px;height:7px;border-radius:50%;background:#fff;box-shadow:0 0 18px #fff}.choice-orbit i:nth-child(1){top:4%;left:48%}.choice-orbit i:nth-child(2){bottom:20%;left:7%}.choice-orbit i:nth-child(3){right:12%;top:64%}@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:760px){main{padding-bottom:18px}.landing-header{height:82px}.landing-header p{display:none}.portfolio-choice{grid-template-columns:1fr;min-height:0}.choice{min-height:calc(100svh - 100px)}.choice h1{font-size:clamp(4.5rem,20vw,7rem)}.choice-orbit{width:65vw;right:-8%}.brand span{font-size:.56rem}}
@media(prefers-reduced-motion:reduce){.choice::before,.choice-action b,.choice-orbit{transition:none;animation:none}}

/* Live portfolio captures, optimized as lightweight WebP previews. */
.choice-static::before { background-image: url('landing-static.webp'); filter: grayscale(1) brightness(.48); }
.choice-3d::before { background: url('landing-3d.webp') center / cover; filter: brightness(.7); }
.choice:hover::before { filter: grayscale(.15) brightness(.66); }
.choice::after { background: linear-gradient(180deg, rgba(0,0,0,.3) 0%, rgba(0,0,0,.58) 48%, rgba(0,0,0,.95) 100%); }
.choice-reel { position:absolute; inset:0; z-index:-2; width:100%; height:100%; object-fit:cover; filter:grayscale(1) brightness(.38); transition:filter .4s ease,transform .8s cubic-bezier(.2,.7,.2,1); }
.choice:hover .choice-reel { filter:grayscale(.15) brightness(.48); transform:scale(1.025); }
@media(prefers-reduced-motion:reduce){.choice-reel{display:none}}