/* Astorians Cinematic Motion System v2.3.0
 * Progressive enhancement. No element is invisible without JavaScript.
 * All movement is transform/opacity based and never changes layout or data.
 */
:root{--asc-ease:cubic-bezier(.17,.78,.22,1);--asc-ease-out:cubic-bezier(.22,1,.36,1);--asc-highlight:#9970ff;--asc-ink:#1a1033;--asc-edge:rgba(130,105,184,.22)}
body.ast-cine-immersive{--asc-primary:#9066fb;--asc-secondary:#ffb890;--asc-dark:#1b123c}
body.ast-cine-editorial{--asc-primary:#ae8be9;--asc-secondary:#f4c7a5;--asc-dark:#181126}
body.ast-cine-learning{--asc-primary:#6bdcc7;--asc-secondary:#cbb3ff;--asc-dark:#102b2d}
body.ast-cine-quiet{--asc-primary:#b2a2d6;--asc-secondary:#fff3df;--asc-dark:#28213c}
/* A quiet line acts as the site's film timeline; it is not a progress claim. */
#asc-scroll-track{position:fixed;z-index:100020;left:0;top:0;right:0;height:3px;background:transparent;pointer-events:none;overflow:hidden}
#asc-scroll-track span{display:block;transform:scaleX(0);transform-origin:left center;width:100%;height:100%;background:linear-gradient(90deg,#7453e7 0%,#d0a6fa 55%,#f9c6aa 100%);box-shadow:0 0 15px #a98af8aa}
/* Shared overlay lives behind the controls: no click interception and no layout shift. */
.as-cine-hero{position:relative;isolation:isolate;--asc-px:62%;--asc-py:38%}
.as-cine-hero>.as-cine-atmosphere{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;isolation:isolate}
.as-cine-hero>.as-cine-atmosphere::before{content:"";position:absolute;inset:-25%;background:radial-gradient(ellipse 35% 34% at var(--asc-px) var(--asc-py),rgba(177,142,252,.24),transparent 75%),radial-gradient(ellipse 37% 40% at 4% 12%,rgba(253,196,167,.16),transparent 75%);filter:blur(18px);opacity:.65;animation:asc-ambient-breathe 18s ease-in-out infinite alternate}
.as-cine-hero>.as-cine-atmosphere::after{content:"";position:absolute;top:10%;bottom:10%;right:2%;width:1px;background:linear-gradient(180deg,transparent,rgba(174,151,237,.42),transparent);opacity:.4}
.as-cine-hero>[data-as-cine-title],.as-cine-hero>.copy,.as-cine-hero>.aso-hero-grid,.as-cine-hero>.ast11-container{position:relative;z-index:1}
@keyframes asc-ambient-breathe{0%{transform:translate3d(-2%,1%,0) rotate(-7deg) scale(1)}100%{transform:translate3d(3%,-2%,0) rotate(7deg) scale(1.07)}}
/* Framing is deliberately light: it should suggest a camera rather than become a UI box. */
.as-cine-frame{position:absolute;inset:24px;z-index:4;pointer-events:none;border:1px solid rgba(158,135,215,.13);border-radius:24px;mask-image:linear-gradient(90deg,black 0%,transparent 28%,transparent 72%,black 100%);opacity:.7}
.as-cine-frame::before,.as-cine-frame::after{content:"";position:absolute;width:32px;height:32px;border-color:rgba(168,126,247,.55);border-style:solid}
.as-cine-frame::before{top:0;left:0;border-width:1px 0 0 1px;border-radius:10px 0 0 0}
.as-cine-frame::after{bottom:0;right:0;border-width:0 1px 1px 0;border-radius:0 0 10px 0}
/* Theme-specific editorial light treatment, stronger in the actual Journal. */
.ast-cine-editorial .as-cine-hero>.as-cine-atmosphere::before{background:radial-gradient(ellipse 40% 43% at var(--asc-px) var(--asc-py),rgba(203,151,116,.18),transparent 75%),radial-gradient(ellipse 30% 39% at 8% 10%,rgba(143,112,223,.15),transparent 80%)}
.ast-cine-learning .as-cine-hero>.as-cine-atmosphere::before{background:radial-gradient(ellipse 42% 34% at var(--asc-px) var(--asc-py),rgba(102,204,193,.18),transparent 75%),radial-gradient(ellipse 40% 40% at 4% 12%,rgba(173,139,253,.19),transparent 80%)}
/* Chapter ribbon: interactive scene links to content that already exists. */
#asc-chapters{position:fixed;right:16px;top:50%;transform:translateY(-50%);z-index:1100;display:grid;justify-items:center;gap:10px;border-radius:24px;padding:13px 7px;background:rgba(26,18,51,.75);border:1px solid rgba(255,255,255,.14);box-shadow:0 22px 50px rgba(21,12,50,.18);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);color:#fff}
#asc-chapters .asc-rail-mark{font:700 9px/1.2 system-ui,sans-serif;letter-spacing:.15em;color:#e2cafa;writing-mode:vertical-rl;rotate:180deg;margin-bottom:7px}
#asc-chapters button{width:21px;height:21px;display:grid;place-items:center;padding:0;border:0;border-radius:50%;background:transparent;color:inherit;cursor:pointer}
#asc-chapters button::after{content:"";display:block;width:5px;height:5px;border-radius:50%;background:rgba(224,205,255,.55);transition:transform .25s ease,background .25s ease,box-shadow .25s ease}
#asc-chapters button[aria-current="step"]::after,#asc-chapters button:hover::after{background:#e9c0ff;transform:scale(1.7);box-shadow:0 0 0 4px rgba(232,196,255,.17)}
#asc-chapters button:focus-visible{outline:2px solid #dcb6ff;outline-offset:3px}
#asc-chapters .asc-current{font:750 9px/1.3 system-ui,sans-serif;letter-spacing:.06em;opacity:.92;margin-top:3px}
/* Controls are a meaningful opt-out. No navigation or third-party data. */
#asc-motion-toggle{position:fixed;left:18px;bottom:18px;z-index:10010;display:inline-flex;align-items:center;justify-content:center;gap:8px;flex-shrink:0;padding:9px 12px;border-radius:999px;font:700 10px/1.2 system-ui,sans-serif;letter-spacing:.09em;white-space:nowrap;text-transform:uppercase;border:1px solid rgba(126,91,190,.35);background:rgba(250,246,255,.95);color:#402575;box-shadow:0 6px 20px rgba(50,31,94,.07);cursor:pointer;transition:background .22s,box-shadow .22s,color .22s}
#asc-motion-toggle:hover{background:#eee3ff;box-shadow:0 7px 20px #6e48b52b}
#asc-motion-toggle:focus-visible{outline:3px solid #c5a4ff;outline-offset:3px}
#asc-motion-toggle .asc-toggle-orb{width:8px;height:8px;border-radius:50%;background:#7456dc;box-shadow:0 0 0 4px #d9cafa}
#asc-motion-toggle[aria-pressed="false"] .asc-toggle-orb{background:#96929d;box-shadow:none}
.ast-learningos-home #asc-motion-toggle{border-color:rgba(100,61,180,.25);background:#fff;max-width:150px}
.ast-cine-quiet #asc-chapters{display:none}
/* Never displace form controls or add distracting image motion to sensitive screens. */
.ast-cine-quiet .as-cine-hero>.as-cine-atmosphere{opacity:.25}
.ast-cine-quiet .as-cine-frame{display:none}
/* Media entry and scroll depth. Avoid selecting any model/world/canvas. */
.as-cine-camera-image{transform-origin:center center;backface-visibility:hidden}
.as-cine-parallax{--asc-depth:0px;transform:translate3d(0,var(--asc-depth),0) scale(1.025);will-change:transform}
.as-cine-reveal{scroll-margin-top:100px}
.as-cine-image-shell{overflow:hidden;border-radius:inherit}
.as-cine-magnetic{translate:var(--asc-mx,0px) var(--asc-my,0px);transition:translate .26s var(--asc-ease-out)}
/* Sticky page headers acquire the confidence of a fixed studio navigation. */
body.as-cine-has-scrolled .ast-header,body.as-cine-has-scrolled .header{box-shadow:0 12px 32px rgba(37,21,73,.08);transition:box-shadow .35s ease}
/* Section dividers and chapter typography; no filler content is inserted. */
.ast-cine-immersive .as-cine-reveal h2,.ast-cine-editorial .as-cine-reveal h2{letter-spacing:-.035em}
.as-cine-reveal>.as-cine-chapter-number{display:inline-block;margin:0 0 9px;padding:5px 0;color:#8767b4;font:750 10px/1.2 system-ui,sans-serif;letter-spacing:.18em;opacity:.8}
/* Avoid permanent paint costs or overlap on mobile. */
@media(max-width:1100px){#asc-chapters{display:none}}
@media(max-width:740px){#asc-motion-toggle{font-size:9px;padding:8px 10px} .as-cine-hero>.as-cine-atmosphere::before{opacity:.28;animation:none}.as-cine-frame{inset:12px;opacity:.4}}
@media(prefers-reduced-motion:reduce){.as-cine-hero>.as-cine-atmosphere::before{animation:none!important}.as-cine-magnetic,.as-cine-parallax{translate:none!important;transform:none!important;will-change:auto!important}html{scroll-behavior:auto!important}}
body[data-asc-motion="off"] .as-cine-hero>.as-cine-atmosphere::before{animation:none!important}
body[data-asc-motion="off"] .as-cine-magnetic{translate:none!important}
body[data-asc-motion="off"] .as-cine-parallax{transform:none!important;will-change:auto!important}
@media print{#asc-scroll-track,#asc-chapters,#asc-motion-toggle,.as-cine-atmosphere,.as-cine-frame{display:none!important}.as-cine-magnetic,.as-cine-parallax{transform:none!important;translate:none!important}}

.as-cine-hero>.as-cine-atmosphere>.as-cine-sky{position:absolute;inset:0;display:block;pointer-events:none;opacity:.85}
body[data-asc-motion="off"] .as-cine-sky{display:none!important}
@media (prefers-reduced-motion:reduce){.as-cine-sky{display:none!important}}

@media(max-width:740px){#asc-motion-toggle{left:12px;bottom:12px}}
