:root{
  --bg:#0e0e0e; --fg:#f4f1ea; --muted:#9a968d; --line:#2a2a2a; --card:#181818;
  --radius:18px;
  --display:"Arial Black","Helvetica Neue",Impact,system-ui,sans-serif;
  --text:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--text);line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:inherit}
img{max-width:100%;display:block}
[hidden]{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}

/* HEADER */
.top{text-align:center;padding:48px 16px 28px}
.brand{display:inline-block;text-decoration:none}
.brand img{height:clamp(72px,12vw,110px);width:auto;margin:0 auto}
.brand-text{font-family:var(--display);font-weight:900;font-size:clamp(56px,12vw,104px);letter-spacing:-.02em;line-height:.9}
.city{margin:6px 0 0;font-size:13px;letter-spacing:.5em;text-transform:uppercase;color:var(--muted);padding-left:.5em}
.claim{margin:18px 0 0;font-size:17px;color:var(--muted)}

/* LOCALI */
.locali{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:1240px;margin:0 auto;padding:0 16px}
.locale{
  position:relative;display:block;aspect-ratio:3/4;border-radius:var(--radius);overflow:hidden;text-decoration:none;
  background:
    radial-gradient(120% 80% at 20% 10%, color-mix(in srgb,var(--accent) 55%, transparent), transparent 60%),
    linear-gradient(160deg,#222,#111);
  isolation:isolate;
  outline-offset:4px;
}
.locale::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to top,rgba(0,0,0,.85) 0%,rgba(0,0,0,.15) 55%,rgba(0,0,0,0) 100%)}
.locale .logo{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);width:auto;height:auto;max-width:62%;max-height:58%;filter:drop-shadow(0 6px 18px rgba(0,0,0,.45));transition:transform .4s ease}
.locale:hover .logo,.locale:focus-visible .logo{transform:translate(-50%,-50%) scale(1.04)}
.locale .info{position:absolute;left:0;right:0;bottom:0;padding:24px}
.locale .info{display:flex;justify-content:center}
.locale h2{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);margin:0;font-family:var(--display);font-weight:900;font-size:15px;line-height:1.1;text-transform:uppercase;letter-spacing:.06em}
.locale h2 em{font-style:normal;color:var(--accent)}
.ig{display:inline-flex;align-items:center;gap:8px;font-size:15px;font-weight:600;padding:8px 14px;border-radius:999px;background:rgba(255,255,255,.12);backdrop-filter:blur(6px);transition:background .2s,color .2s}
.ig svg{width:18px;height:18px}
.locale:hover .ig,.locale:focus-visible .ig{background:var(--accent);color:#111}
.locale:focus-visible{outline:3px solid var(--accent)}

/* PRENOTAZIONI / EVENTI */
.contatti{max-width:1240px;margin:88px auto 0;padding:0 16px}
.contatti .lavora-head{max-width:760px}
.wa-list{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.wa{display:flex;flex-direction:column;gap:6px;padding:22px;border-radius:var(--radius);background:var(--card);border:1px solid var(--line);text-decoration:none;transition:border-color .2s,transform .2s}
.wa-name{font-family:var(--display);font-weight:900;text-transform:uppercase;font-size:20px;line-height:1.1}
.wa-name em{font-style:normal;color:var(--accent)}
.wa-num{color:var(--muted);font-size:17px;font-variant-numeric:tabular-nums;letter-spacing:.02em}
.wa-btn{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;margin-top:10px;padding:10px 16px;border-radius:999px;background:#25d366;color:#0b2a17;font-weight:700;font-size:15px}
.wa-btn svg{width:18px;height:18px}
.wa:hover,.wa:focus-visible{border-color:var(--accent);transform:translateY(-2px)}
.wa:focus-visible{outline:3px solid var(--accent);outline-offset:3px}

/* LAVORA CON NOI */
.lavora{max-width:760px;margin:88px auto 0;padding:0 16px}
.lavora-head h2{font-family:var(--display);font-size:clamp(34px,6vw,52px);text-transform:uppercase;line-height:1;margin:0}
.lavora-head p{color:var(--muted);margin:12px 0 28px;font-size:17px}
form{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:24px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
label{display:block;font-size:14px;font-weight:600;margin-bottom:16px}
input,select,textarea{
  display:block;width:100%;margin-top:6px;padding:12px 14px;font:inherit;font-weight:400;font-size:16px;
  color:var(--fg);background:#0f0f0f;border:1px solid #333;border-radius:10px;
}
textarea{resize:vertical}
input:focus,select:focus,textarea:focus{outline:none;border-color:#ffc629;box-shadow:0 0 0 3px rgba(255,198,41,.25)}
input[type=file]{padding:10px;color:var(--muted)}
.check{display:flex;gap:10px;align-items:flex-start;font-weight:400;color:var(--muted)}
.check input{width:20px;height:20px;margin:2px 0 0;flex:none;accent-color:#ffc629}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
button{
  width:100%;padding:16px;border:0;border-radius:12px;cursor:pointer;
  font:900 16px var(--display);text-transform:uppercase;letter-spacing:.04em;
  background:#ffc629;color:#111;transition:transform .1s,opacity .2s;
}
button:hover{transform:translateY(-1px)}
button:disabled{opacity:.6;cursor:wait;transform:none}
.esito{margin:14px 0 0;min-height:1.5em;font-weight:600}
.esito.ok{color:#5ddc8a}
.esito.ko{color:#ff6b6b}

/* FOOTER */
.bottom{max-width:1240px;margin:88px auto 0;padding:24px 16px 40px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;color:var(--muted);font-size:13px}
.bottom p{margin:0}
.bottom .credit{flex-basis:100%;text-align:center;margin-top:8px;font-style:italic;color:#7a766e}

/* PAGINE INTERNE (privacy, menù) */
.page{max-width:760px;margin:0 auto;padding:40px 16px 60px}
.page h1{font-family:var(--display);text-transform:uppercase;line-height:1}
.page p,.page li{color:#cfcbc2}
.back{display:inline-block;margin-bottom:24px;color:var(--muted);text-decoration:none}

@media (max-width:860px){
  .locali{grid-template-columns:1fr;gap:14px}
  .locale{aspect-ratio:4/3}
  .locale .logo{max-height:58%;top:40%}
  .locale .info{padding:16px}
  .row{grid-template-columns:1fr;gap:0}
  .wa-list{grid-template-columns:1fr;gap:12px}
  .contatti,.lavora{margin-top:64px}
  .top{padding-top:36px}
  form{padding:18px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}