/* ============================================================
   STRATO AUTUNNALE — decorazioni, animali nascosti, segreti, particelle
   Si appoggia sopra il sito senza cambiarne la struttura.
   ============================================================ */
.hdr .hl{justify-self:start;display:flex;align-items:center;gap:14px}
.secrets{font-size:clamp(12px,1.2vw,17px);text-transform:uppercase;display:flex;align-items:center;gap:6px;white-space:nowrap}
.secrets img{width:16px;height:auto;transition:transform .5s cubic-bezier(.3,1.6,.5,1)}
.secrets.bump img{transform:rotate(-30deg) scale(1.5)}
@media (max-width:560px){ .secrets b{display:none} }

.au{position:absolute;z-index:4;pointer-events:none}
.au > *{pointer-events:auto}
.au img{display:block;width:100%;height:auto;-webkit-user-drag:none;user-select:none}
.au.deco{z-index:1}
.au.deco img{pointer-events:none}
.au.lib{display:none}
@media (min-width:640px){ .au.lib{display:block} }

/* ondeggiamenti */
.sway{animation:auSway 5s ease-in-out infinite;transform-origin:var(--to,50% 0)}
@keyframes auSway{0%,100%{transform:rotate(calc(var(--sw,3deg) * -1))}50%{transform:rotate(var(--sw,3deg))}}
.bob{animation:auBob 4s ease-in-out infinite}
@keyframes auBob{50%{transform:translateY(-8px) rotate(-3deg)}}
.spinslow{animation:auSpin 18s linear infinite}
@keyframes auSpin{to{transform:rotate(360deg)}}
.au .flip{transform:scaleX(-1)}

/* ---------- nascondigli: cespuglio davanti, animale dietro ---------- */
.hid{cursor:pointer;touch-action:manipulation}
.hid .a{position:absolute;left:var(--ax,50%);bottom:var(--ab,30%);width:var(--aw,55%);transform:translate(-50%,var(--down,95%)) ;
  transition:transform .55s cubic-bezier(.3,1.5,.5,1);z-index:1}
.hid .a img{transform-origin:50% 100%}
.hid .b{position:relative;z-index:2;transform-origin:50% 100%}
.hid.peek .a{transform:translate(-50%,var(--half,45%))}
.hid:hover .a{transform:translate(-50%,var(--half,40%))}
.hid.out .a{transform:translate(-50%,-8%)}
.hid.out .a img{animation:auJump .7s cubic-bezier(.3,.7,.4,1)}
@keyframes auJump{0%{transform:scale(1.1,.85)}40%{transform:translateY(-30%) scale(.95,1.08)}100%{transform:none}}
.hid.shake .b{animation:auShake .45s linear}
@keyframes auShake{20%,60%{transform:rotate(-4deg)}40%,80%{transform:rotate(4deg)}}
.hid .eyes{position:absolute;left:var(--ax,50%);bottom:calc(var(--ab,30%) + 4%);z-index:3;transform:translateX(-50%);display:flex;gap:6px;opacity:0;transition:opacity .3s;pointer-events:none}
.hid .eyes i{width:7px;height:7px;border-radius:50%;background:#1c1a18;box-shadow:0 0 0 2px #f6f6ed;animation:auBlink 3.2s infinite}
.hid.eyeson .eyes{opacity:1}
@keyframes auBlink{0%,92%,100%{transform:scaleY(1)}95%{transform:scaleY(.1)}}

/* ---------- segreti ---------- */
.sec{border:0;background:none;padding:0;cursor:pointer;display:block;width:100%;touch-action:manipulation;
  transition:transform .5s cubic-bezier(.3,1.6,.5,1)}
.sec:hover{transform:scale(1.08) rotate(-4deg)}
.sec.hint::after{content:"";position:absolute;right:6%;top:6%;width:10px;height:10px;border-radius:50%;background:#eef25a;
  box-shadow:0 0 0 0 rgba(238,242,90,.9);animation:auPing 2.2s infinite}
@keyframes auPing{0%{box-shadow:0 0 0 0 rgba(238,242,90,.9)}70%{box-shadow:0 0 0 14px rgba(238,242,90,0)}100%{box-shadow:0 0 0 0 rgba(238,242,90,0)}}
.sec.found.hint::after{display:none}
.sec.wig img{animation:auWig .6s ease-in-out}
@keyframes auWig{20%{transform:rotate(-14deg)}40%{transform:rotate(12deg)}60%{transform:rotate(-8deg)}80%{transform:rotate(4deg)}}
.reveal{position:absolute;left:50%;bottom:50%;pointer-events:none;z-index:6;transform:translate(-50%,40%) scale(0);opacity:0}
.reveal.go{animation:auReveal 2.6s cubic-bezier(.3,1.4,.5,1) forwards}
@keyframes auReveal{0%{transform:translate(-50%,40%) scale(0);opacity:0}18%{transform:translate(-50%,-40%) scale(1);opacity:1}
  75%{transform:translate(-50%,-60%) scale(1);opacity:1}100%{transform:translate(-50%,-140%) scale(.8);opacity:0}}
.reveal.fly{animation:auFly 2.8s cubic-bezier(.4,0,.6,1) forwards}
@keyframes auFly{0%{transform:translate(-50%,40%) scale(0);opacity:0}15%{transform:translate(-50%,-40%) scale(1);opacity:1}
  100%{transform:translate(calc(-50% + var(--fx,300px)),var(--fy,-500px)) scale(.7) rotate(12deg);opacity:0}}

/* ---------- particelle ---------- */
#leafsky{position:fixed;inset:0;width:100%;height:100%;z-index:850;pointer-events:none}
.pleaf{position:fixed;left:0;top:0;z-index:955;pointer-events:none;width:26px;animation:auBurst var(--t,1.3s) cubic-bezier(.2,.7,.4,1) forwards}
@keyframes auBurst{0%{transform:translate(var(--x0),var(--y0)) rotate(0) scale(.3);opacity:1}
  100%{transform:translate(var(--x1),var(--y1)) rotate(var(--r)) scale(1);opacity:0}}
.ffly{position:absolute;width:6px;height:6px;border-radius:50%;background:#f7f07a;pointer-events:none;z-index:2;
  box-shadow:0 0 10px 4px rgba(247,240,122,.65);animation:auFf var(--t,7s) ease-in-out infinite alternate,auGlow 2.4s ease-in-out infinite;animation-delay:var(--d,0s)}
@keyframes auFf{0%{transform:translate(0,0)}33%{transform:translate(var(--a),var(--b))}66%{transform:translate(var(--c),var(--e))}100%{transform:translate(var(--b),var(--a))}}
@keyframes auGlow{0%,100%{opacity:.25}50%{opacity:1}}
.bubg{position:absolute;border-radius:50%;background:#9bd36b;pointer-events:none;z-index:7;animation:auBub 1.8s ease-in forwards}
@keyframes auBub{0%{transform:translate(-50%,0) scale(.3);opacity:0}20%{opacity:1}100%{transform:translate(calc(-50% + var(--dx)),-160px) scale(1);opacity:0}}

/* scrub: si muovono con lo scroll */
.scrub{will-change:transform}

@media (prefers-reduced-motion:reduce){ .sway,.bob,.spinslow,.ffly,.hid .eyes i{animation:none!important} }

/* nessuna decorazione deve allargare la pagina (su telefono lo farebbe) */
html,body{overflow-x:clip}
main{overflow-x:clip}