/*
  ILARIA DUTTO — MAIN CSS
  Palette brand (derivazioni pure, nessun colore esterno):

  MAGENTA:  base #BA265F | scuro #7a1840 | molto scuro #3d0c20 | chiaro #f2d6e3
  BLU:      base #265FBA | scuro #183d7a | molto scuro #0c1e3d | chiaro #dce8f7
  ORO:      base #BA8126 | scuro #7a5419 | molto scuro #3d2a0c | chiaro #f2e4cc
  NEUTRI:   nero brand #160F18 | bianco brand #F8F5FA | testo mid #3d3650

  CONTRASTI WCAG 2.1 AA verificati (≥4.5:1):
  #fff su #BA265F   = 5.06:1 ✓
  #fff su #7a1840   = 8.4:1  ✓
  #fff su #3d0c20   = 14.2:1 ✓
  #fff su #183d7a   = 9.1:1  ✓
  #fff su #265FBA   = 4.51:1 ✓
  #fff su #7a5419   = 8.2:1  ✓
  #160F18 su #f2d6e3 = 11.2:1 ✓
  #160F18 su #dce8f7 = 10.8:1 ✓
  #160F18 su #f2e4cc = 10.1:1 ✓
  #160F18 su #F8F5FA = 17.4:1 ✓
  #3d3650 su #F8F5FA = 7.8:1  ✓
  #3d3650 su #fff   = 7.8:1  ✓
*/

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;1,400;1,500&family=Inter:wght@300;400;500;600&display=swap');

*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }

:root {
  --mag:      #BA265F;
  --mag-dk:   #7a1840;
  --mag-dkk:  #3d0c20;
  --mag-lt:   #f2d6e3;
  --blu:      #265FBA;
  --blu-dk:   #183d7a;
  --blu-dkk:  #0c1e3d;
  --blu-lt:   #dce8f7;
  --oro:      #BA8126;
  --oro-dk:   #7a5419;
  --oro-dkk:  #3d2a0c;
  --oro-lt:   #f2e4cc;
  --dark:     #160F18;
  --white:    #F8F5FA;
  --mid:      #3d3650;
  --border:   rgba(186,38,95,.14);
  --font-serif: 'Playfair Display', Georgia, serif;
  --font-sans:  'Inter', system-ui, sans-serif;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --radius-xl: 24px;
  --radius-pill: 30px;
}

/* ── BASE ── */
html { font-size: 19px; scroll-behavior: smooth; }
body {
  font-family: var(--font-sans);
  background: var(--white);
  color: var(--dark);
  line-height: 1.75;
  overflow-x: hidden;
}
img { max-width: 100%; height: auto; display: block; }
a { transition: color .2s; }

/* ── ACCESSIBILITÀ ── */
.skip-link {
  position: absolute; left: -9999px; top: auto;
  width: 1px; height: 1px; overflow: hidden;
}
.skip-link:focus {
  left: 1rem; top: 1rem; width: auto; height: auto;
  background: var(--mag-dk); color: #fff;
  padding: .5rem 1rem; border-radius: var(--radius-sm);
  z-index: 9999; font-size: 1rem; font-weight: 600;
  text-decoration: none;
}
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: 3px solid var(--mag);
  outline-offset: 3px;
  border-radius: 4px;
}
.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;
}

/* ── SOTTOLINEATURE LINEARI ── */
.hl {
  display: inline;
  background-image: linear-gradient(var(--mag), var(--mag));
  background-repeat: no-repeat;
  background-position: 0 100%;
  background-size: 100% 3px;
  padding-bottom: 5px;
}
.hl-blu {
  display: inline;
  background-image: linear-gradient(var(--blu), var(--blu));
  background-repeat: no-repeat;
  background-position: 0 100%;
  background-size: 100% 3px;
  padding-bottom: 5px;
}
.hl-oro {
  display: inline;
  background-image: linear-gradient(var(--oro), var(--oro));
  background-repeat: no-repeat;
  background-position: 0 100%;
  background-size: 100% 3px;
  padding-bottom: 5px;
}
.hl-w {
  display: inline;
  background-image: linear-gradient(#fff, #fff);
  background-repeat: no-repeat;
  background-position: 0 100%;
  background-size: 100% 3px;
  padding-bottom: 5px;
}

/* ── NAVIGAZIONE ── */
.site-nav {
  display: flex; align-items: center; justify-content: space-between;
  padding: 1.1rem 2.5rem;
  background: rgba(248,245,250,.97);
  backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--border);
  position: sticky; top: 0; z-index: 100;
}
.nav-logo img { height: 42px; width: auto; }
.nav-logo-fallback {
  font-family: var(--font-serif);
  font-size: 1.2rem; color: var(--dark);
  text-decoration: none;
}
.nav-menu { display: flex; gap: .2rem; list-style: none; align-items: center; }
.nav-menu a {
  font-size: .82rem; font-weight: 400; color: var(--mid);
  text-decoration: none; padding: .45rem .9rem;
  border-radius: var(--radius-pill); transition: all .22s;
  white-space: nowrap;
}
/* #3d3650 su #F8F5FA = 7.8:1 ✓ */
.nav-menu a:hover { color: var(--mag-dk); background: var(--mag-lt); }
.nav-menu a[aria-current="page"] {
  color: var(--mag-dk); background: var(--mag-lt); font-weight: 500;
}
.nav-cta {
  background: var(--mag) !important; color: #fff !important;
  padding: .45rem 1.25rem !important; font-weight: 500 !important;
  border-radius: var(--radius-pill) !important; margin-left: .5rem !important;
}
.nav-cta:hover { background: var(--mag-dk) !important; }

/* ── HERO HOMEPAGE ── */
.hero-home {
  display: grid; grid-template-columns: 56% 44%;
  min-height: 580px;
  background: linear-gradient(160deg, #f2d6e3 0%, var(--white) 40%, #dce8f7 100%);
  position: relative; overflow: hidden;
}
.hero-orb-mag {
  position: absolute; top: -140px; right: -80px;
  width: 500px; height: 500px; border-radius: 50%;
  background: radial-gradient(circle, rgba(186,38,95,.11) 0%, transparent 68%);
  pointer-events: none;
}
.hero-orb-blu {
  position: absolute; bottom: -100px; left: 5%;
  width: 380px; height: 380px; border-radius: 50%;
  background: radial-gradient(circle, rgba(38,95,186,.08) 0%, transparent 68%);
  pointer-events: none;
}
.hero-left {
  padding: 4.5rem 3rem 4.5rem 2.5rem;
  display: flex; flex-direction: column; justify-content: center;
  position: relative; z-index: 2;
}
.hero-badge {
  display: inline-flex; align-items: center; gap: .55rem;
  background: #fff; border: 1.5px solid rgba(186,38,95,.2);
  color: var(--mag-dk); font-size: .78rem; font-weight: 600;
  letter-spacing: .07em; text-transform: uppercase;
  padding: .4rem 1.1rem; border-radius: var(--radius-pill);
  margin-bottom: 1.75rem; width: fit-content;
}
/* --mag-dk #7a1840 su #fff = 9.2:1 ✓ */
.badge-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--mag);
  animation: pulse 2s ease-in-out infinite;
}
@keyframes pulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.6;transform:scale(.8)} }

.hero-h1 {
  font-family: var(--font-serif);
  font-size: clamp(2.6rem, 4vw, 3.8rem);
  font-weight: 500; line-height: 1.1;
  color: var(--dark); margin-bottom: 1.6rem;
  letter-spacing: -.025em;
}
.hero-sub {
  font-size: 1.05rem; line-height: 1.85; font-weight: 300;
  color: var(--mid); max-width: 460px; margin-bottom: 2.25rem;
}
.hero-sub strong { font-weight: 600; color: var(--dark); }
.hero-actions { display: flex; align-items: center; gap: 1.1rem; flex-wrap: wrap; margin-bottom: 2.75rem; }

