/* PRIME Motion UI (Tennoji) — site-wide motion & refinement layer.
   Everything is scoped to body.prime-motion so that disabling the plugin restores the original look. */

body.prime-motion{
  --pm-brand:#2f4a38;
  --pm-brand-deep:#213e32;
  --pm-brand-soft:#edf1e9;
  --pm-paper:#f8f7f3;
  --pm-ink:#26302a;
  --pm-muted:#62695f;
  --pm-gold:#c3ad7c;
  --pm-gold-soft:#dfd1b1;
  --pm-line:rgba(47,74,56,.12);
  --pm-ease:cubic-bezier(.22,1,.36,1);
  --pm-ease-out:cubic-bezier(.16,1,.3,1);
  --pm-r:14px;
  --pm-d:34px;
  --pm-dur:1s;
  --pm-x:50%;
  --pm-y:50%;
}
body.prime-motion--subtle{--pm-d:16px;--pm-dur:.6s}

/* ---------- Reveal on scroll (works without Motion, driven by IntersectionObserver) ---------- */
html.pm-js body.prime-motion .pm-reveal{
  opacity:0;
  transform:translate3d(0,var(--pm-d),0);
  transition:opacity var(--pm-dur) var(--pm-ease),transform var(--pm-dur) var(--pm-ease);
  transition-delay:var(--pm-delay,0s);
  will-change:opacity,transform;
}
html.pm-js body.prime-motion .pm-reveal.pm-reveal--l{transform:translate3d(calc(var(--pm-d) * -1),0,0)}
html.pm-js body.prime-motion .pm-reveal.pm-reveal--r{transform:translate3d(var(--pm-d),0,0)}
html.pm-js body.prime-motion .pm-reveal.pm-reveal--scale{transform:scale(.95) translate3d(0,calc(var(--pm-d) / 2),0)}
html.pm-js body.prime-motion .pm-reveal.pm-in{opacity:1;transform:none}

/* Heading character reveal (Motion) */
body.prime-motion .pm-ch{display:inline-block;white-space:pre;opacity:0;will-change:transform,opacity,filter}
body.prime-motion .pm-ch.pm-ch-show,body.prime-motion .pm-split-done .pm-ch{opacity:1;filter:none;transform:none}

/* ---------- Scroll progress ---------- */
body.prime-motion .pm-progress{
  position:fixed;top:0;left:0;width:100%;height:3px;z-index:2147483000;
  transform-origin:0 50%;transform:scaleX(0);
  background:linear-gradient(90deg,var(--pm-brand-deep) 0%,var(--pm-brand) 45%,var(--pm-gold) 100%);
  box-shadow:0 0 10px rgba(195,173,124,.45);
  pointer-events:none;
}

/* ---------- Header: glass on scroll ---------- */
body.prime-motion .site-header{transition:box-shadow .5s var(--pm-ease),background-color .5s var(--pm-ease)}
body.prime-motion .site-header.pm-scrolled{background-color:rgba(246,242,234,.84)!important;-webkit-backdrop-filter:saturate(1.3) blur(14px);backdrop-filter:saturate(1.3) blur(14px);box-shadow:0 10px 30px -20px rgba(38,48,42,.45)}

