/* Hamburger del widget */
.imp-burger-wrap{display:flex;justify-content:flex-end}
.imp-burger{box-sizing:border-box;width:54px;height:54px;border:2px solid #16120E;border-radius:50%;background:#fff;box-shadow:4px 4px 0 #16120E;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;transition:transform .16s,box-shadow .16s}
.imp-burger:hover{transform:translate(-2px,-2px)}
.imp-burger span{display:block;width:44%;height:2.5px;background:#16120E;border-radius:2px}

/* ===== IMPRONTAE · Menu overlay collage — CSS (scoped) ===== */
/* Incolla in: Elementor > Custom Code (Head)  oppure  Impostazioni sito > Custom CSS */
/* I font Fraunces/Archivo/Space Mono devono essere caricati dal tema/Elementor.
   Se NON lo sono, togli il commento alla riga @import qui sotto: */
/* @import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,600;0,9..144,700;1,9..144,600&family=Archivo:wght@400;600;700&family=Space+Mono:wght@400;700&display=swap'); */

body.imp-menu-lock{overflow:hidden}
#improntae-menu .amp{font-family:'Archivo','Helvetica Neue',Arial,sans-serif;font-weight:600;font-style:normal;letter-spacing:0}

#improntae-menu{
  --red:#E0464B;--navy:#2B303A;--paper:#EDEAE1;--ink:#16120E;
  --mono:'Space Mono',monospace;--disp:'Fraunces',serif;--yellow:#F2C21B;--home:#8FD46A;
  position:fixed;inset:0;z-index:99990;pointer-events:none
}
#improntae-menu .imp-half{position:absolute;top:0;bottom:0;width:50%;transition:transform .6s cubic-bezier(.76,0,.24,1)}
#improntae-menu .imp-left{left:0;background:var(--red);transform:translateX(-102%)}
#improntae-menu .imp-right{right:0;background:var(--navy);transform:translateX(102%)}
#improntae-menu.open{pointer-events:auto}
#improntae-menu.open .imp-left{transform:translateX(0)}
#improntae-menu.open .imp-right{transform:translateX(0)}
#improntae-menu .imp-mtop{display:none}

#improntae-menu .imp-inner{position:relative;z-index:6;width:100%;height:100%;display:grid;grid-template-columns:1fr 64px 1fr;align-items:center}
#improntae-menu .imp-col{padding:0 5.5vw;opacity:0;transition:opacity .12s ease}
#improntae-menu.open .imp-col{opacity:1;transition:opacity .4s ease}
#improntae-menu .imp-primary{justify-self:start}
#improntae-menu .imp-services{justify-self:end;text-align:right}
#improntae-menu .imp-col a{display:block;text-decoration:none;outline:none;opacity:0;transform:translateY(16px);transition:opacity .5s ease,transform .55s cubic-bezier(.2,.7,.2,1)}
#improntae-menu.open .imp-col a{opacity:1;transform:none}
#improntae-menu .imp-col a .lab{font-family:var(--disp);font-weight:600;letter-spacing:-.01em;color:#fff;display:inline-block;padding:4px 12px;border:2px solid transparent;border-radius:11px;transition:background .18s,color .18s,box-shadow .18s,transform .18s}
#improntae-menu .imp-primary a .lab{font-size:clamp(19px,2vw,28px)}
#improntae-menu .imp-services a{display:flex;align-items:baseline;justify-content:flex-end;gap:14px}
#improntae-menu .imp-services a .idx{display:none}
#improntae-menu .imp-services a .lab{font-size:clamp(18px,1.9vw,25px);order:1}
#improntae-menu .imp-services a:hover .lab,#improntae-menu .imp-services a:focus-visible .lab{background:var(--c);color:#fff;border-color:var(--ink);box-shadow:-6px 6px 0 rgba(0,0,0,.32);transform:translateX(-6px)}
#improntae-menu .imp-services a.on .lab{background:var(--c);color:#fff;border-color:var(--ink);box-shadow:-6px 6px 0 rgba(0,0,0,.28)}
#improntae-menu .imp-primary a:hover .lab,#improntae-menu .imp-primary a:focus-visible .lab{background:var(--yellow);color:var(--ink);border-color:var(--ink);box-shadow:6px 6px 0 rgba(0,0,0,.3);transform:translateX(4px)}
#improntae-menu .imp-primary a.on .lab{background:var(--home);color:var(--ink);border-color:var(--ink);box-shadow:5px 5px 0 rgba(0,0,0,.28)}
#improntae-menu .imp-primary a.on:hover .lab{background:var(--home);color:var(--ink);transform:translateX(4px) translateY(-1px)}

#improntae-menu .imp-core{position:relative;perspective:700px;grid-column:2;justify-self:center;display:flex;flex-direction:column;align-items:center;gap:14px;z-index:8;opacity:0;transform:scale(.6);transition:opacity .4s ease .25s,transform .5s cubic-bezier(.34,1.56,.64,1) .25s}
#improntae-menu.open .imp-core{opacity:1;transform:scale(1)}
#improntae-menu .coin{width:82px;height:82px;cursor:pointer;filter:drop-shadow(3px 4px 0 rgba(0,0,0,.32));transition:transform .3s}
#improntae-menu .coin svg{width:100%;height:100%;display:block}
#improntae-menu .coin:hover{animation:imp-coinflip .9s cubic-bezier(.5,.05,.3,1)}
@keyframes imp-coinflip{0%{transform:rotateY(0)}100%{transform:rotateY(360deg)}}
#improntae-menu .imp-chiudi{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.16em;color:#fff;background:var(--ink);border:2px solid var(--ink);padding:8px 15px;border-radius:30px;box-shadow:3px 3px 0 rgba(0,0,0,.25);cursor:pointer;transition:background .18s,color .18s,transform .16s}
#improntae-menu .imp-chiudi:hover{background:var(--yellow);color:var(--ink);transform:translateY(-2px)}

/* coin collect: salto + giro + esplosione */
#improntae-menu .imp-fx{position:absolute;left:50%;top:-6px;width:0;height:0;pointer-events:none;z-index:20}
#improntae-menu .imp-fx .p{position:absolute;left:0;top:0;width:9px;height:9px;margin:-4.5px;opacity:0}
#improntae-menu .imp-fx .p.gold{background:#F5C518;border:1.5px solid #16120E;border-radius:2px}
#improntae-menu .imp-fx .p.spark{width:auto;height:auto;margin:-7px;font-size:14px;line-height:1;color:#fff;text-shadow:0 0 6px rgba(255,255,255,.7);border:0;background:none}
#improntae-menu .imp-fx .p.go{animation:imp-burst .6s ease-out forwards}
@keyframes imp-burst{0%{transform:translate(0,0) rotate(0) scale(.6);opacity:1}18%{opacity:1}100%{transform:translate(var(--dx),var(--dy)) rotate(var(--rot)) scale(.35);opacity:0}}
@keyframes imp-collect{0%{transform:translateY(0) rotateY(0) scale(1);opacity:1}30%{transform:translateY(-42px) rotateY(360deg) scale(1.06)}62%{transform:translateY(-58px) rotateY(720deg) scale(1)}100%{transform:translateY(-68px) rotateY(1080deg) scale(.14);opacity:0}}
#improntae-menu .coin.collect{animation:imp-collect .62s cubic-bezier(.3,.6,.4,1) forwards}

#improntae-menu .imp-ribbon{position:absolute;left:0;right:0;bottom:0;height:12px;z-index:9;transform:scaleX(0);transform-origin:left;transition:transform .6s cubic-bezier(.76,0,.24,1) .3s}
#improntae-menu.open .imp-ribbon{transform:scaleX(1)}
#improntae-menu .imp-ribbon i{position:absolute;top:0;bottom:0;width:12.5%}

@media(prefers-reduced-motion:reduce){
  #improntae-menu .coin.collect{animation:none}
  #improntae-menu .imp-half,#improntae-menu .imp-col a,#improntae-menu .imp-core,#improntae-menu .imp-ribbon{transition:opacity .2s!important;transform:none!important}
  #improntae-menu .imp-left,#improntae-menu .imp-right{transform:none!important}
}

/* ===== MOBILE ===== */
@media(max-width:820px){
  #improntae-menu .imp-left{display:none}
  #improntae-menu .imp-right{width:100%;transform:translateY(-102%);transition:transform .55s cubic-bezier(.76,0,.24,1)}
  #improntae-menu.open .imp-right{transform:translateY(0)}

  /* TUTTO IN UNA SCHERMATA: niente scroll, altezza reale del viewport */
  #improntae-menu .imp-inner{
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:clamp(6px,1.4vh,14px);
    padding:clamp(14px,3vh,28px) 20px clamp(12px,2.5vh,24px);
    height:100dvh;max-height:100dvh;
    text-align:center;overflow:hidden;
  }

  /* servizi: compatti, spaziatura proporzionale all'altezza dello schermo */
  #improntae-menu .imp-services{
    order:1;justify-self:auto;width:100%;
    display:flex;flex-direction:column;align-items:center;
    gap:clamp(2px,0.9vh,8px);text-align:center;
  }
  #improntae-menu .imp-services a{width:auto;justify-content:center;padding:0}
  #improntae-menu .imp-services a .lab{
    font-size:clamp(15px,2.35vh,21px);
    line-height:1.16;
    padding:clamp(2px,0.5vh,5px) 10px;
  }
  #improntae-menu .imp-services a:hover .lab{transform:translateY(-1px)}
  /* la voce attiva non deve "gonfiare" la riga */
  #improntae-menu .imp-services a.on .lab{padding:clamp(2px,0.5vh,5px) 12px}

  /* monetina + CHIUDI: più piccoli, spazio ridotto */
  #improntae-menu .imp-core{
    order:2;position:static;width:100%;
    flex-direction:column;align-items:center;justify-content:center;
    gap:clamp(2px,0.6vh,6px);margin:clamp(2px,0.8vh,8px) 0;
  }
  #improntae-menu .coin{width:clamp(36px,5.4vh,52px);height:clamp(36px,5.4vh,52px)}
  #improntae-menu .imp-chiudi{
    font-size:clamp(9px,1.3vh,11px);
    padding:clamp(5px,0.9vh,9px) clamp(14px,3vw,20px);
  }

  /* voci principali: chip su una o due righe, in basso */
  #improntae-menu .imp-primary{
    order:3;justify-self:auto;width:100%;max-width:360px;
    display:flex;flex-wrap:wrap;justify-content:center;align-items:center;
    gap:clamp(4px,1vh,9px);
    border-top:2px dashed rgba(255,255,255,.22);
    padding-top:clamp(8px,1.8vh,18px);
  }
  #improntae-menu .imp-primary a .lab{
    font-size:clamp(12px,1.7vh,15px);
    padding:clamp(3px,0.6vh,6px) clamp(8px,2.5vw,12px);
  }
  #improntae-menu .imp-primary a:hover .lab,
  #improntae-menu .imp-primary a.on:hover .lab{transform:translateY(-2px)}

  /* la fascia colorata in basso non deve rubare altezza */
  #improntae-menu .imp-ribbon{height:5px}
}

/* schermi molto bassi (iPhone SE e simili): ulteriore compressione */
@media(max-width:820px) and (max-height:700px){
  #improntae-menu .imp-services a .lab{font-size:clamp(13px,2.1vh,17px)}
  #improntae-menu .coin{width:34px;height:34px}
  #improntae-menu .imp-chiudi{font-size:9px;padding:4px 12px}
  #improntae-menu .imp-primary a .lab{font-size:11.5px;padding:3px 8px}
  #improntae-menu .imp-inner{gap:4px;padding:10px 16px 10px}
}