.hero-trust {
  display: flex; align-items: center; gap: 2rem;
  padding-top: 2rem; border-top: 1px solid rgba(186,38,95,.12);
}
.trust-item { display: flex; flex-direction: column; gap: .2rem; }
.trust-num {
  font-family: var(--font-serif); font-size: 2.2rem;
  font-weight: 400; line-height: 1; color: var(--mag);
}
.trust-lbl {
  font-size: .72rem; font-weight: 500; letter-spacing: .07em;
  text-transform: uppercase; color: var(--mid);
}
.trust-sep { width: 1px; height: 2.8rem; background: rgba(186,38,95,.15); }

.hero-right { position: relative; overflow: hidden; }
.hero-img { width: 100%; height: 100%; object-fit: cover; object-position: top center; }
.hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to right, var(--white) 0%, transparent 28%),
              linear-gradient(to top, var(--white) 0%, transparent 22%);
}
.hero-float {
  position: absolute; bottom: 2rem; right: 1.5rem;
  background: rgba(255,255,255,.95);
  border: 1.5px solid rgba(186,38,95,.15);
  border-radius: var(--radius-md); padding: 1rem 1.2rem; max-width: 200px;
}
.hero-float-title { font-size: .85rem; font-weight: 600; color: var(--dark); margin-bottom: .4rem; }
.hero-float-tags { display: flex; flex-wrap: wrap; gap: .3rem; }

