:root{
  --bg:#ffffff;
  --bg-alt:#0f172a;
  --text:#04060b;
  --muted:#475569;
  --brand:#0b3b2e;
  --brand-2:#23a26d;
  --card:#ffffff;
  --border:#e5e7eb;
  --radius:16px;
  --shadow:0 10px 30px rgba(2,6,23,.08);
  --header-h:64px;

  --font-sans:"Lexend Deca", system-ui, -apple-system, "Segoe UI",
              Roboto, "Helvetica Neue", Arial, "Noto Sans",
              "Liberation Sans", sans-serif;

  /* palette Chi Siamo */
  --cs-main:#1F4AA0;
  --cs-dark:#173B7A;
  --cs-mid:#5C86D6;
  --cs-soft:#E7F1FF;
  --cs-border:#E2E8F0;

  /* profilo “acqua” */
  --cs-acqua-soft:#E9FBF7;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:var(--font-sans);
  color:var(--text);
  background:var(--bg);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
h1,h2,h3,h4{letter-spacing:.2px}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.menu a,.btn,.cta{font-family:var(--font-sans)}

/* ===========================
   CONTAINER
   =========================== */
.container{width:min(1100px,92vw);margin-inline:auto}

/* ===========================
   HEADER
   =========================== */
header{
  position:sticky;top:0;z-index:50;height:var(--header-h);
  display:flex;align-items:center;
  background: #ffffff;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border-bottom:1px solid var(--border);
  box-shadow:var(--shadow);
}
header .container{width:100%;max-width:none;margin-inline:0;padding-inline:clamp(16px,5vw,56px)}
.nav{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px}

/* brand */
.brand{justify-self:start;display:flex;align-items:center;gap:0}
.brand-logo{
  width:96px;height:auto;display:block;border:0;border-radius:0;background:transparent;
  transition:transform .18s ease, filter .18s ease;
  filter:drop-shadow(0 6px 16px rgba(2,6,23,.18));
}
.brand:hover .brand-logo{transform:scale(1.12);filter:drop-shadow(0 10px 26px rgba(2,6,23,.22))}
.brand-logo[src$=".png"],.brand-logo[src*="logo-clean.svg"]{filter:none!important;box-shadow:none!important}

/* menu */
.menu{justify-self:center;display:flex;align-items:center;gap:28px}
.menu a{font-weight:600;color:var(--text);opacity:.9}
.menu a:hover{opacity:1}

/* underline on hover (desktop) */
@media (min-width:841px){
  .menu a{position:relative;padding-bottom:12px}
  .menu a::after{
    content:"";position:absolute;left:50%;bottom:0;width:28px;height:3px;background:var(--brand);
    border-radius:2px;transform:translateX(-50%) scaleX(0);transform-origin:center;transition:transform .18s ease;opacity:.95
  }
  .menu a:hover::after,.menu a:focus-visible::after{transform:translateX(-50%) scaleX(1)}
}
@media (prefers-reduced-motion:reduce){.menu a::after{transition:none}}

/* actions / CTA */
.actions{justify-self:end;display:flex;align-items:center;gap:12px}
.cta{
  padding:10px 16px;border-radius:999px;font-weight:600;
  border:1px solid var(--border);background:var(--brand);color:#fff
}

/* hamburger + mobile menu */
.hamb{display:none;gap:6px;flex-direction:column;background:none;border:0;cursor:pointer}
.hamb span{width:26px;height:2px;background:var(--text)}
#mobile{
  display:none;position:fixed;inset:var(--header-h) 0 auto 0;background:#fff;
  border-bottom:1px solid var(--border);box-shadow:var(--shadow)
}
#mobile a{display:block;padding:16px 24px;border-top:1px solid var(--border);font-weight:600;color:var(--text)}
body.no-scroll{ overflow: hidden; }

/* ===========================
   HERO
   =========================== */
