/* Atlas Estates · Motion Plus — page transitions, custom cursor, scroll progress. Layered on top of atlas-cinema.css. Everything degrades gracefully and is disabled under prefers-reduced-motion. */ /* ── Page transition curtain ─────────────────────────────── */ .pt-overlay{ position:fixed; inset:0; z-index:9999; background:linear-gradient(160deg, #0A3D2E 0%, #062A1F 100%); transform:translateY(101%); pointer-events:none; display:flex; align-items:center; justify-content:center; } .pt-overlay .pt-mark{ opacity:0; transform:translateY(12px) scale(.92); transition:opacity .28s ease .12s, transform .34s cubic-bezier(.2,.8,.2,1) .12s; } /* Leaving: curtain sweeps up from bottom */ .pt-overlay.pt-cover{ transform:translateY(0); transition:transform .46s cubic-bezier(.65,.05,.35,1); pointer-events:all; } .pt-overlay.pt-cover .pt-mark{opacity:1; transform:translateY(0) scale(1)} /* Arriving: page starts covered (html.pt-enter set inline in ), curtain lifts */ html.pt-enter .pt-overlay{transform:translateY(0); transition:none} html.pt-enter .pt-overlay .pt-mark{opacity:1; transform:none; transition:none} .pt-overlay.pt-reveal{ transform:translateY(-101%); transition:transform .6s cubic-bezier(.65,.05,.35,1) .08s; } .pt-overlay.pt-reveal .pt-mark{opacity:0; transition:opacity .25s ease} /* ── Scroll progress hairline ────────────────────────────── */ .scroll-progress{ position:fixed; top:0; left:0; height:2px; width:100%; z-index:9998; pointer-events:none; background:linear-gradient(90deg, #B8924D, #D9B574); transform-origin:0 50%; transform:scaleX(0); } /* Custom cursor removed 2026-08-08 — site uses the normal system pointer. */ /* ── WebGL hero canvas (video-texture layer) ─────────────── */ #hero-gl-video{ position:absolute; inset:0; width:100%; height:100%; display:block; z-index:0; opacity:0; transition:opacity .9s ease; } #top.glv-on #hero-gl-video{opacity:.34} #top.glv-on .hero-video{opacity:0} /* ── Lift & glow — Four Disciplines cards ────────────────── */ /* The transition list re-declares the cine-reveal properties (opacity/clip-path) so the entrance animation keeps working while transform/shadow get a snappy hover timing instead of the slow staggered reveal timing. */ @media (hover:hover){ #manage article, #about div.p-7.reveal, #construction-detail article{ transition: opacity 1.4s var(--ease-cinema, cubic-bezier(.2,.8,.2,1)) calc(var(--i, 0) * 80ms), clip-path 1.4s var(--ease-cinema, cubic-bezier(.2,.8,.2,1)) calc(var(--i, 0) * 80ms), transform .45s cubic-bezier(.2,.8,.2,1), box-shadow .45s ease, background-color .45s ease; will-change: transform; } #manage article:hover, #about div.p-7.reveal:hover, #construction-detail article:hover{ transform: translateY(-8px); background-color: #FFFDF8; box-shadow: 0 22px 44px -20px rgba(10,61,46,.30), 0 8px 22px -10px rgba(184,146,77,.38), inset 0 0 0 1px rgba(184,146,77,.35); z-index: 2; } #manage article:hover svg{ stroke: #B8924D; transition: stroke .35s ease; } } /* ── Reduced motion: switch the whole layer off ──────────── */ @media (prefers-reduced-motion: reduce){ .pt-overlay, .scroll-progress, #hero-gl-video{display:none !important} #manage article, #manage article:hover{transform:none; box-shadow:none} }