/* A fixed navy sky with two small, composited animation layers. */
body{isolation:isolate}
.ambient-wallpaper{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;contain:strict;background:radial-gradient(ellipse at 9% 6%,#c7a45b18,transparent 53%),radial-gradient(ellipse at 94% 85%,#526eaa26,transparent 55%),#0b1120}
.star-parallax{position:absolute;inset:-16px;transition:transform .2s ease-out}
.star-layer{position:absolute;inset:-88px;opacity:.62;background-repeat:repeat;background-size:720px 660px;animation:stars-drift 40s linear -12s infinite alternate}
.star-layer-1{background-image:radial-gradient(1px 1px at 25px 36px,#d2def3 80%,transparent),radial-gradient(1px 1px at 193px 122px,#d2def3 80%,transparent),radial-gradient(1px 1px at 470px 58px,#d2def3 80%,transparent),radial-gradient(1px 1px at 623px 223px,#d2def3 80%,transparent),radial-gradient(1px 1px at 355px 259px,#d2def3 80%,transparent),radial-gradient(1px 1px at 109px 341px,#d2def3 80%,transparent),radial-gradient(1px 1px at 553px 389px,#d2def3 80%,transparent),radial-gradient(1px 1px at 295px 490px,#d2def3 80%,transparent),radial-gradient(1px 1px at 691px 579px,#d2def3 80%,transparent),radial-gradient(1px 1px at 174px 603px,#d2def3 80%,transparent),radial-gradient(1px 1px at 446px 620px,#d2def3 80%,transparent),radial-gradient(1px 1px at 380px 144px,#d2def3 80%,transparent)}
.star-layer-2{background-size:620px 730px;opacity:.74;animation-duration:30s;animation-delay:-8s;animation-direction:alternate-reverse;background-image:radial-gradient(1.4px 1.4px at 73px 171px,#e4d2a8 80%,transparent),radial-gradient(1.3px 1.3px at 445px 281px,#d7e3f4 80%,transparent),radial-gradient(1.5px 1.5px at 560px 40px,#e4d2a8 80%,transparent),radial-gradient(1.3px 1.3px at 240px 410px,#d7e3f4 80%,transparent),radial-gradient(1.4px 1.4px at 95px 650px,#e4d2a8 80%,transparent),radial-gradient(1.3px 1.3px at 497px 570px,#d7e3f4 80%,transparent),radial-gradient(1.4px 1.4px at 365px 702px,#e4d2a8 80%,transparent)}
@keyframes stars-drift{from{transform:translate3d(-64px,54px,0)}to{transform:translate3d(64px,-54px,0)}}

/* A transparent gold mark sits directly on every surface. */
.brand-mark{--mark-height:37px;display:block;position:relative;width:calc(var(--mark-height)*.58);height:var(--mark-height);flex-shrink:0;background:var(--gold);-webkit-mask-image:url('/assets/meridian-logo-gold.png');mask-image:url('/assets/meridian-logo-gold.png');-webkit-mask-size:calc(var(--mark-height)*1.5675) calc(var(--mark-height)*1.5675);mask-size:calc(var(--mark-height)*1.5675) calc(var(--mark-height)*1.5675);-webkit-mask-position:calc(var(--mark-height)*-.51875) calc(var(--mark-height)*-.2625);mask-position:calc(var(--mark-height)*-.51875) calc(var(--mark-height)*-.2625);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;mask-mode:alpha}
.connection-center .brand-mark{--mark-height:48px;margin-bottom:11px}
.brand .brand-mark{transition:transform .45s cubic-bezier(.2,.75,.25,1)}
.brand:hover .brand-mark{transform:translateY(-2px) rotate(4deg)}
.connection-node small{font-size:12px;color:#9daabe;line-height:1.3;text-align:center}

/* A transparent sculpture revolves in a shared, tilted orbital plane. */
.orbital-scene{--orbit-radius:clamp(170px,23vw,260px);--compass-size:clamp(245px,29vw,330px);--orbit-duration:28s;--orbit-delay:-18s;position:relative;width:100%;max-width:1120px;height:clamp(460px,54vw,580px);margin:12px auto 0;perspective:1400px;perspective-origin:50% 50%;pointer-events:none}
.orbit-aura{position:absolute;left:50%;top:50%;width:90%;height:75%;transform:translate(-50%,-50%);background:radial-gradient(ellipse,#c7a45b0b 0%,#7891bd06 35%,transparent 68%)}
.orbit-plane{position:absolute;left:50%;top:50%;width:0;height:0;transform:rotateX(64deg);transform-style:preserve-3d}
.celestial-ring{position:absolute;left:calc(-1 * var(--orbit-radius));top:calc(-1 * var(--orbit-radius));width:calc(2 * var(--orbit-radius));height:calc(2 * var(--orbit-radius));border:1px solid #d8bb7960;border-radius:50%;box-shadow:0 0 22px #d8bb7909,inset 0 0 22px #d8bb7909}
.celestial-ring--outer{transform:scale(1.29);border-color:#adbcd326;box-shadow:none}
.celestial-ring--inner{transform:scale(.69);border-color:#d8bb7924;box-shadow:none}
.compass-revolution,.compass-position,.compass-counterspin{position:absolute;width:0;height:0;transform-style:preserve-3d;transform-origin:0 0}
.compass-revolution{transform:rotateZ(35deg);animation:compass-revolve var(--orbit-duration) linear var(--orbit-delay) infinite}
.compass-revolution::before{content:"";position:absolute;left:calc(-1 * var(--orbit-radius));top:calc(-1 * var(--orbit-radius));width:calc(2 * var(--orbit-radius));height:calc(2 * var(--orbit-radius));border:1px solid transparent;border-right-color:#e6c98b;border-radius:50%}
.compass-position{transform:translateX(var(--orbit-radius))}
.compass-counterspin{transform:rotateZ(-35deg);animation:compass-counterspin var(--orbit-duration) linear var(--orbit-delay) infinite}
.compass-object{position:absolute;width:var(--compass-size);transform:translate(-50%,-50%) rotateX(-64deg);transform-style:preserve-3d}
.compass-object img{width:100%;max-width:none;height:auto;object-fit:contain;animation:compass-bank 14s ease-in-out -4s infinite alternate}
.guiding-star{position:absolute;left:50%;top:50%;width:5px;height:5px;border-radius:50%;background:#fff1ce;transform:translate(-50%,-50%);box-shadow:0 0 12px #f4d996b3,0 0 40px 7px #d8bb7926;animation:guide-glimmer 6s ease-in-out infinite alternate}
.guiding-star::before,.guiding-star::after{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:linear-gradient(transparent,#ffe6ad,transparent);width:1px;height:37px}
.guiding-star::after{transform:translate(-50%,-50%) rotate(90deg);height:25px}
@keyframes compass-revolve{from{transform:rotateZ(0deg)}to{transform:rotateZ(360deg)}}
@keyframes compass-counterspin{from{transform:rotateZ(0deg)}to{transform:rotateZ(-360deg)}}
@keyframes compass-bank{from{transform:rotate(-8deg)}to{transform:rotate(8deg)}}
@keyframes guide-glimmer{from{opacity:.55}to{opacity:.95}}
.school-lead .orbital-scene--compact{--orbit-radius:clamp(64px,8vw,110px);--compass-size:clamp(150px,16vw,210px);height:330px;margin:0}
.tile-visual{transition:transform .8s cubic-bezier(.2,.75,.25,1)}
.feature-tile{transition:box-shadow .6s ease}
.orbit-track{--orbit-start:-28deg;animation:product-orbit 30s linear infinite}
.orbit-track.second{--orbit-start:40deg;animation-duration:42s;animation-direction:reverse}
.orbit-track.third{--orbit-start:17deg;animation-duration:36s}
@keyframes product-orbit{from{transform:rotate(var(--orbit-start))}to{transform:rotate(calc(var(--orbit-start) + 360deg))}}
.connection::after{content:"";position:absolute;width:18%;height:1px;left:14%;top:50%;background:linear-gradient(90deg,transparent,#dfc480,transparent);animation:connection-flow 5.5s ease-in-out infinite;pointer-events:none}
@keyframes connection-flow{0%{transform:translateX(0);opacity:0}15%{opacity:.95}85%{opacity:.95}100%{transform:translateX(295%);opacity:0}}
.mini-steps span{transform-origin:left center}
.is-visible .mini-steps span{animation:step-draw 1.1s cubic-bezier(.16,1,.3,1) both}
.is-visible .mini-steps span:nth-child(2){animation-delay:.16s}
.is-visible .mini-steps span:nth-child(3){animation-delay:.32s}
@keyframes step-draw{from{transform:scaleX(.08);opacity:.35}to{transform:scaleX(1);opacity:1}}
.text-link{position:relative;transition:color .25s,border-color .25s}
.pill{transition:background .25s,transform .3s,box-shadow .3s}
.pill:active{transform:translateY(0) scale(.97)}
.site-header{transition:background .4s,box-shadow .4s}
.site-header.is-scrolled{background:rgba(11,17,32,.95);box-shadow:0 8px 30px #00000015}
@media(hover:hover) and (pointer:fine){
  .feature-tile:hover{box-shadow:0 18px 46px -30px #09122455}
  .feature-tile:hover .tile-visual{transform:translateY(-7px)}
  .pill:hover{box-shadow:0 8px 28px -12px #c7a45b80}
  .pill.outline:hover{box-shadow:none}
}

.site-footer{padding-bottom:76px}
.motion-toggle{position:fixed;right:20px;bottom:18px;z-index:45;display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:10px 15px;color:#d5dce7;background:rgba(14,22,37,.93);border:1px solid rgba(180,189,207,.24);border-radius:100px;font-size:12px;line-height:1.25;box-shadow:0 6px 25px #00000014}
.motion-toggle[hidden]{display:none}
.motion-toggle:hover{border-color:#c7a45b80;color:#fff}
.motion-toggle:disabled{cursor:default;opacity:.78}
.motion-symbol{width:9px;height:10px;border-inline:2px solid currentColor}
.motion-toggle[aria-pressed=true] .motion-symbol{width:0;height:0;border:5px solid transparent;border-right:0;border-left:8px solid currentColor}
.motion-toggle:disabled .motion-symbol{width:9px;height:2px;background:currentColor;border:0}
html.motion-paused *,html.motion-paused *::before,html.motion-paused *::after{animation-play-state:paused!important}
html.motion-paused .reveal{opacity:1;transform:none;transition:none}
html.motion-paused .hero .eyebrow,html.motion-paused .hero h1,html.motion-paused .hero .lead,html.motion-paused .hero-actions,html.motion-paused .page-hero .eyebrow,html.motion-paused .page-hero h1,html.motion-paused .page-hero .lead,html.motion-paused .contact-main .eyebrow,html.motion-paused .contact-main h1,html.motion-paused .contact-main .lead{animation:none;opacity:1;transform:none}
html.motion-paused .mini-steps span{animation:none;opacity:1;transform:none}
html.motion-paused .tile-visual,html.motion-paused .brand-mark,html.motion-paused .pill{transition:none}
html.motion-paused .brand:hover .brand-mark,html.motion-paused .feature-tile:hover .tile-visual,html.motion-paused .pill:hover{transform:none}

/* The orbit stops outside the viewport; the wallpaper remains quietly in motion. */
.motion-offscreen,.motion-offscreen *,.motion-offscreen::before,.motion-offscreen *::before,.motion-offscreen *::after{animation-play-state:paused!important}
@media(max-width:760px){
 .orbital-scene--hero{--orbit-radius:clamp(62px,22vw,135px);--compass-size:clamp(160px,48vw,260px);height:clamp(316px,64vw,404px);margin-top:8px}
 .school-lead .orbital-scene--compact{--orbit-radius:clamp(58px,20vw,120px);--compass-size:clamp(150px,43vw,230px);height:300px;margin:12px auto -10px}
 .brand-mark{--mark-height:33px}
 .connection-center .brand-mark{--mark-height:33px;margin-bottom:6px}
 .connection-node{min-height:100px}
 .connection-node small{font-size:11px;max-width:85px}
 .motion-toggle{right:12px;bottom:12px;padding:9px 12px;font-size:12px}
 .site-footer{padding-bottom:73px}
 .context-strip{gap:10px 16px}
 .context-strip span+span{padding-left:16px}
}
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
 .js-motion .reveal{opacity:1;transform:none}
 .compass-object img,.mini-steps span{transform:none}
 .brand:hover .brand-mark,.feature-tile:hover .tile-visual,.pill:hover{transform:none}
}

/* Intro typography arrives once; content below responds to each scroll. */
.hero .eyebrow,.hero h1,.hero .lead,.hero-actions,.page-hero .eyebrow,.page-hero h1,.page-hero .lead,.contact-main h1{animation:editorial-arrive .85s cubic-bezier(.16,1,.3,1) both}
.hero h1,.page-hero h1{animation-delay:.07s}
.hero .lead,.page-hero .lead{animation-delay:.14s}
.hero-actions{animation-delay:.2s}
@keyframes editorial-arrive{from{opacity:0;transform:translate3d(0,25px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
.scroll-reveal{--scroll-rise:56px;--scroll-scale:1;--scroll-shift:0px;transform-origin:50% 35%}
.scroll-visual{--scroll-rise:88px;--scroll-scale:.9}
.feature-copy.scroll-reveal{--scroll-shift:-32px}
.reverse .feature-copy.scroll-reveal{--scroll-shift:32px}
.scroll-reveal.is-arriving{animation:scroll-arrive 1.15s cubic-bezier(.2,.65,.3,1) both}
@keyframes scroll-arrive{from{opacity:.25;transform:translate3d(var(--scroll-shift),var(--scroll-rise),0) scale(var(--scroll-scale))}to{opacity:1;transform:translate3d(0,0,0) scale(1)}}
@keyframes compass-depth{from{opacity:1;transform:translate3d(0,0,0) scale(1)}to{opacity:.35;transform:translate3d(0,90px,0) scale(.86)}}
@supports (animation-timeline:view()) and (animation-range:cover 0px cover 360px){
 html.scroll-linked .scroll-reveal{animation:scroll-arrive 1s linear both;animation-timeline:view();animation-range:cover 0px cover clamp(160px,42vh,360px)}
 html.scroll-linked .orbital-scene--hero{animation:compass-depth 1s linear both;animation-timeline:view();animation-range:exit 0% exit 100%}
}
/* Focused controls are immediately readable, including when following an anchor. */
.scroll-reveal:focus-within{animation:none!important;opacity:1;transform:none}
@media(max-width:760px){
 .scroll-reveal{--scroll-rise:42px}
 .scroll-visual{--scroll-rise:64px;--scroll-scale:.92}
 .feature-copy.scroll-reveal,.reverse .feature-copy.scroll-reveal{--scroll-shift:0px}
}
.product-visual .plan-row .step-mark{animation:tutor-step 7.5s ease-in-out infinite}
.product-visual .plan-row:nth-child(2) .step-mark{animation-delay:-5s}
.product-visual .plan-row:nth-child(3) .step-mark{animation-delay:-2.5s}
@keyframes tutor-step{0%,28%,100%{opacity:1;transform:scale(1)}12%{opacity:1;transform:scale(1.12)}36%,90%{opacity:.55;transform:scale(1)}}
html.motion-paused .scroll-reveal,html.motion-paused .orbital-scene--hero{animation:none!important;opacity:1;transform:none}
html.motion-paused .network-node{transition:none}
html.motion-paused .network-node:hover,html.motion-paused .network-node:focus-visible{transform:translate(-50%,-50%)}
@media(prefers-reduced-motion:reduce){
 .scroll-reveal,.orbital-scene--hero{animation:none!important;opacity:1;transform:none}
 .network-node:hover,.network-node:focus-visible{transform:translate(-50%,-50%)}
}
