/* ============================================================
   Animațiile din „Învăț” pentru orientare și numere (anim-numere.js).
   Întârzierea fiecărui element vine din JS, în --int; toate animațiile
   păstrează starea de la început înainte de pornire și starea de la
   sfârșit după oprire (fill-mode both).
   ============================================================ */

/* ---------- mișcări comune ---------- */
.an-apare { animation: an-apare 0.45s ease-out var(--int, 0s) both; }
.an-cade { animation: an-cade 0.55s cubic-bezier(0.3, 1.4, 0.6, 1) var(--int, 0s) both; }
.an-salt { animation: an-salt 0.6s ease-out var(--int, 0s) both; }
.an-dispare { display: inline-block; animation: an-dispare 0.5s ease-in var(--int, 0s) both; }
@keyframes an-apare { from { opacity: 0; transform: scale(0.6); } }
@keyframes an-cade { from { opacity: 0; transform: translateY(-40px); } }
@keyframes an-salt { 0% { opacity: 0; transform: scale(0.4); } 60% { opacity: 1; transform: scale(1.25); } }
@keyframes an-dispare { to { opacity: 0; transform: scale(0.3) translateY(10px); } }
/* Elementele SVG se transformă față de ele însele. */
svg .an-apare, svg .an-cade { transform-box: fill-box; transform-origin: center; }

/* Textele care se schimbă în același loc: stau unul peste altul. */
.an-contor { display: inline-grid; justify-items: center; align-items: center; }
.an-contor__val { grid-area: 1 / 1; opacity: 0; white-space: nowrap; animation: an-fereastra var(--dur, 1s) linear var(--int, 0s); }
.an-contor__val--ultim { opacity: 1; animation: an-apare 0.4s ease-out var(--int, 0s) both; }
@keyframes an-fereastra { 0%, 100% { opacity: 1; } }

.an-sir { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: center; gap: 4px 8px; font-size: clamp(1.2rem, 5vw, 2.4rem); font-weight: 900; color: var(--albastru-inchis); }
.an-sir__semn { color: var(--rosu); }
.an-sir__semn--virgula { margin-left: -8px; color: var(--albastru-inchis); }
.an-bete__total { display: block; margin-top: 6px; font-size: clamp(1.4rem, 4.6vw, 2.2rem); font-weight: 900; color: var(--albastru-inchis); text-align: center; }