/* ---------- Aurora backdrop in the hero (dark green: use additive glows) ---------- */
body.prime-motion .pm-has-aurora{position:relative;isolation:isolate}
body.prime-motion .pm-aurora{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:-1}
body.prime-motion .pm-aurora i{
  position:absolute;border-radius:50%;filter:blur(80px);opacity:.42;mix-blend-mode:screen;
  animation:pm-drift 26s ease-in-out infinite alternate;
}
body.prime-motion .pm-aurora i:nth-child(1){width:48vw;height:48vw;left:-14vw;top:-20vw;background:radial-gradient(circle,#6f8f6a 0%,rgba(111,143,106,0) 70%)}
body.prime-motion .pm-aurora i:nth-child(2){width:36vw;height:36vw;left:26%;bottom:-18vw;background:radial-gradient(circle,#c3ad7c 0%,rgba(195,173,124,0) 70%);animation-duration:32s;animation-delay:-10s;opacity:.28}
body.prime-motion .pm-aurora i:nth-child(3){width:30vw;height:30vw;right:-8vw;top:8%;background:radial-gradient(circle,#4f7a5c 0%,rgba(79,122,92,0) 70%);animation-duration:24s;animation-delay:-16s}
@keyframes pm-drift{
  0%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(6vw,-3vw,0) scale(1.12)}
  100%{transform:translate3d(-4vw,4vw,0) scale(.96)}
}

/* ---------- Cards: spotlight + lift (21st.dev style, kept editorial) ---------- */
body.prime-motion .pm-card{
  position:relative;
  transition:transform .55s var(--pm-ease),box-shadow .55s var(--pm-ease),border-color .4s,background-color .4s;
  background-image:radial-gradient(420px circle at var(--pm-x) var(--pm-y),rgba(195,173,124,.16),transparent 42%);
  background-repeat:no-repeat;
}
body.prime-motion .article-card,
body.prime-motion .latest-post-item,
body.prime-motion .prime-sisters__card,
body.prime-motion .pba-card,
body.prime-motion .lesson-grid > article,
body.prime-motion .info-plan,
body.prime-motion .hero-offer{
  border-radius:var(--pm-r);
  box-shadow:0 1px 2px rgba(38,48,42,.04),0 18px 44px -26px rgba(38,48,42,.35);
}
@media (hover:hover) and (pointer:fine){
  body.prime-motion .pm-card:hover{transform:translateY(-5px);box-shadow:0 2px 4px rgba(38,48,42,.05),0 30px 60px -28px rgba(38,48,42,.5)}
  body.prime-motion .concerns > li,body.prime-motion .reasons > li,body.prime-motion .flow-list > li,body.prime-motion .route-step{transition:transform .5s var(--pm-ease)}
  body.prime-motion .concerns > li:hover,body.prime-motion .reasons > li:hover,body.prime-motion .flow-list > li:hover,body.prime-motion .route-step:hover{transform:translateX(6px)}
}
body.prime-motion .faq-list > details{transition:background-color .35s,box-shadow .35s;border-radius:10px}
body.prime-motion .faq-list > details[open]{background-color:#fff;box-shadow:0 14px 34px -24px rgba(38,48,42,.45)}
body.prime-motion .faq-list > details summary{transition:color .3s}
body.prime-motion .faq-list > details summary:hover{color:var(--pm-brand)}

/* ---------- Buttons: deep-green gradient, shine sweep, press ---------- */
body.prime-motion .button,
body.prime-motion .sticky-reservation a,
body.prime-motion .header-cta,
body.prime-motion .site-header a.button{
  position:relative;overflow:hidden;isolation:isolate;
  transition:transform .35s var(--pm-ease),box-shadow .35s var(--pm-ease),background-color .3s,color .3s,border-color .3s;
}
body.prime-motion .button.button-primary,
body.prime-motion .sticky-reservation .sticky-line{
  background-image:linear-gradient(135deg,#3b5c46 0%,var(--pm-brand) 45%,var(--pm-brand-deep) 100%);
  box-shadow:0 10px 26px -14px rgba(33,62,50,.7),inset 0 1px 0 rgba(255,255,255,.12);
}
body.prime-motion .button::after,
body.prime-motion .sticky-reservation a::after{
  content:"";position:absolute;inset:-40% auto -40% -60%;width:40%;
  background:linear-gradient(105deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.35) 50%,rgba(255,255,255,0) 100%);
  transform:skewX(-18deg) translateX(-120%);pointer-events:none;z-index:1;
}
@media (hover:hover) and (pointer:fine){
  body.prime-motion .button:hover,body.prime-motion .sticky-reservation a:hover{transform:translateY(-2px)}
  body.prime-motion .button.button-primary:hover{box-shadow:0 18px 34px -16px rgba(33,62,50,.8),inset 0 1px 0 rgba(255,255,255,.16)}
  body.prime-motion .button-outline:hover{background-color:rgba(47,74,56,.06)}
  body.prime-motion .button:hover::after,body.prime-motion .sticky-reservation a:hover::after{animation:pm-shine .9s var(--pm-ease) forwards}
}
@keyframes pm-shine{to{transform:skewX(-18deg) translateX(420%)}}
body.prime-motion .button:active,body.prime-motion .sticky-reservation a:active{transform:scale(.97)}

/* Text links: arrow nudge + underline draw */
body.prime-motion .text-link{position:relative;transition:color .3s}
body.prime-motion .text-link::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .45s var(--pm-ease)}
@media (hover:hover) and (pointer:fine){
  body.prime-motion .text-link:hover::after{transform:scaleX(1)}
}

/* Sticky reservation bar: slide-in + soft pulse */
html.pm-js body.prime-motion .sticky-reservation{transition:transform .8s var(--pm-ease),opacity .8s var(--pm-ease)}
html.pm-js body.prime-motion .sticky-reservation:not(.pm-cta-in){transform:translateY(110%);opacity:0}
body.prime-motion .sticky-reservation .sticky-line{animation:pm-pulse 4.2s ease-in-out 2s infinite}
@keyframes pm-pulse{
  0%,78%,100%{box-shadow:0 10px 26px -14px rgba(33,62,50,.7),0 0 0 0 rgba(195,173,124,0)}
  86%{box-shadow:0 10px 26px -14px rgba(33,62,50,.7),0 0 0 10px rgba(195,173,124,.22)}
  94%{box-shadow:0 10px 26px -14px rgba(33,62,50,.7),0 0 0 18px rgba(195,173,124,0)}
}

/* ---------- Images: parallax wrappers & hover zoom ---------- */
body.prime-motion .pm-px-wrap{overflow:hidden;border-radius:inherit}
body.prime-motion .pm-px{transform:scale(1.1);will-change:transform;display:block}
body.prime-motion .route-photo img,
body.prime-motion .pba-photo img,
body.prime-motion .media-figure img,
body.prime-motion .prime-group__photo img,
body.prime-motion .article-card img,
body.prime-motion .latest-post-item img{transition:transform .9s var(--pm-ease)}
@media (hover:hover) and (pointer:fine){
  body.prime-motion .route-step:hover .route-photo img,
  body.prime-motion .pba-photo:hover img,
  body.prime-motion .article-card:hover img,
  body.prime-motion .latest-post-item:hover img,
  body.prime-motion .prime-group__photo:hover img{transform:scale(1.05)}
}

/* ---------- Section heads: gold hairline grows in ---------- */
body.prime-motion .section-heading .eyebrow{letter-spacing:.24em}
body.prime-motion .section-heading h2::after{
  content:"";display:block;width:44px;height:1px;margin-top:.8em;background:linear-gradient(90deg,var(--pm-gold),rgba(195,173,124,0));
  transform:scaleX(0);transform-origin:left;transition:transform .9s var(--pm-ease) .25s;
}
body.prime-motion .section-heading.pm-done h2::after,body.prime-motion .section-heading.pm-in h2::after{transform:scaleX(1)}
body.prime-motion .section-heading[style*="text-align: center"] h2::after,
body.prime-motion .section-heading.center h2::after{margin-left:auto;margin-right:auto;transform-origin:center}

/* ---------- Hero offer: gentle float of the offer card ---------- */
body.prime-motion .hero-offer{transition:transform .6s var(--pm-ease),box-shadow .6s var(--pm-ease)}
@media (hover:hover) and (pointer:fine){
  body.prime-motion .hero-offer:hover{transform:translateY(-4px)}
}

/* ---------- Numbers ---------- */
body.prime-motion .pm-num{font-variant-numeric:tabular-nums}

/* ---------- Accessibility & reduced motion ---------- */
@media (prefers-reduced-motion: reduce){
  html.pm-js body.prime-motion .pm-reveal{opacity:1!important;transform:none!important;transition:none!important}
  body.prime-motion .pm-ch{opacity:1!important;transform:none!important;filter:none!important}
  body.prime-motion .pm-aurora i,body.prime-motion .sticky-reservation .sticky-line{animation:none!important}
  body.prime-motion .pm-px{transform:none!important}
  html.pm-js body.prime-motion .sticky-reservation:not(.pm-cta-in){transform:none;opacity:1}
  body.prime-motion .section-heading h2::after{transform:scaleX(1)}
}