/* ASTORIANS CINEMATIC MOTION v3.0.4 · progressive enhancement.
   All content remains visible without JavaScript; transforms and opacity only. */
:root{--cine-fast:cubic-bezier(.16,1,.3,1);--cine-pink:#f778ec;--cine-cyan:#63eaff;--cine-gold:#ffd19c}
html{scroll-behavior:auto!important}
html.cine-ready .cine-heading{overflow:visible}
html.cine-ready .cine-heading .cine-word{display:inline-block;vertical-align:baseline;white-space:pre;transform-origin:50% 100%;will-change:auto}
html.cine-ready:not(.cine-reduced) .cine-heading .cine-word,
html.cine-ready:not(.cine-reduced) .cine-heading > .grad,
html.cine-ready:not(.cine-reduced) .cine-heading > span:not(.grad) .grad{
  opacity:0;transform:translate3d(0,26px,0);filter:blur(5px);
  transition:opacity .58s var(--cine-fast),transform .58s var(--cine-fast),filter .48s ease;
  transition-delay:calc(min(var(--cine-index,0),12)*38ms)}
html.cine-ready:not(.cine-reduced) .cine-heading.cine-in .cine-word,
html.cine-ready:not(.cine-reduced) .cine-heading.cine-in > .grad,
html.cine-ready:not(.cine-reduced) .cine-heading.cine-in > span:not(.grad) .grad{
  opacity:1;transform:translate3d(0,0,0);filter:blur(0)}
/* Hero lines reveal individually, with a sunset neon accent, but without forced line breaks on mobile. */
html.cine-ready .hero-copy h1>span{display:block;overflow:visible}
html.cine-ready:not(.cine-reduced) .hero-copy h1>span{transition:opacity .62s var(--cine-fast),transform .7s var(--cine-fast),filter .55s ease;
  transition-delay:calc(var(--cine-line,0)*115ms)}
html.cine-ready:not(.cine-reduced) .hero-copy h1:not(.cine-in)>span{opacity:0;transform:translate3d(0,22px,0);filter:blur(4px)}
html.cine-ready:not(.cine-reduced) .hero-copy h1.cine-in>span{opacity:1;transform:none;filter:none}
/* Animated illuminated filament below headings. */
.cine-heading:not(.hero-copy h1)::after{content:'';display:block;width:min(290px,57%);height:2px;margin:18px 0 0;
  background:linear-gradient(90deg,var(--cine-cyan),var(--cine-pink) 48%,var(--cine-gold),transparent);
  box-shadow:0 0 18px rgba(234,92,227,.55);transform-origin:left;transform:scaleX(0);opacity:0;pointer-events:none;
  transition:transform .72s var(--cine-fast) .12s,opacity .38s ease .12s}
.cine-heading.cine-in:not(.hero-copy h1)::after{transform:scaleX(1);opacity:.85}
/* Paragraphs unfurl; no splitting for readability or indexing. */
html.cine-ready:not(.cine-reduced) .cine-intro{opacity:0;transform:translate3d(0,18px,0);filter:blur(2px);
  transition:opacity .48s ease,transform .58s var(--cine-fast),filter .44s ease}
html.cine-ready:not(.cine-reduced) .cine-intro.cine-in{opacity:1;transform:none;filter:none}
/* A luminous diagonal sweep on real educational imagery. Underlay photos remain visible. */
.cine-surface{position:relative;isolation:isolate;overflow:hidden}
.cine-surface>.cine-flare{position:absolute;z-index:5;inset:0;pointer-events:none;opacity:0;
  transform:translate3d(-125%,0,0) skewX(-18deg);
  background:linear-gradient(90deg,transparent 20%,rgba(255,183,231,.02) 39%,rgba(161,105,255,.18) 48%,rgba(102,241,248,.26) 50%,rgba(247,171,225,.04) 61%,transparent 78%);
  mix-blend-mode:screen}
.cine-surface.cine-in>.cine-flare{animation:cine-flare-pass .98s var(--cine-fast) both}
@keyframes cine-flare-pass{0%{opacity:0;transform:translate3d(-125%,0,0) skewX(-18deg)}20%{opacity:1}80%{opacity:.75}100%{opacity:0;transform:translate3d(125%,0,0) skewX(-18deg)}}
/* Subtle real-time cursor light is limited to desktop fine-pointer devices. */
@media (hover:hover) and (pointer:fine) and (min-width:769px){
  .cine-hover{position:relative;isolation:isolate}
  .cine-hover::after{content:'';position:absolute;inset:0;border-radius:inherit;z-index:4;pointer-events:none;opacity:0;
    background:radial-gradient(260px circle at var(--cine-x,50%) var(--cine-y,50%),rgba(250,108,241,.18),rgba(106,211,248,.07) 48%,transparent 73%);
    transition:opacity .22s ease;mix-blend-mode:screen}
  .cine-hover:hover::after,.cine-hover:focus-within::after{opacity:1}
  .cine-hover:hover,.cine-hover:focus-within{border-color:rgba(252,164,237,.64)!important;
    box-shadow:0 14px 42px rgba(9,3,31,.55),0 0 27px rgba(166,74,249,.25),0 0 0 1px rgba(230,120,248,.28)!important}
}
/* Fast skip-to-section navigation never leaves headings hidden. */
html.cine-ready .cine-heading.cine-fast-arrival .cine-word,
html.cine-ready .cine-heading.cine-fast-arrival>.grad,
html.cine-ready .cine-intro.cine-fast-arrival{transition-delay:0ms!important;transition-duration:.24s!important}
/* Mobile gets shorter motion and smaller shifts; don't animate expensive blur on low-power screens. */
@media(max-width:768px){
 html.cine-ready:not(.cine-reduced) .cine-heading .cine-word,
 html.cine-ready:not(.cine-reduced) .cine-heading>.grad{filter:none;transform:translate3d(0,12px,0);
   transition-duration:.34s;transition-delay:calc(min(var(--cine-index,0),10)*21ms)}
 html.cine-ready:not(.cine-reduced) .cine-heading.cine-in .cine-word,
 html.cine-ready:not(.cine-reduced) .cine-heading.cine-in>.grad{transform:none}
 html.cine-ready:not(.cine-reduced) .cine-intro{filter:none;transform:translate3d(0,9px,0);transition-duration:.3s}
 .cine-surface.cine-in>.cine-flare{animation-duration:.55s;opacity:.5}
 .cine-heading:not(.hero-copy h1)::after{width:min(210px,48%)}
}
/* Opt-out and OS preference take precedence even if JS started the sequence. */
@media(prefers-reduced-motion:reduce){
 .cine-heading .cine-word,.cine-heading>.grad,.cine-intro{opacity:1!important;transform:none!important;filter:none!important;transition:none!important}
 .cine-heading::after{transform:scaleX(1)!important;opacity:.65!important;transition:none!important}
 .cine-flare{display:none!important}
}
body.motion-off .cine-heading .cine-word,body.motion-off .cine-heading>.grad,body.motion-off .cine-intro{
 opacity:1!important;transform:none!important;filter:none!important;transition:none!important}
body.motion-off .cine-heading::after{transform:scaleX(1)!important;opacity:.65!important;transition:none!important}
body.motion-off .cine-flare{display:none!important}
@media(forced-colors:active){.cine-heading::after,.cine-flare,.cine-hover::after{display:none!important}}
