/* DSE interior motion layer (2026-10-16): the homepage's motion language, adapted for the
   editorial-interior sub pages. Scoped to body.dse-premium-interior; native content, forms
   and layout are untouched. Every effect respects prefers-reduced-motion. */
body.dse-premium-interior{--dse-x-gold:#e5a511;--dse-x-gold-line:#d39e1a}

/* ---------- scroll progress ---------- */
body.dse-premium-interior .dse-x-progress{position:fixed;top:0;left:0;right:0;z-index:10001;height:2px;pointer-events:none}
body.dse-premium-interior .dse-x-progress i{display:block;height:100%;width:100%;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,var(--dse-x-gold-line),var(--dse-x-gold))}

/* ---------- DSE Updates line ---------- */
body.dse-premium-interior .dse-x-updates{background:var(--ed-navy);color:#dfe5ec;font-size:12.5px;line-height:1.4;letter-spacing:-.01em}
body.dse-premium-interior .dse-x-updates-inner{height:38px;display:flex;align-items:center}
body.dse-premium-interior .dse-x-updates a{display:flex;align-items:center;gap:14px;width:100%;min-width:0;color:inherit!important;text-decoration:none!important}
body.dse-premium-interior .dse-x-updates b{flex:none;font-weight:600;color:#fff}
body.dse-premium-interior .dse-x-dot{flex:none;width:7px;height:7px;border-radius:50%;background:var(--dse-x-gold);box-shadow:0 0 0 0 rgba(229,165,17,.6);animation:dse-x-ping 2.2s infinite}
@keyframes dse-x-ping{70%{box-shadow:0 0 0 8px rgba(229,165,17,0)}100%{box-shadow:0 0 0 0 rgba(229,165,17,0)}}
body.dse-premium-interior .dse-x-ticker{position:relative;flex:1;min-width:0;height:18px;overflow:hidden}
body.dse-premium-interior .dse-x-ticker span{position:absolute;inset:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:0;transform:translateY(8px);transition:opacity .5s,transform .5s}
body.dse-premium-interior .dse-x-ticker span.on{opacity:1;transform:none}
body.dse-premium-interior .dse-x-updates em{flex:none;font-style:normal;color:#f2c766}
body.dse-premium-interior .dse-x-updates a:hover em{color:#fff}

/* ---------- header details ---------- */
body.dse-premium-interior .dse-ed-desktop-nav>a{position:relative}
body.dse-premium-interior .dse-ed-desktop-nav>a::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:1.5px;background:var(--dse-x-gold);transform:scaleX(0);transform-origin:left;transition:transform .3s}
body.dse-premium-interior .dse-ed-desktop-nav>a:hover::after,body.dse-premium-interior .dse-ed-desktop-nav>a[aria-current="page"]::after{transform:scaleX(1)}
body.dse-premium-interior .dse-ed-header-cta{position:relative;overflow:hidden;isolation:isolate}
body.dse-premium-interior .dse-ed-header-cta::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.22) 50%,transparent 70%);transform:translateX(-120%);transition:transform .8s cubic-bezier(.2,.7,.1,1)}
body.dse-premium-interior .dse-ed-header-cta:hover::after{transform:translateX(120%)}

/* ---------- headline: words rise into place ---------- */
body.dse-premium-interior main h1.dse-x-rise .dse-x-word{display:inline-block;opacity:0;transform:translateY(.42em);transition:opacity .7s cubic-bezier(.2,.7,.1,1),transform .7s cubic-bezier(.2,.7,.1,1)}
body.dse-premium-interior main h1.dse-x-rise.dse-x-on .dse-x-word{opacity:1;transform:none}
/* The governed design system whitens text inside hero cards (:where(...) h1..span); word spans must keep the heading's colour. */
html:is(#dse-x,*) body.dse-premium-interior main h1 .dse-x-word{color:inherit!important;-webkit-text-fill-color:currentColor!important}

/* ---------- intro: faint network field behind the first section ---------- */
body.dse-premium-interior .dse-x-field{position:absolute;inset:0;z-index:-1;width:100%;height:100%;pointer-events:none}

/* ---------- sections and cards reveal on scroll ---------- */
body.dse-premium-interior .dse-x-reveal{opacity:0;transform:translateY(18px);transition:opacity .9s cubic-bezier(.2,.7,.1,1),transform .9s cubic-bezier(.2,.7,.1,1)}
body.dse-premium-interior .dse-x-reveal.dse-x-in{opacity:1;transform:none}

/* ---------- page contents: gold marker on the active section ---------- */
body.dse-premium-interior main .dse-page-toc a.is-active{box-shadow:inset 0 -2px 0 var(--dse-x-gold)}

/* ---------- footer: Michigan time ---------- */
body.dse-premium-interior .dse-x-clock{display:none;align-items:center;gap:6px;margin-left:12px;padding-left:12px;border-left:1px solid var(--ed-line);font-variant-numeric:tabular-nums}
body.dse-premium-interior .dse-x-clock.on{display:inline-flex}
body.dse-premium-interior .dse-x-clock i{width:6px;height:6px;border-radius:50%;background:#2f9e5b;animation:dse-x-blink 2s ease-in-out infinite}
@keyframes dse-x-blink{50%{opacity:.35}}

@media (max-width:900px){body.dse-premium-interior .dse-x-updates em{display:none}}
@media (max-width:760px){body.dse-premium-interior .dse-x-clock{display:none!important}}
@media print{body.dse-premium-interior .dse-x-reveal,body.dse-premium-interior main h1 .dse-x-word{opacity:1!important;transform:none!important}body.dse-premium-interior :is(.dse-x-updates,.dse-x-progress,.dse-x-field){display:none!important}}
@media (prefers-reduced-motion:reduce){
  html:not(.dse-x-motion) body.dse-premium-interior .dse-x-reveal,html:not(.dse-x-motion) body.dse-premium-interior main h1 .dse-x-word{opacity:1;transform:none;transition:none}
  html:not(.dse-x-motion) body.dse-premium-interior :is(.dse-x-dot,.dse-x-clock i){animation:none}
}