.hero-full{
  position:relative;min-height:100svh;display:grid;place-items:center;text-align:center;color:#fff
}
.hero-full::before{
  content:"";position:absolute;inset:0;background-image:var(--hero-img, url('https://images.unsplash.com/photo-1486406146926-c627a92ad1ab?q=80&w=1920&auto=format&fit=crop'));
  background-size:cover;background-position:center;background-repeat:no-repeat;z-index:-2
}
.hero-full::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(2,6,23,.72) 0%,rgba(2,6,23,.35) 40%,rgba(2,6,23,.6) 100%);z-index:-1}
.hero-inner{padding:clamp(24px,5vw,48px)}
.badge{display:inline-flex;gap:8px;align-items:center;padding:8px 12px;border:1px solid var(--border);border-radius:999px;color:var(--muted);font-size:.9rem;background:#fff}
.badge.inv{background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.45);color:#fff}
.hero-inner h1{font-size:clamp(2.2rem,6vw,3.6rem);line-height:1.1;margin:16px 0}
.hero-inner p{color:#dbeafe;max-width:64ch;margin-inline:auto}
.hero-actions{display:flex;gap:12px;margin-top:18px;justify-content:center;flex-wrap:wrap}
.btn{padding:12px 18px;border-radius:12px;font-weight:600;border:1px solid var(--border);background:#fff;color:#0b1324}
.btn.primary{background:var(--brand);border-color:var(--brand);color:#fff}
.btn.ghost{background:transparent;border-color:rgba(255,255,255,.55);color:#fff}

/* ===========================
   SEZIONI COMUNI
   =========================== */
section{padding:80px 0;scroll-margin-top:calc(var(--header-h) + 12px)}
@media (max-width:640px){
  /* stringe la partenza della sezione dopo l'hero */
  #chi-siamo{ padding-top:48px; }
}

section.alt{background:var(--bg-alt);color:#e5e7eb}
section.alt p{color:#cbd5e1}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:18px;margin-bottom:28px}
.section-head h2{font-size:clamp(1.6rem,4vw,2.2rem);margin:0}
.section-head p{color:var(--muted);max-width:60ch}
.alt .section-head p{color:#cbd5e1}

/* ===========================
   CHI SIAMO (.cs*)
   =========================== */
/* RIGA STATISTICHE – centrata come gruppo */
.cs-stats-row{
  display: flex;                /* <— invece della grid */
  flex-wrap: wrap;
  justify-content: center;      /* centra il gruppo */
  align-items: flex-start;
  gap: 28px 64px;               /* spazio tra elementi (riga, colonna) */
  margin:6px 0 16px;
  text-align: center;           /* centra il testo all’interno */
}


.cs-stats{ min-width: 180px; }  /* evita che “collassino” troppo */
.stats-link{ display:block; color:inherit; text-decoration:none; }

@media (max-width: 700px){
  .cs-stats-row{ gap: 12px 18px; }
}



.cs-stats{ text-align:center; }
.cs-number{
  font-weight:800;
  font-size:clamp(2rem,4vw,2.6rem);
  color:var(--cs-dark);
  letter-spacing:.5px;
}
#g-reviews-stat .cs-number{ transition: transform .15s ease; }
#g-reviews-stat:hover .cs-number{ transform: translateY(-2px); }
.cs-label{ color:#6B7280; margin-top:4px; }
.cs-profile .profile-links { position: relative; z-index: 1; }
.cs-profile .profile-links .btn { display: inline-flex; }



/* Callout */
.cs-callout{
  background:var(--cs-soft);
  border-left:6px solid var(--cs-main);
  border-radius:12px;
  padding:30px 30px;
  margin:20px 0 24px;
  box-shadow:0 8px 24px rgba(23,59,122,.08);
  height: max-cont;

}

.cs-callout h3{
  margin:0 0 6px;
  color:var(--cs-dark);
  font-size:clamp(1.05rem,2.2vw,1.25rem);
}
.cs-callout p{ margin:0; color:#334155; }

/* Layout due colonne + riordino mobile */
.cs-layout{
  display:grid;
  grid-template-columns: 1.8fr 1.1fr;
  gap:34px;
  align-items:start;
  position:relative;

  /* aree per poter riordinare in mobile */
  grid-template-areas: "features side";
}
.cs-features{ grid-area: features; }
.cs-side{ 
  grid-area: side; 
  padding-top: 0rem;
  padding-bottom: 4rem;

}

@media (max-width:1024px){
  .cs-layout{
    grid-template-columns:1fr;
    gap:8px; 
    /* Mobile/Tablet: profilo PRIMA delle card */
    grid-template-areas:
      "side"
      "features";
  }
}

/* Griglia 2x3 per le feature */
.cs-features{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:18px;
}
@media (max-width:700px){
  .cs-features{ grid-template-columns:1fr; }
}

/* Card feature */
.cs-card{
  position:relative;
  background:#fff;
  border:1px solid var(--cs-border);
  border-radius:14px;
  padding:18px;
  box-shadow:0 10px 30px rgba(2,6,23,.06);
  transition:
    transform .18s ease,
    box-shadow .22s ease,
    border-color .18s ease,
    background-color .25s ease;
}
.cs-card h4{
  margin:6px 0 8px;
  color:#0b1324;
  font-size:1.05rem;
}
.cs-card p{ margin:0; color:#475569; }
.cs-card:hover,
.cs-card:focus-within{
  background:linear-gradient(180deg,#F3F8FF 0%,#FFFFFF 60%);
  border-color:var(--cs-mid);
  box-shadow:
    0 18px 46px rgba(2,6,23,.12),
    0 8px 22px rgba(31,74,160,.18);
  transform:translateY(-3px);
}

/* Icona delle feature */
.cs-ico{
  width:40px; height:40px; border-radius:12px;
  background:linear-gradient(180deg,var(--cs-main),var(--cs-dark));
  display:inline-grid; place-items:center;
  box-shadow:0 6px 18px rgba(23,59,122,.25);
  transition: transform .18s ease, box-shadow .22s ease, background .22s ease;
}
.cs-ico svg{ width:22px; height:22px; fill:#fff; }
.cs-card:hover .cs-ico,
.cs-card:focus-within .cs-ico{
  background:linear-gradient(180deg,var(--cs-mid),var(--cs-main));
  box-shadow:0 12px 26px rgba(31,74,160,.35);
  transform:translateY(-1px) scale(1.06);
}

/* Colonna destra: card profilo */
.cs-side{ align-self:start; padding-left:8px; }
@media (max-width:1024px){
  .cs-side{
    padding-top: 0;
    padding-bottom: 16px; /* da 4rem -> 16px */
    margin-top: -8px;     /* piccolo “tiraggio” verso l’alto */
  }
}

.cs-profile{
  position:sticky;
  top:calc(var(--header-h) + 16px);
  background:var(--cs-acqua-soft);
  border:2px solid rgba(0,0,0,.35);
  border-radius:14px;
  padding:18px;
  box-shadow:
    0 22px 56px rgba(2,6,23,.10),
    0 10px 30px rgba(2,6,23,.06);
}
@media (max-width:1024px){
  .cs-profile{
    position: static;   /* niente sticky in colonna singola */
    top: auto;
    margin-top: 0;      /* sicurezza: niente margine extra */
  }
}

.cs-profile h3{ margin:0 0 4px; color:#0b1324; }
.cs-profile .subtitle{ margin:0 0 12px; color:#334155; font-weight:600; }
.profile-photo{
  width:100%; height:auto; display:block; object-fit:cover;
  border-radius:12px; margin:8px 0 12px;
  border:2px solid rgba(0,0,0,.22);
}
.cs-profile p{ color:#475569; margin:0 0 8px; }
.cs-profile .badges{
  display:flex; flex-wrap:wrap; gap:8px;
  margin:10px 0 0; padding:0; list-style:none;
}
.cs-profile .badges li{
  background:#F1FFFA;
  border:1px solid #CFF6E9;
  border-radius:999px;
  padding:6px 10px;
  font-weight:600;
  font-size:.85rem;
  color:#0b1324;
}
/* ---- BIO COLLASSABILE NEL PROFILO ---- */
.cs-profile .profile-summary{
  position: relative;
  margin: 0 0 8px;
  overflow: hidden;

  /* clamp multi-riga */
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 6;           /* quante righe mostrare da chiuso */
  line-clamp: 6;
}

/* sfumatura in basso quando è chiuso */
.cs-profile .profile-summary::after{
  content:"";
  position:absolute; left:0; right:0; bottom:0;
  height:42px;
  pointer-events:none;
  background: linear-gradient(180deg, rgba(255,255,255,0), var(--cs-acqua-soft) 70%);
  transition: opacity .2s ease;
}

/* stato APERTO */
.cs-profile.is-open .profile-summary{
  -webkit-line-clamp: unset;
  line-clamp: unset;
  max-height: none;
}
.cs-profile.is-open .profile-summary::after{ opacity:0; }

/* bottone “Leggi di più” */
.more-toggle{
  appearance: none;
  border: 2px solid var(--cs-border);
  background: #fff;
  color: #0b1324;
  border-radius: 12px;
  padding: 8px 12px;
  font-weight: 700;
  cursor: pointer;
  transition: box-shadow .18s ease, transform .12s ease;
  margin-right: 8px;
  
}

.more-toggle:hover{ box-shadow: var(--shadow); transform: translateY(-1px); }
.more-toggle:focus-visible{ outline: 2px solid #1F4AA0; outline-offset: 2px; }

/* Mobile: estetica */
@media (max-width: 640px){
  .cs-profile{
    position: relative;
    background: linear-gradient(180deg, var(--cs-acqua-soft) 0%, #FFFFFF 72%);
    border: 2px solid rgba(0,0,0,.28);
    box-shadow:
      0 8px 26px rgba(35,162,109,.14),
      0 6px 16px rgba(2,6,23,.06);
    margin-top: 6px;
    margin-bottom: 42px;
  }
  .cs-profile::before{
    content:"";
    position:absolute;
    inset: 0 auto 0 0;
    width: 6px;
    border-radius: 14px 0 0 14px;
    background: linear-gradient(180deg, var(--brand-2), #1F4AA0);
    opacity: .85;
  }
  .cs-profile::after{
    content:"";
    position:absolute;
    left:16px; right:16px; top:-10px;
    height:1px;
    background: linear-gradient(90deg, transparent, rgba(2,6,23,.18), transparent);
    border-radius:999px;
  }
  .profile-chip{
    position:absolute;
    top:10px; right:10px;
    background:#0b3b2e;
    color:#fff;
    font-weight:700;
    font-size:.73rem;
    letter-spacing:.2px;
    padding:6px 10px;
    border-radius:999px;
    box-shadow:0 4px 12px rgba(2,6,23,.18);
  }
}

/* CHI SIAMO – reveal mobile (se usi JS relativo) */
@media (max-width: 840px){
  .cs-features.has-reveal .cs-card{
    opacity: 0;
    transform: translateY(22px) scale(.98);
    filter: blur(2px);
    will-change: transform, opacity, filter;
    transition:
      opacity .60s ease,
      transform .60s cubic-bezier(.2,.8,.2,1),
      filter .60s ease;
  }
  .cs-features.has-reveal .cs-card.reveal-in{
    opacity: 1;
    transform: none;
    filter: none;
    transition-delay: calc(var(--delay, 0) * 1ms);
  }
}
@media (prefers-reduced-motion: reduce){
  .cs-features .cs-card{
    transition: none !important;
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
  }
}

/* ===========================
   SERVIZI
   =========================== */
#servizi{ position: relative; }
#servizi.alt .section-head h2{color:#fff}
#servizi.alt .section-head p{color:#cbd5e1}

#servizi .section-head{
  display:flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  margin-bottom: 24px;
}
#servizi .section-head p{ margin:0; max-width:72ch; }

.services-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:18px
}
@media (max-width:1100px){.services-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:700px){.services-grid{grid-template-columns:1fr}}

.service{
  display:flex;flex-direction:column;gap:10px;background:#fff;color:var(--text);
  border:1px solid var(--border);border-radius:var(--radius);padding:18px;
  box-shadow:var(--shadow);
  transition:transform .18s ease, box-shadow .22s ease, border-color .18s ease, background-color .25s ease
}
.service h3{margin:4px 0 6px;font-size:1.08rem;color:#0b1324}
.service p{margin:0;color:var(--text);opacity:1;font-weight:500}
.service:hover,.service:focus-within{
  background:linear-gradient(180deg,#F3F8FF 0%,#FFFFFF 60%);border-color:#5C86D6;
  box-shadow:0 18px 46px rgba(2,6,23,.12),0 8px 22px rgba(31,74,160,.18);transform:translateY(-3px)
}
#servizi.alt .services-grid .service p,
#servizi        .services-grid .service p{
  color:#0b1324; opacity:1; font-weight:500; line-height:1.55;
}

/* icone */
.s-ico{
  width:42px;height:42px;border-radius:12px;background:linear-gradient(180deg,#1F4AA0,#173B7A);
  display:inline-grid;place-items:center;box-shadow:0 6px 18px rgba(23,59,122,.25);
  transition:transform .18s ease, box-shadow .22s ease, background .22s ease
}
.s-ico svg{width:22px;height:22px;fill:#fff}
.service:hover .s-ico{transform:translateY(-1px) scale(1.06);background:linear-gradient(180deg,#5C86D6,#1F4AA0)}

/* ===========================
   NEWS
   =========================== */
#news .section-head{display:flex;flex-direction:column;align-items:flex-start;gap:8px;margin-bottom:24px}
#news .section-head p{margin:0;max-width:72ch;color:var(--muted)}
.news-section{padding:72px 0}
.news-section .section-head h2{color:#0b1324}
.news-section .section-head p{color:#475569}

.news-feature{
  display:grid;grid-template-columns:1.2fr 1fr;gap:18px;overflow:hidden;margin-bottom:22px;
  border:1px solid var(--border);border-radius:16px;background:#fff;box-shadow:var(--shadow)
}
.news-feature img{width:100%;height:100%;min-height:220px;object-fit:cover}
.news-feature .nf-body{padding:18px;display:flex;flex-direction:column;gap:10px}
.nf-cat{
  align-self:flex-start;font-weight:700;font-size:.85rem;color:#0b1324;
  background:#EEF2FF;border:1px solid #D9E2FF;border-radius:999px;padding:6px 10px;text-decoration:none
}
.news-feature h3{margin:0;color:#0b1324;font-size:clamp(1.05rem,2vw,1.35rem)}
.news-feature p{margin:0;color:#334155}
.nf-meta{color:#64748b;font-size:.9rem}
.news-feature .btn{align-self:flex-start}
@media (max-width:900px){.news-feature{grid-template-columns:1fr}}

.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:6px;margin-bottom:18px}
@media (max-width:1100px){.news-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:700px){.news-grid{grid-template-columns:1fr}}

.news-card{
  background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow);
  padding:16px;display:flex;flex-direction:column;gap:8px;
  transition:transform .18s ease, box-shadow .22s ease, border-color .18s ease, background-color .25s ease
}
.news-card:hover{
  background:linear-gradient(180deg,#F7FAFF 0%,#FFFFFF 60%);border-color:#5C86D6;
  transform:translateY(-3px);box-shadow:0 18px 46px rgba(2,6,23,.12),0 8px 22px rgba(31,74,160,.18)
}
.nc-ico{font-size:22px;line-height:1}
.nc-cat{
  align-self:flex-start;font-weight:700;font-size:.82rem;color:#0b1324;
  background:#F1FFFA;border:1px solid #CFF6E9;border-radius:999px;padding:4px 10px;text-decoration:none
}
.news-card h4{margin:2px 0 2px;color:#0b1324;font-size:1.02rem}
.news-card p{margin:0;color:#334155}
.nc-meta{color:#64748b;font-size:.9rem}

/* ===========================
   CONTATTI
   =========================== */
.card{ background: var(--card); border: 1px solid var(--border); border-radius: var(--radius); padding: 20px; box-shadow: var(--shadow); }
.contact{ display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.contact .item{ display: flex; gap: 12px; align-items: start; margin: 10px 0; }
.contact label{display:block;margin:8px 0 6px;font-weight:600}
.map-card h3{ margin-top: 0; }
.map-embed{ width: 100%; aspect-ratio: 16 / 10; border-radius: 12px; overflow: hidden; box-shadow: var(--shadow); margin-top: 8px; }
.map-embed iframe{ width: 100%; height: 100%; border: 0; display: block; }
.map-actions{ margin-top: 12px; }
@media (max-width: 900px){ .contact{ grid-template-columns: 1fr; } }
#contatti .section-head{ display:flex; flex-direction:column; align-items:flex-start; gap:8px; margin-bottom:24px; }
#contatti .section-head p{ margin:0; max-width:72ch; }
#contatti .map-card .btn,
#contatti .map-wrap + .btn,
#contatti .map-btn{ display:inline-flex; align-items:center; justify-content:center; margin:14px auto 8px; min-width:220px; text-align:center; }
#contatti .map-wrap{ border-radius:12px; overflow:hidden; }
@media (max-width:640px){
  #contatti{ padding-top:44px; } /* invece degli 80px generici */
}

/* ===========================
   FOOTER (stile uniforme)
   =========================== */
.legal{
  background:#1f3b7a;
  color:#eef3ff;
  padding:28px 0;
  text-align:center;
}
.legal a{ color:#eef3ff; text-decoration:none; }
.legal a:hover{ text-decoration:underline; }
.legal p{ margin:6px 0; }

/* Tutto lo stesso font-size/weight */
.legal .brandline,
.legal .owner,
.legal .regs,
.legal .address{
  font-weight:700;
  font-size:clamp(.69rem,1vw,1.05rem);
  letter-spacing:.2px;
}

/* etichette e monospace */
.legal .label{ font-weight:600; opacity:.95; }
.legal .mono{
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", "Courier New", monospace;
  letter-spacing:.3px;
}
/* ==== Link Privacy nel footer ==== */
.legal .legal-links { margin: 8px 0 2px; }
.legal .link-legal{
  appearance:none; background:none; border:0; cursor:pointer;
  color:#eef3ff; font:inherit; font-weight:700;
  text-decoration:underline; text-underline-offset:2px;
}
.legal .link-legal:hover{ opacity:.92; }

/* ==== Modale Privacy ==== */
.modal-backdrop{
  position:fixed; inset:0; z-index:1000;
  display:grid; place-items:center; padding:16px;
  background:rgba(2,6,23,.58);
}
.modal-backdrop[hidden]{ display:none !important; }

.modal-dialog{
  position:relative;
  width:min(760px,92vw); max-height:86vh; overflow:auto;
  background:var(--card,#fff);
  border:1px solid var(--border,#e5e7eb);
  border-radius:var(--radius,16px);
  box-shadow:var(--shadow,0 10px 30px rgba(2,6,23,.08));
  padding:22px 18px 20px;
}

.modal-dialog h3{ margin:0 0 8px; color:var(--text,#0b1324); }
.modal-body p{ margin:0 0 10px; color:var(--text,#0b1324); }

.modal-close{
  position:absolute; top:10px; right:10px;
  width:36px; height:36px; border-radius:999px;
  display:inline-flex; align-items:center; justify-content:center;
  border:1px solid var(--border,#e5e7eb);
  background:#fff; cursor:pointer; font-size:22px; line-height:1;
  transition:transform .15s ease, box-shadow .2s ease, border-color .2s ease;
}
.modal-close:hover{ transform:translateY(-1px); box-shadow:var(--shadow); border-color:#cbd5e1; }

/* disabilita scroll pagina quando il modale è aperto (già usi .no-scroll) */
body.no-scroll{ overflow:hidden; }

/* ===========================
   UTILITIES
   =========================== */
.sr-only{ position:absolute;width:1px;height:1px;padding:0;margin:-1px; overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0 }
.pill{display:inline-block;padding:6px 10px;background:#ecfdf5;border:1px solid #bbf7d0;border-radius:999px;color:#065f46;font-weight:600;font-size:.85rem}

/* ===========================
   RESPONSIVE HEADER
   =========================== */
@media (max-width:840px){
  :root{--header-h:92px}
  header .container{padding-inline:20px}
  .nav{grid-template-columns:1fr auto}
  .menu{display:none}
  .actions .cta{display:none}
  .hamb{display:flex}
  .brand-logo{width:112px}
}

/* riduzione motion */
@media (prefers-reduced-motion:reduce){
  .brand-logo,.cs-card,.cs-ico,.service,.s-ico,.news-card{transition:none}
  .cs-card:hover,.service:hover,.news-card:hover{transform:none}
}

/* === SERVIZI – Stack scroll stile iOS (solo mobile) =================== */
@media (max-width: 640px){
  #servizi .services-grid{
    grid-template-columns: 1fr;
    gap: 12px;
    max-height: min(70vh, 520px);
    padding: 8px 4px 12px;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: y mandatory;
    position: relative;
    border-radius: 16px;

    /* fade con mask (niente “piega”) */
    --fade: 26px;
    -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 var(--fade), #000 calc(100% - var(--fade)), transparent 100%);
            mask-image: linear-gradient(180deg, transparent 0, #000 var(--fade), #000 calc(100% - var(--fade)), transparent 100%);
    -webkit-mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
  }
  #servizi .services-grid::-webkit-scrollbar{ display:none; }
  #servizi .services-grid{ scrollbar-width: none; }

  #servizi .services-grid .service{
    scroll-snap-align: start;
    transform: translateY(10px) scale(.98);
    opacity: .95;
    transition:
      transform .35s cubic-bezier(.2,.8,.2,1),
      box-shadow .25s ease,
      background-color .25s ease,
      border-color .25s ease;
  }
  #servizi .services-grid .service.is-current{
    transform: translateY(0) scale(1);
    opacity: 1;
    box-shadow: 0 18px 46px rgba(2,6,23,.14), 0 8px 22px rgba(31,74,160,.18);
    background: linear-gradient(180deg,#F3F8FF 0%,#FFFFFF 60%);
    border-color: #5C86D6;
  }
  #servizi .services-grid .service .s-ico{ transition: transform .25s ease, background .25s ease; }
  #servizi .services-grid .service.is-current .s-ico{ transform: translateY(-1px) scale(1.06); background: linear-gradient(180deg,#5C86D6,#1F4AA0); }
}