/* ---------- numărarea ---------- */
.an-numara { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.an-numara__rand { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.an-numara__grup { display: flex; gap: 4px; padding: 26px 8px 6px; border-radius: 14px; background: var(--albastru-pal); }
.an-numara__ob { position: relative; display: inline-block; font-size: clamp(2.2rem, 8vw, 3rem); line-height: 1.1; }
.an-numara__nr { position: absolute; top: -24px; left: 50%; display: grid; place-items: center; width: 26px; height: 26px; margin-left: -13px; border-radius: 50%; background: var(--albastru); color: #fff; font-size: 0.95rem; }
.an-numara__total { font-size: clamp(2.6rem, 8vw, 3.6rem); color: var(--rosu); }

.an-scara { display: flex; align-items: flex-end; justify-content: center; gap: 8px; }
.an-scara__col { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.an-scara__ob { display: flex; flex-direction: column-reverse; align-items: center; font-size: clamp(1.4rem, 5vw, 1.8rem); line-height: 1.15; }
.an-scara__nou { display: inline-block; border-radius: 50%; background: var(--galben); }
.an-scara__col > b { font-size: 1.7rem; color: var(--albastru-inchis); }

.an-zero { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.an-zero__rand { display: flex; gap: 10px; min-height: 1.2em; font-size: clamp(2.4rem, 8vw, 3.2rem); line-height: 1.15; }
.an-zero__contor { font-size: clamp(1.4rem, 4.6vw, 2rem); font-weight: 900; color: var(--albastru-inchis); }

/* Bilele care trec dintr-o grupă în cealaltă. */
.an-desc { display: flex; flex-direction: column; align-items: center; gap: 12px; font-size: clamp(1.15rem, 5.2vw, 2.4rem); }
.an-desc__rand { position: relative; width: calc((2 * var(--n) + 1) * 1.25em); height: 1.5em; }
.an-desc__bila { position: absolute; top: 0.1em; left: calc(var(--i) * 1.25em); width: 1.25em; text-align: center; line-height: 1.3; animation: an-trece 0.7s ease-in-out var(--int) both; }
@keyframes an-trece {
  from { transform: none; }
  50% { transform: translate(calc((var(--n) + 1) * 0.625em), -0.6em); }
  to { transform: translateX(calc((var(--n) + 1) * 1.25em)); }
}
.an-desc__bara { position: absolute; top: 0; bottom: 0; left: calc(var(--n) * 1.25em + 0.55em); width: 0.15em; border-radius: 4px; background: var(--cerneala-slaba); }
.an-desc__contor { font-weight: 900; color: var(--albastru-inchis); }

/* ---------- axa numerelor ---------- */
.an-axa { width: min(100%, 860px); }
.an-axa svg { overflow: visible; }
.an-axa__arc { stroke-dasharray: 1; stroke-dashoffset: 1; animation: an-traseaza var(--dur, 0.8s) ease-in-out var(--int, 0s) both; }
@keyframes an-traseaza { to { stroke-dashoffset: 0; } }
.an-axa__colorat { animation: an-coloreaza 0.3s ease-out var(--int, 0s) both; }
@keyframes an-coloreaza { to { fill: #d9534f; font-weight: 900; } }
.an-axa-sir { display: flex; flex-direction: column; align-items: center; gap: 10px; width: 100%; }

/* ---------- bețișoare ---------- */
.an-bete-anim { display: flex; flex-direction: column; align-items: center; width: 100%; }
.an-bete-loc { width: 100%; container-type: inline-size; }
.an-bete {
  --u: min(30px, calc(100cqw / var(--n)));
  position: relative;
  width: calc(var(--n) * var(--u));
  height: calc(5.6 * var(--u));
  margin: 0 auto;
}
.an-bete__bat { position: absolute; top: calc(1.5 * var(--u)); left: calc(var(--x) * var(--u)); width: calc(0.36 * var(--u)); height: calc(3.2 * var(--u)); border-radius: calc(0.12 * var(--u)); background: #e0a800; box-shadow: inset -2px 0 0 rgba(0, 0, 0, 0.12); }
.an-bete__bat--liber { position: static; display: block; }
.an-bete__nou { position: absolute; top: 0; left: calc(var(--x) * var(--u)); width: calc(0.36 * var(--u)); height: 100%; animation: an-strange 0.9s ease-in-out var(--dupa, 0s) both; }
@keyframes an-strange { from { transform: translateX(calc(var(--dx) * var(--u))); } }
.an-bete__cade { position: absolute; top: calc(1.5 * var(--u)); left: 0; display: block; }
.an-bete__nr { position: absolute; top: 0; left: 50%; width: 3em; margin-left: -1.5em; text-align: center; font-size: clamp(9px, calc(0.55 * var(--u)), 16px); line-height: calc(1.3 * var(--u)); color: var(--albastru-inchis); }
.an-bete__nou--leaga .an-bete__nr { animation: an-ascunde 0.4s ease-in var(--dupa, 0s) both; }
@keyframes an-ascunde { to { opacity: 0; } }
.an-bete__legatura { position: absolute; top: calc(2.9 * var(--u)); left: calc(var(--x) * var(--u)); width: calc((4.86 + 0.3) * var(--u)); height: calc(0.45 * var(--u)); border-radius: calc(0.15 * var(--u)); background: #d9534f; transform-origin: center; }
.an-bete__legatura--noua { animation: an-leaga 0.5s ease-out var(--int, 0s) both; }
@keyframes an-leaga { from { transform: scaleX(0); } }
.an-bete__sus { position: absolute; top: 0; left: calc(var(--x) * var(--u)); width: 6em; margin-left: -3em; text-align: center; font-size: clamp(12px, calc(0.6 * var(--u)), 18px); line-height: calc(1.3 * var(--u)); color: var(--rosu); }
.an-bete__grup { position: absolute; inset: 0; }
.an-bete__contor { font-size: clamp(1.6rem, 5vw, 2.4rem); font-weight: 900; color: var(--rosu); }

.an-grupe { display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-start; gap: 12px; font-size: clamp(1.25rem, 4.6vw, 1.7rem); }
.an-grupe__grup { position: relative; display: grid; grid-template-columns: repeat(5, auto); gap: 2px; padding: 8px; border: 3px dashed transparent; border-radius: 14px; }
.an-grupe__grup--plin { animation: an-chenar 0.4s ease-out var(--int, 0s) both; }
@keyframes an-chenar { from { border-color: transparent; background: transparent; } to { border-color: var(--verde); border-style: solid; background: var(--verde-pal); } }
.an-grupe__eticheta { position: absolute; top: -14px; right: -10px; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--verde); color: #fff; font-size: 1rem; }
.an-grupe > .an-bete__total { flex-basis: 100%; }

.an-zu td { vertical-align: bottom; }
.an-zu__desen td { height: 80px; padding: 6px 10px; }
.an-zu__manunchi, .an-zu__bat { display: inline-block; height: 64px; margin: 0 2px; border-radius: 3px; background: #e0a800; }
.an-zu__bat { width: 7px; }
.an-zu__manunchi { width: 30px; background: repeating-linear-gradient(90deg, #e0a800 0 4px, #fff 4px 6px); box-shadow: inset 0 26px 0 -20px transparent; position: relative; }
.an-zu__manunchi::after { content: ''; position: absolute; left: -3px; right: -3px; top: 28px; height: 8px; border-radius: 3px; background: #d9534f; }
.an-zu__cifra { color: var(--rosu); }

/* ---------- comparare ---------- */
.an-cmp { display: flex; align-items: flex-start; justify-content: center; gap: clamp(6px, 3vw, 30px); }
.an-cmp__nr { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.an-cmp__cifre { display: flex; gap: 4px; }
.an-cmp__cifra { display: grid; place-items: center; width: 1.2em; height: 1.35em; border: 3px solid var(--linie); border-radius: 12px; background: #fff; font-size: clamp(1.9rem, 8vw, 3.6rem); font-weight: 900; color: var(--albastru-inchis); }
.an-cmp__cifra--z, .an-cmp__cifra--u { animation: an-evidentiaza 0.5s ease-out var(--int, 0s) both; }
@keyframes an-evidentiaza { to { border-color: var(--portocaliu); background: #fff2c4; } }
.an-cmp__eticheta { font-size: clamp(1rem, 3.6vw, 1.25rem); font-weight: 800; color: var(--cerneala-slaba); white-space: nowrap; }
.an-cmp__semn { height: calc(1.35em + 6px); font-size: clamp(1.9rem, 8vw, 3.6rem); font-weight: 900; color: var(--rosu); }
.an-cmp__semn .an-contor__val--ultim { animation: an-salt 0.6s ease-out var(--int, 0s) both; }

.an-ord { display: flex; flex-direction: column; align-items: center; gap: 14px; }
.an-ord__rand { --pas: clamp(3.2rem, 15vw, 4.4rem); display: flex; align-items: flex-end; height: 140px; }
.an-ord__col { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; width: var(--pas); height: 100%; animation: an-muta 1.6s ease-in-out var(--int, 0s) both; }
@keyframes an-muta {
  0% { transform: translateX(calc(var(--dx) * var(--pas))); }
  25% { transform: translate(calc(var(--dx) * var(--pas)), -16px); }
  75% { transform: translate(0, -16px); }
  100% { transform: none; }
}
.an-ord__bara { width: 70%; height: calc(var(--h) * 100px); border-radius: 10px 10px 0 0; background: linear-gradient(var(--albastru), var(--albastru-inchis)); }
.an-ord__nr { font-size: clamp(1.4rem, 4.6vw, 1.9rem); color: var(--albastru-inchis); }

/* ---------- par și impar ---------- */
.an-perechi { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.an-perechi__rand { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 10px; }
.an-perechi__p { display: flex; flex-direction: column; align-items: center; gap: 2px; }
.an-perechi__ob { display: flex; min-width: 2.4em; justify-content: center; padding: 4px 8px; border: 3px solid transparent; border-radius: 16px; font-size: clamp(1.8rem, 7vw, 2.4rem); line-height: 1.15; animation: an-pereche 0.4s ease-out var(--int, 0s) both; }
@keyframes an-pereche { to { border-color: var(--verde); background: var(--verde-pal); } }
.an-perechi__p--singur .an-perechi__ob { animation-name: an-singur; }
@keyframes an-singur { to { border-color: var(--rosu); border-style: dashed; background: var(--rosu-pal); } }
.an-perechi__p .an-perechi__ob { animation-delay: var(--int, 0s); }
.an-perechi__nr { font-size: 1.1rem; color: var(--verde); }
.an-perechi__p--singur .an-perechi__nr { color: var(--rosu); }

.an-cifra-u { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.an-cifra-u__carte { display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 76px; padding: 8px 10px; border-radius: 16px; background: var(--albastru-pal); }
.an-cifra-u__nr { font-size: clamp(2rem, 7vw, 2.6rem); font-weight: 900; color: var(--albastru-inchis); }
.an-cifra-u__u { display: inline-block; padding: 0 4px; border-radius: 10px; animation: an-cerc-verde 0.4s ease-out var(--int, 0s) both; }
.an-cifra-u__carte--impar .an-cifra-u__u { animation-name: an-cerc-rosu; }
@keyframes an-cerc-verde { to { box-shadow: 0 0 0 3px var(--verde); color: var(--verde); } }
@keyframes an-cerc-rosu { to { box-shadow: 0 0 0 3px var(--rosu); color: var(--rosu); } }
.an-cifra-u__carte b { font-size: 1.15rem; color: var(--verde); }
.an-cifra-u__carte--impar b { color: var(--rosu); }

/* ---------- zece, sută, bani ---------- */
.an-zece { display: flex; flex-direction: column; gap: 6px; }
.an-zece__rand { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 4px 12px; }
.an-zece__bile { display: flex; gap: 3px; }
.an-zece__bila { width: clamp(16px, 5.4vw, 24px); height: clamp(16px, 5.4vw, 24px); border-radius: 50%; background: var(--albastru); }
.an-zece__bila--rosie { background: var(--rosu); }
.an-zece__bila:nth-child(5) { margin-right: 6px; }
.an-zece__calcul { min-width: 5.6em; font-size: clamp(1.15rem, 4vw, 1.5rem); color: var(--albastru-inchis); }

.an-suta-cu-total { display: flex; flex-direction: column; align-items: center; }
.an-suta { display: flex; flex-direction: column; gap: 4px; padding: 10px 12px; border-radius: 14px; background: var(--albastru-pal); }
.an-suta__rand { display: flex; align-items: center; gap: 4px; }
.an-suta__punct { width: clamp(13px, 4.2vw, 18px); height: clamp(13px, 4.2vw, 18px); border-radius: 50%; background: var(--albastru); }
.an-suta__punct--alt { background: var(--portocaliu); }
.an-suta__nr { min-width: 2.4em; margin-left: 8px; font-size: 1.05rem; color: var(--albastru-inchis); }

.an-bani { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.an-bani__rand { gap: 6px; }
.an-bani .bancnota { width: clamp(56px, 16vw, 96px); height: clamp(40px, 11vw, 52px); }
.an-bani .bancnota__valoare { font-size: clamp(1.1rem, 4.4vw, 1.5rem); }
.an-bani .bancnota__unitate { font-size: 0.65rem; }
.an-bani__contor { font-size: clamp(1.4rem, 4.6vw, 2rem); font-weight: 900; color: var(--albastru-inchis); }

.an-schimb { display: flex; flex-direction: column; align-items: center; gap: 12px; }
.an-schimb__tabel { --cel: clamp(64px, 18vw, 90px); display: grid; grid-template-columns: var(--cel) var(--cel); }
.an-schimb__cap, .an-schimb__cifra { display: grid; place-items: center; height: var(--cel); border: 3px solid var(--linie); font-weight: 900; }
.an-schimb__cap { height: 40px; color: var(--cerneala-slaba); font-size: 1.3rem; }
.an-schimb__cifra { position: relative; z-index: 1; font-size: clamp(2.6rem, 9vw, 3.6rem); color: var(--albastru-inchis); }
.an-schimb__cifra--z { animation: an-spre-dreapta 1.1s ease-in-out var(--int, 0s) both; }
.an-schimb__cifra--u { animation: an-spre-stanga 1.1s ease-in-out var(--int, 0s) both; color: var(--rosu); }
@keyframes an-spre-dreapta { 50% { transform: translate(calc(var(--cel) / 2), -40px); } to { transform: translateX(var(--cel)); } }
@keyframes an-spre-stanga { 50% { transform: translate(calc(var(--cel) / -2), 40px); } to { transform: translateX(calc(var(--cel) * -1)); } }
.an-schimb__contor { font-size: clamp(1.5rem, 5vw, 2.2rem); font-weight: 900; color: var(--albastru-inchis); }

/* ---------- interior și exterior ---------- */
.an-gard { width: min(100%, 320px); }
.an-gard__linie { stroke-dasharray: 1; stroke-dashoffset: 1; animation: an-traseaza 2s linear var(--int, 0s) both; }
.an-gard__interior { animation: an-apare-plin 0.6s ease-out var(--int, 0s) both; }
@keyframes an-apare-plin { from { opacity: 0; } }

.an-tarc-cu-text { display: flex; flex-direction: column; align-items: center; gap: 8px; width: 100%; }
.an-tarc { position: relative; width: min(100%, 300px); aspect-ratio: 26 / 18; }
.an-tarc__gard { position: absolute; left: 18%; top: 15%; width: 64%; height: 70%; border: 6px dashed #8a5a2b; border-radius: 50%; background: var(--verde-pal); box-sizing: border-box; }
.an-tarc__ob { position: absolute; transform: translate(-50%, -50%); font-size: clamp(1.7rem, 7vw, 2.2rem); line-height: 1; }
.an-tarc__pasi { display: inline-block; animation: an-paseste 0.3s ease-in-out 0.5s var(--pasi, 6) alternate; }
@keyframes an-paseste { to { transform: translateY(-5px) rotate(-6deg); } }
.an-tarc__ob--vine { animation: an-vine-tarc 0.9s ease-out var(--int, 0s) both; }
.an-tarc__ob--vine .an-tarc__pasi { animation-delay: var(--int, 0s); --pasi: 3; }
@keyframes an-vine-tarc { from { left: -4%; top: 50%; opacity: 0; } 20% { opacity: 1; } }
.an-tarc__ob--in { animation: an-vine-tarc 0.9s ease-out var(--int, 0s) both, an-cerc-verde-ob 0.4s ease-out calc(var(--int, 0s) + 0.9s) both; border-radius: 50%; }
.an-tarc__ob--out { animation: an-vine-tarc 0.9s ease-out var(--int, 0s) both, an-cerc-rosu-ob 0.4s ease-out calc(var(--int, 0s) + 0.9s) both; border-radius: 50%; }
@keyframes an-cerc-verde-ob { to { box-shadow: 0 0 0 3px var(--verde); } }
@keyframes an-cerc-rosu-ob { to { box-shadow: 0 0 0 3px var(--rosu); } }
.an-tarc__total { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 18px; font-size: clamp(1.25rem, 4.4vw, 1.6rem); }
.an-tarc__in { color: var(--verde); }
.an-tarc__out { color: var(--rosu); }
.an-tarc__contor { font-size: clamp(1.3rem, 4.6vw, 1.8rem); font-weight: 900; color: var(--albastru-inchis); }

/* ---------- poziții ---------- */
.an-traseaza { stroke-dasharray: 1; stroke-dashoffset: 1; animation: an-traseaza 1.4s ease-in-out var(--int, 0s) both; }

.an-roteste { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.an-roteste__creion { display: block; width: 150px; animation: an-roteste 5.2s ease-in-out 0.4s both; }
.an-roteste__creion .desen--creion { width: 100%; }
@keyframes an-roteste {
  0%, 18% { transform: rotate(-90deg); }
  32%, 58% { transform: rotate(-45deg); }
  72%, 100% { transform: rotate(0deg); }
}
.an-roteste__contor { font-size: clamp(1.5rem, 5vw, 2.1rem); font-weight: 900; color: var(--albastru-inchis); }

.an-foaie-loc { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 16px 28px; }
.an-foaie { position: relative; width: 180px; height: 180px; border: 3px dashed var(--linie); border-radius: 16px; background: #fff; animation: an-foaia 1.6s ease-in-out 1.2s both; }
@keyframes an-foaia { to { transform: rotate(90deg); } }
.an-foaie__creion { position: absolute; width: 90px; }
.an-foaie__creion .desen--creion { width: 100%; }
.an-foaie__creion--v { left: -6px; top: 40px; }
.an-foaie__creion--o { right: 0; top: -6px; }
.an-foaie__creion--b { right: 0; bottom: -4px; }
.an-foaie__lista { display: flex; flex-direction: column; gap: 6px; font-size: clamp(1.1rem, 4vw, 1.35rem); font-weight: 800; }
.an-foaie__rand { display: flex; align-items: center; gap: 8px; }
.an-foaie__bulina { width: 18px; height: 18px; border-radius: 50%; }

.an-litere { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.an-litere__desen { width: min(100%, 360px); }
.an-litere__legenda { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 18px; font-size: 1.15rem; font-weight: 800; }

/* ---------- fără mișcare: starea de la sfârșit ---------- */
@media (prefers-reduced-motion: reduce) {
  .an-apare, .an-cade, .an-salt, .an-axa__arc, .an-traseaza, .an-gard__linie, .an-gard__interior,
  .an-bete__nou, .an-bete__nr, .an-bete__legatura--noua, .an-desc__bila, .an-ord__col,
  .an-tarc__pasi, .an-foaie, .an-roteste__creion, .an-contor__val, .an-cmp__semn .an-contor__val--ultim {
    animation: none !important;
  }
  .an-dispare { animation: none !important; opacity: 0; }
  .an-axa__arc, .an-traseaza, .an-gard__linie { stroke-dashoffset: 0; }
  .an-desc__bila { transform: translateX(calc((var(--n) + 1) * 1.25em)); }
  .an-bete__nou--leaga .an-bete__nr { opacity: 0; }
  .an-foaie { transform: rotate(90deg); }
  .an-roteste__creion { transform: none; }
  .an-axa__colorat { animation-duration: 0s !important; animation-delay: 0s !important; }
  .an-cmp__cifra--z, .an-cmp__cifra--u, .an-grupe__grup--plin, .an-perechi__ob, .an-cifra-u__u,
  .an-tarc__ob--vine, .an-tarc__ob--in, .an-tarc__ob--out, .an-schimb__cifra--z, .an-schimb__cifra--u {
    animation-duration: 0s !important;
    animation-delay: 0s !important;
  }
}

/* Axa scurtă (până la 10) are mai puține numere: se desenează mai mică,
   ca numerele să fie mari și pe telefon. */
.invata__vizual .an-axa.an-axa--scurta { width: min(100%, 600px); }

/* acvariul: peștele înoată în interior, pisica stă în exterior */
.an-acvariu { width: min(100%, 460px); }
.an-acvariu__inot { animation: an-inot 7s ease-in-out infinite; }
@keyframes an-inot {
  0% { transform: translate(85px, 150px); }
  45% { transform: translate(245px, 125px); }
  50% { transform: translate(245px, 125px); }
  95% { transform: translate(85px, 160px); }
  100% { transform: translate(85px, 150px); }
}
/* Emoji-ul peștelui privește spre stânga: spre dreapta înoată întors. */
.an-acvariu__intoarce { animation: an-intoarce 7s step-end infinite; }
@keyframes an-intoarce {
  0% { transform: scaleX(-1); }
  47.5% { transform: scaleX(1); }
  97.5% { transform: scaleX(-1); }
}
.an-acvariu__bula { animation: an-bula 4.2s ease-in var(--int, 0s) infinite both; }
@keyframes an-bula {
  from { transform: translateY(0); opacity: 0; }
  10% { opacity: 1; }
  to { transform: translateY(-120px); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .an-acvariu__inot, .an-acvariu__intoarce, .an-acvariu__bula { animation: none; }
  .an-acvariu__inot { transform: translate(165px, 150px); }
}