/* =========================================================================
   Savorita Footer
   Specifica: docs/footer-widget.md · Mockup: mockups/footer/

   Regole di scrittura: radice .sv-ftr.sv-ftr (specificità raddoppiata),
   contenitore di sé stessa (svf); responsive a contenitore, sotto 1000 il
   telefono (il tablet verticale è un telefono grande); niente !important su
   display. I link si vestono dalla posizione o da data-svf, mai dalla classe.

   data-v   dark | light      stile (A scuro, B chiaro)
   data-l   full | mini       impaginazione (completa, minima = C)
   ========================================================================= */

.sv-ftr.sv-ftr{
  --f-bg:#fff; --f-ink:var(--sv-navy,#293241); --f-muted:var(--sv-text,#6B8083); --f-line:#E3E8E4;
  --f-head:var(--sv-green,#087F23); --f-hover:var(--sv-green,#087F23); --f-ico:#E3E8E4;
  --f-font:Nunito, "Nunito Sans", system-ui, sans-serif;
  container-type:inline-size; container-name:svf;
  background:var(--f-bg); color:var(--f-ink);
  line-height:1.4; /* il kit dà al body un'interlinea fissa (30px) che i testi piccoli erediterebbero */
  font-family:"Nunito Sans", Nunito, system-ui, sans-serif; font-size:15px;
  -webkit-font-smoothing:antialiased; text-align:left;
  padding-bottom:env(safe-area-inset-bottom, 0px);
}
.sv-ftr.sv-ftr *,
.sv-ftr.sv-ftr *::before,
.sv-ftr.sv-ftr *::after{ box-sizing:border-box; }
.sv-ftr.sv-ftr :is(p, ul, nav, details, summary){ margin:0; padding:0; }
.sv-ftr.sv-ftr ul{ list-style:none; }
.sv-ftr.sv-ftr a{
  color:inherit; text-decoration:none; background:none; border:0; box-shadow:none;
  word-spacing:normal; letter-spacing:inherit; white-space:normal; font:inherit;
}
.sv-ftr.sv-ftr img{ display:block; max-width:100%; height:auto; }
.sv-ftr.sv-ftr :is(a, summary):focus-visible{ outline:2px solid var(--sv-green-2,#61C685); outline-offset:3px; border-radius:4px; }
.sv-ftr.sv-ftr a[data-svf-missing]{ outline:1.5px dashed var(--sv-red,#EC1B30); outline-offset:2px; opacity:.7; cursor:help; }

.sv-ftr.sv-ftr .svf-in{ max-width:1200px; margin:0 auto; padding:72px 48px 26px; }
.sv-ftr.sv-ftr .svf-srcnote{ margin:0 0 20px; padding:8px 12px; border:1.5px dashed currentColor; border-radius:10px; font-size:13px; opacity:.8; }

/* ---------- fascia di chiusura ---------- */
.sv-ftr.sv-ftr .svf-cta{
  display:grid; grid-template-columns:minmax(0,1fr) auto; gap:24px 56px; align-items:end;
  padding-bottom:44px; border-bottom:1px solid var(--f-line);
}
.sv-ftr.sv-ftr .svf-cta-txt{ min-width:0; }
.sv-ftr.sv-ftr .svf-eyebrow{
  display:flex; align-items:center; gap:10px; margin-bottom:14px;
  font:800 12px/1 var(--f-font); letter-spacing:.18em; text-transform:uppercase; color:var(--f-muted);
}
.sv-ftr.sv-ftr .svf-eyebrow::before{
  content:""; flex:none; width:30px; height:4px; border-radius:2px;
  background:linear-gradient(90deg,#1a9a3a 0 33.3%,#fff 33.3% 66.6%,#EC1B30 66.6%);
}
.sv-ftr.sv-ftr .svf-lead{ font:900 42px/1.08 var(--f-font); letter-spacing:-.01em; text-wrap:balance; color:inherit; }
.sv-ftr.sv-ftr .svf-lead em{ font-style:normal; color:var(--sv-green,#087F23); }
.sv-ftr.sv-ftr .svf-text{ margin-top:12px; font-size:17px; color:var(--f-muted); max-width:52ch; }
.sv-ftr.sv-ftr .svf-who{ display:inline-flex; align-items:center; gap:10px; margin-top:16px; font-size:14px; color:var(--f-muted); }
.sv-ftr.sv-ftr .svf-who b{ color:var(--f-ink); font-weight:700; }
.sv-ftr.sv-ftr .svf-ava{ width:34px; height:34px; flex:none; border-radius:50%; display:grid; place-items:center; background:var(--sv-green,#087F23); color:#fff; font:900 13px/1 var(--f-font); }

.sv-ftr.sv-ftr .svf-acts{ display:flex; flex-direction:column; align-items:flex-end; gap:12px; }
.sv-ftr.sv-ftr a[data-svf="btn"]{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  min-height:52px; padding:0 26px; border-radius:999px;
  font:800 16px/1.2 var(--f-font); text-align:center;
  background:var(--sv-green,#087F23); color:#fff; border:1.5px solid var(--sv-green,#087F23);
  transition:transform .15s, box-shadow .15s;
}
.sv-ftr.sv-ftr a[data-svf="btn"] svg{ width:18px; height:18px; flex:none; }
.sv-ftr.sv-ftr a[data-svf="btn"]:hover{ transform:translateY(-1px); box-shadow:0 10px 24px -12px rgba(8,127,35,.6); }
.sv-ftr.sv-ftr .svf-sub{ font-size:14.5px; color:var(--f-muted); text-align:right; }
.sv-ftr.sv-ftr .svf-sub a{ color:var(--f-ink); font-weight:700; text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1px; }
.sv-ftr.sv-ftr .svf-prod{ display:inline-flex; align-items:center; gap:8px; font-size:14.5px; color:var(--f-muted); }
.sv-ftr.sv-ftr .svf-prod a{ color:var(--f-ink); font-weight:700; }
.sv-ftr.sv-ftr .svf-flag{
  width:18px; height:12px; flex:none; border-radius:2px;
  background:linear-gradient(90deg,#1a9a3a 0 33.3%,#fff 33.3% 66.6%,#EC1B30 66.6%);
  box-shadow:0 0 0 1px rgba(0,0,0,.12);
}

/* ---------- colonne ---------- */
.sv-ftr.sv-ftr .svf-cols{ display:flex; gap:32px; padding:44px 0 40px; }
.sv-ftr.sv-ftr .svf-cols > *{ flex:1 1 0; min-width:0; }
.sv-ftr.sv-ftr .svf-cols > .svf-brand{ flex:1.2 1 0; }
.sv-ftr.sv-ftr .svf-cols > [data-two]{ flex:1.7 1 0; }
.sv-ftr.sv-ftr .svf-cols > [data-contact]{ flex:1.25 1 0; }
.sv-ftr.sv-ftr .svf-brand a[data-svf="logo"]{ display:inline-block; }
.sv-ftr.sv-ftr[data-v="dark"] .svf-brand img{ width:104px; }
.sv-ftr.sv-ftr[data-v="light"] .svf-brand img{ width:190px; }
.sv-ftr.sv-ftr .svf-brand p{ margin-top:14px; font-size:14px; color:var(--f-muted); max-width:34ch; text-wrap:pretty; }

.sv-ftr.sv-ftr .svf-grp > summary{
  list-style:none; display:flex; justify-content:space-between; align-items:center; gap:12px;
  margin-bottom:16px; cursor:default;
  font:800 12.5px/1 var(--f-font); letter-spacing:.12em; text-transform:uppercase; color:var(--f-head);
}
.sv-ftr.sv-ftr .svf-grp > summary::-webkit-details-marker{ display:none; }
.sv-ftr.sv-ftr .svf-grp > summary::marker{ content:""; }
.sv-ftr.sv-ftr .svf-grp > summary svg{ display:none; width:18px; height:18px; flex:none; transition:transform .2s; }
.sv-ftr.sv-ftr .svf-list{ display:grid; gap:11px; font-size:15px; }
.sv-ftr.sv-ftr .svf-grp[data-two] .svf-list{ grid-template-columns:1fr 1fr; column-gap:20px; }
.sv-ftr.sv-ftr .svf-list a{ display:inline-flex; align-items:center; gap:8px; transition:color .15s; }
.sv-ftr.sv-ftr .svf-list a:hover{ color:var(--f-hover); }
.sv-ftr.sv-ftr .svf-list small{ display:block; margin-top:2px; font-size:12.5px; color:var(--f-muted); }
.sv-ftr.sv-ftr .svf-list li[data-svf-all] a{ font-weight:700; }
.sv-ftr.sv-ftr .svf-tag{
  display:inline-block; vertical-align:middle; padding:4px 7px; border-radius:999px;
  font:800 10.5px/1 var(--f-font); letter-spacing:.06em; text-transform:uppercase;
  background:var(--sv-red,#EC1B30); color:#fff;
}
.sv-ftr.sv-ftr .svf-ico{
  width:30px; height:30px; flex:none; border-radius:50%; display:grid; place-items:center;
  border:1px solid var(--f-ico);
}
.sv-ftr.sv-ftr .svf-ico svg{ width:16px; height:16px; }

/* ---------- riga legale ---------- */
.sv-ftr.sv-ftr .svf-legal{
  display:flex; flex-wrap:wrap; justify-content:space-between; gap:10px 24px;
  padding-top:22px; border-top:1px solid var(--f-line); font-size:13.5px; color:var(--f-muted);
}
.sv-ftr.sv-ftr .svf-legal ul{ display:flex; flex-wrap:wrap; gap:6px 20px; }
.sv-ftr.sv-ftr .svf-legal a:hover{ color:var(--f-ink); }

/* ---------- impaginazione minima ---------- */
.sv-ftr.sv-ftr[data-l="mini"]{ border-top:1px solid var(--f-line); }
.sv-ftr.sv-ftr[data-l="mini"] .svf-in{ padding:34px 48px 22px; }
.sv-ftr.sv-ftr .svf-row{ display:flex; flex-wrap:wrap; align-items:center; gap:20px 36px; padding-bottom:26px; }
.sv-ftr.sv-ftr .svf-row .svf-brand{ flex:none; }
.sv-ftr.sv-ftr[data-l="mini"][data-v="dark"] .svf-brand img{ width:64px; }
.sv-ftr.sv-ftr[data-l="mini"][data-v="light"] .svf-brand img{ width:150px; }
.sv-ftr.sv-ftr .svf-nav{ flex:1 1 auto; min-width:0; }
.sv-ftr.sv-ftr .svf-nav ul{ display:flex; flex-wrap:wrap; gap:10px 26px; font-size:15px; font-weight:600; }
.sv-ftr.sv-ftr .svf-nav a:hover{ color:var(--f-hover); }
.sv-ftr.sv-ftr .svf-soc{ display:flex; gap:8px; }
.sv-ftr.sv-ftr .svf-soc a{ width:34px; height:34px; border-radius:50%; display:grid; place-items:center; border:1px solid var(--f-ico); }
.sv-ftr.sv-ftr .svf-soc svg{ width:16px; height:16px; }
.sv-ftr.sv-ftr .svf-row a[data-svf="btn"]{ min-height:44px; padding:0 20px; font-size:15px; }
.sv-ftr.sv-ftr[data-l="mini"] .svf-legal{ padding-top:18px; }

/* ---------- A · scuro ---------- */
.sv-ftr.sv-ftr[data-v="dark"]{
  --f-bg:linear-gradient(170deg, var(--sv-navy,#293241) 0%, #1f4a36 58%, var(--sv-green,#087F23) 100%);
  --f-ink:#fff; --f-muted:rgba(255,255,255,.72); --f-line:rgba(255,255,255,.16);
  --f-head:var(--sv-green-2,#61C685); --f-hover:var(--sv-yellow,#FFCC37); --f-ico:rgba(255,255,255,.28);
}
.sv-ftr.sv-ftr[data-v="dark"] .svf-lead em{ color:var(--sv-yellow,#FFCC37); }
.sv-ftr.sv-ftr[data-v="dark"] .svf-ava{ background:var(--sv-yellow,#FFCC37); color:var(--sv-navy,#293241); }
.sv-ftr.sv-ftr[data-v="dark"] a[data-svf="btn"]{ background:var(--sv-mint,#E8FFE5); color:var(--sv-green,#087F23); border-color:var(--sv-green-2,#61C685); }

/* ---------- B · chiaro ---------- */
.sv-ftr.sv-ftr[data-v="light"]{ --f-bg:var(--sv-lilac,#F7F6FE); --f-line:#E2E0F2; --f-ico:#E2E0F2; }
.sv-ftr.sv-ftr[data-v="light"][data-l="full"] .svf-in{ padding-top:56px; }
.sv-ftr.sv-ftr[data-v="light"] .svf-cta{
  background:#fff; border:0; border-radius:28px; padding:34px 40px;
  box-shadow:0 1px 0 rgba(41,50,65,.04), 0 18px 40px -26px rgba(41,50,65,.35);
}
.sv-ftr.sv-ftr[data-v="light"] .svf-lead{ font-size:34px; }
.sv-ftr.sv-ftr[data-v="light"] .svf-cols{ padding-top:48px; }
.sv-ftr.sv-ftr[data-v="light"] :is(.svf-ico, .svf-soc a){ background:#fff; color:var(--sv-green,#087F23); }
.sv-ftr.sv-ftr[data-v="light"][data-l="mini"]{ --f-bg:#fff; --f-line:#E3E8E4; }

/* ---------- telefono (contenitore sotto 1000) ---------- */
@container svf (max-width: 999px){
  .sv-ftr.sv-ftr .svf-in{ padding:48px 20px 22px; }
  .sv-ftr.sv-ftr .svf-lead{ font-size:30px; }
  .sv-ftr.sv-ftr .svf-text{ font-size:16px; }
  .sv-ftr.sv-ftr .svf-cta{ grid-template-columns:1fr; gap:22px; padding-bottom:32px; }
  .sv-ftr.sv-ftr .svf-acts{ align-items:stretch; }
  .sv-ftr.sv-ftr .svf-acts a[data-svf="btn"]{ width:100%; }
  .sv-ftr.sv-ftr .svf-sub{ text-align:center; }
  .sv-ftr.sv-ftr .svf-cols{ flex-direction:column; gap:0; padding:12px 0 24px; }
  .sv-ftr.sv-ftr .svf-cols > *{ flex:none; }
  .sv-ftr.sv-ftr .svf-brand{ padding:20px 0 18px; }
  .sv-ftr.sv-ftr[data-v="dark"] .svf-brand img{ width:84px; }
  .sv-ftr.sv-ftr .svf-brand p{ margin-top:10px; }
  .sv-ftr.sv-ftr .svf-grp{ border-bottom:1px solid var(--f-line); }
  .sv-ftr.sv-ftr .svf-grp > summary{ margin:0; padding:18px 0; cursor:pointer; font-size:13px; }
  .sv-ftr.sv-ftr .svf-grp > summary svg{ display:block; }
  .sv-ftr.sv-ftr .svf-grp[open] > summary svg{ transform:rotate(180deg); }
  .sv-ftr.sv-ftr .svf-grp .svf-list{ padding-bottom:20px; font-size:16px; gap:14px; }
  .sv-ftr.sv-ftr .svf-grp[data-two] .svf-list{ grid-template-columns:1fr; }
  .sv-ftr.sv-ftr .svf-grp[data-contact]{ border-bottom:0; }
  .sv-ftr.sv-ftr .svf-grp[data-contact] > summary{ cursor:default; padding-top:26px; }
  .sv-ftr.sv-ftr .svf-grp[data-contact] > summary svg{ display:none; }
  .sv-ftr.sv-ftr .svf-legal{ flex-direction:column; gap:14px; font-size:13px; }
  .sv-ftr.sv-ftr .svf-legal ul{ gap:8px 18px; }

  .sv-ftr.sv-ftr[data-v="light"][data-l="full"] .svf-in{ padding-top:32px; }
  .sv-ftr.sv-ftr[data-v="light"] .svf-cta{ padding:26px 22px; border-radius:24px; }
  .sv-ftr.sv-ftr[data-v="light"] .svf-lead{ font-size:26px; }

  .sv-ftr.sv-ftr[data-l="mini"] .svf-in{ padding:28px 20px 20px; }
  .sv-ftr.sv-ftr .svf-row{ flex-direction:column; align-items:flex-start; gap:20px; }
  .sv-ftr.sv-ftr .svf-nav{ width:100%; }
  .sv-ftr.sv-ftr .svf-nav ul{ display:grid; grid-template-columns:1fr 1fr; gap:12px 20px; font-size:15.5px; }
  .sv-ftr.sv-ftr .svf-row a[data-svf="btn"]{ width:100%; }
}
/* tablet verticale: telefono grande, misure un po' più ampie */
@container svf (min-width: 700px) and (max-width: 999px){
  .sv-ftr.sv-ftr .svf-in{ padding-inline:40px; }
  .sv-ftr.sv-ftr .svf-lead{ font-size:36px; }
}

@media (prefers-reduced-motion: reduce){
  .sv-ftr.sv-ftr :is(a[data-svf="btn"], .svf-grp > summary svg, .svf-list a){ transition:none; }
}
