/* ==========================================================================
   Informativa privacy e cookie — pagina autonoma e finestra sovrapposta
   ========================================================================== */

/* ---------- pagina ---------- */
.legal-page{background:var(--paper);color:var(--ink)}
.legal{
  max-width:820px;margin:0 auto;
  padding:calc(var(--hdr-h) + clamp(40px,7vw,86px)) var(--pad) clamp(60px,8vw,110px);
}
.legal__back{margin:0 0 clamp(26px,4vw,44px)}
.legal__back a{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--verde)}
.legal__back a:hover{text-decoration:underline;text-underline-offset:4px}
.legal__doc + .legal__doc{margin-top:clamp(54px,8vw,96px);border-top:1px solid color-mix(in srgb,var(--ink) 15%,transparent);padding-top:clamp(40px,6vw,70px)}
.legal__doc{scroll-margin-top:calc(var(--hdr-h) + 24px)}

/* ---------- testo del documento, condiviso con la finestra ---------- */
.legal__doc h1,.sheet__body h1{
  font-family:var(--d);font-weight:400;font-size:clamp(28px,4.4vw,52px);
  line-height:1.05;letter-spacing:-.02em;margin-bottom:10px
}
.legal__date{font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  color:color-mix(in srgb,var(--ink) 55%,transparent);margin-bottom:clamp(22px,3vw,34px)}
.legal__lead{font-size:clamp(16px,1.5vw,19px);line-height:1.6;margin-bottom:clamp(26px,4vw,40px)}
.legal__doc h2,.sheet__body h2{
  font-family:var(--d);font-weight:400;font-size:clamp(19px,2vw,26px);
  line-height:1.2;margin:clamp(30px,4vw,44px) 0 10px
}
.legal__doc p,.legal__doc li,.sheet__body p,.sheet__body li{
  font-size:15px;line-height:1.72;color:color-mix(in srgb,var(--ink) 82%,transparent)
}
.legal__doc p + p,.sheet__body p + p{margin-top:12px}
.legal__doc ul,.sheet__body ul{display:grid;gap:9px;margin:12px 0 0;padding-left:20px;list-style:disc}
.legal__doc li,.sheet__body li{padding-left:3px}
.legal__doc b,.sheet__body b{font-weight:500;color:var(--ink)}
.legal__doc a,.sheet__body a{color:var(--verde);text-decoration:underline;text-underline-offset:3px}
.legal__note,.sheet__body .legal__note{
  border-left:2px solid var(--verde);padding:4px 0 4px 14px;margin:14px 0;
  font-size:13.5px;color:color-mix(in srgb,var(--ink) 70%,transparent)
}

/* i segnaposto da compilare devono saltare all'occhio */
.legal__doc b:has(+ *),.sheet__body b{}
.legal__doc,.sheet__body{counter-reset:none}

/* ---------- finestra sovrapposta ---------- */
.sheet{
  /* il pannello è chiaro ma vive fuori dalle sezioni chiare: senza questi
     token erediterebbe quelli del fondo scuro e il pulsante pieno finirebbe
     bianco su bianco */
  --fg:var(--ink);--bg:var(--paper);
  --acc:var(--verde);--acc-on:var(--cream);
  --line:color-mix(in srgb,var(--ink) 15%,transparent);
  --muted:color-mix(in srgb,var(--ink) 72%,transparent);
  width:min(780px,100%);max-width:100%;max-height:min(86svh,900px);
  margin:auto;padding:0;border:0;border-radius:var(--rad);
  background:var(--paper);color:var(--ink);overflow:hidden;
  opacity:0;transform:translateY(22px) scale(.985);
  transition:opacity .4s var(--e),transform .5s var(--e),overlay .4s allow-discrete,display .4s allow-discrete
}
.sheet[open]{opacity:1;transform:none}
@starting-style{.sheet[open]{opacity:0;transform:translateY(22px) scale(.985)}}
.sheet::backdrop{background:rgba(var(--scrim),0);transition:background .4s var(--e),overlay .4s allow-discrete,display .4s allow-discrete}
.sheet[open]::backdrop{background:rgba(var(--scrim),.82);backdrop-filter:blur(3px)}
@starting-style{.sheet[open]::backdrop{background:rgba(var(--scrim),0)}}

.sheet__head{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:16px clamp(18px,3vw,34px);border-bottom:1px solid color-mix(in srgb,var(--ink) 13%,transparent);
  background:var(--paper);position:sticky;top:0;z-index:2
}
.sheet__head p{font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;
  color:color-mix(in srgb,var(--ink) 58%,transparent);margin:0}
.sheet__close{
  flex:0 0 auto;width:38px;height:38px;border-radius:50%;cursor:pointer;
  border:1px solid color-mix(in srgb,var(--ink) 22%,transparent);background:none;
  display:grid;place-items:center;transition:background .3s,border-color .3s,transform .3s var(--e)
}
.sheet__close:hover{background:var(--verde);border-color:var(--verde);color:#FFF;transform:rotate(90deg)}
.sheet__close svg{width:14px;height:14px}

.sheet__body{
  overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;
  padding:clamp(24px,4vw,40px) clamp(18px,3vw,34px) clamp(34px,5vw,50px);
  max-height:calc(min(86svh,900px) - 72px)
}
.sheet__body h1{font-size:clamp(25px,3.4vw,38px)}
.sheet__foot{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;
  margin-top:clamp(28px,4vw,40px);padding-top:18px;
  border-top:1px solid color-mix(in srgb,var(--ink) 13%,transparent)}
.sheet__foot a{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--verde)}

@media (max-width:640px){
  .sheet{width:100%;max-height:92svh;margin:auto auto 0;border-radius:12px 12px 0 0}
  .sheet__body{max-height:calc(92svh - 70px)}
  @starting-style{.sheet[open]{transform:translateY(100%)}}
  .sheet{transform:translateY(100%)}
  .sheet[open]{transform:none}
}

@media (prefers-reduced-motion:reduce){
  .sheet,.sheet::backdrop{transition:none}
  .sheet{transform:none!important}
}