/* RESET */
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:'Segoe UI', Roboto, Arial, sans-serif; background:#f9fafc; color:#333; line-height:1.7; overflow-x:hidden; }
html { scroll-behavior:smooth; }

/* ANIMAZIONI */
@keyframes fadeIn { from{opacity:0; transform:translateY(20px);} to{opacity:1; transform:translateY(0);} }
@keyframes zoomIn { from{opacity:0; transform:scale(0.98);} to{opacity:1; transform:scale(1);} }
@keyframes slideFade { from{opacity:0; transform:translateY(30px);} to{opacity:1; transform:translateY(0);} }

/* HEADER */
header { background:#fff; padding:14px 20px; border-bottom:1px solid #e5e7eb; position:sticky; top:0; z-index:100; animation:fadeIn .7s ease forwards; }
nav { display:flex; justify-content:center; align-items:center; gap:40px; }
.menu-toggle { display:none; font-size:28px; cursor:pointer; color:#174a8c; font-weight:bold; background:none; border:none; }
.menu { list-style:none; display:flex; justify-content:center; gap:36px; }
.menu a { text-decoration:none; color:#174a8c; font-weight:600; font-size:17px; position:relative; transition:color .25s; }
.menu a::after { content:''; position:absolute; left:0; bottom:-4px; width:0; height:2px; background:#174a8c; transition:width .25s; }
.menu a:hover::after { width:100%; }
.menu a:hover { color:#0f3563; }

/* HERO */
.hero {
  background: linear-gradient(rgba(23,74,140,0.55), rgba(23,74,140,0.35)), url('../img/panoramica-como.jpg') center/cover no-repeat;
  color:white; padding:90px 20px; text-align:center; display:flex; flex-direction:column; justify-content:center; align-items:center;
  animation:zoomIn .8s ease forwards; min-height:440px;
}
.hero h1 { font-size:clamp(32px,5vw,48px); margin-bottom:10px; text-shadow:0 2px 8px rgba(0,0,0,.4); }
.hero p { font-size:clamp(16px,2.5vw,19px); max-width:720px; text-shadow:0 2px 6px rgba(0,0,0,.35); }
.btn-hero { margin-top:26px; padding:14px 32px; background:#fff; color:#174a8c; border-radius:8px; text-decoration:none; font-weight:700; font-size:18px; transition:.25s; box-shadow:0 4px 14px rgba(0,0,0,.18); }
.btn-hero:hover { background:#174a8c; color:#fff; transform:translateY(-3px); }

/* CONTAINER */
.container { max-width:980px; margin:0 auto; padding:28px 20px; width:100%; }
.box-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:26px; margin-top:24px; }
.box { background:#fff; padding:22px; border-radius:14px; box-shadow:0 3px 12px rgba(0,0,0,.08); transition:.3s; animation:slideFade .6s ease forwards; width:100%; max-width:100%; }
.box:hover { transform:translateY(-4px); box-shadow:0 8px 22px rgba(0,0,0,.12); }
.box h2 { font-size:18px; color:#174a8c; margin-bottom:6px; }
.box p { font-size:15px; color:#4b5563; }
.box-top { display:flex; justify-content:center; margin-bottom:14px; }
.mini-foto { width:100%; max-width:280px; height:180px; object-fit:cover; border-radius:10px; box-shadow:0 3px 10px rgba(0,0,0,.12); display:block; }

.location-section { margin-top:48px; }
.location-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:28px; }
.location-box { background:#fff; padding:26px; border-radius:14px; box-shadow:0 3px 12px rgba(0,0,0,.08); width:100%; }
.location-box h2 { color:#174a8c; margin-bottom:8px; }
.map-container { margin-top:14px; border-radius:12px; overflow:hidden; }
.vista-lago { width:100%; border-radius:12px; margin-top:14px; aspect-ratio:16/10; object-fit:cover; display:block; }

footer { background:#174a8c; color:white; padding:28px 20px; text-align:center; font-size:14px; margin-top:56px; }
.scroll-top { position:fixed; bottom:22px; right:22px; background:#174a8c; color:white; padding:10px 18px; border-radius:30px; font-size:14px; font-weight:600; text-decoration:none; box-shadow:0 4px 12px rgba(0,0,0,.2); z-index:200; transition:.25s; }
.scroll-top:hover { background:#0f3563; transform:translateY(-3px); }

/* --- FIX MOBILE DOPO FORM - il bug che hai trovato --- */
@media (max-width: 768px){
  header { padding:10px 12px; }
  nav { justify-content:flex-end; }
  .menu-toggle { display:block; }
  .menu { display:none; position:fixed; top:62px; right:10px; background:#fff; border-radius:12px; box-shadow:0 6px 20px rgba(0,0,0,.22); padding:18px 24px; flex-direction:column; align-items:flex-start; gap:14px; z-index:300; width:72%; max-width:280px; }
  .menu.show { display:flex; }

  /* FORZA 1 COLONNA - risolve il bug dopo il ritorno da grazie.html */
  .box-grid { grid-template-columns: 1fr !important; }
  .location-grid { grid-template-columns: 1fr !important; }
  .mini-foto { max-width:100%; height:200px; }
  .container { padding:20px 14px; }
}
