/* Font self-hosted (GDPR-friendly) — Archivo + Inter, subset latin/latin-ext */
/* latin-ext */
@font-face {
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(/fonts/archivo-600-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
}
/* latin */
@font-face {
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(/fonts/archivo-600-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
}
/* latin-ext */
@font-face {
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(/fonts/archivo-700-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
}
/* latin */
@font-face {
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(/fonts/archivo-700-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
}
/* latin-ext */
@font-face {
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 800;
  font-stretch: 100%;
  font-display: swap;
  src: url(/fonts/archivo-800-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
}
/* latin */
@font-face {
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 800;
  font-stretch: 100%;
  font-display: swap;
  src: url(/fonts/archivo-800-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
}
/* latin-ext */
@font-face {
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/inter-400-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
}
/* latin */
@font-face {
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/inter-400-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
}
/* latin-ext */
@font-face {
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/inter-500-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
}
/* latin */
@font-face {
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/inter-500-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
}
/* latin-ext */
@font-face {
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/inter-600-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
}
/* latin */
@font-face {
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/inter-600-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
}
/* latin-ext */
@font-face {
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/fonts/inter-700-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
}
/* latin */
@font-face {
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/fonts/inter-700-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
}
/* =========================================================
   TINELLI GROUP — Design System
   Palette: blu brand + tricolore + navy · Font: Archivo/Inter
   ========================================================= */

:root{
  /* Brand */
  --brand:        #1466B4;   /* blu Tinelli (testi/CTA) */
  --brand-600:    #12599e;
  --brand-700:    #0f4c88;
  --brand-bright: #2E86D6;   /* accento chiaro */
  --brand-050:    #eaf2fb;   /* superficie azzurra */
  --brand-100:    #d7e6f7;

  /* Tricolore (firma logo) */
  --it-green: #009246;
  --it-red:   #CE2B37;

  /* Neutri */
  --ink:      #0c1a2b;   /* testo principale */
  --ink-soft: #40566d;   /* testo secondario */
  --muted:    #6b7c90;
  --line:     #e3e9f1;   /* bordi */
  --line-2:   #eef2f7;
  --bg:       #ffffff;
  --bg-soft:  #f4f7fb;   /* sezioni alternate */
  --navy:     #0a1c30;   /* sezioni scure */
  --navy-2:   #0d2440;
  --navy-soft:#12314f;

  /* UI */
  --radius:   16px;
  --radius-sm:10px;
  --radius-lg:24px;
  --shadow-sm: 0 1px 2px rgba(12,26,43,.06), 0 2px 8px rgba(12,26,43,.05);
  --shadow-md: 0 6px 24px rgba(12,26,43,.10);
  --shadow-lg: 0 24px 60px rgba(10,28,48,.18);
  --ring: 0 0 0 4px rgba(20,102,180,.18);

  --container: 1200px;
  --pad: clamp(1.1rem, 4vw, 2rem);

  --ff-head: "Archivo", system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --ff-body: "Inter", system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  --header-h: 76px;
}

/* ---------- Reset / base ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:calc(var(--header-h) + 16px); }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } *{ animation:none!important; transition:none!important; } }
body{
  margin:0; font-family:var(--ff-body); color:var(--ink); background:var(--bg);
  font-size:17px; line-height:1.65; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img,svg,video{ max-width:100%; height:auto; display:block; }
a{ color:var(--brand); text-decoration:none; }
a:hover{ color:var(--brand-700); }
h1,h2,h3,h4{ font-family:var(--ff-head); font-weight:800; line-height:1.08; letter-spacing:-.02em; color:var(--ink); margin:0 0 .5em; }
p{ margin:0 0 1rem; }
ul{ margin:0 0 1rem; padding-left:1.1rem; }
strong{ font-weight:700; color:var(--ink); }
:focus-visible{ outline:none; box-shadow:var(--ring); }
.btn:active{ transform:translateY(0); }
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0; }

/* ---------- Layout ---------- */
.container{ width:100%; max-width:var(--container); margin-inline:auto; padding-inline:var(--pad); }
.container-narrow{ max-width:820px; }
section{ position:relative; }
.section{ padding:clamp(3.5rem, 8vw, 6.5rem) 0; }
.section--soft{ background:var(--bg-soft); }
.section--navy{ background:var(--navy); color:#dfe8f2; }
.section--tight{ padding:clamp(2.5rem,6vw,4rem) 0; }

/* ---------- Signature: filo tricolore ---------- */
.tricolor{ display:inline-flex; height:5px; width:64px; border-radius:99px; overflow:hidden; box-shadow:var(--shadow-sm); }
.tricolor i{ flex:1; }
.tricolor i:nth-child(1){ background:var(--it-green); }
.tricolor i:nth-child(2){ background:#fff; }
.tricolor i:nth-child(3){ background:var(--it-red); }
.section--navy .tricolor i:nth-child(2){ background:#eaf1f8; }

/* ---------- Eyebrow + heading ---------- */
.eyebrow{
  display:inline-flex; align-items:center; gap:.6rem; font-family:var(--ff-head);
  font-weight:700; font-size:.82rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--brand); margin:0 0 1rem;
}
.section--navy .eyebrow{ color:#7db6ec; }
.h-display{ font-size:clamp(2.1rem, 5.4vw, 3.6rem); }
.h-xl{ font-size:clamp(1.9rem, 4.4vw, 2.9rem); }
.h-lg{ font-size:clamp(1.5rem, 3vw, 2rem); }
.lead{ font-size:clamp(1.05rem,1.6vw,1.25rem); color:var(--ink-soft); line-height:1.6; }
.section--navy .lead{ color:#b9cbdd; }
.text-center{ text-align:center; }
.mx-auto{ margin-inline:auto; }
.section-head{ max-width:720px; margin-bottom:clamp(2rem,4vw,3rem); }
.section-head.text-center{ margin-inline:auto; }

/* ---------- Buttons ---------- */
.btn{
  --_bg:var(--brand); --_fg:#fff; --_bd:var(--brand);
  display:inline-flex; align-items:center; justify-content:center; gap:.55rem;
  font-family:var(--ff-head); font-weight:700; font-size:1rem; line-height:1;
  padding:.95rem 1.5rem; border-radius:99px; border:1.5px solid var(--_bd);
  background:var(--_bg); color:var(--_fg); cursor:pointer; transition:transform .15s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
  box-shadow:0 4px 14px rgba(20,102,180,.28); white-space:nowrap;
}
.btn:hover{ transform:translateY(-2px); box-shadow:0 10px 24px rgba(20,102,180,.34); color:#fff; background:var(--brand-600); }
.btn svg{ width:1.05em; height:1.05em; }
.btn--lg{ padding:1.1rem 1.9rem; font-size:1.06rem; }
.btn--ghost{ --_bg:transparent; --_fg:var(--brand); --_bd:var(--line); box-shadow:none; background:#fff; }
.btn--ghost:hover{ background:var(--brand-050); color:var(--brand-700); border-color:var(--brand-100); }
.btn--wa{ --_bg:#25D366; --_bd:#25D366; --_fg:#04361a; box-shadow:0 4px 14px rgba(37,211,102,.3); }
.btn--wa:hover{ background:#1fbb59; color:#04361a; }
.btn--light{ --_bg:#fff; --_fg:var(--brand-700); --_bd:#fff; box-shadow:0 8px 24px rgba(0,0,0,.18); }
.btn--light:hover{ background:#eef4fb; color:var(--brand-700); }
.btn--outline-light{ --_bg:transparent; --_fg:#fff; --_bd:rgba(255,255,255,.5); box-shadow:none; }
.btn--outline-light:hover{ background:rgba(255,255,255,.1); color:#fff; border-color:#fff; }
.btn-row{ display:flex; flex-wrap:wrap; gap:.85rem; }

/* ---------- Header ---------- */
.site-header{ position:sticky; top:0; z-index:100; background:rgba(255,255,255,.9); backdrop-filter:saturate(160%) blur(12px); border-bottom:1px solid var(--line-2); transition:box-shadow .2s ease; }
.site-header.scrolled{ box-shadow:0 6px 20px rgba(12,26,43,.08); }
.nav{ display:flex; align-items:center; gap:1.2rem; height:var(--header-h); }
.brand{ display:flex; align-items:center; gap:.6rem; margin-right:auto; }
.brand img{ height:44px; width:auto; }
.nav-links{ display:flex; align-items:center; gap:.35rem; list-style:none; margin:0; padding:0; }
.nav-links a{
  font-family:var(--ff-head); font-weight:600; font-size:.98rem; color:var(--ink); padding:.55rem .75rem; border-radius:8px; transition:background .18s, color .18s; letter-spacing:-.01em;
}
.nav-links a:hover{ background:var(--brand-050); color:var(--brand-700); }
.nav-links a[aria-current="page"]{ color:var(--brand); }
.nav-links a[aria-current="page"]::after{ content:""; display:block; height:2.5px; width:60%; margin:.15rem auto 0; background:var(--brand); border-radius:2px; }
.nav-cta{ display:flex; align-items:center; gap:.6rem; }
.nav-phone{ display:inline-flex; align-items:center; gap:.45rem; font-family:var(--ff-head); font-weight:700; color:var(--ink); font-size:.98rem; padding:.4rem .5rem; }
.nav-phone:hover{ color:var(--brand); }
.nav-toggle{ display:none; width:46px; height:46px; border:1px solid var(--line); border-radius:12px; background:#fff; cursor:pointer; align-items:center; justify-content:center; }
.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after{ content:""; display:block; width:20px; height:2px; background:var(--ink); border-radius:2px; position:relative; transition:transform .25s ease, opacity .2s ease; }
.nav-toggle span::before{ position:absolute; top:-6px; }
.nav-toggle span::after{ position:absolute; top:6px; }
body.nav-open .nav-toggle span{ background:transparent; }
body.nav-open .nav-toggle span::before{ transform:translateY(6px) rotate(45deg); }
body.nav-open .nav-toggle span::after{ transform:translateY(-6px) rotate(-45deg); }

@media (max-width:1000px){
  .nav-toggle{ display:inline-flex; }
  .nav-phone{ display:none; }
  .nav-links{
    position:fixed; inset:var(--header-h) 0 auto 0; flex-direction:column; align-items:stretch; gap:.2rem;
    background:#fff; padding:1rem var(--pad) 1.6rem; border-bottom:1px solid var(--line);
    box-shadow:var(--shadow-lg); transform:translateY(-120%); transition:transform .3s cubic-bezier(.4,0,.2,1); max-height:calc(100vh - var(--header-h)); overflow:auto;
  }
  body.nav-open .nav-links{ transform:translateY(0); }
  .nav-links a{ font-size:1.15rem; padding:.85rem .6rem; border-bottom:1px solid var(--line-2); border-radius:0; }
  .nav-links a[aria-current="page"]::after{ display:none; }
  .nav-links .mobile-cta{ margin-top:1rem; }
  .nav-links .mobile-cta a{ border:0; }
}

/* ---------- Hero ---------- */
.hero{ position:relative; color:#fff; background:var(--navy); overflow:hidden; }
.hero__media{ position:absolute; inset:0; z-index:0; }
.hero__media img{ width:100%; height:100%; object-fit:cover; }
.hero__media::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(100deg, rgba(7,18,31,.92) 0%, rgba(8,22,38,.78) 42%, rgba(9,26,44,.35) 100%); }
.hero__inner{ position:relative; z-index:1; padding-block:clamp(3.5rem,9vw,7rem) clamp(3rem,7vw,5.5rem); }
.hero__grid{ max-width:760px; }
.hero h1{ color:#fff; font-size:clamp(2.3rem, 6vw, 4.2rem); line-height:1.03; margin-bottom:1.1rem; }
.hero h1 .accent{ color:#8dc0f0; }
.hero .lead{ color:#d3e0ee; max-width:560px; font-size:clamp(1.1rem,1.8vw,1.3rem); }
.hero .btn-row{ margin-top:2rem; }
.hero__eyebrow{ color:#8dc0f0; }
.hero__badges{ display:flex; flex-wrap:wrap; gap:1.4rem 2.2rem; margin-top:2.6rem; padding-top:1.8rem; border-top:1px solid rgba(255,255,255,.14); }
.hero__badge b{ font-family:var(--ff-head); font-size:1.7rem; display:block; color:#fff; line-height:1; }
.hero__badge span{ font-size:.86rem; color:#a9bed3; letter-spacing:.02em; }

/* page hero (interne) */
.pagehero{ background:var(--navy); color:#fff; position:relative; overflow:hidden; padding:calc(var(--header-h) - 20px) 0 0; }
.pagehero::before{ content:""; position:absolute; right:-10%; top:-40%; width:640px; height:640px; border-radius:50%;
  background:radial-gradient(circle, rgba(46,134,214,.35), transparent 60%); }
.pagehero__inner{ position:relative; z-index:1; padding-block:clamp(2.6rem,6vw,4.5rem) clamp(2.6rem,6vw,4rem); max-width:760px; }
.pagehero h1{ color:#fff; font-size:clamp(2rem,5vw,3.3rem); }
.pagehero .lead{ color:#c3d4e6; }
.breadcrumb{ font-size:.85rem; color:#93aac2; margin-bottom:1.2rem; display:flex; gap:.5rem; flex-wrap:wrap; align-items:center; }
.breadcrumb a{ color:#bcd2e8; }
.breadcrumb a:hover{ color:#fff; }
.breadcrumb span{ opacity:.6; }

/* ---------- Grids & cards ---------- */
.grid{ display:grid; gap:1.4rem; }
.grid-2{ grid-template-columns:repeat(2,1fr); }
.grid-3{ grid-template-columns:repeat(3,1fr); }
.grid-4{ grid-template-columns:repeat(4,1fr); }
@media (max-width:900px){ .grid-3,.grid-4{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:620px){ .grid-2,.grid-3,.grid-4{ grid-template-columns:1fr; } }

.card{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:1.7rem; box-shadow:var(--shadow-sm); transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease; height:100%; }
.card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-md); border-color:var(--brand-100); }
.card h3{ font-size:1.28rem; margin-bottom:.5rem; }
.card p{ color:var(--ink-soft); margin-bottom:0; font-size:.99rem; }
.card__icon{ width:52px; height:52px; border-radius:14px; display:grid; place-items:center; background:var(--brand-050); color:var(--brand); margin-bottom:1.1rem; }
.card__icon svg{ width:26px; height:26px; }
.card__num{ font-family:var(--ff-head); font-weight:800; color:var(--brand-100); font-size:1.1rem; letter-spacing:.1em; }

/* feature list */
.checklist{ list-style:none; padding:0; margin:0; display:grid; gap:.7rem; }
.checklist li{ position:relative; padding-left:2rem; color:var(--ink-soft); }
.checklist li::before{ content:""; position:absolute; left:0; top:.15rem; width:22px; height:22px; border-radius:50%; background:var(--brand-050);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%231466B4' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:center; }
.section--navy .checklist li{ color:#bccede; }
.section--navy .checklist li::before{ background-color:rgba(255,255,255,.08); }

/* split media + text */
.split{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,5vw,4rem); align-items:center; }
.split--reverse .split__media{ order:2; }
@media (max-width:860px){ .split{ grid-template-columns:1fr; } .split--reverse .split__media{ order:0; } }
.split__media{ position:relative; }
.split__media img{ border-radius:var(--radius-lg); box-shadow:var(--shadow-md); width:100%; aspect-ratio:4/3.2; object-fit:cover; }
.split__media .tag-float{ position:absolute; left:-14px; bottom:22px; background:#fff; border-radius:14px; box-shadow:var(--shadow-md); padding:.9rem 1.15rem; display:flex; align-items:center; gap:.7rem; }
.split__media .tag-float b{ font-family:var(--ff-head); font-size:1.5rem; color:var(--brand); line-height:1; }
.split__media .tag-float span{ font-size:.8rem; color:var(--muted); }
@media (max-width:860px){ .split__media .tag-float{ left:12px; } }

/* ---------- Stats band ---------- */
.stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem; }
@media (max-width:720px){ .stats{ grid-template-columns:repeat(2,1fr); } }
.stat{ text-align:center; padding:1rem; }
.stat b{ font-family:var(--ff-head); font-weight:800; font-size:clamp(2.1rem,4.5vw,3rem); color:#fff; line-height:1; letter-spacing:-.02em; display:block; }
.section--navy .stat b .plus{ color:#7db6ec; }
.stat span{ display:block; margin-top:.5rem; font-size:.92rem; color:#a9bed3; letter-spacing:.02em; }

/* ---------- Process steps ---------- */
.steps{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.2rem; counter-reset:step; }
@media (max-width:900px){ .steps{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .steps{ grid-template-columns:1fr; } }
.step{ position:relative; padding:1.6rem; background:#fff; border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow-sm); }
.step__n{ font-family:var(--ff-head); font-weight:800; font-size:1rem; color:#fff; background:var(--brand); width:38px; height:38px; border-radius:50%; display:grid; place-items:center; margin-bottom:1rem; box-shadow:0 4px 12px rgba(20,102,180,.3); }
.step h3{ font-size:1.15rem; margin-bottom:.35rem; }
.step p{ font-size:.95rem; color:var(--ink-soft); margin:0; }

/* ---------- Marchi / loghi ---------- */
.logo-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:1rem; }
@media (max-width:900px){ .logo-grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:560px){ .logo-grid{ grid-template-columns:repeat(2,1fr); } }
.logo-cell{ background:#fff; border:1px solid var(--line); border-radius:var(--radius-sm); height:118px; display:grid; place-items:center; padding:1.2rem; transition:box-shadow .2s, transform .2s; }
.logo-cell:hover{ box-shadow:var(--shadow-md); transform:translateY(-3px); }
.logo-cell img{ max-height:64px; width:auto; object-fit:contain; filter:saturate(1); }

.brand-card{ display:grid; grid-template-columns:180px 1fr; gap:1.6rem; align-items:center; background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:1.6rem; box-shadow:var(--shadow-sm); }
.brand-card__logo{ height:110px; display:grid; place-items:center; background:var(--bg-soft); border-radius:12px; padding:1rem; }
.brand-card__logo img{ max-height:74px; }
.brand-card h3{ margin-bottom:.35rem; }
.brand-card p{ margin:0; color:var(--ink-soft); font-size:.98rem; }
@media (max-width:620px){ .brand-card{ grid-template-columns:1fr; text-align:center; } .brand-card__logo{ max-width:220px; margin-inline:auto; } }

/* ---------- Gallery ---------- */
.gallery{ columns:3; column-gap:1rem; }
@media (max-width:900px){ .gallery{ columns:2; } }
@media (max-width:560px){ .gallery{ columns:1; } }
.gallery figure{ margin:0 0 1rem; break-inside:avoid; border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-sm); cursor:zoom-in; position:relative; background:var(--bg-soft); }
.gallery img{ width:100%; display:block; transition:transform .5s ease; }
.gallery figure:hover img{ transform:scale(1.05); }
.gallery figure::after{ content:""; position:absolute; inset:0; background:linear-gradient(to top, rgba(10,28,48,.35), transparent 45%); opacity:0; transition:opacity .3s; }
.gallery figure:hover::after{ opacity:1; }

.gallery-tabs{ display:flex; gap:.5rem; flex-wrap:wrap; justify-content:center; margin-bottom:2rem; }
.gallery-tabs button{ font-family:var(--ff-head); font-weight:600; font-size:.95rem; padding:.6rem 1.2rem; border-radius:99px; border:1.5px solid var(--line); background:#fff; color:var(--ink-soft); cursor:pointer; transition:all .18s; }
.gallery-tabs button:hover{ border-color:var(--brand-100); color:var(--brand); }
.gallery-tabs button.active{ background:var(--brand); border-color:var(--brand); color:#fff; }

/* Lightbox */
.lightbox{ position:fixed; inset:0; z-index:200; background:rgba(6,16,28,.94); display:none; align-items:center; justify-content:center; padding:4vh 4vw; }
.lightbox.open{ display:flex; }
.lightbox img{ max-width:100%; max-height:92vh; border-radius:8px; box-shadow:0 30px 80px rgba(0,0,0,.5); }
.lightbox__close, .lightbox__nav{ position:absolute; background:rgba(255,255,255,.12); border:0; color:#fff; width:52px; height:52px; border-radius:50%; font-size:1.6rem; cursor:pointer; display:grid; place-items:center; transition:background .2s; }
.lightbox__close:hover, .lightbox__nav:hover{ background:rgba(255,255,255,.28); }
.lightbox__close{ top:20px; right:20px; }
.lightbox__nav{ top:50%; transform:translateY(-50%); }
.lightbox__nav.prev{ left:20px; } .lightbox__nav.next{ right:20px; }
@media (max-width:560px){ .lightbox__nav{ width:44px; height:44px; } }

/* ---------- CTA band ---------- */
.cta-band{ background:linear-gradient(120deg, var(--brand-700), var(--brand) 60%, var(--brand-bright)); color:#fff; border-radius:var(--radius-lg); padding:clamp(2.2rem,5vw,3.6rem); position:relative; overflow:hidden; box-shadow:var(--shadow-lg); }
.cta-band::before{ content:""; position:absolute; right:-6%; top:-40%; width:420px; height:420px; border-radius:50%; background:rgba(255,255,255,.1); }
.cta-band .cta-inner{ position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:2rem; flex-wrap:wrap; }
.cta-band h2{ color:#fff; margin-bottom:.4rem; font-size:clamp(1.6rem,3.2vw,2.3rem); }
.cta-band p{ color:#e2edf9; margin:0; max-width:520px; }

/* ---------- Contatti ---------- */
.contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:2.4rem; }
@media (max-width:860px){ .contact-grid{ grid-template-columns:1fr; } }
.info-list{ list-style:none; padding:0; margin:0; display:grid; gap:1.1rem; }
.info-list li{ display:flex; gap:1rem; align-items:flex-start; }
.info-list .ico{ flex:0 0 auto; width:46px; height:46px; border-radius:12px; background:var(--brand-050); color:var(--brand); display:grid; place-items:center; }
.info-list .ico svg{ width:22px; height:22px; }
.info-list b{ display:block; font-family:var(--ff-head); font-size:.82rem; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); font-weight:700; margin-bottom:.15rem; }
.info-list a, .info-list span{ font-size:1.08rem; color:var(--ink); font-weight:500; }
.info-list a:hover{ color:var(--brand); }

.form{ display:grid; gap:1.1rem; }
.form .row{ display:grid; grid-template-columns:1fr 1fr; gap:1.1rem; }
@media (max-width:520px){ .form .row{ grid-template-columns:1fr; } }
.field{ display:flex; flex-direction:column; gap:.4rem; }
.field label{ font-size:.9rem; font-weight:600; color:var(--ink); }
.field label .req{ color:var(--it-red); }
.field input, .field textarea, .field select{
  font-family:var(--ff-body); font-size:1rem; padding:.85rem 1rem; border:1.5px solid var(--line); border-radius:12px; background:#fff; color:var(--ink); transition:border-color .18s, box-shadow .18s; width:100%;
}
.field input:focus, .field textarea:focus, .field select:focus{ outline:none; border-color:var(--brand); box-shadow:var(--ring); }
.field textarea{ resize:vertical; min-height:130px; }
.form .consent{ display:flex; gap:.6rem; align-items:flex-start; font-size:.9rem; color:var(--ink-soft); }
.form .consent input{ margin-top:.25rem; width:18px; height:18px; accent-color:var(--brand); }
.form-note{ font-size:.85rem; color:var(--muted); }
.hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.form-alert{ padding:.9rem 1.1rem; border-radius:12px; font-size:.95rem; display:none; }
.form-alert.ok{ display:block; background:#e7f6ee; color:#0a6b3b; border:1px solid #bce3cd; }
.form-alert.err{ display:block; background:#fdecec; color:#a12; border:1px solid #f5c4c4; }

.map-embed{ border:0; width:100%; height:100%; min-height:340px; border-radius:var(--radius); filter:grayscale(.15); }
.map-embed[data-src]{ display:none; } /* nascosto finché non c'è consenso cookie di terze parti */
.map-wrap{ border-radius:var(--radius); overflow:hidden; border:1px solid var(--line); box-shadow:var(--shadow-sm); }

/* hours table */
.hours{ list-style:none; padding:0; margin:0; }
.hours li{ display:flex; justify-content:space-between; gap:1rem; padding:.55rem 0; border-bottom:1px solid var(--line-2); font-size:.98rem; }
.hours li:last-child{ border-bottom:0; }
.hours span:first-child{ color:var(--ink-soft); }
.hours span:last-child{ font-weight:600; }
.badge-24{ display:inline-flex; align-items:center; gap:.45rem; background:var(--brand-050); color:var(--brand-700); font-weight:700; font-size:.85rem; padding:.35rem .8rem; border-radius:99px; }

/* ---------- Prose (pagine legali) ---------- */
.prose{ max-width:800px; }
.prose h2{ font-size:1.5rem; margin-top:2.4rem; }
.prose h3{ font-size:1.2rem; margin-top:1.6rem; }
.prose p, .prose li{ color:var(--ink-soft); }
.prose ul{ padding-left:1.2rem; }
.prose a{ text-decoration:underline; }
.prose table{ width:100%; border-collapse:collapse; margin:1.2rem 0; font-size:.94rem; }
.prose th, .prose td{ text-align:left; padding:.7rem .8rem; border:1px solid var(--line); }
.prose th{ background:var(--bg-soft); font-family:var(--ff-head); }
.data-box{ background:var(--bg-soft); border:1px solid var(--line); border-radius:var(--radius); padding:1.5rem 1.7rem; margin:1.4rem 0; }
.data-box dl{ margin:0; display:grid; grid-template-columns:auto 1fr; gap:.5rem 1.4rem; }
.data-box dt{ font-weight:700; color:var(--ink); }
.data-box dd{ margin:0; color:var(--ink-soft); }
@media (max-width:520px){ .data-box dl{ grid-template-columns:1fr; gap:.1rem 0; } .data-box dd{ margin-bottom:.6rem; } }

/* ---------- Footer ---------- */
.site-footer{ background:var(--navy); color:#aebfd2; padding:clamp(3rem,6vw,4.5rem) 0 2rem; font-size:.95rem; }
.footer-grid{ display:grid; grid-template-columns:1.5fr 1fr 1fr 1.2fr; gap:2rem; }
@media (max-width:860px){ .footer-grid{ grid-template-columns:1fr 1fr; gap:2rem 1.5rem; } }
@media (max-width:520px){ .footer-grid{ grid-template-columns:1fr; } }
.footer-brand img{ height:46px; background:#fff; border-radius:10px; padding:6px 10px; margin-bottom:1rem; }
.footer-brand p{ color:#8fa3ba; max-width:280px; font-size:.92rem; }
.site-footer h4{ color:#fff; font-size:.85rem; letter-spacing:.1em; text-transform:uppercase; margin-bottom:1.1rem; }
.footer-links{ list-style:none; padding:0; margin:0; display:grid; gap:.6rem; }
.footer-links a{ color:#aebfd2; }
.footer-links a:hover{ color:#fff; }
.footer-contact{ list-style:none; padding:0; margin:0; display:grid; gap:.7rem; }
.footer-contact a{ color:#cddbec; }
.footer-contact a:hover{ color:#fff; }
.footer-bottom{ margin-top:2.5rem; padding-top:1.6rem; border-top:1px solid rgba(255,255,255,.1); display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; font-size:.85rem; color:#7f93aa; }
.footer-bottom a{ color:#9fb2c8; }
.footer-social{ display:flex; gap:.6rem; }
.footer-social a{ width:40px; height:40px; border-radius:10px; background:rgba(255,255,255,.08); display:grid; place-items:center; color:#cddbec; transition:background .2s; }
.footer-social a:hover{ background:var(--brand); color:#fff; }

/* ---------- Cookie banner ---------- */
.cookie{ position:fixed; left:1rem; right:1rem; bottom:1rem; z-index:300; max-width:520px; margin-inline:auto; background:#fff; border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow-lg); padding:1.4rem 1.5rem; display:none; }
.cookie.show{ display:block; animation:cookieUp .4s ease; }
@keyframes cookieUp{ from{ transform:translateY(20px); opacity:0; } to{ transform:translateY(0); opacity:1; } }
.cookie h4{ font-size:1.1rem; margin-bottom:.4rem; }
.cookie p{ font-size:.9rem; color:var(--ink-soft); margin-bottom:1rem; }
.cookie p a{ text-decoration:underline; }
.cookie__actions{ display:flex; gap:.6rem; flex-wrap:wrap; }
.cookie__actions .btn{ flex:1; padding:.75rem 1rem; font-size:.92rem; box-shadow:none; }
.cookie__actions .btn--ghost{ flex:1; }

/* ---------- Reveal on scroll ---------- */
.reveal{ opacity:0; transform:translateY(22px); transition:opacity .6s ease, transform .6s cubic-bezier(.2,.7,.2,1); }
.reveal.in{ opacity:1; transform:none; }
.reveal.d1{ transition-delay:.08s; } .reveal.d2{ transition-delay:.16s; } .reveal.d3{ transition-delay:.24s; }

/* ---------- Utilities ---------- */
.mt-0{ margin-top:0; } .mb-0{ margin-bottom:0; } .mt-2{ margin-top:1.4rem; } .mt-3{ margin-top:2rem; }
.pill{ display:inline-flex; align-items:center; gap:.5rem; background:var(--brand-050); color:var(--brand-700); font-family:var(--ff-head); font-weight:700; font-size:.8rem; letter-spacing:.04em; padding:.4rem .9rem; border-radius:99px; }
.section--navy .pill{ background:rgba(125,182,236,.14); color:#9fccf3; }
.divider{ height:1px; background:var(--line); border:0; margin:2.5rem 0; }
.two-col-text{ columns:2; column-gap:2.5rem; }
@media (max-width:700px){ .two-col-text{ columns:1; } }

/* ---------- Rifiniture mobile (comfort/respiro) ---------- */
@media (max-width:600px){
  :root{ --pad: 1.4rem; }
  .hero__badges{ display:grid; grid-template-columns:1fr 1fr; gap:1.2rem 1rem; }
  .hero__badge b{ font-size:1.5rem; }
  .hero__badges{ margin-top:2.2rem; padding-top:1.6rem; }
  .cta-band .cta-inner{ gap:1.4rem; }
  .cta-band .btn-row{ width:100%; }
  .cta-band .btn-row .btn{ flex:1 1 100%; }
}
@media (max-width:480px){
  .hero h1{ font-size:clamp(1.9rem, 8.5vw, 2.5rem); }
  .hero .lead{ font-size:1.06rem; }
  .hero .btn-row{ flex-direction:column; align-items:stretch; }
  .hero .btn-row .btn{ width:100%; }
  .section-head .lead, .lead{ font-size:1.06rem; }
  .h-xl{ font-size:clamp(1.7rem,7vw,2.2rem); }
  .pagehero h1{ font-size:clamp(1.85rem,8vw,2.4rem); }
}