/* shadows ease motion */
:root {
  /* motion */
  --asy-ease: ease-in;
  --asy-fast: 420ms;
  --asy-mid: 620ms;

  /* shadows (elevations) */
  --asy-shadow-0: 0 0 0 0 rgba(0,0,0,0);
  --asy-shadow-1: 0 1px 2px rgba(0,0,0,.06), 0 1px 1px rgba(0,0,0,.04);
  --asy-shadow-2: 0 2px 6px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.05);
  --asy-shadow-3: 0 8px 24px rgba(0,0,0,.12), 0 2px 6px rgba(0,0,0,.08);

  /* interactive overlays */
  --asy-ring: 0 0 0 3px rgba(0,64,128,.18); 
  --asy-ring-cta: 0 0 0 3px rgba(0,190,64,.22);
}

/* EN: Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  :root{
    --asy-fast: 0ms;
    --asy-mid: 0ms;
  }
}

html {scroll-behavior: smooth;}
a {
    transition: color var(--asy-mid) var(--asy-ease), text-decoration-color var(--asy-mid) var(--asy-ease);
}

a:focus-visible{ outline: none; box-shadow: var(--asy-ring); border-radius: 4px; }


/* EN: Motion/hover presets */
.hover-lift{
  transition: transform var(--asy-mid) var(--asy-ease), box-shadow var(--asy-mid) var(--asy-ease);
}
.hover-lift:hover{ transform: translateY(-2px); box-shadow: var(--asy-shadow-2); }

.hover-grow{
  transition: transform var(--asy-mid) var(--asy-ease);
}
.hover-grow:hover{ transform: scale(1.05); }

.hover-shadow{
  transition: var(--asy-mid) var(--asy-ease) 0s, background-color var(--asy-mid) var(--asy-ease) 0s, filter var(--asy-mid) var(--asy-ease) 0s, color var(--asy-mid) var(--asy-ease) 0s, transform var(--asy-fast) var(--asy-ease) 0s;
}
.hover-shadow:hover{ box-shadow: var(--asy-shadow-3); }

/* EN: Active/press feedback */
.pressable{ transition: transform var(--asy-mid) var(--asy-ease); }
.pressable:active{ transform: translateY(1px) scale(.99); }

/* EN: Smooth opacity hover */
.hover-fade{ transition: opacity var(--asy-mid) var(--asy-ease); }
.hover-fade:hover{ opacity:.85; }

.hover-unfade{ 
    transition: opacity var(--asy-fast) var(--asy-ease); 
}
.hover-unfade:hover {
    opacity: 1;
}

.hover-grow.hover-unfade {
    transition: transform var(--asy-mid) var(--asy-ease), opacity var(--asy-mid) var(--asy-ease);
    opacity: 0.9;
}

.hover-grow.hover-unfade:hover {
    opacity: 1;
    transform: scale(1.05);
}

/* EN: Generic focus ring */
.ring:focus-visible{ outline:none; box-shadow: var(--asy-ring); }