/* ===== "ink & leaf" motion system — shared across the site =====
   one easing curve, durations 300/500/600ms + 1.1s photographic fades,
   motion enters up-and-in, reveals fire once, full reduced-motion support.
   Classes are applied by motion.js, so nothing is hidden if JS fails. */

:root { --ease-settle:cubic-bezier(0.22,1,0.36,1); }

@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }

/* logo leaf settles in once per page */
.logo-mark img { animation:fadeIn 0.8s var(--ease-settle) 0.15s backwards; }

/* scroll reveals — text & structure: an 8px settle.
   Doubled class selectors out-rank single-class transition rules in the
   page styles (which load after this file); extra properties keep the
   element's own hovers animated during the short reveal window. */
.reveal.reveal { opacity:0; transform:translateY(8px); transition:opacity 0.5s var(--ease-settle), transform 0.5s var(--ease-settle), color 0.3s var(--ease-settle); }
.reveal.in { opacity:1; transform:none; }

/* scroll reveals — cards & imagery: no movement, a slow photographic fade */
.reveal-fade.reveal-fade { opacity:0; transition:opacity 1.1s ease-out, transform 0.3s var(--ease-settle), background 0.25s ease, border-color 0.25s ease; }
.reveal-fade.in { opacity:1; }

/* leaf signature — clover markers unfurl gently when they enter */
.leaf-anim { transform-origin:50% 50%; transition:opacity 0.6s var(--ease-settle), transform 0.6s var(--ease-settle); }
.leaf-anim.leaf-wait { opacity:0; transform:scale(0.75) rotate(-30deg); }

/* text links — gold underline draws in left-to-right over the resting stone line.
   (a.* selectors out-rank the page-level rules that load after this file) */
.intro-more a, .intro-cv a, a.recent-all, a.sub-link {
  border-bottom:none !important; padding-bottom:2px;
  background-image:linear-gradient(var(--gold),var(--gold)), linear-gradient(var(--stone-soft),var(--stone-soft));
  background-repeat:no-repeat; background-position:0 100%, 0 100%; background-size:0 1px, 100% 1px;
  transition:background-size 0.3s var(--ease-settle), color 0.3s var(--ease-settle);
}
.intro-more a:hover, .intro-cv a:hover, a.recent-all:hover, a.sub-link:hover { background-size:100% 1px, 100% 1px; color:var(--gold); }

/* cross-page fade between any two pages that load this file */
@view-transition { navigation:auto; }

@media (prefers-reduced-motion:reduce){
  .logo-mark img { animation:none; }
  .reveal.reveal, .reveal-fade.reveal-fade { opacity:1; transform:none; transition:none; }
  .leaf-anim.leaf-wait { opacity:1; transform:none; }
}