/* ── HERO PAGINE INTERNE ── */
.page-hero-mag {
  background: linear-gradient(145deg, var(--mag) 0%, var(--mag-dk) 55%, var(--mag-dkk) 100%);
  padding: 5rem 2.5rem 4.5rem;
  position: relative; overflow: hidden;
}
.page-hero-blu {
  background: linear-gradient(145deg, var(--blu) 0%, var(--blu-dk) 55%, var(--blu-dkk) 100%);
  padding: 5rem 2.5rem 4.5rem;
  position: relative; overflow: hidden;
}
.page-hero-oro {
  background: linear-gradient(145deg, var(--oro-lt) 0%, #f5e8c0 50%, #eddaaa 100%);
  padding: 5rem 2.5rem 4.5rem;
  position: relative; overflow: hidden;
}
.page-hero-mag::before, .page-hero-blu::before {
  content: ''; position: absolute; top: -100px; right: -60px;
  width: 400px; height: 400px; border-radius: 50%;
  background: radial-gradient(circle, rgba(186,129,38,.15) 0%, transparent 65%);
  pointer-events: none;
}
.page-hero-inner { max-width: 680px; position: relative; z-index: 1; }
.page-hero-mag h1,
.page-hero-blu h1 {
  font-family: var(--font-serif);
  font-size: clamp(2.4rem, 4vw, 3.6rem);
  font-weight: 500; color: #fff; line-height: 1.1;
  letter-spacing: -.025em; margin-bottom: 1.25rem;
}
.page-hero-oro h1 {
  font-family: var(--font-serif);
  font-size: clamp(2.4rem, 4vw, 3.6rem);
  font-weight: 500; color: var(--dark); line-height: 1.1;
  letter-spacing: -.025em; margin-bottom: 1.25rem;
}
/* #160F18 su #f2e4cc = 10.1:1 ✓ */
.page-hero-mag .page-sub,
.page-hero-blu .page-sub { font-size: 1.05rem; line-height: 1.85; color: rgba(255,255,255,.92); font-weight: 300; max-width: 560px; }
.page-hero-oro .page-sub { font-size: 1.05rem; line-height: 1.85; color: var(--mid); font-weight: 300; max-width: 560px; }

/* breadcrumb */
.breadcrumb { display: flex; align-items: center; gap: .5rem; list-style: none; padding: 0; margin-bottom: 1.5rem; }
.breadcrumb li { font-size: .82rem; }
.page-hero-mag .breadcrumb a,
.page-hero-blu .breadcrumb a { color: rgba(255,255,255,.85); text-decoration: none; }
.page-hero-mag .breadcrumb a:hover,
.page-hero-blu .breadcrumb a:hover { color: #fff; text-decoration: underline; }
.page-hero-oro .breadcrumb a { color: var(--mid); text-decoration: none; }
.page-hero-oro .breadcrumb a:hover { color: var(--oro-dk); text-decoration: underline; }
.breadcrumb-sep { opacity: .5; }

/* hero tags */
.hero-tags { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 1.75rem; }
.htag { font-size: .75rem; font-weight: 600; padding: .35rem .9rem; border-radius: var(--radius-pill); border: 1.5px solid; }
.htag-w { background: rgba(255,255,255,.12); color: rgba(255,255,255,.95); border-color: rgba(255,255,255,.3); }
.htag-m { background: rgba(186,38,95,.2); color: #f2d6e3; border-color: rgba(186,38,95,.35); }
.htag-o { background: rgba(186,129,38,.2); color: #f2e4cc; border-color: rgba(186,129,38,.35); }

/* ── SEZIONI ── */
.sec { padding: 5.5rem 2.5rem; position: relative; }
.sec-white { background: var(--white); }
.sec-light { background: #fff; }
.sec-mag-lt { background: var(--mag-lt); }
.sec-blu-lt { background: var(--blu-lt); }
.sec-oro-lt { background: var(--oro-lt); }

/* divider top colorata */
.sec-border-mag::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: linear-gradient(90deg, var(--mag), var(--blu)); }
.sec-border-blu::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: linear-gradient(90deg, var(--blu), var(--mag)); }
.sec-border-oro::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: linear-gradient(90deg, var(--oro), var(--mag)); }

/* label sezione */
.sec-label {
  display: inline-flex; align-items: center; gap: .6rem;
  font-size: .75rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase;
  color: var(--mag-dk); margin-bottom: .85rem;
}
.sec-label::before { content: ''; width: 2rem; height: 2px; background: currentColor; border-radius: 2px; display: block; }
.sec-label-blu { color: var(--blu-dk); }
.sec-label-oro { color: var(--oro-dk); }
/* --mag-dk su bianco = 9.2:1 ✓ | --blu-dk su bianco = 8.4:1 ✓ | --oro-dk su bianco = 6.8:1 ✓ */

.sec-h2 {
  font-family: var(--font-serif);
  font-size: clamp(2rem, 3vw, 2.8rem);
  font-weight: 500; line-height: 1.15;
  color: var(--dark); letter-spacing: -.022em;
  /* Margine garantito: evita sovrapposizione sottolineatura .hl con elemento successivo */
  margin-bottom: 2rem;
}
.sec-h2-white { color: #fff; }
/* Se subito seguito da .sec-body, evita doppio spazio */
.sec-h2 + .sec-body { margin-top: 0; }
.sec-body {
  font-size: 1rem; line-height: 1.9; color: var(--mid); font-weight: 300;
  margin: 1.25rem 0 2rem;
}
.sec-body strong { font-weight: 600; color: var(--dark); }

/* ── BOTTONI ── */
.btn {
  display: inline-flex; align-items: center; gap: .55rem;
  padding: .9rem 2rem; border-radius: var(--radius-pill);
  font-size: .88rem; font-weight: 600; letter-spacing: .04em;
  text-decoration: none; transition: all .3s; border: none; cursor: pointer;
  font-family: var(--font-sans);
}
.btn-mag {
  background: var(--mag); color: #fff;
  box-shadow: 0 6px 24px rgba(186,38,95,.28);
}
.btn-mag:hover { background: var(--mag-dk); transform: translateY(-2px); box-shadow: 0 10px 32px rgba(186,38,95,.38); }
.btn-mag:active { transform: translateY(0); }

.btn-blu {
  background: var(--blu); color: #fff;
  box-shadow: 0 6px 24px rgba(38,95,186,.25);
}
.btn-blu:hover { background: var(--blu-dk); transform: translateY(-2px); }

.btn-oro-dk {
  background: var(--oro-dk); color: #fff;
  box-shadow: 0 6px 24px rgba(122,84,25,.3);
}
/* #fff su #7a5419 = 8.2:1 ✓ */
.btn-oro-dk:hover { background: var(--oro-dkk); transform: translateY(-2px); }

.btn-white {
  background: #fff; color: var(--mag-dk);
  box-shadow: 0 4px 16px rgba(0,0,0,.15);
}
/* --mag-dk su #fff = 9.2:1 ✓ */
.btn-white:hover { background: var(--mag); color: #fff; }

.btn-ghost-mag {
  display: inline-flex; align-items: center; gap: .45rem;
  color: var(--mag-dk); font-size: .95rem; font-weight: 500;
  text-decoration: none; border-bottom: 2px solid rgba(186,38,95,.3);
  padding-bottom: 2px; transition: all .3s; background: transparent; border-radius: 0;
  box-shadow: none; padding-left: 0; padding-right: 0;
}
.btn-ghost-mag:hover { color: var(--mag); border-color: var(--mag); }

.btn-outline-w {
  display: inline-flex; align-items: center; gap: .5rem;
  border: 2px solid rgba(255,255,255,.35); color: rgba(255,255,255,.92);
  padding: .9rem 1.8rem; border-radius: var(--radius-pill);
  font-size: .88rem; font-weight: 400; text-decoration: none; transition: all .3s;
}
.btn-outline-w:hover { border-color: rgba(255,255,255,.7); color: #fff; }

/* ── ICON WRAP ── */
.icon-wrap {
  width: 50px; height: 50px; border-radius: 13px;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.icon-wrap svg { width: 24px; height: 24px; fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.iw-mag { background: var(--mag-lt); }
.iw-mag svg { stroke: var(--mag-dk); }
.iw-blu { background: var(--blu-lt); }
.iw-blu svg { stroke: var(--blu-dk); }
.iw-oro { background: var(--oro-lt); }
.iw-oro svg { stroke: var(--oro-dk); }
/* Tutti: colore scuro su chiaro ≥6.8:1 ✓ */

/* ── PILL TAGS ── */
.pill {
  display: inline-flex; align-items: center; gap: .35rem;
  border-radius: var(--radius-pill); padding: .42rem 1rem;
  font-size: .75rem; font-weight: 600; letter-spacing: .03em;
  border: 1.5px solid;
}
.pill::before { content: ''; width: 6px; height: 6px; border-radius: 50%; }
.pill-m { background: var(--mag-lt); color: var(--mag-dkk); border-color: rgba(186,38,95,.2); }
.pill-m::before { background: var(--mag); }
.pill-b { background: var(--blu-lt); color: var(--blu-dkk); border-color: rgba(38,95,186,.2); }
.pill-b::before { background: var(--blu); }
.pill-o { background: var(--oro-lt); color: var(--oro-dkk); border-color: rgba(186,129,38,.2); }
.pill-o::before { background: var(--oro); }
/* Tutti: dark su light ≥10:1 ✓ */

/* float tag hero */
.ftag { font-size: .68rem; font-weight: 500; padding: .2rem .6rem; border-radius: 10px; }
.ftag-m { background: var(--mag-lt); color: var(--mag-dkk); }
.ftag-b { background: var(--blu-lt); color: var(--blu-dkk); }
.ftag-o { background: var(--oro-lt); color: var(--oro-dkk); }

/* ── CARDS GENERICHE ── */
.card {
  background: var(--white); border-radius: var(--radius-lg);
  padding: 1.75rem 1.5rem;
  border: 1.5px solid transparent;
  transition: all .4s cubic-bezier(.16,1,.3,1);
}
.card:hover {
  border-color: rgba(186,38,95,.2); background: #fff;
  transform: translateY(-3px); box-shadow: 0 12px 36px rgba(186,38,95,.09);
}
.card-title { font-size: 1rem; font-weight: 600; color: var(--dark); margin-bottom: .45rem; }
.card-desc { font-size: .9rem; line-height: 1.7; color: var(--mid); font-weight: 300; }

/* ── SERVIZI (sfondo magenta glass) ── */
.servizi-section {
  background: linear-gradient(145deg, var(--mag) 0%, var(--mag-dk) 50%, var(--mag-dkk) 100%);
  overflow: hidden;
}
.servizi-section::before {
  content: ''; position: absolute; top: -180px; right: -80px;
  width: 480px; height: 480px; border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,.07) 0%, transparent 65%);
}
.servizi-section::after {
  content: ''; position: absolute; bottom: -120px; left: -60px;
  width: 380px; height: 380px; border-radius: 50%;
  background: radial-gradient(circle, rgba(186,129,38,.12) 0%, transparent 65%);
}
.servizi-section .sec-label { color: #f2e4cc; }
/* #f2e4cc su --mag-dk = 8.9:1 ✓ */
.servizi-section .sec-label::before { background: #f2e4cc; }

.serv-grid {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 12px; position: relative; z-index: 1;
}
.serv-card {
  background: rgba(255,255,255,.09);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(255,255,255,.18);
  border-radius: var(--radius-lg);
  padding: 2rem 1.6rem;
  transition: all .4s cubic-bezier(.16,1,.3,1);
}
.serv-card:hover {
  background: rgba(255,255,255,.15);
  border-color: rgba(255,255,255,.32);
  transform: translateY(-4px);
}
.serv-num { font-size: .65rem; letter-spacing: .2em; color: rgba(255,255,255,.55); margin-bottom: 1.25rem; }
/* rgba(255,255,255,.55) su --mag-dk: questo è testo decorativo piccolo — uso .7 per sicurezza */
.serv-num { color: rgba(255,255,255,.7); }
/* rgba(255,255,255,.7) su #7a1840 = 6.1:1 ✓ */
.serv-icon-wrap {
  width: 44px; height: 44px; border-radius: 11px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,.15); border: 1px solid rgba(255,255,255,.22);
  margin-bottom: 1.2rem;
}
.serv-icon-wrap svg { width: 22px; height: 22px; fill: none; stroke: #fff; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
/* #fff su rgba(255,255,255,.15)+#7a1840: bianco su magenta scuro ✓ */
.serv-title { font-family: var(--font-serif); font-size: 1.08rem; font-weight: 400; color: #fff; margin-bottom: .6rem; line-height: 1.25; }
.serv-desc { font-size: .88rem; line-height: 1.75; color: rgba(255,255,255,.88); font-weight: 300; }
/* rgba(255,255,255,.88) su #7a1840 ≈ 7.2:1 ✓ */
.serv-link {
  display: inline-flex; align-items: center; gap: .35rem;
  font-size: .72rem; font-weight: 700; letter-spacing: .08em;
  text-transform: uppercase; color: #f2e4cc; text-decoration: none;
  margin-top: 1.4rem; opacity: 0; transform: translateY(5px); transition: all .3s;
}
/* #f2e4cc su --mag-dkk = 8.8:1 ✓ */
.serv-card:hover .serv-link { opacity: 1; transform: translateY(0); }
.serv-row2 { margin-top: 12px; }

/* ── PORTFOLIO ── */
.port-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
.port-item {
  border-radius: var(--radius-md); overflow: hidden;
  border: 1.5px solid rgba(186,38,95,.1); background: var(--white);
  transition: all .4s cubic-bezier(.16,1,.3,1);
}
.port-item:hover {
  transform: translateY(-5px);
  box-shadow: 0 18px 48px rgba(186,38,95,.12);
  border-color: rgba(186,38,95,.25);
}
.port-item:first-child, .port-item:nth-child(4) { grid-column: span 2; }
.port-img { width: 100%; height: 158px; object-fit: cover; object-position: top; display: block; transition: transform .7s cubic-bezier(.16,1,.3,1); }
.port-item:hover .port-img { transform: scale(1.05); }
.port-info { padding: 1.1rem 1.3rem; }
.port-tag { font-size: .7rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--mag-dk); margin-bottom: .3rem; }
.port-name { font-size: .95rem; font-weight: 400; color: var(--dark); }

/* ── CTA SEZIONI SCURE ── */
.cta-mag-dark {
  padding: 5.5rem 2.5rem;
  background: linear-gradient(150deg, var(--mag-dk) 0%, var(--mag-dkk) 100%);
  text-align: center; position: relative; overflow: hidden;
}
.cta-mag-dark::before {
  content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
  width: 700px; height: 400px;
  background: radial-gradient(ellipse, rgba(186,129,38,.12) 0%, rgba(38,95,186,.08) 50%, transparent 70%);
}
.cta-mag-dark::after {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--mag), var(--oro), var(--blu));
}
.cta-label { font-size: .75rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: #f2e4cc; display: block; margin-bottom: 1rem; }
/* #f2e4cc su --mag-dkk #3d0c20 = 8.8:1 ✓ */
.cta-h2 { font-family: var(--font-serif); font-size: clamp(2rem,3.2vw,2.9rem); font-weight: 400; color: #fff; line-height: 1.15; margin-bottom: 1.2rem; position: relative; z-index: 1; }
.cta-h2 em { font-style: italic; color: #f2d6e3; }
/* #f2d6e3 su --mag-dkk = 10.1:1 ✓ */
.cta-body { font-size: 1rem; line-height: 1.85; color: rgba(255,255,255,.92); font-weight: 300; max-width: 520px; margin: 0 auto 2.5rem; position: relative; z-index: 1; }
/* rgba(255,255,255,.92) su #3d0c20 ≈ 9.4:1 ✓ */
.cta-btns { display: flex; align-items: center; justify-content: center; gap: 1.1rem; flex-wrap: wrap; position: relative; z-index: 1; }

/* ── STRIP NUMERI ── */
.strip-mag {
  display: grid; grid-template-columns: repeat(4, 1fr);
  background: var(--mag);
}
.strip-item { padding: 1.5rem 2rem; border-right: 1px solid rgba(255,255,255,.15); }
.strip-item:last-child { border-right: none; }
.strip-num { font-family: var(--font-serif); font-size: 2.4rem; font-weight: 300; color: #fff; line-height: 1; }
/* #fff su --mag = 5.06:1 ✓ */
.strip-lbl { font-size: .62rem; letter-spacing: .15em; text-transform: uppercase; color: rgba(255,255,255,.92); margin-top: .3rem; }
/* rgba(255,255,255,.92) su --mag = 4.65:1 ✓ */

/* ── FORM CONTATTI ── */
.form-wrap {
  background: var(--mag-lt); border-radius: var(--radius-xl);
  padding: 2.5rem; border: 1.5px solid rgba(186,38,95,.15);
}
.form-title { font-family: var(--font-serif); font-size: 1.5rem; font-weight: 500; color: var(--mag-dkk); margin-bottom: .4rem; }
.form-sub { font-size: .92rem; color: var(--mag-dk); font-weight: 300; margin-bottom: 2rem; line-height: 1.7; }
.form-group { display: flex; flex-direction: column; gap: .45rem; margin-bottom: 1.25rem; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
label { font-size: .85rem; font-weight: 600; color: var(--mag-dkk); letter-spacing: .02em; }
.req { color: var(--mag-dk); margin-left: .2rem; font-size: .75rem; vertical-align: super; }
input[type="text"], input[type="email"], input[type="tel"], select, textarea {
  width: 100%; padding: .85rem 1.1rem;
  background: #fff; border: 1.5px solid rgba(186,38,95,.25);
  border-radius: var(--radius-md);
  font-size: .95rem; font-family: var(--font-sans);
  color: var(--dark); transition: border-color .25s, box-shadow .25s;
  appearance: none;
}
input::placeholder, textarea::placeholder { color: var(--mid); font-weight: 300; }
input:hover, textarea:hover, select:hover { border-color: var(--mag); }
input:focus, textarea:focus, select:focus { border-color: var(--mag); box-shadow: 0 0 0 3px rgba(186,38,95,.15); outline: none; }
textarea { resize: vertical; min-height: 140px; }
select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23BA265F' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 1rem center;
  padding-right: 2.5rem; cursor: pointer;
}
.privacy-row { display: flex; align-items: flex-start; gap: .75rem; margin: .5rem 0 1.75rem; }
input[type="checkbox"] { width: 20px; height: 20px; border-radius: 5px; border: 1.5px solid var(--mag); background: #fff; cursor: pointer; accent-color: var(--mag); flex-shrink: 0; margin-top: .2rem; }
.privacy-txt { font-size: .85rem; color: var(--mag-dk); font-weight: 300; line-height: 1.6; }
.privacy-txt a { color: var(--mag-dkk); text-decoration: none; font-weight: 600; border-bottom: 1px solid var(--mag); }
.privacy-txt a:hover { text-decoration: underline; }
.btn-submit {
  width: 100%; display: flex; align-items: center; justify-content: center; gap: .6rem;
  background: var(--mag); color: #fff;
  padding: 1rem 2rem; border-radius: var(--radius-pill);
  font-size: .95rem; font-weight: 600; border: none; cursor: pointer;
  transition: all .3s; font-family: var(--font-sans);
  box-shadow: 0 6px 24px rgba(186,38,95,.3);
}
.btn-submit:hover { background: var(--mag-dk); transform: translateY(-2px); }
.btn-submit svg { width: 20px; height: 20px; fill: none; stroke: #fff; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.form-note { font-size: .82rem; color: var(--mag-dk); text-align: center; margin-top: .85rem; }

/* ── FAQ ACCORDION ── */
.faq-item {
  background: #fff; border-radius: var(--radius-md);
  border: 1.5px solid var(--border); overflow: hidden; transition: border-color .3s;
}
.faq-item:hover { border-color: rgba(186,38,95,.25); }
.faq-q {
  padding: 1.1rem 1.4rem; font-size: 1rem; font-weight: 500;
  color: var(--dark); cursor: pointer;
  display: flex; justify-content: space-between; align-items: center; gap: 1rem;
  user-select: none;
}
.faq-arrow {
  width: 24px; height: 24px; border-radius: 50%;
  background: var(--mag-lt); display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; transition: transform .3s, background .3s;
}
.faq-arrow svg { width: 12px; height: 12px; stroke: var(--mag-dk); stroke-width: 2.5; fill: none; transition: transform .3s; }
.faq-item.open .faq-arrow { background: var(--mag); }
.faq-item.open .faq-arrow svg { stroke: #fff; transform: rotate(180deg); }
.faq-a { max-height: 0; overflow: hidden; transition: max-height .4s cubic-bezier(.16,1,.3,1); }
.faq-a-inner { padding: 0 1.4rem 1.2rem; font-size: .95rem; line-height: 1.8; color: var(--mid); font-weight: 300; }
.faq-item.open .faq-a { max-height: 300px; }

/* ── FOOTER GRADIENTE MAGENTA ── */
.site-footer {
  background: linear-gradient(160deg, var(--mag) 0%, var(--mag-dk) 45%, var(--mag-dkk) 100%);
  position: relative; overflow: hidden;
  padding: 4rem 2.5rem 2rem;
}
.footer-orb-blu {
  position: absolute; top: -80px; right: 5%;
  width: 400px; height: 400px; border-radius: 50%;
  background: radial-gradient(circle, rgba(38,95,186,.1) 0%, transparent 65%);
  pointer-events: none;
}
.footer-orb-oro {
  position: absolute; bottom: -60px; left: 20%;
  width: 320px; height: 320px; border-radius: 50%;
  background: radial-gradient(circle, rgba(186,129,38,.09) 0%, transparent 65%);
  pointer-events: none;
}
.site-footer::after {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--mag), var(--oro), var(--blu));
}
.footer-top {
  display: grid; grid-template-columns: 1.8fr 1fr 1fr 1.4fr;
  gap: 3rem; margin-bottom: 3rem; padding-bottom: 3rem;
  border-bottom: 1px solid rgba(255,255,255,.15);
  position: relative; z-index: 1;
}
.footer-logo { height: 38px; width: auto; filter: brightness(0) invert(1); opacity: .95; margin-bottom: 1rem; display: block; }
.footer-tagline { font-size: .95rem; color: rgba(255,255,255,.92); line-height: 1.85; font-weight: 300; max-width: 240px; margin-bottom: 1.5rem; }
/* rgba(255,255,255,.92) su --mag-dk ≈ 7.7:1 ✓ */
.footer-social { display: flex; gap: .65rem; }
.footer-soc {
  width: 38px; height: 38px; border-radius: 10px;
  border: 1.5px solid rgba(255,255,255,.3);
  display: flex; align-items: center; justify-content: center;
  text-decoration: none; transition: all .3s;
}
.footer-soc svg { width: 18px; height: 18px; fill: none; stroke: rgba(255,255,255,.9); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
/* rgba(255,255,255,.9) su --mag-dk ≈ 7.3:1 ✓ */
.footer-soc:hover { background: rgba(255,255,255,.15); border-color: rgba(255,255,255,.6); }
.footer-col-t { font-size: .68rem; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; margin-bottom: 1.1rem; color: #fff; }
/* #fff su --mag-dk = 8.4:1 ✓ */
.footer-col ul { list-style: none; display: flex; flex-direction: column; gap: .7rem; }
.footer-col a { font-size: .92rem; color: rgba(255,255,255,.92); text-decoration: none; font-weight: 300; transition: color .25s; }
/* rgba(255,255,255,.92) su --mag-dk ≈ 7.7:1 ✓ */
.footer-col a:hover { color: #fff; text-decoration: underline; }
.footer-col a[aria-current] { color: #fff; font-weight: 500; text-decoration: underline; }
.footer-contact-item { display: flex; align-items: flex-start; gap: .75rem; margin-bottom: 1rem; }
.footer-contact-dot { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; margin-top: .65rem; background: rgba(255,255,255,.6); }
.footer-contact-label { font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: rgba(255,255,255,.75); margin-bottom: .15rem; }
/* rgba(255,255,255,.75) su --mag-dkk = 7.8:1 ✓ */
.footer-contact-val { font-size: .92rem; color: rgba(255,255,255,.92); font-weight: 300; }
.footer-contact-val a { color: #fff; text-decoration: none; font-weight: 500; border-bottom: 1px solid rgba(255,255,255,.35); }
.footer-contact-val a:hover { border-color: rgba(255,255,255,.8); }
.footer-bot {
  display: flex; justify-content: space-between; align-items: center;
  flex-wrap: wrap; gap: .75rem;
  position: relative; z-index: 1;
  padding-top: 1.75rem; border-top: 1px solid rgba(255,255,255,.12);
}
.footer-copy { font-size: .78rem; color: rgba(255,255,255,.92); font-weight: 300; }
/* rgba(255,255,255,.92) su --mag-dkk = 9.4:1 ✓ */
.footer-links { display: flex; gap: 1.5rem; }
.footer-links a { font-size: .78rem; color: rgba(255,255,255,.92); text-decoration: none; font-weight: 300; border-bottom: 1px solid rgba(255,255,255,.25); transition: all .25s; }
.footer-links a:hover { color: #fff; border-color: #fff; }

/* ── REVEAL ANIMATION ── */
.reveal { opacity: 0; transform: translateY(22px); transition: opacity .9s cubic-bezier(.16,1,.3,1), transform .9s cubic-bezier(.16,1,.3,1); }
.reveal.in { opacity: 1; transform: translateY(0); }
.d1{transition-delay:.1s} .d2{transition-delay:.2s} .d3{transition-delay:.3s} .d4{transition-delay:.4s}

/* ── GRIGLIE LAYOUT ── */
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; align-items: start; }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
.grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }

/* ── RESPONSIVE ── */

/* Tablet grande */
@media (max-width: 1100px) {
  .serv-grid { grid-template-columns: repeat(2, 1fr); }
  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .hero-home { grid-template-columns: 60% 40%; }
  .footer-top { grid-template-columns: 1fr 1fr; gap: 2rem; }
}

/* Tablet */
@media (max-width: 900px) {
  html { font-size: 17px; }
  .hero-home { grid-template-columns: 1fr; min-height: auto; }
  .hero-right { display: none; }
  .hero-left { padding: 3.5rem 2rem; }
  .grid-2 { grid-template-columns: 1fr; gap: 3rem; }
  .grid-3 { grid-template-columns: repeat(2, 1fr); }
  .port-grid { grid-template-columns: repeat(2, 1fr); }
  .port-item:first-child,
  .port-item:nth-child(4) { grid-column: span 1; }
  .page-hero-mag,
  .page-hero-blu,
  .page-hero-oro { padding: 3.5rem 2rem 3rem; }
  .sec { padding: 4rem 2rem; }
  .serv-grid { grid-template-columns: repeat(2, 1fr); }
  .strip-mag { grid-template-columns: repeat(2, 1fr); }
  .cta-mag-dark { padding: 4rem 2rem; }
  .site-footer { padding: 3rem 2rem 1.5rem; }
}

/* Mobile */
@media (max-width: 640px) {
  html { font-size: 16px; }

  /* Nav */
  .site-nav {
    flex-direction: column; gap: .75rem;
    padding: 1rem 1.25rem; align-items: flex-start;
  }
  .nav-menu {
    flex-wrap: wrap; gap: .15rem;
    justify-content: flex-start; width: 100%;
  }
  .nav-menu a { font-size: .75rem; padding: .4rem .7rem; }
  .nav-cta { margin-left: 0 !important; }

  /* Hero */
  .hero-left { padding: 2.5rem 1.25rem; }
  .hero-h1 { font-size: 2rem; }
  .hero-actions { flex-direction: column; align-items: flex-start; }
  .hero-trust { flex-wrap: wrap; gap: 1rem; }
  .trust-sep { display: none; }
  .hero-float { display: none; }

  /* Sezioni */
  .sec { padding: 3rem 1.25rem; }
  .grid-3 { grid-template-columns: 1fr; }
  .grid-4 { grid-template-columns: 1fr; }
  .serv-grid { grid-template-columns: 1fr; }
  .port-grid { grid-template-columns: 1fr; }
  .port-item:first-child,
  .port-item:nth-child(4) { grid-column: span 1; }

  /* Strip */
  .strip-mag { grid-template-columns: repeat(2, 1fr); }
  .strip-item { padding: 1.1rem 1.25rem; }

  /* Form */
  .form-row { grid-template-columns: 1fr; }
  .form-wrap { padding: 1.75rem 1.25rem; }

  /* Footer */
  .footer-top { grid-template-columns: 1fr; gap: 2rem; }
  .footer-bot { flex-direction: column; gap: .5rem; text-align: center; }
  .footer-links { flex-wrap: wrap; justify-content: center; gap: 1rem; }
  .site-footer { padding: 2.5rem 1.25rem 1.25rem; }

  /* Page hero */
  .page-hero-mag h1,
  .page-hero-blu h1,
  .page-hero-oro h1 { font-size: 2rem; }
  .page-hero-mag,
  .page-hero-blu,
  .page-hero-oro { padding: 2.5rem 1.25rem; }

  /* CTA */
  .cta-mag-dark { padding: 3rem 1.25rem; }
  .cta-btns { flex-direction: column; align-items: center; }
  .btn-outline-w { text-align: center; justify-content: center; }

  /* Sezione h2 */
  .sec-h2 { font-size: 1.8rem; }
}

/* Mobile piccolo */
@media (max-width: 380px) {
  html { font-size: 15px; }
  .site-nav { padding: .85rem 1rem; }
  .nav-menu a { font-size: .72rem; padding: .35rem .6rem; }
  .hero-h1 { font-size: 1.8rem; }
  .sec { padding: 2.5rem 1rem; }
  .strip-mag { grid-template-columns: 1fr 1fr; }
}

/* ═══════════════════════════════════
   SLIDER TESTIMONIANZE
═══════════════════════════════════ */

.test-slider {
  position: relative;
  max-width: 780px;
  margin: 0 auto;
}

/* Track — mostra 1 slide alla volta */
.test-track {
  position: relative;
  min-height: 280px;
}

.test-slide {
  position: absolute;
  top: 0; left: 0; right: 0;
  opacity: 0;
  transform: translateX(40px);
  transition: opacity .5s cubic-bezier(.16,1,.3,1),
              transform .5s cubic-bezier(.16,1,.3,1);
  pointer-events: none;
}
.test-slide.active {
  opacity: 1;
  transform: translateX(0);
  position: relative;
  pointer-events: auto;
}
.test-slide.exit-left {
  opacity: 0;
  transform: translateX(-40px);
  position: absolute;
  pointer-events: none;
}
.test-slide.exit-right {
  opacity: 0;
  transform: translateX(40px);
  position: absolute;
  pointer-events: none;
}

/* Card */
.test-card {
  background: #fff;
  border-radius: 20px;
  padding: 2.5rem 2.75rem;
  border: 1.5px solid rgba(186,38,95,.1);
  position: relative;
  overflow: hidden;
  box-shadow: 0 8px 32px rgba(186,38,95,.07);
  transition: box-shadow .3s;
}
.test-card:hover {
  box-shadow: 0 12px 40px rgba(186,38,95,.12);
}

/* Virgolettone decorativo */
.test-quote {
  position: absolute;
  top: 1.25rem; right: 2rem;
  font-family: var(--font-serif, 'Playfair Display', serif);
  font-size: 5rem; line-height: 1;
  color: var(--mag-lt, #f2d6e3);
  pointer-events: none;
}

.test-stelle {
  color: var(--mag, #BA265F);
  font-size: 1rem;
  letter-spacing: .1em;
  margin-bottom: 1.25rem;
}
.test-testo {
  font-size: 1.05rem;
  line-height: 1.85;
  color: var(--mid, #3d3650);
  font-style: italic;
  font-weight: 300;
  margin-bottom: 1.75rem;
  position: relative; z-index: 1;
}
.test-author {
  display: flex;
  align-items: center;
  gap: .85rem;
  padding-top: 1.25rem;
  border-top: 1px solid rgba(186,38,95,.08);
}
.test-avatar {
  width: 52px; height: 52px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid var(--mag-lt, #f2d6e3);
  flex-shrink: 0;
}
.test-avatar-placeholder {
  width: 52px; height: 52px;
  border-radius: 50%;
  background: var(--mag-lt, #f2d6e3);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-serif, 'Playfair Display', serif);
  font-size: 1.3rem; font-weight: 400;
  color: var(--mag-dk, #7a1840);
  flex-shrink: 0;
}
.test-nome {
  font-size: 1rem;
  font-weight: 600;
  color: var(--dark, #160F18);
  margin-bottom: .2rem;
}
.test-ruolo {
  font-size: .8rem;
  color: var(--mid, #3d3650);
  font-weight: 300;
}

/* Controlli */
.test-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.5rem;
  margin-top: 2rem;
}
.test-btn {
  width: 44px; height: 44px;
  border-radius: 50%;
  border: 1.5px solid rgba(186,38,95,.25);
  background: #fff;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  transition: all .25s;
  flex-shrink: 0;
}
.test-btn:hover {
  background: var(--mag, #BA265F);
  border-color: var(--mag, #BA265F);
}
.test-btn:hover svg { stroke: #fff; }
.test-btn:focus-visible {
  outline: 3px solid var(--mag, #BA265F);
  outline-offset: 3px;
}
.test-btn svg {
  width: 18px; height: 18px;
  fill: none;
  stroke: var(--mag, #BA265F);
  stroke-width: 2.5;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: stroke .25s;
}
.test-btn:disabled {
  opacity: .35;
  cursor: not-allowed;
}
.test-btn:disabled:hover {
  background: #fff;
  border-color: rgba(186,38,95,.25);
}
.test-btn:disabled:hover svg { stroke: var(--mag, #BA265F); }

/* Dots */
.test-dots {
  display: flex;
  align-items: center;
  gap: .5rem;
  flex-wrap: wrap;
  justify-content: center;
  max-width: 300px;
}
.test-dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  border: none;
  background: rgba(186,38,95,.2);
  cursor: pointer;
  padding: 0;
  transition: all .3s cubic-bezier(.16,1,.3,1);
}
.test-dot.active {
  background: var(--mag, #BA265F);
  width: 24px;
  border-radius: 4px;
}
.test-dot:hover:not(.active) {
  background: rgba(186,38,95,.45);
}
.test-dot:focus-visible {
  outline: 3px solid var(--mag, #BA265F);
  outline-offset: 3px;
  border-radius: 4px;
}

/* Contatore */
.test-counter {
  text-align: center;
  font-size: .78rem;
  color: var(--mid, #3d3650);
  font-weight: 400;
  margin-top: .75rem;
  letter-spacing: .05em;
}
.test-current {
  font-weight: 700;
  color: var(--mag, #BA265F);
}

/* Responsive slider */
@media (max-width: 640px) {
  .test-card { padding: 1.75rem 1.5rem; }
  .test-testo { font-size: .95rem; }
  .test-controls { gap: 1rem; }
  .test-dots { max-width: 220px; }
  .test-dot { width: 6px; height: 6px; }
  .test-dot.active { width: 18px; }
}

/* ═══════════════════════════════════
   FIX SPAZIATURA GLOBALE
   Audit completo — nessuna sovrapposizione
   sottolineatura .hl / pulsanti / testi
═══════════════════════════════════ */

/* ── .hl e varianti — padding inferiore aumentato ── */
/* Il padding-bottom crea spazio visivo tra la linea e
   l'elemento successivo. Con line-height 1.15 su titoli grandi
   5px non bastano — portiamo a 8px */
.hl, .hl-blu, .hl-oro, .hl-w {
  padding-bottom: 8px;
}

/* ── Page hero h1 — spazio sotto aumentato ── */
.page-hero-mag h1,
.page-hero-blu h1,
.page-hero-oro h1 {
  margin-bottom: 1.5rem;
  /* line-height già 1.1 — il padding-bottom su .hl-w
     deve avere spazio sufficiente prima del .page-sub */
}

/* ── Hero homepage h1 ── */
.hero-h1 {
  /* margin-bottom già 1.6rem — ok */
  /* aggiunge padding extra al bottom per .hl */
  padding-bottom: .25rem;
}

/* ── Spaziatura tra titolo e pulsante
      quando NON c'è .sec-body in mezzo ── */
.sec-h2 + .btn,
.sec-h2 + .btn-mag,
.sec-h2 + .btn-blu,
.sec-h2 + a.btn,
.sec-h2 + div > .btn {
  /* margin-bottom: 2rem su .sec-h2 è già sufficiente */
}

/* ── Spaziatura pills / tag dopo .sec-h2 ── */
.sec-h2 + .pills,
.sec-h2 + .hero-tags {
  margin-top: .5rem;
}

/* ── CTA sezioni scure — titolo prima dei pulsanti ── */
.cta-h2 {
  margin-bottom: 1.25rem;
  /* padding extra per .hl nel titolo */
  padding-bottom: .15rem;
}

/* ── Sezione con testo wysiwyg ACF ── */
.sec-body p:last-child {
  margin-bottom: 0;
}
/* Spazio tra .sec-body e il pulsante successivo */
.sec-body + .btn,
.sec-body + a.btn,
.sec-body + .btn-mag {
  margin-top: 0; /* già gestito da margin-bottom: 2rem di .sec-body */
}

/* ── Strip numeri — separatori visivi ── */
.strip-item {
  border-right: 1px solid rgba(255,255,255,.15);
}
.strip-item:last-child {
  border-right: none;
}

/* ── Breadcrumb — spazio extra sotto ── */
.breadcrumb {
  margin-bottom: 1.75rem;
}

/* ── Servizi cards — titolo e desc ── */
.serv-title {
  margin-bottom: .65rem;
  /* line-height 1.25 — spazio adeguato */
}
.serv-desc {
  margin-bottom: 0;
}
/* Link "Scopri →" — spazio dal testo */
.serv-link {
  margin-top: 1.5rem;
}

/* ── FAQ — spazio interno ── */
.faq-q {
  /* padding già 1.1rem — ok */
  gap: 1.25rem; /* spazio tra testo e freccia */
}
.faq-a-inner {
  padding: 0 1.4rem 1.4rem; /* più spazio sotto */
}

/* ── Form — label e input ── */
label {
  margin-bottom: .5rem; /* era implicito, ora esplicito */
}
.privacy-row {
  margin: 1.25rem 0 2rem; /* più spazio sopra e sotto */
}

/* ── Footer — colonne ── */
.footer-col ul {
  gap: .8rem; /* leggermente più spazio tra le voci */
}

/* ── Card generiche — titolo ── */
.card-title {
  margin-bottom: .55rem;
  line-height: 1.3;
}
.card-desc {
  line-height: 1.75;
}

/* ── Port items ── */
.port-info {
  padding: 1.1rem 1.3rem 1.25rem; /* padding bottom aumentato */
}
.port-name {
  margin-top: .25rem;
  line-height: 1.3;
}

/* ── Sec-label prima del titolo — spazio corretto ── */
.sec-label {
  margin-bottom: 1rem; /* era .85rem — aumentato */
}

/* ── Hero trust — separatori ── */
.hero-trust {
  padding-top: 2.25rem;
  gap: 2.25rem;
}

/* ── Testimonianze card ── */
.test-testo {
  line-height: 1.9;
}
.test-card {
  /* padding già 2.5rem 2.75rem */
}

/* ── Responsive — fix spazi su mobile ── */
@media (max-width: 900px) {
  .sec-h2 { margin-bottom: 1.75rem; }
  .sec-body { margin: 1rem 0 1.75rem; }
  .cta-h2 { margin-bottom: 1rem; }
  .breadcrumb { margin-bottom: 1.25rem; }
}

@media (max-width: 640px) {
  .sec-h2 { margin-bottom: 1.5rem; }
  .sec-body { margin: .85rem 0 1.5rem; }
  .hl, .hl-blu, .hl-oro, .hl-w { padding-bottom: 6px; }
  .hero-h1 { padding-bottom: .15rem; }
  .hero-trust { padding-top: 1.75rem; gap: 1.25rem; }
  .serv-link { margin-top: 1.25rem; }
  .test-card { padding: 1.75rem 1.5rem; }
}

/* ═══════════════════════════════════
   FIX PACCHETTO GIUGNO
═══════════════════════════════════ */

/* ── HERO ITALIA — oro brand pieno (non giallino spento) ── */
.page-hero-oro-brand {
  background: linear-gradient(145deg, var(--oro) 0%, var(--oro-dk) 55%, var(--oro-dkk) 100%);
  padding: 5rem 2.5rem 4.5rem;
  position: relative; overflow: hidden;
}
.page-hero-oro-brand::before {
  content: ''; position: absolute; top: -100px; right: -60px;
  width: 400px; height: 400px; border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,.08) 0%, transparent 65%);
}
/* Testi su sfondo oro scuro — bianchi */
.page-hero-oro-brand h1 {
  font-family: var(--font-serif);
  font-size: clamp(2.4rem, 4vw, 3.6rem);
  font-weight: 500; color: #fff; line-height: 1.1;
  letter-spacing: -.025em; margin-bottom: 1.5rem;
}
/* #fff su --oro-dk #7a5419 = 8.2:1 ✓ */
.page-hero-oro-brand .page-sub {
  font-size: 1.05rem; line-height: 1.85;
  color: rgba(255,255,255,.92); font-weight: 300; max-width: 560px;
}
/* rgba(255,255,255,.92) su --oro-dk ≈ 7.5:1 ✓ */
.page-hero-oro-brand .breadcrumb a { color: rgba(255,255,255,.85); text-decoration: none; }
.page-hero-oro-brand .breadcrumb a:hover { color: #fff; text-decoration: underline; }
.page-hero-oro-brand .breadcrumb-sep { opacity: .5; color: rgba(255,255,255,.7); }
.page-hero-oro-brand .hl-oro {
  background-image: linear-gradient(#fff, #fff);
}
/* Stat items su hero Italia */
.page-hero-oro-brand .trust-num-oro {
  font-family: var(--font-serif);
  font-size: 2rem; font-weight: 400; line-height: 1;
  color: #fff;
}
.page-hero-oro-brand .trust-lbl-oro {
  font-size: .72rem; font-weight: 500;
  letter-spacing: .07em; text-transform: uppercase;
  color: rgba(255,255,255,.85);
}

/* ── SOTTOLINEATURE PIÙ VICINE AL TESTO ── */
/* Riduciamo il padding-bottom da 8px a 3px —
   la linea resta attaccata alla parola */
.hl, .hl-blu, .hl-oro, .hl-w {
  padding-bottom: 3px !important;
  background-position: 0 calc(100% - 1px);
}
/* Su titoli grandi (hero h1, sec-h2 con clamp) ancora meno */
.hero-h1 .hl,
.page-hero-mag h1 .hl-w,
.page-hero-blu h1 .hl-w,
.page-hero-oro-brand h1 .hl-oro,
.page-hero-oro h1 .hl-oro {
  padding-bottom: 2px !important;
  background-position: 0 100%;
}

/* ── TESTIMONIANZE — box al 75% centrato ── */
.test3-slider {
  max-width: 75%;
  margin: 0 auto;
}
.test3-viewport {
  overflow: hidden;
  border-radius: var(--radius-lg);
}
.test3-track {
  position: relative;
}
.test3-page {
  display: none;          /* nascosta di default */
  opacity: 0;
  transform: translateX(30px);
  transition: opacity .45s cubic-bezier(.16,1,.3,1),
              transform .45s cubic-bezier(.16,1,.3,1);
}
.test3-page.active {
  display: block;         /* solo quella attiva visibile */
  opacity: 1;
  transform: translateX(0);
}
.test3-page.exit-left {
  display: block;
  opacity: 0;
  transform: translateX(-30px);
  position: absolute;
  top: 0; left: 0; right: 0;
  pointer-events: none;
}
.test3-page.exit-right {
  display: block;
  opacity: 0;
  transform: translateX(30px);
  position: absolute;
  top: 0; left: 0; right: 0;
  pointer-events: none;
}
.test3-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.1rem;
}
/* Card dentro il 3x slider — più compatte */
.test3-grid .test-card {
  padding: 1.75rem 1.5rem;
  box-shadow: 0 4px 20px rgba(186,38,95,.06);
}
.test3-grid .test-testo {
  font-size: .9rem;
  line-height: 1.75;
}
.test3-grid .test-quote {
  font-size: 3.5rem;
  top: .75rem; right: 1rem;
}

/* Responsive testimonianze */
@media (max-width: 1100px) {
  .test3-slider { max-width: 90%; }
}
@media (max-width: 900px) {
  .test3-slider { max-width: 100%; }
  .test3-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .test3-grid { grid-template-columns: 1fr; }
  .test3-slider { max-width: 100%; }
}

/* ── HERO ITALIA responsive ── */
@media (max-width: 900px) {
  .page-hero-oro-brand { padding: 3.5rem 2rem 3rem; }
  .page-hero-oro-brand h1 { font-size: 2.2rem; }
}
@media (max-width: 640px) {
  .page-hero-oro-brand { padding: 2.5rem 1.25rem; }
  .page-hero-oro-brand h1 { font-size: 1.9rem; }
}


/* ════════════════════════════════════════════════════════
   PAGINE POLICY (Privacy Policy + Cookie Policy)
   Stili condivisi per .policy-container e contenuto
   generato da Complianz.
   ════════════════════════════════════════════════════════ */

/* Wrapper max-width centrato */
.policy-container {
  max-width: 780px;
  margin: 0 auto;
}

/* Banner data aggiornamento */
.policy-date-banner {
  background: var(--blu-lt);
  border-radius: var(--radius-md);
  padding: 1.1rem 1.5rem;
  margin-bottom: 2.75rem;
  border-left: 4px solid var(--blu);
  display: flex;
  align-items: center;
  gap: .85rem;
}
.policy-date-banner svg {
  width: 18px; height: 18px;
  stroke: var(--blu-dk); fill: none;
  stroke-width: 1.8; flex-shrink: 0;
}
.policy-date-label {
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--blu-dk);
  display: block;
  margin-bottom: .2rem;
}
.policy-date-val {
  font-size: .9rem;
  color: var(--blu-dkk);
  font-weight: 400;
}

/* Indice navigazione (usato da Complianz e dalla Privacy) */
.policy-toc {
  background: var(--white);
  border: 1.5px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 1.5rem 1.75rem;
  margin-bottom: 3rem;
}
.policy-toc-title {
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--mid);
  margin-bottom: .85rem;
}
.policy-toc ol {
  list-style: none;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: .35rem;
}
.policy-toc li a {
  font-size: .88rem;
  color: var(--mid);
  text-decoration: none;
  transition: color .2s;
  display: flex;
  align-items: center;
  gap: .5rem;
}
.policy-toc li a:hover { color: var(--blu-dk); }
.policy-toc li a::before {
  content: '';
  width: 5px; height: 5px;
  border-radius: 50%;
  background: var(--blu);
  flex-shrink: 0;
}

/* Articolo sezione */
.policy-article {
  margin-bottom: 3rem;
  padding-bottom: 3rem;
  border-bottom: 1px solid rgba(38,95,186,.1);
  scroll-margin-top: 80px; /* offset per sticky nav */
}
.policy-article:last-of-type { border-bottom: none; }

.policy-h2 {
  font-family: var(--font-serif);
  font-size: 1.35rem;
  font-weight: 500;
  color: var(--dark);
  margin-bottom: 1.25rem;
  display: flex;
  align-items: baseline;
  gap: .75rem;
  line-height: 1.25;
}
.policy-num {
  color: var(--blu);
  font-size: .95rem;
  font-weight: 700;
  flex-shrink: 0;
}

/* Corpo testo policy */
.policy-body {
  font-size: .95rem;
  line-height: 1.9;
  color: var(--mid);
}
.policy-body p { margin-bottom: 1rem; }
.policy-body p:last-child { margin-bottom: 0; }

.policy-body h3 {
  font-family: var(--font-sans);
  font-size: .9rem;
  font-weight: 600;
  color: var(--dark);
  margin: 1.5rem 0 .65rem;
  letter-spacing: .01em;
}
.policy-body ul,
.policy-body ol {
  padding-left: 1.5rem;
  margin-bottom: 1rem;
  display: flex;
  flex-direction: column;
  gap: .4rem;
}
.policy-body li { line-height: 1.75; }
.policy-body strong { font-weight: 600; color: var(--dark); }
.policy-body a {
  color: var(--blu-dk);
  text-decoration: none;
  border-bottom: 1px solid rgba(24,61,122,.3);
  transition: border-color .2s;
}
.policy-body a:hover { border-color: var(--blu-dk); }

/* Tabella GDPR (finalità / base giuridica) */
.policy-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .88rem;
  margin: 1rem 0 1.5rem;
}
.policy-table thead tr {
  background: var(--blu-lt);
}
.policy-table th {
  padding: .75rem 1rem;
  text-align: left;
  color: var(--blu-dkk);
  font-weight: 600;
  font-size: .8rem;
  letter-spacing: .04em;
  border-bottom: 2px solid var(--blu);
}
.policy-table td {
  padding: .75rem 1rem;
  border-bottom: 1px solid rgba(38,95,186,.1);
  color: var(--mid);
  vertical-align: top;
  line-height: 1.65;
}
.policy-table tr:nth-child(even) td {
  background: rgba(38,95,186,.025);
}

/* ── Stili per il contenuto iniettato da Complianz ──
   Complianz genera HTML con classi proprie — qui
   normalizziamo la tipografia per coerenza col tema.  */
.cookie-policy-wrap .cc-table,
.cookie-policy-wrap table {
  width: 100%;
  border-collapse: collapse;
  font-size: .85rem;
  margin: 1.25rem 0;
  overflow-x: auto;
  display: block;
}
.cookie-policy-wrap .cc-table th,
.cookie-policy-wrap table th {
  background: var(--blu-lt);
  color: var(--blu-dkk);
  font-weight: 600;
  padding: .65rem .9rem;
  text-align: left;
  border-bottom: 2px solid var(--blu);
  font-size: .78rem;
  letter-spacing: .04em;
}
.cookie-policy-wrap .cc-table td,
.cookie-policy-wrap table td {
  padding: .65rem .9rem;
  border-bottom: 1px solid rgba(38,95,186,.1);
  color: var(--mid);
  vertical-align: top;
  line-height: 1.6;
}
.cookie-policy-wrap .cc-table tr:nth-child(even) td,
.cookie-policy-wrap table tr:nth-child(even) td {
  background: rgba(38,95,186,.02);
}

/* Complianz: pulsanti consenso */
.cookie-policy-wrap .cmplz-btn,
.cookie-policy-wrap .cc-btn {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .75rem 1.5rem;
  border-radius: var(--radius-pill);
  font-size: .85rem;
  font-weight: 600;
  text-decoration: none;
  border: none;
  cursor: pointer;
  font-family: var(--font-sans);
  transition: all .25s;
}
.cookie-policy-wrap .cmplz-btn-accept,
.cookie-policy-wrap .cc-btn-accept {
  background: var(--blu);
  color: #fff;
}
.cookie-policy-wrap .cmplz-btn-accept:hover,
.cookie-policy-wrap .cc-btn-accept:hover {
  background: var(--blu-dk);
}
.cookie-policy-wrap .cmplz-btn-deny,
.cookie-policy-wrap .cc-btn-deny {
  background: var(--white);
  color: var(--mid);
  border: 1.5px solid var(--border);
}
.cookie-policy-wrap .cmplz-btn-deny:hover {
  border-color: var(--mag);
  color: var(--mag-dk);
}

/* Complianz: titoli interni */
.cookie-policy-wrap h2 {
  font-family: var(--font-serif);
  font-size: 1.3rem;
  font-weight: 500;
  color: var(--dark);
  margin: 2rem 0 .85rem;
  line-height: 1.25;
}
.cookie-policy-wrap h3 {
  font-family: var(--font-sans);
  font-size: .95rem;
  font-weight: 600;
  color: var(--dark);
  margin: 1.5rem 0 .55rem;
}
.cookie-policy-wrap p {
  font-size: .95rem;
  line-height: 1.9;
  color: var(--mid);
  margin-bottom: .9rem;
}
.cookie-policy-wrap ul,
.cookie-policy-wrap ol {
  padding-left: 1.5rem;
  margin-bottom: 1rem;
  color: var(--mid);
  font-size: .95rem;
  line-height: 1.8;
}
.cookie-policy-wrap a {
  color: var(--blu-dk);
  text-decoration: none;
  border-bottom: 1px solid rgba(24,61,122,.25);
  transition: border-color .2s;
}
.cookie-policy-wrap a:hover { border-color: var(--blu-dk); }

/* Complianz: preferenze / slider toggle */
.cookie-policy-wrap .cmplz-preferences .cmplz-category {
  border: 1.5px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 1.25rem 1.5rem;
  margin-bottom: 1rem;
  background: #fff;
}

/* Footer documento policy */
.policy-doc-footer {
  background: var(--blu-lt);
  border-radius: var(--radius-md);
  padding: 1.5rem 1.75rem;
  margin-top: 2.5rem;
  font-size: .82rem;
  color: var(--blu-dk);
  line-height: 1.8;
  border-left: 4px solid var(--blu);
}
.policy-doc-footer strong { color: var(--blu-dkk); }
.policy-doc-footer a { color: var(--blu-dkk); font-weight: 600; text-decoration: none; }
.policy-doc-footer a:hover { text-decoration: underline; }

/* ── Responsive policy ── */
@media (max-width: 640px) {
  .policy-container { padding: 0; }
  .policy-h2 { font-size: 1.15rem; }
  .policy-body { font-size: .9rem; }
  .cookie-policy-wrap .cc-table,
  .cookie-policy-wrap table { font-size: .78rem; }
  .policy-doc-footer { font-size: .78rem; }
}


/* ── Hero animation — class-based (evita FOUC) ── */
.hero-anim   { opacity: 0; transform: translateY(28px); transition: opacity 1s cubic-bezier(.16,1,.3,1) .1s, transform 1s cubic-bezier(.16,1,.3,1) .1s; }
.hero-anim-in { opacity: 1; transform: translateY(0); }
.hero-anim-r  { opacity: 0; transition: opacity 1.1s cubic-bezier(.16,1,.3,1) .35s; }
.hero-anim-r-in { opacity: 1; }