.hero--archive { background: #020202; cursor: none; }
.view:not(.active) { display: none !important; }
body.home-project-flow #project-detail { display: block !important; width: 100%; min-height: 0; margin: 0; padding: 0; }
#home.active ~ #project-detail { display: block !important; width: 100%; min-height: 0; margin: 0; padding: 0; }
.hero--archive::after { display: none; }
.saline-cover { --x: 50%; --y: 42%; --reveal: clamp(110px, 16vw, 250px); position: absolute; inset: 0; overflow: hidden; isolation: isolate; touch-action: none; }
.saline-cover::after { content: ""; position: absolute; inset: 0; z-index: 4; pointer-events: none; background: radial-gradient(circle at center, transparent 45%, rgba(0,0,0,.34) 100%); }
.saline-cover-plane { position: absolute; inset: 0; overflow: hidden; }
.saline-cover-plane > div { position: absolute; top: 45%; left: 50%; width: 100svh; height: 100vw; background-position: center; background-repeat: no-repeat; background-size: cover; transform: translate(-50%, -50%) rotate(90deg) scale(1.52); }
.saline-cover-base { z-index: 1; opacity: .8; }
.saline-cover-base > div { background-image: url('../assets/home-cover/salt-framework-optimized.webp'); }
.saline-cover-crystal { z-index: 2; opacity: 0; will-change: -webkit-mask-image, mask-image; transition: opacity .2s ease; -webkit-mask-image: radial-gradient(circle 0 at var(--x) var(--y), #000 0, transparent 100%); mask-image: radial-gradient(circle 0 at var(--x) var(--y), #000 0, transparent 100%); }
.saline-cover-crystal > div { background-image: url('../assets/home-cover/salt-crystallized-optimized.webp'); }
.saline-cover.is-active .saline-cover-crystal { opacity: 1; -webkit-mask-image: radial-gradient(circle var(--reveal) at var(--x) var(--y), #000 0 46%, rgba(0,0,0,.82) 61%, transparent 100%); mask-image: radial-gradient(circle var(--reveal) at var(--x) var(--y), #000 0 46%, rgba(0,0,0,.82) 61%, transparent 100%); }
.saline-cover-cursor { position: absolute; z-index: 7; top: var(--y); left: var(--x); width: clamp(34px,3vw,52px); aspect-ratio: 1; border: 1px solid rgba(255,255,255,.7); border-radius: 50%; transform: translate(-50%,-50%) scale(.7); opacity: 0; pointer-events: none; box-shadow: 0 0 30px rgba(255,218,207,.16), inset 0 0 20px rgba(255,255,255,.08); transition: opacity .25s ease, transform .35s ease; }
.saline-cover.is-active .saline-cover-cursor { opacity: 1; transform: translate(-50%,-50%) scale(1); }
.saline-cover-grain { display: none; }
.hero--archive .cover-copy { z-index: 8; top: clamp(88px,11vw,140px); bottom: auto; left: clamp(22px,3.2vw,48px); width: auto; pointer-events: none; }
.hero--archive .cover-copy p { margin-bottom: 14px; color: rgba(255,255,255,.72); font-size: clamp(9px,.82vw,12px); letter-spacing: -.025em; }
.hero--archive .cover-copy h1 { font-size: clamp(3.6rem,8.5vw,9rem); letter-spacing: -.082em; }
.hero--archive .cover-copy .enter-link { pointer-events: auto; margin-top: 26px; }
.hero--archive .cover-copy { top: auto; bottom: 84px; }
@media (max-width:680px) { .hero--archive { cursor:auto; } .saline-cover-plane > div { top:46%; transform:translate(-50%,-50%) rotate(90deg) scale(1.56); } .hero--archive .cover-copy { top:auto; bottom:80px; left:22px; } }
@media (prefers-reduced-motion: reduce) { .saline-cover-crystal,.saline-cover-cursor { transition:none; } }