/* ====== HEADER sticky + var altezza ====== */
#site-header{position:sticky;top:0;z-index:50;background:#ffffff;border-bottom:1px solid #e5e7eb;backdrop-filter:saturate(180%) blur(4px);}
#site-header .container{max-width:1180px;margin:0 auto;padding:10px 16px;display:flex;align-items:center;gap:24px;}
#site-header .brand{display:flex;align-items:center;gap:10px;text-decoration:none}
#site-header .brand img{height:28px;width:auto;display:block}
#site-header .brand span{font-weight:700;letter-spacing:.5px;color:#0f172a}

/* nav desktop */
#site-header nav.primary{display:flex;align-items:center;gap:26px;margin-left:auto}
#site-header nav.primary a{text-decoration:none;color:#0f172a;opacity:.9}
#site-header nav.primary a.active{color:#1d4ed8;background:#2563eb14;padding:8px 16px;border-radius:999px;font-weight:600;border:1.5px solid #2563eb66}

/* CTA desktop (se presente) */
#site-header .cta{margin-left:12px;text-decoration:none;background:#2563eb;color:#fff;border-radius:12px;padding:10px 16px;font-weight:600;border:1px solid transparent}

/* Burger */
#site-header .burger{display:none;margin-left:auto;border:0;background:transparent;width:42px;height:36px;border-radius:10px;align-items:center;justify-content:center}
#site-header .burger svg{width:22px;height:22px}

/* Menu mobile */
#mobileMenu{position:fixed;inset:calc(var(--hdr-h,64px)) 0 auto 0;background:#ffffff;border-bottom:1px solid #e5e7eb;
transform-origin:top;transform:scaleY(0);transition:.18s ease-out;display:grid;gap:12px;padding:14px 16px;z-index:40}
#mobileMenu.open{transform:scaleY(1)}
#mobileMenu a{padding:12px 10px;border-radius:12px;text-decoration:none;color:#0f172a}
#mobileMenu a.active{background:#2563eb14;border:1.5px solid #2563eb66;color:#1d4ed8}

@media (max-width:860px){
  #site-header nav.primary, #site-header .cta{display:none}
  #site-header .burger{display:inline-flex}
  #site-header .brand img{height:24px}
}
@media (min-width:861px){ #site-header .container{padding-left:24px;padding-right:24px} }

/* ====== HERO full-bleed con tipografia “come prima” ====== */
body{margin:0 !important}
main{margin-top:0 !important;padding-top:0 !important}
.header-spacer,.top-spacer,#header-spacer{height:0 !important;padding:0 !important;margin:0 !important}

#hero{position:relative;width:100vw;min-height:100svh;overflow:hidden;margin:0}
#hero video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;display:block}

/* Centro testi e li rendo grandi/chiari */
#hero .overlay{
  position:relative;z-index:1;min-height:calc(100svh - var(--hdr-h,64px));
  display:flex;align-items:center;justify-content:center;text-align:center;padding:0 24px;
}
#hero .overlay .inner h1{
  margin:0 0 8px 0;color:#fff;font-weight:800;
  font-size:clamp(44px,8vw,92px); line-height:1.05;
  text-shadow:0 2px 14px rgba(0,0,0,.35);
}
#hero .overlay .inner .sub{
  margin:2px 0 0 0;color:#fff;opacity:.95;
  font-size:clamp(16px,2.8vw,22px);
  text-shadow:0 1px 10px rgba(0,0,0,.35);
}
#hero .overlay .inner .actions{
  margin-top:16px;display:inline-flex;gap:12px;flex-wrap:wrap;justify-content:center
}

/* Fade morbido alla fine della hero */
#hero::after{
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:140px;
  background:linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,.65) 60%, #ffffff 100%);
  pointer-events:none
}

/* Mobile tweaks */
@media (max-width:640px){
  #hero .overlay{padding:0 16px}
  #hero .overlay .inner .actions a{padding:10px 16px}
}

/* Carosello: frecce disabilitate */
#srvPrev[aria-disabled="true"], #srvNext[aria-disabled="true"]{
  opacity:.35; pointer-events:none; filter:grayscale(30%);
}

/* In modalità loop: manteniamo le frecce sempre attive */
#srvPrev[aria-disabled="false"], #srvNext[aria-disabled="false"]{
  opacity: 1; pointer-events:auto; filter:none;
}

/* —— Chi Siamo: abbellimenti ————————————————————— */

/* Fondo panna con pattern morbidissimo */
.bg-cream-pattern{
  background: #faf6ef;
  position: relative;
}
.bg-cream-pattern::after{
  content:"";
  position:absolute; inset:-40% -20% auto auto;
  width:480px; height:480px; border-radius:9999px;
  background: radial-gradient(closest-side, rgba(59,130,246,.10), rgba(59,130,246,0) 70%);
  filter: blur(8px);
  pointer-events:none;
}

/* Decorazione d'angolo nella hero */
.hero-accent{
  position:absolute; right:-40px; bottom:-40px;
  width:220px; height:220px; border-radius:32px;
  background: conic-gradient(from 180deg at 50% 50%, rgba(59,130,246,.12), rgba(59,130,246,0));
  filter: blur(6px);
  transform:rotate(-8deg);
  pointer-events:none; opacity:.7;
}

/* TOC mask + no scroll bar orizzontale */
.toc-mask{ mask-image:linear-gradient(to right,transparent,black 24px,black calc(100% - 24px),transparent) }
.no-scrollbar::-webkit-scrollbar{ display:none }
.no-scrollbar{ -ms-overflow-style:none; scrollbar-width:none }

/* Spaziature globali minime */
body{ margin:0 }

/* —— Chi Siamo: abbellimenti ————————————————————— */

/* Fondo panna con pattern morbidissimo */
.bg-cream-pattern{
  background: #faf6ef;
  position: relative;
}
.bg-cream-pattern::after{
  content:"";
  position:absolute; inset:-40% -20% auto auto;
  width:480px; height:480px; border-radius:9999px;
  background: radial-gradient(closest-side, rgba(59,130,246,.10), rgba(59,130,246,0) 70%);
  filter: blur(8px);
  pointer-events:none;
}

/* Decorazione d'angolo nella hero */
.hero-accent{
  position:absolute; right:-40px; bottom:-40px;
  width:220px; height:220px; border-radius:32px;
  background: conic-gradient(from 180deg at 50% 50%, rgba(59,130,246,.12), rgba(59,130,246,0));
  filter: blur(6px);
  transform:rotate(-8deg);
  pointer-events:none; opacity:.7;
}

/* TOC mask + no scroll bar orizzontale */
.toc-mask{ mask-image:linear-gradient(to right,transparent,black 24px,black calc(100% - 24px),transparent) }
.no-scrollbar::-webkit-scrollbar{ display:none }
.no-scrollbar{ -ms-overflow-style:none; scrollbar-width:none }

/* Spaziature globali minime */
body{ margin:0 }

/* Mobile optimizations */
@media (max-width: 768px) {
  /* Better touch targets */
  button, a, input, textarea, select {
    min-height: 44px;
  }
  
  /* Prevent horizontal scroll */
  img, video, iframe {
    max-width: 100%;
    height: auto;
  }
  
  /* Better text readability */
  body {
    font-size: 16px;
    line-height: 1.5;
  }
  
  /* Prevent zoom on inputs */
  input[type="text"], 
  input[type="email"], 
  input[type="tel"], 
  input[type="password"], 
  textarea {
    font-size: 16px;
  }
  
  /* Better spacing on mobile */
  .section-px {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}