/*
  Brand kit Nextfuture 1.0 su nextfuture.it (11/11/2026).
  Caratteri (Host Grotesk, grassetti in Satoshi 900), pulsanti neri, toni delle sezioni della home,
  componenti del kit chiusi dentro .nfk (T1, C1, F2: .btn e .wrap esistono anche nel tema Martex),
  schermate vive di Extravirgin e schermate animate (Interconnessione, Extrafly, Portale).
  Sorgente: ~/Desktop/Claude/brand-kit-nextfuture. Le scelte sezione per sezione le ha fatte l'utente
  sull'anteprima della home; i colori dei file del tema sono già stati portati alla palette P2.
*/

/* ================= token del kit ================= */
/*
  Brand kit Nextfuture — token (versione 1.0, 11/11/2026)

  Palette P2 «Nero e lime» con il verde notte per le parti scure.
  Caratteri: Host Grotesk per titoli e testo (L1), Satoshi Black per i grassetti (L0).
  Vale per tutti i siti: nextfuture.it, extravirginsoftware.it, softwarefrantoio.it,
  extrafly.it, portaledellolio.it. Cambia solo il logo e il nome nella firma del footer.

  Caricare i caratteri nell'<head>:
  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link href="https://fonts.googleapis.com/css2?family=Host+Grotesk:wght@400..700&display=swap" rel="stylesheet">
  <link href="https://api.fontshare.com/v2/css?f[]=satoshi@900&display=swap" rel="stylesheet">
*/
:root {
  /* --- colori del marchio (il logo resta com'è) --- */
  --nf-logo-verde: #7a9c30;    /* verde del logo: icone, link nelle grafiche, dettagli */
  --nf-logo-goccia: #c5bb28;   /* goccia del logo: solo nel logo */

  /* --- P2: fondi e testo --- */
  --bg: #ffffff;               /* fondo pagina */
  --surface: #f1f1f1;          /* sezioni e riquadri chiari */
  --ink: #0e0f0c;              /* testo principale e titoli */
  --muted: #585a53;            /* testo secondario e paragrafi lunghi */
  --line: #e3e3de;             /* linee sottili */
  --line-strong: #c9c9c2;      /* bordi dei campi e linee forti */

  /* --- azione --- */
  --accent: #0e0f0c;           /* pulsanti pieni: neri */
  --accent-ink: #ffffff;       /* testo sui pulsanti pieni */
  --brand: #7a9c30;            /* icone e link evidenziati: verde del logo */
  --spot: #cde26c;             /* lime: evidenziare, pulsanti sulle parti scure, fascia K4 */

  /* --- parti scure: verde notte (footer, fasce, sezioni scure) --- */
  --deep: #1f2914;             /* verde notte */
  --deep-ink: #f4f6ee;         /* testo sul verde notte */
  --deep-muted: #aab49c;       /* testo secondario sul verde notte */
  --deep-line: #34402a;        /* linee sul verde notte */
  --deep-accent: #cde26c;      /* pulsanti e dettagli sul verde notte: lime */

  /* --- caratteri --- */
  --font-display: "Host Grotesk", system-ui, sans-serif;
  --font-text: "Host Grotesk", system-ui, sans-serif;
  --font-grassetto: "Satoshi", "Host Grotesk", sans-serif;
  --display-weight: 600;
  --display-tracking: -0.035em;
  --display-stretch: 100%;
  --bold-weight: 900;

  /* --- scala dei testi --- */
  --t-h1: clamp(42px, 5.6vw, 80px);
  --t-h2: clamp(32px, 3.6vw, 52px);
  --t-h3: clamp(22px, 2vw, 28px);
  --t-lead: 19px;
  --t-body: 17px;
  --t-small: 14px;

  /* --- misure --- */
  --wrap: 1200px;
  --gutter: 24px;
  --r-sm: 4px; --r-md: 8px; --r-lg: 14px;
  --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 24px; --s-6: 32px; --s-7: 48px; --s-8: 64px; --s-9: 96px;
  --nav: 64px; --nav-h: 64px;

  /* --- movimento --- */
  --ease: cubic-bezier(.2, .7, .2, 1);
  --m-hover: 150ms;            /* pulsanti e link */
  --m-card: 180ms;             /* schede con link: si alzano di 2px */
  --m-enter: 1100ms;           /* entrata della prima schermata (A1), una volta sola */

  /* nomi usati dai momenti animati del kit (A3, A4, A7, A8) */
  --ground-bg: var(--surface); --p-bg: var(--bg); --p-surface: var(--surface); --p-inv-bg: var(--deep);
}

/* Le sezioni scure: verde notte, testo chiaro, lime per i pulsanti */
.ground-inverse { --bg: var(--deep); --surface: var(--deep); --ink: var(--deep-ink); --muted: var(--deep-muted); --line: var(--deep-line); --accent: var(--deep-accent); background: var(--deep); color: var(--deep-ink); }

/* Grassetti nel testo: Satoshi Black (L0) sopra Host Grotesk */
b, strong { font-family: var(--font-grassetto); font-weight: var(--bold-weight); }

/* ================= componenti del kit (dentro .nfk) ================= */
.nfk { --ground-bg: var(--surface); --p-bg: var(--bg); --p-surface: var(--surface); --p-inv-bg: var(--deep); }
.nfk * { box-sizing: border-box; }
.nfk { scroll-behavior: auto; }
.nfk { margin: 0; background: var(--bg); color: var(--ink); font: 400 17px/1.6 var(--font-text); font-optical-sizing: auto; -webkit-font-smoothing: antialiased; transition: background .3s, color .3s; }
.nfk img { max-width: 100%; display: block; }
.nfk a { color: inherit; }
.nfk h1, .nfk h2, .nfk h3, .nfk h4 { font-family: var(--font-display); font-weight: var(--display-weight); font-stretch: var(--display-stretch); letter-spacing: var(--display-tracking); line-height: 1.08; margin: 0; color: var(--ink); }
.nfk p { margin: 0; }
.nfk .wrap { width: min(var(--wrap), 100% - 48px); margin-inline: auto; }
.nfk .muted { color: var(--muted); }
.nfk .btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; height: 48px; padding: 0 22px; border-radius: 6px; font: 700 16px var(--font-text); text-decoration: none; cursor: pointer; border: 1px solid transparent; transition: transform .15s var(--ease), background-color .15s, color .15s, border-color .15s; }
.nfk .btn--pieno { background: var(--accent); color: var(--accent-ink); }
.nfk .btn--bordo { border-color: var(--ink); color: var(--ink); background: transparent; }
.nfk .f-scuro .btn--pieno { background: var(--deep-accent); color: var(--deep); }
.nfk .f-scuro .btn--bordo { border-color: var(--deep-ink); color: var(--deep-ink); }
@media (hover: hover) and (pointer: fine) {
  .nfk .btn:hover { transform: translateY(-1px); }
  .nfk .btn--pieno:hover { background: color-mix(in srgb, var(--accent) 86%, var(--ink)); }
  .nfk .btn--bordo:hover { background: color-mix(in srgb, var(--ink) 6%, transparent); }
}
.nfk .btn:active { transform: translateY(1px) scale(.985); transition-duration: .09s; }
.nfk .btn-fila { display: flex; flex-wrap: wrap; gap: 12px; }
.nfk .b2 .btn { border-radius: 999px; }
.nfk .btn--freccia { height: auto; padding: 0; background: none; border: 0; color: var(--ink); border-bottom: 2px solid var(--accent); border-radius: 0; padding-bottom: 4px; }
.nfk .btn--freccia svg { width: 18px; height: 18px; transition: transform .15s var(--ease); }
.nfk .btn--freccia:hover { transform: none; }
.nfk .btn--freccia:hover svg { transform: translateX(3px); }
.nfk .btn--blocco { height: 72px; min-width: 320px; justify-content: space-between; padding: 0 26px; border-radius: 0; font-size: 18px; }
.nfk .btn--blocco svg { width: 22px; height: 22px; transition: transform .15s var(--ease); }
.nfk .btn--blocco:hover svg { transform: translateX(4px); }
.nfk .lk { text-decoration: none; background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat, linear-gradient(var(--line-strong), var(--line-strong)) 0 100% / 100% 1px no-repeat; transition: background-size .15s var(--ease); padding-bottom: 1px; }
.nfk .lk:hover { background-size: 100% 1px, 100% 1px; }
.nfk .ico { width: 18px; height: 18px; flex: none; stroke: currentColor; fill: none; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.nfk .t1 { padding: 96px 0; }
.nfk .t1 blockquote { margin: 0; font: var(--display-weight) clamp(26px, 3vw, 40px)/1.25 var(--font-display); letter-spacing: -0.02em; max-width: 980px; min-height: 5.2em; }
.nfk .t1-chi { margin-top: 36px; display: flex; gap: 0; border-top: 1px solid var(--line); }
.nfk .t1-chi button { flex: 1; text-align: left; background: none; border: 0; border-top: 2px solid transparent; margin-top: -1px; padding: 18px 0 0; cursor: pointer; font: 400 15px/1.4 var(--font-text); color: var(--muted); display: flex; gap: 14px; align-items: center; }
.nfk .t1-chi button img { width: 44px; height: 44px; object-fit: contain; filter: grayscale(1); opacity: .7; transition: filter .2s, opacity .2s; }
.nfk .t1-chi button strong { display: block; color: var(--ink); font-size: 16px; }
.nfk .t1-chi button[aria-selected="true"] { border-top-color: var(--ink); }
.nfk .t1-chi button[aria-selected="true"] img { filter: none; opacity: 1; }
.nfk .t1-fonte { margin-top: 28px; font-size: 15px; color: var(--muted); }
.nfk .campi { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.nfk .campi .largo { grid-column: 1 / -1; }
.nfk .campo label { display: block; font-size: 14px; font-weight: 700; margin-bottom: 6px; }
.nfk .campo input, .nfk .campo select, .nfk .campo textarea { width: 100%; font: 400 16px var(--font-text); color: var(--ink); background: var(--bg); border: 1px solid var(--line-strong); border-radius: 6px; padding: 12px 14px; transition: border-color .14s, box-shadow .14s; }
.nfk .campo textarea { min-height: 120px; resize: vertical; }
.nfk .campo input:focus, .nfk .campo select:focus, .nfk .campo textarea:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent); }
.nfk .m2 .campo input, .nfk .m2 .campo select, .nfk .m2 .campo textarea { border: 0; border-bottom: 1px solid var(--line-strong); border-radius: 0; padding: 10px 0; background: transparent; }
.nfk .m2 .campo input:focus, .nfk .m2 .campo textarea:focus, .nfk .m2 .campo select:focus { box-shadow: 0 1px 0 0 var(--accent); }
.nfk .spunta { display: flex; gap: 10px; font-size: 14px; color: var(--muted); align-items: flex-start; }
.nfk .spunta input { width: 18px; height: 18px; margin-top: 2px; accent-color: var(--accent); }
.nfk .f2 h4 { font: 700 14px var(--font-text); color: var(--muted); letter-spacing: 0; margin-bottom: 14px; }
.nfk .f2 ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 9px; font-size: 15px; }
.nfk .f-lk { text-decoration: none; background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size .15s var(--ease); }
.nfk .f-lk:hover { background-size: 100% 1px; }
.nfk .f-legale { margin-top: 40px; display: flex; justify-content: space-between; gap: 20px; font-size: 13px; color: var(--muted); }
.nfk .f-legale a { color: inherit; }
.nfk .f2 { background: var(--deep); color: var(--deep-ink); padding: 80px 0 0; overflow: hidden; }
.nfk .f2-alto { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1fr; gap: 40px; }
.nfk .f2 h4 { color: var(--deep-muted); }
.nfk .f2 .f2-frase { font: var(--display-weight) 30px/1.15 var(--font-display); letter-spacing: -0.02em; max-width: 380px; color: var(--deep-ink); }
.nfk .f2 .f2-frase + p { margin-top: 18px; color: var(--deep-muted); font-size: 15px; }
.nfk .f2 .f2-frase + p a { color: var(--deep-ink); }
.nfk .f2-firma { margin-top: 80px; font: var(--display-weight) clamp(70px, 15.5vw, 236px)/0.78 var(--font-display); letter-spacing: -0.055em; color: var(--deep-ink); white-space: nowrap; transform: translateY(8%); }
.nfk .f2-firma span { color: var(--deep-accent); }
.nfk .f2 .f-legale { color: var(--deep-muted); margin-top: 48px; }
.nfk .comp-riga { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; padding: 40px; }
.nfk .comp-due { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; padding: 40px; }
.nfk .s2 { padding: 40px; }
.nfk .s2 table { width: 100%; border-collapse: collapse; font-size: 16px; }
.nfk .s2 th { text-align: left; font-size: 14px; color: var(--muted); padding: 0 12px 12px 0; border-bottom: 1px solid var(--ink); }
.nfk .s2 th:not(:first-child):not(:nth-child(2)), .nfk .s2 td:not(:first-child):not(:nth-child(2)) { text-align: center; width: 90px; }
.nfk .s2 td { padding: 16px 12px 16px 0; border-bottom: 1px solid var(--line); vertical-align: top; }
.nfk .s2 td:first-child { font-weight: var(--bold-weight); width: 26%; }
.nfk .s2 td:nth-child(2) { color: var(--muted); }
.nfk .s2 .si { color: var(--brand); font-weight: var(--bold-weight); }
.nfk .s3 { display: grid; grid-template-columns: 7fr 5fr; gap: 56px; padding: 48px 40px; align-items: center; }
.nfk .s3 .schermo { border-radius: 10px; border: 1px solid var(--line); overflow: hidden; background: var(--surface); }
.nfk .s3 .schermo img { width: 100%; }
.nfk .s3 h4 { font-size: 32px; }
.nfk .s3 ul { list-style: none; padding: 0; margin: 22px 0 0; }
.nfk .s3 li { padding: 14px 0; border-top: 1px solid var(--line); font-size: 16px; }
.nfk .s3 li b { display: block; }
.nfk .s3 li span { color: var(--muted); }
.nfk .k1 { padding: 96px 40px; }
.nfk .k1 h3 { font-size: clamp(36px, 4.6vw, 64px); max-width: 900px; }
.nfk .k1 p { margin-top: 18px; color: var(--muted); font-size: 19px; max-width: 620px; }
.nfk .k1 .btn-fila { margin-top: 32px; }
.nfk .an h2 { font-size: var(--t-h2); }
.nfk .an-nota { margin-top: 10px; color: var(--muted); max-width: 640px; }
.nfk .a1-hero { padding: 96px 40px 104px; text-align: left; }
.nfk .a1-hero h3 { font-size: clamp(42px, 5.4vw, 76px); max-width: 900px; }
.nfk .a1-hero p { margin-top: 22px; max-width: 620px; font-size: 19px; color: var(--muted); }
.nfk .a1-hero .btn-fila { margin-top: 30px; }
.nfk .a1-riga { display: block; overflow: hidden; padding-bottom: .06em; }
.nfk .a1-riga > span { display: inline-block; }
.nfk .a1-gioca .a1-riga > span { animation: a1-sale .7s var(--ease) both; }
.nfk .a1-gioca .a1-riga:nth-child(2) > span { animation-delay: .08s; }
.nfk .a1-gioca .a1-riga:nth-child(3) > span { animation-delay: .16s; }
.nfk .a1-gioca .a1-dopo { animation: a1-dopo .52s var(--ease) both; }
.nfk .a1-gioca .a1-dopo:nth-of-type(1) { animation-delay: .45s; }
.nfk .a1-gioca .btn-fila.a1-dopo { animation-delay: .55s; }
.nfk .a1-gioca .a1-img { animation: a1-img 1.1s var(--ease) both; }
@keyframes a1-sale { from { transform: translateY(105%); } to { transform: none; } }
@keyframes a1-dopo { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@keyframes a1-img { from { transform: scale(.98); } to { transform: none; } }
.nfk .a1-ancora { margin-top: 18px; font: 700 14px var(--font-text); background: none; border: 1px solid var(--line-strong); border-radius: 6px; padding: 8px 14px; cursor: pointer; color: var(--ink); }
.nfk .mo-wh__text { font: var(--display-weight) clamp(30px, 3.6vw, 52px)/1.2 var(--font-display); letter-spacing: -0.02em; max-width: 1000px; }
.nfk .mo-la__type { font-size: clamp(48px, 8vw, 120px); }
.nfk .mo-la__sub { margin-top: 18px; color: var(--muted); font-size: 19px; }
.nfk .t-stat { font: var(--display-weight) clamp(44px, 5vw, 72px)/1 var(--font-display); letter-spacing: -0.03em; }
.nfk .a4-griglia { display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; margin-top: 48px; border-top: 1px solid var(--line); padding-top: 32px; }
.nfk .a4-griglia p.small { color: var(--muted); margin-top: 8px; font-size: 15px; }
.nfk .a6-griglia { display: grid; grid-template-columns: 1.2fr 1fr; gap: 56px; align-items: center; }
.nfk .a6-griglia p { color: var(--deep-muted); margin-top: 16px; font-size: 18px; }
.nfk .a6-griglia ul { margin: 20px 0 0; padding: 0; list-style: none; }
.nfk .a6-griglia li { padding: 12px 0; border-top: 1px solid var(--deep-line); }
.nfk .mo-pc__step h3 { font-size: 26px; }
.nfk .mo-pc__step p { color: var(--muted); margin-top: 8px; }
.nfk .mo-pc__visual .viva { width: 100%; }
.nfk .mo-pc__visual .viva img { width: auto; height: auto; object-fit: contain; }
.nfk .mo-pc__visual .vv-lato img { width: 128px; }
.nfk .mo-pc__visual.tel-visual .viva { width: 46%; margin: 0 auto; }
.nfk .mo-pc__visual img { width: 100%; height: 100%; object-fit: cover; object-position: top left; }
.nfk .an h2.mo-la__type { font-size: clamp(48px, 8vw, 120px); }
.nfk .loop-pause { position: absolute; right: 12px; bottom: 12px; z-index: 6; display: grid; place-items: center; width: 32px; height: 32px; padding: 0; border-radius: 50%; cursor: pointer; border: 1px solid color-mix(in oklab, var(--ink) 16%, transparent); background: var(--bg); color: var(--ink); box-shadow: 0 1px 2px rgb(0 0 0 / .12), 0 4px 12px -4px rgb(0 0 0 / .28); }
.nfk .loop-pause svg { width: 14px; height: 14px; fill: currentColor; }
.nfk .mo-mq__track li { font: var(--display-weight) clamp(28px, 3vw, 44px) var(--font-display); letter-spacing: -0.02em; color: var(--ink); }
.nfk .a10-griglia { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 48px; }
.nfk .a10-griglia > div { border: 1px solid var(--line); border-radius: 12px; padding: 28px; }
.nfk .a10-griglia h4 { font-size: 20px; }
.nfk .a10-griglia p { color: var(--muted); margin-top: 8px; font-size: 15px; }
.nfk .a10 .a10-el { opacity: 0; transform: translateY(40px); transition: opacity .8s var(--ease), transform .8s var(--ease); }
.nfk .a10 .a10-el.visto { opacity: 1; transform: none; }
.nfk .btn--diviso { padding: 0; gap: 0; overflow: hidden; border-radius: 6px; }
.nfk .btn--diviso > span:first-child { padding: 0 22px; }
.nfk .btn--diviso > span:last-child { width: 48px; height: 100%; display: grid; place-items: center; border-left: 1px solid color-mix(in srgb, currentColor 25%, transparent); transition: background .15s; }
.nfk .btn--diviso:hover > span:last-child { background: color-mix(in srgb, currentColor 12%, transparent); }
.nfk .btn--diviso svg { transition: transform .15s var(--ease); }
.nfk .btn--diviso:hover svg { transform: translateX(3px); }
.nfk .m4 .campo { position: relative; }
.nfk .m4 .campo input { padding: 22px 14px 8px; }
.nfk .m4 .campo label { position: absolute; left: 15px; top: 15px; margin: 0; font-weight: 400; color: var(--muted); font-size: 16px; pointer-events: none; transition: transform .15s var(--ease), font-size .15s, color .15s; transform-origin: 0 0; }
.nfk .m4 .campo input:focus + label, .nfk .m4 .campo input:not(:placeholder-shown) + label { transform: translateY(-9px); font-size: 12px; font-weight: 700; color: var(--accent); }
.nfk .k4 { background: var(--spot); color: #1b1f17; padding: 88px 48px; display: grid; grid-template-columns: 1.4fr 1fr; gap: 40px; align-items: end; }
.nfk .k4 h3 { font-size: clamp(38px, 5vw, 72px); color: #1b1f17; }
.nfk .k4 p { font-size: 18px; color: #2b2f22; }
.nfk .k4 .btn { background: #1b1f17; color: #fff; margin-top: 22px; }
.nfk .k4 .btn:hover { background: #000; }
.nfk .a11-palco { margin-top: 56px; transform-origin: 50% 0; will-change: transform; }
@media (max-width: 900px) {
  .nfk .k4 { grid-template-columns: 1fr; }
  .nfk .k4 { padding: 56px 24px; }
}
@media (max-width: 900px) {
  .nfk .f2-alto, .nfk .s3, .nfk .a6-griglia, .nfk .comp-due { grid-template-columns: 1fr; }
  .nfk .a4-griglia { grid-template-columns: 1fr 1fr; }
  .nfk .a10-griglia { grid-template-columns: 1fr; }
  .nfk .campi { grid-template-columns: 1fr; }
  .nfk .btn--blocco { min-width: 0; width: 100%; }
  .nfk .s2 { overflow-x: auto; }
}
@media (prefers-reduced-motion: reduce) {
  .nfk .a1-gioca *, .nfk .a10 .a10-el { animation: none !important; transition: none !important; opacity: 1 !important; transform: none !important; }
}
.nfk .a13 .wrap { position: relative; z-index: 4; padding-top: 18vh; }
.nfk .a14 .wrap { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
.nfk .a16 .wrap { overflow: visible; }
.nfk .a17 { height: 100vh; background: var(--deep); position: relative; overflow: hidden; display: flex; align-items: center; justify-content: center; }
.nfk .a17-titolo { position: absolute; top: 12vh; left: 0; right: 0; text-align: center; z-index: 2; color: var(--deep-ink); font-size: clamp(32px, 4vw, 56px); }
.nfk .a17-zoom { width: min(1200px, 92vw); overflow: hidden; transform-origin: 50% 60%; box-shadow: 0 40px 80px -30px #000a; }
.nfk .a19 { padding: 120px 0; overflow: hidden; }
.nfk .a19-riga { white-space: nowrap; font-family: var(--font-display); font-weight: var(--display-weight); font-stretch: var(--display-stretch); letter-spacing: var(--display-tracking); font-size: clamp(56px, 9vw, 140px); line-height: 1.05; }
.nfk .a19-riga span { margin-right: .5em; }
.nfk .a19-riga.vuota span { color: transparent; -webkit-text-stroke: 1.5px var(--ink); }
.nfk .a21 h2.mo-lt__type, .nfk .a21 .mo-lt__type { font-size: clamp(64px, 11vw, 170px); line-height: .95; }
@media (max-width: 900px) {
  .nfk .a14 .wrap { grid-template-columns: 1fr; gap: 24px; }
}
@keyframes t5n { to { transform: translateX(-50%); } }
@keyframes c2w-ok { from { transform: scale(0); } }
.nfk .d5f { padding: 40px; }
.nfk .d5f-voce { border-top: 1px solid var(--line); }
.nfk .d5f-voce:last-child { border-bottom: 1px solid var(--line); }
.nfk .d5f-voce button { width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 24px; background: none; border: 0; color: var(--ink); text-align: left; padding: 26px 0; cursor: pointer; font: var(--display-weight) clamp(22px, 2.6vw, 36px)/1.15 var(--font-display); letter-spacing: var(--display-tracking); font-stretch: var(--display-stretch); }
.nfk .d5f-voce button i { width: 44px; height: 44px; flex: none; border-radius: 50%; border: 1px solid var(--line-strong); position: relative; transition: transform .35s var(--ease), background .2s, border-color .2s; }
.nfk .d5f-voce button i::before, .nfk .d5f-voce button i::after { content: ""; position: absolute; left: 50%; top: 50%; width: 14px; height: 2px; background: currentColor; transform: translate(-50%, -50%); }
.nfk .d5f-voce button i::after { transform: translate(-50%, -50%) rotate(90deg); }
.nfk .d5f-voce.aperta button i { transform: rotate(45deg); background: var(--ink); color: var(--bg); border-color: var(--ink); }
.nfk .d5f-risp { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .4s var(--ease); }
.nfk .d5f-voce.aperta .d5f-risp { grid-template-rows: 1fr; }
.nfk .d5f-risp > div { overflow: hidden; }
.nfk .d5f-risp p { color: var(--muted); font-size: 18px; max-width: 760px; padding-bottom: 28px; }
.nfk .f7 { background: var(--deep); color: var(--deep-ink); padding: 88px 0 28px; overflow: hidden; }
.nfk .f7-alto { display: flex; justify-content: space-between; align-items: end; gap: 32px; flex-wrap: wrap; }
.nfk .f7-alto h3 { color: var(--deep-ink); font-size: clamp(34px, 4.4vw, 60px); max-width: 760px; }
.nfk .f7 .btn--pieno { background: var(--deep-accent); color: var(--deep); }
.nfk .f7-nastro { margin: 72px 0 56px; display: flex; width: max-content; animation: t5n 30s linear infinite; }
.nfk .f7-nastro span { display: flex; align-items: center; gap: .35em; padding-right: .35em; white-space: nowrap; font: var(--display-weight) clamp(80px, 12vw, 190px)/1 var(--font-display); letter-spacing: -0.04em; font-stretch: var(--display-stretch); color: var(--deep-ink); }
.nfk .f7-nastro span em { font-style: normal; color: var(--deep-muted); }
.nfk .f7-nastro svg { width: .42em; height: .42em; fill: var(--deep-accent); flex: none; }
.nfk .f7-colonne { display: grid; grid-template-columns: 1.4fr repeat(3, 1fr); gap: 32px; padding-top: 32px; border-top: 1px solid var(--deep-line); }
.nfk .f7-colonne h4 { font: 700 14px var(--font-text); color: var(--deep-muted); margin-bottom: 12px; }
.nfk .f7-colonne ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; font-size: 15px; }
.nfk .f7-colonne p { color: var(--deep-muted); font-size: 15px; }
.nfk .f7 .f-legale { color: var(--deep-muted); }
.nfk .a14f { padding: 120px 0; }
.nfk .a14f-frase { font: var(--display-weight) clamp(40px, 5.6vw, 84px)/1.08 var(--font-display); letter-spacing: var(--display-tracking); font-stretch: var(--display-stretch); }
.nfk .a14f-frase .grigio { color: var(--muted); }
.nfk .a14f-parola { display: inline-grid; overflow: hidden; vertical-align: bottom; color: var(--brand); }
.nfk .a14f-parola > span { grid-area: 1 / 1; transition: transform .55s var(--ease), opacity .4s; }
.nfk .a14f-parola > span.via { transform: translateY(-105%); opacity: 0; }
.nfk .a14f-parola > span.dopo { transform: translateY(105%); opacity: 0; }
.nfk .a14f-tipi { display: flex; flex-wrap: wrap; gap: 6px 28px; margin-top: 28px; }
.nfk .a14f-tipi button { background: none; border: 0; padding: 4px 0; font: 500 18px var(--font-text); color: var(--muted); cursor: pointer; border-bottom: 2px solid transparent; transition: color .2s, border-color .2s; }
.nfk .a14f-tipi button[aria-pressed="true"] { color: var(--ink); border-bottom-color: var(--ink); }
.nfk .a14f-palco { position: relative; margin-top: 48px; }
.nfk .a14f-palco > div { transition: opacity .5s var(--ease), transform .5s var(--ease); }
.nfk .a14f-palco > div:not(.ora) { position: absolute; inset: 0 0 auto 0; opacity: 0; transform: translateY(16px); pointer-events: none; }
.nfk .a14f-palco .tel-palco { max-width: 300px; margin: 0 auto; }
.nfk .a15s { padding: 120px 0; }
.nfk .a15s-righe { margin-top: 40px; border-top: 1px solid var(--line); }
.nfk .a15s-righe div { display: grid; grid-template-columns: 1.1fr 1fr; gap: 32px; align-items: baseline; padding: 26px 0; border-bottom: 1px solid var(--line); }
.nfk .a15s-righe b { font: var(--display-weight) clamp(40px, 6vw, 92px)/1 var(--font-display); letter-spacing: var(--display-tracking); font-stretch: var(--display-stretch); font-variant-numeric: tabular-nums; white-space: nowrap; }
.nfk .a15s-righe span { color: var(--muted); font-size: 18px; }
@media (max-width: 900px) {
  .nfk .f7-colonne { grid-template-columns: 1fr; }
  .nfk .a15s-righe div { grid-template-columns: 1fr; gap: 6px; }
}
@media (prefers-reduced-motion: reduce) {
  .nfk .f7-nastro { animation: none; flex-wrap: wrap; width: auto; }
}
.nfk .pf-form { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 14px; }
.nfk .pf-form .largo { grid-column: 1 / -1; }
.nfk .pf-campo label { display: flex; justify-content: space-between; font-size: 14px; font-weight: 600; color: var(--ink); margin-bottom: 6px; }
.nfk .pf-campo label small { font-weight: 400; color: var(--muted); }
.nfk .pf-campo input, .nfk .pf-campo select, .nfk .pf-campo textarea { width: 100%; height: 48px; font: 400 16px var(--font-text); color: var(--ink); background: var(--bg); border: 1px solid var(--line-strong); border-radius: 8px; padding: 0 14px; transition: border-color .15s, box-shadow .15s; appearance: none; -webkit-appearance: none; }
.nfk .pf-campo textarea { height: 112px; padding: 12px 14px; resize: vertical; }
.nfk .pf-campo select { background-image: linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(-45deg, transparent 50%, var(--muted) 50%); background-position: right 19px top 21px, right 14px top 21px; background-size: 5px 5px; background-repeat: no-repeat; padding-right: 36px; cursor: pointer; }
.nfk .pf-campo input:hover, .nfk .pf-campo select:hover, .nfk .pf-campo textarea:hover { border-color: color-mix(in srgb, var(--ink) 45%, var(--line-strong)); }
.nfk .pf-campo input:focus, .nfk .pf-campo select:focus, .nfk .pf-campo textarea:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 20%, transparent); }
.nfk .pf-campo.errore input, .nfk .pf-campo.errore select { border-color: #c4372d; box-shadow: 0 0 0 3px #c4372d22; }
.nfk .pf-campo .msg { display: none; font-size: 13px; color: #c4372d; margin-top: 6px; }
.nfk .pf-campo.errore .msg { display: block; }
.nfk .pf-privacy { font-size: 13px; color: var(--muted); display: flex; gap: 10px; align-items: flex-start; line-height: 1.5; }
.nfk .pf-privacy input { width: 18px; height: 18px; margin-top: 1px; accent-color: var(--accent); flex: none; }
.nfk .pf-privacy a { color: var(--ink); }
.nfk .pf-invia { width: 100%; height: 52px; border: 0; border-radius: 8px; background: var(--accent); color: var(--accent-ink); font: 700 16px var(--font-text); display: flex; align-items: center; justify-content: center; gap: 10px; cursor: pointer; transition: background .15s, transform .15s var(--ease); }
.nfk .pf-invia:hover { background: color-mix(in srgb, var(--accent) 86%, var(--ink)); }
.nfk .pf-invia:active { transform: scale(.99); }
.nfk .pf-invia .ico { width: 18px; height: 18px; transition: transform .15s var(--ease); }
.nfk .pf-invia:hover .ico { transform: translateX(3px); }
.nfk .pf-nota { font-size: 13px; color: var(--muted); text-align: center; }
.nfk .pf-fatto { display: none; text-align: center; padding: 40px 10px; }
.nfk .pf-fatto .ok { width: 60px; height: 60px; margin: 0 auto 18px; border-radius: 50%; background: var(--accent); color: var(--accent-ink); display: grid; place-items: center; font-size: 26px; animation: c2w-ok .5s cubic-bezier(.3,1.6,.5,1); }
.nfk .pf-fatto h4 { font-size: 26px; }
.nfk .pf-fatto p { color: var(--muted); margin-top: 8px; }
.nfk [data-modulo].inviato .pf-form { display: none; }
.nfk [data-modulo].inviato .pf-fatto { display: block; }
.nfk .pc1 { display: grid; grid-template-columns: 1fr 1.05fr; gap: 64px; padding: 80px 56px; background: var(--surface); align-items: start; }
.nfk .pc1-testo h3 { font-size: clamp(36px, 4vw, 56px); }
.nfk .pc1-testo > p { color: var(--muted); font-size: 19px; margin-top: 16px; max-width: 520px; }
.nfk .pc1-passi { margin-top: 36px; border-top: 1px solid var(--line-strong); }
.nfk .pc1-passi div { display: grid; grid-template-columns: 26px 1fr; gap: 14px; padding: 18px 0; border-bottom: 1px solid var(--line-strong); }
.nfk .pc1-passi .ico { width: 22px; height: 22px; color: var(--brand); margin-top: 2px; }
.nfk .pc1-passi b { display: block; font-size: 17px; }
.nfk .pc1-passi span { color: var(--muted); font-size: 15px; }
.nfk .pc1-fiducia { margin-top: 36px; }
.nfk .pc1-fiducia p { font-size: 14px; color: var(--muted); }
.nfk .pc1-fiducia p b { color: var(--ink); }
.nfk .pc1-loghi { display: flex; flex-wrap: wrap; gap: 22px; align-items: center; margin-top: 16px; }
.nfk .pc1-loghi img { height: 34px; width: auto; filter: grayscale(1); opacity: .65; mix-blend-mode: multiply; }
.nfk .pc1-scheda { background: var(--bg); border-radius: 16px; padding: 32px; box-shadow: 0 0 0 1px var(--line), 0 30px 60px -32px #00000040; display: grid; gap: 22px; }
.nfk .pc1-scheda h4 { font-size: 22px; }
.nfk .pc2-corpo .btn { width: 100%; }
.nfk .pc4 { display: grid; grid-template-columns: 1fr 1fr; min-height: 640px; }
.nfk .pc4-sx { background: var(--deep); color: var(--deep-ink); padding: 64px 56px; display: flex; flex-direction: column; justify-content: space-between; gap: 40px; }
.nfk .pc4-sx h3 { color: var(--deep-ink); font-size: clamp(40px, 4.6vw, 68px); }
.nfk .pc4-num a { display: block; text-decoration: none; color: var(--deep-ink); font: var(--display-weight) clamp(32px, 3.4vw, 48px)/1.1 var(--font-display); letter-spacing: var(--display-tracking); font-stretch: var(--display-stretch); transition: color .2s; width: fit-content; }
.nfk .pc4-num a:hover { color: var(--deep-accent); }
.nfk .pc4-num small { display: block; color: var(--deep-muted); font-size: 14px; margin: 4px 0 20px; }
.nfk .pc4-voto { display: flex; align-items: center; gap: 14px; padding-top: 22px; border-top: 1px solid var(--deep-line); font-size: 15px; color: var(--deep-muted); }
.nfk .pc4-voto b { font: var(--display-weight) 34px/1 var(--font-display); color: var(--deep-ink); }
.nfk .pc4-dx { padding: 56px; display: grid; gap: 22px; align-content: center; }
.nfk .pc4-dx h4 { font-size: 24px; }
.nfk .pc4-seg { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); background: var(--surface); border-radius: 10px; padding: 4px; }
.nfk .pc4-seg button { position: relative; z-index: 1; border: 0; background: none; font: 600 15px var(--font-text); color: var(--muted); padding: 11px 6px; cursor: pointer; transition: color .2s; }
.nfk .pc4-seg button[aria-pressed="true"] { color: var(--ink); }
.nfk .pc4-seg i { position: absolute; top: 4px; bottom: 4px; left: 4px; width: calc((100% - 8px) / 3); background: var(--bg); border-radius: 7px; box-shadow: 0 1px 3px #0000001f, 0 0 0 1px var(--line); transition: transform .35s var(--ease); }
.nfk .pc4-dove { font-size: 14px; color: var(--muted); margin-top: -8px; }
.nfk .pc4-dove b { color: var(--ink); }
.nfk .pf-fluttua .pf-campo { position: relative; }
.nfk .pf-fluttua .pf-campo input, .nfk .pf-fluttua .pf-campo textarea { height: 56px; padding: 22px 14px 6px; }
.nfk .pf-fluttua .pf-campo textarea { height: 110px; padding-top: 26px; }
.nfk .pf-fluttua .pf-campo label { position: absolute; left: 15px; top: 17px; margin: 0; font-weight: 400; color: var(--muted); pointer-events: none; transition: transform .15s var(--ease), font-size .15s, color .15s; transform-origin: 0 0; }
.nfk .pf-fluttua .pf-campo input:focus + label, .nfk .pf-fluttua .pf-campo input:not(:placeholder-shown) + label, .nfk .pf-fluttua .pf-campo textarea:focus + label, .nfk .pf-fluttua .pf-campo textarea:not(:placeholder-shown) + label { transform: translateY(-10px); font-size: 12px; font-weight: 600; color: var(--accent); }
@media (max-width: 900px) {
  .nfk .pc1, .nfk .pc4 { grid-template-columns: 1fr; padding: 40px 20px; gap: 32px; }
  .nfk .pc4 { padding: 0; }
  .nfk .pc4-sx, .nfk .pc4-dx { padding: 36px 20px; }
  .nfk .pf-form { grid-template-columns: 1fr; }
}
.nfk .pc1-passi b { color: var(--bold, inherit); }
.nfk .arm-barra .wrap { display: flex; flex-wrap: wrap; gap: 10px 22px; align-items: center; padding: 12px 0; font-size: 14px; }
.nfk .arm-hero .btn-fila { justify-content: center; margin-top: 30px; }
.nfk .arm-pagina .s3 { padding-left: 0; padding-right: 0; }
.nfk .arm-pagina .pc1 { padding: 0; background: transparent; }
.nfk .t1-tp { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; margin-top: 34px; padding: 18px 22px; border: 1px solid var(--line); border-radius: 12px; text-decoration: none; color: var(--ink); background: var(--bg); width: fit-content; transition: border-color .2s, transform .2s var(--ease), box-shadow .25s; }
.nfk .t1-tp:hover { border-color: var(--ink); transform: translateY(-2px); box-shadow: 0 18px 36px -24px #0005; }
.nfk .t1-tp img { height: 30px; width: auto; }
.nfk .t1-tp-voto { font: var(--display-weight) 44px/1 var(--font-display); letter-spacing: -0.03em; }
.nfk .t1-tp-voto small { font-size: 18px; color: var(--muted); }
.nfk .t1-tp-testo { font-size: 14px; color: var(--muted); line-height: 1.35; }
.nfk .t1-tp-vai { display: inline-flex; gap: 8px; align-items: center; font-weight: 700; font-size: 15px; padding-left: 22px; border-left: 1px solid var(--line); }
.nfk .t1-tp-vai .ico { transition: transform .15s var(--ease); }
.nfk .t1-tp:hover .t1-tp-vai .ico { transform: translateX(3px); }
.nfk .t0 { padding: 80px 0; }
.nfk .t0-titolo { text-align: center; max-width: 760px; margin: 0 auto 48px; }
.nfk .t0-titolo h3 { font-size: clamp(30px, 3.4vw, 46px); }
.nfk .t0-titolo p { margin-top: 12px; color: var(--muted); font-size: 18px; }
.nfk .nfc-recensioni { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); }
.nfk .nfc-recensioni > div { padding: 28px 28px 28px 0; display: flex; flex-direction: column; justify-content: space-between; gap: 22px; }
.nfk .nfc-recensioni > div + div { padding-left: 28px; border-left: 1px solid var(--line); }
.nfk .nfc-recensioni p { margin: 10px 0 0; font-size: 16px; line-height: 1.6; color: var(--muted); }
.nfk .nfc-stelle { color: #c5bb28; letter-spacing: 2px; font-size: 16px; }
.nfk .nfc-autore { display: flex; align-items: center; gap: 14px; }
.nfk .nfc-autore img { width: 52px; height: 52px; border-radius: 50%; object-fit: contain; background: #fff; border: 1px solid var(--line); }
.nfk .nfc-autore strong { display: block; }
.nfk .nfc-autore small { color: var(--muted); }
.nfk .nf-clienti { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 26px 40px; margin-top: 60px; padding-top: 40px; border-top: 1px solid var(--line); }
.nfk .nf-clienti img { width: 64px; height: 64px; border-radius: 50%; object-fit: contain; filter: grayscale(1); opacity: .75; transition: filter .3s, opacity .3s; }
.nfk .nf-clienti img:hover { filter: none; opacity: 1; }
.nfk .nf-clienti p { width: 100%; text-align: center; margin: 0 0 4px; font-size: 15px; color: var(--muted); }
@media (max-width: 900px) {
  .nfk .nfc-recensioni { grid-template-columns: 1fr; }
  .nfk .nfc-recensioni > div + div { padding-left: 0; border-left: 0; border-top: 1px solid var(--line); }
  .nfk .t1-tp-vai { padding-left: 0; border-left: 0; }
}

/* ================= schermate vive di Extravirgin ================= */
.viva { position: relative; width: 100%; overflow: hidden; }
.viva-scala { position: absolute; top: 0; left: 0; transform-origin: 0 0; font-family: "Poppins", system-ui, sans-serif; color: #1b1f17; -webkit-font-smoothing: antialiased; }
.viva-scala * { box-sizing: border-box; }
.viva-scala b { font-weight: 600; }

/* finestra del browser */
.vv-fin { width: 100%; height: 100%; background: #eef1f4; border-radius: 12px; overflow: hidden; box-shadow: 0 0 0 1px #0000001a, 0 30px 60px -30px #0006; display: flex; flex-direction: column; }
.vv-barra { height: 34px; flex: none; background: #f7f7f5; border-bottom: 1px solid #e3e3df; display: flex; align-items: center; gap: 6px; padding: 0 12px; }
.vv-barra i { width: 10px; height: 10px; border-radius: 50%; background: #dcdcd6; }
.vv-barra span { margin: 0 auto; transform: translateX(-24px); font-size: 11px; color: #7a7d75; background: #ececE8; border-radius: 6px; padding: 3px 14px; }
.vv-corpo { flex: 1; display: flex; min-height: 0; }
.vv-lato { width: 196px; flex: none; background: linear-gradient(180deg, #2f4420, #1f2d16); color: #e8eedf; padding: 18px 10px; display: flex; flex-direction: column; }
.vv-lato img { width: 128px; margin: 4px auto 22px; display: block; }
.vv-lato small { font-size: 9px; letter-spacing: .12em; color: #a7b39a; padding: 0 10px; margin-bottom: 8px; }
.vv-voce { font-size: 13px; padding: 9px 10px; border-radius: 8px; display: flex; justify-content: space-between; color: #e8eedf; }
.vv-voce.sel { background: #6f9a2e; font-weight: 600; }
.vv-voce::after { content: "⌄"; opacity: .6; font-size: 11px; }
.vv-voce.sel::after { content: ""; }
.vv-main { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.vv-top { height: 46px; flex: none; background: #fff; border-bottom: 1px solid #e3e6e9; display: flex; align-items: center; justify-content: space-between; padding: 0 18px; font-size: 13px; }
.vv-utente { display: flex; align-items: center; gap: 8px; font-weight: 600; }
.vv-utente i { width: 24px; height: 24px; border-radius: 50%; background: #34501f; color: #fff; font: 600 9px/24px "Poppins"; text-align: center; font-style: normal; }
.vv-pag { padding: 18px 20px; flex: 1; min-height: 0; position: relative; }
.vv-titolo { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.vv-titolo h5 { margin: 0; font: 700 17px "Poppins"; letter-spacing: 0; color: #1b1f17; }
.vv-titolo h5 small { font-weight: 400; color: #8a8f86; font-size: 12px; margin-left: 6px; }
.vv-btn { font: 600 11px "Poppins"; letter-spacing: .04em; text-transform: uppercase; border: 1px solid #cfd5cb; background: #fff; border-radius: 8px; padding: 7px 12px; display: inline-flex; gap: 6px; align-items: center; transition: transform .12s, background .2s; }
.vv-btn.pieno { background: #6f9a2e; border-color: #6f9a2e; color: #fff; }
.vv-btn.premuto { transform: scale(.94); background: #5b8224; }

/* dashboard */
.vv-tessere { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.vv-tessera { border-radius: 12px; padding: 14px 16px 16px; color: #fff; transition: box-shadow .3s, transform .3s; }
.vv-tessera span { font-size: 13px; font-weight: 500; }
.vv-tessera strong { display: block; font: 700 26px "Poppins"; letter-spacing: -.01em; margin-top: 6px; font-variant-numeric: tabular-nums; }
.vv-tessera em { display: inline-block; margin-top: 8px; font-style: normal; font-size: 10.5px; border: 1px solid #ffffffa0; border-radius: 99px; padding: 2px 9px; }
.vv-tessera.olio { background: #8cc43a; } .vv-tessera.olive { background: #0a7f0a; } .vv-tessera.sansa { background: #e8c200; }
.vv-tessera.scatto { transform: translateY(-3px); box-shadow: 0 0 0 3px #fff, 0 0 0 5px #0a7f0a; }
.vv-sotto { margin: 18px 0 10px; font-size: 14px; font-weight: 600; }
.vv-riep { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.vv-riep div { background: #fff; border-radius: 10px; border-top: 3px solid #6f9a2e; padding: 12px; display: flex; justify-content: space-between; align-items: center; font-size: 11.5px; box-shadow: 0 1px 3px #0000000f; }
.vv-riep div:nth-child(even) { border-top-color: #2c2c2c; }
.vv-riep b { font-size: 15px; font-weight: 700; font-variant-numeric: tabular-nums; }
.vv-grafico { margin-top: 14px; background: #fff; border-radius: 10px; padding: 12px 14px; box-shadow: 0 1px 3px #0000000f; }
.vv-grafico small { font-size: 11px; color: #6b7066; }
.vv-barre { display: flex; align-items: flex-end; gap: 8px; height: 88px; margin-top: 8px; }
.vv-barre i { flex: 1; background: #d9e8c4; border-radius: 4px 4px 0 0; height: 4%; transition: height .9s cubic-bezier(.2,.7,.2,1); }
.vv-barre i.oggi { background: #6f9a2e; }

/* avviso che scende (come il toast di Hustlo) */
.vv-avviso { position: absolute; top: 12px; left: 50%; transform: translate(-50%, -140%); opacity: 0; background: #1b2412; color: #f2f5ec; border-radius: 12px; padding: 11px 16px; display: flex; gap: 11px; align-items: center; font-size: 12px; box-shadow: 0 16px 34px -12px #0008; transition: transform .45s cubic-bezier(.2,.8,.2,1), opacity .3s; z-index: 5; white-space: nowrap; }
.vv-avviso.su { transform: translate(-50%, 0); opacity: 1; }
.vv-avviso i { width: 26px; height: 26px; border-radius: 50%; background: #6f9a2e; display: grid; place-items: center; font-style: normal; font-size: 14px; flex: none; }
.vv-avviso small { display: block; color: #aab49c; font-size: 11px; }

/* cursore */
.vv-cursore { position: absolute; top: 0; left: 0; width: 22px; height: 22px; z-index: 6; transition: transform .9s cubic-bezier(.45,.05,.2,1); pointer-events: none; filter: drop-shadow(0 2px 3px #0005); }
.vv-cursore::after { content: ""; position: absolute; left: -9px; top: -9px; width: 22px; height: 22px; border-radius: 50%; border: 2px solid #6f9a2e; opacity: 0; transform: scale(.4); }
.vv-cursore.clic::after { animation: vv-clic .45s ease-out; }
@keyframes vv-clic { from { opacity: 1; transform: scale(.4); } to { opacity: 0; transform: scale(1.6); } }

/* registro */
.vv-tab { width: 100%; border-collapse: collapse; background: #fff; font-size: 11px; border-radius: 8px; overflow: hidden; box-shadow: 0 0 0 1px #e1e4dc; }
.vv-tab th { font-size: 9.5px; letter-spacing: .06em; text-transform: uppercase; color: #6b7066; padding: 7px 8px; text-align: right; background: #f3f5f1; font-weight: 600; }
.vv-tab th:nth-child(-n+3) { text-align: left; }
.vv-tab thead tr:first-child th { color: #fff; text-align: center; }
.vv-tab th.c-ol { background: #4d7a1d; } .vv-tab th.c-oo { background: #d98a1f; } .vv-tab th.c-sa { background: #c8372d; } .vv-tab th.c-vu { background: #f3f5f1; }
.vv-tab td { padding: 8px; border-top: 1px solid #eef0eb; text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.vv-tab td:nth-child(-n+3) { text-align: left; }
.vv-tab td em { font-style: normal; font-size: 10px; font-weight: 600; background: #e7f0d9; color: #3f6215; border-radius: 99px; padding: 2px 8px; }
.vv-tab tbody tr { opacity: 0; transform: translateY(6px); transition: opacity .35s, transform .35s, background .6s; }
.vv-tab tbody tr.vis { opacity: 1; transform: none; }
.vv-tab tbody tr.nuova { background: #f4f9ea; }
.vv-tab tfoot td { font-weight: 700; background: #f7f8f5; border-top: 1px solid #dfe3da; }
.vv-scrive::after { content: "|"; animation: vv-lamp .8s steps(1) infinite; color: #6f9a2e; margin-left: 1px; }
@keyframes vv-lamp { 50% { opacity: 0; } }

/* telefono */
.vv-tel { width: 100%; height: 100%; background: #111; border-radius: 42px; padding: 11px; box-shadow: 0 30px 60px -28px #0007; }
.vv-tel-in { width: 100%; height: 100%; background: #eef1f4; border-radius: 32px; overflow: hidden; position: relative; display: flex; flex-direction: column; }
.vv-stato { height: 32px; flex: none; display: flex; justify-content: space-between; align-items: center; padding: 0 22px; font-size: 11px; font-weight: 600; }
.vv-tel .vv-top { height: 42px; padding: 0 14px; }
.vv-tel .vv-pag { padding: 12px; overflow: hidden; }
.vv-tel .vv-titolo h5 { font-size: 14px; }
.vv-schede { display: flex; flex-direction: column; gap: 8px; }
.vv-scheda { background: #fff; border-radius: 10px; padding: 10px 11px; box-shadow: 0 1px 3px #0000000f; transition: transform .5s cubic-bezier(.2,.8,.2,1), opacity .4s, box-shadow .6s; }
.vv-scheda b { font-size: 11.5px; font-weight: 700; text-transform: uppercase; display: block; }
.vv-scheda .chip { display: inline-block; font-size: 9.5px; border-radius: 99px; padding: 1px 7px; margin: 5px 3px 0 0; background: #eef0eb; color: #4b5045; }
.vv-scheda .chip.ct { background: #e7f0d9; color: #3f6215; border: 1px solid #b9d39a; }
.vv-scheda .chip.cp { background: #fbeee2; color: #8a4b12; border: 1px solid #ecc49e; }
.vv-scheda .chip.ita { background: #fff6d6; color: #7a6200; border: 1px solid #ecd37a; }
.vv-scheda.entra { transform: translateY(-120%); opacity: 0; }
.vv-scheda.nuova { box-shadow: 0 0 0 2px #6f9a2e; }
.vv-totali { margin-top: 10px; background: #fff; border-radius: 10px; padding: 10px 11px; font-size: 10.5px; display: grid; gap: 3px; }
.vv-totali b { font-variant-numeric: tabular-nums; }
.vv-tasto-tel { position: absolute; right: 14px; bottom: 16px; width: 46px; height: 46px; border-radius: 50%; background: #6f9a2e; color: #fff; display: grid; place-items: center; font-size: 26px; font-weight: 300; box-shadow: 0 8px 18px -6px #6f9a2e; transition: transform .12s; }
.vv-tasto-tel.premuto { transform: scale(.88); }

/* riquadri vivi (S4) */
.vv-wid { background: #fff; border-radius: 14px; padding: 18px; height: 100%; box-shadow: 0 0 0 1px #e3e6df; font-family: "Poppins", sans-serif; color: #1b1f17; }
.vv-wid h6 { margin: 0 0 4px; font: 600 13px "Poppins"; letter-spacing: 0; display: flex; justify-content: space-between; color: #1b1f17; }
.vv-wid h6 small { font-weight: 400; color: #8a8f86; }
.vv-wid .grande { font: 700 30px "Poppins"; letter-spacing: -.01em; font-variant-numeric: tabular-nums; margin: 10px 0 6px; }
.vv-cisterna { display: flex; gap: 12px; align-items: flex-end; height: 120px; margin-top: 12px; }
.vv-cisterna div { flex: 1; height: 100%; border: 2px solid #c9cfc2; border-radius: 10px 10px 14px 14px; position: relative; overflow: hidden; background: #f6f7f3; }
.vv-cisterna div i { position: absolute; left: 0; right: 0; bottom: 0; height: 0; background: linear-gradient(#c9d943, #8fae1c); transition: height 1.6s cubic-bezier(.2,.7,.2,1); }
.vv-cisterna div span { position: absolute; top: 6px; left: 0; right: 0; text-align: center; font-size: 10px; font-weight: 600; color: #4b5045; z-index: 1; }
.vv-bilancia { margin-top: 10px; background: #1b2412; color: #d6f08a; border-radius: 10px; padding: 14px; font: 600 34px "Poppins"; text-align: right; font-variant-numeric: tabular-nums; letter-spacing: .02em; }
.vv-ok { margin-top: 10px; font-size: 12px; color: #3f6215; display: flex; gap: 6px; align-items: center; opacity: 0; transform: translateY(4px); transition: opacity .3s, transform .3s; }
.vv-ok.vis { opacity: 1; transform: none; }
.vv-anello { display: flex; gap: 16px; align-items: center; margin-top: 12px; }
.vv-anello svg { width: 92px; height: 92px; transform: rotate(-90deg); }
.vv-anello circle { fill: none; stroke-width: 9; }
.vv-anello .fondo { stroke: #eef0eb; } .vv-anello .pieno { stroke: #6f9a2e; stroke-linecap: round; transition: stroke-dasharray 1.4s cubic-bezier(.2,.7,.2,1); }
.vv-anello p { font-size: 12px; color: #4b5045; }
.vv-anello p b { display: block; font-size: 22px; color: #1b1f17; font-weight: 700; }

/* chat (C5) */
.vv-chat { background: #efeae2; border-radius: 16px; overflow: hidden; height: 100%; display: flex; flex-direction: column; font-family: system-ui, sans-serif; box-shadow: 0 0 0 1px #0000001a, 0 24px 50px -28px #0007; }
.vv-chat-testa { background: #1f2914; color: #fff; padding: 12px 16px; display: flex; gap: 10px; align-items: center; font-size: 14px; }
.vv-chat-testa i { width: 34px; height: 34px; border-radius: 50%; background: #fff; display: grid; place-items: center; }
.vv-chat-testa i img { width: 24px; }
.vv-chat-testa small { display: block; font-size: 11px; color: #aab49c; }
.vv-chat-corpo { flex: 1; padding: 16px; display: flex; flex-direction: column; gap: 8px; justify-content: flex-end; }
.vv-msg { max-width: 78%; padding: 8px 11px; border-radius: 10px; font-size: 13.5px; line-height: 1.4; color: #111; background: #fff; align-self: flex-start; opacity: 0; transform: translateY(8px); transition: opacity .3s, transform .3s; box-shadow: 0 1px 1px #0000001a; }
.vv-msg.io { background: #d9fdd3; align-self: flex-end; }
.vv-msg.vis { opacity: 1; transform: none; }
.vv-msg small { display: block; text-align: right; font-size: 10px; color: #667; margin-top: 2px; }
.vv-scrivendo { align-self: flex-start; background: #fff; border-radius: 10px; padding: 10px 12px; display: none; gap: 4px; }
.vv-scrivendo.vis { display: flex; }
.vv-scrivendo i { width: 6px; height: 6px; border-radius: 50%; background: #9aa; animation: vv-punti 1s infinite; }
.vv-scrivendo i:nth-child(2) { animation-delay: .15s; } .vv-scrivendo i:nth-child(3) { animation-delay: .3s; }
@keyframes vv-punti { 50% { transform: translateY(-4px); opacity: .5; } }

@media (prefers-reduced-motion: reduce) {
  .viva-scala *, .vv-cursore { transition: none !important; animation: none !important; }
}

/* ================= blocchi della home: T1, schermate animate, Extrafly, Portale ================= */

/* ---------- T1 con più recensioni ---------- */
.t1p { padding: 0; }
.t1p-testa { display: grid; grid-template-columns: 1.1fr .9fr; gap: 24px 64px; align-items: end; padding-bottom: 40px; border-bottom: 1px solid var(--line); }
.t1p-testa h2 { margin: 0; font: 600 clamp(36px, 4.4vw, 60px)/1.04 var(--font-display); letter-spacing: -0.035em; color: var(--ink); }
.t1p-testa p { margin: 0; font-size: 18px; line-height: 1.55; color: var(--muted); max-width: 460px; }
.t1p-testa b { color: var(--ink); }
.t1p-scelta { padding-top: 48px; }
.t1p-scelta blockquote { margin: 18px 0 0; font: 500 clamp(24px, 2.6vw, 34px)/1.3 var(--font-display); letter-spacing: -0.02em; color: var(--ink); max-width: 1000px; min-height: 4.2em; }
.t1p-stelle { display: inline-flex; gap: 3px; }
.t1p-stelle i { width: 16px; height: 16px; background: var(--ink); clip-path: polygon(50% 0, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%); }
.nfk .t1p .t1p-chi { display: grid; grid-template-columns: repeat(4, 1fr); row-gap: 6px; }
.t1p-chi button { padding-right: 12px; font-size: 13.5px; }
.t1p-chi button strong { font-size: 14.5px; line-height: 1.25; margin-bottom: 2px; }
.t1p-ini { flex: none; width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; font: 700 14px/1 var(--font-text); font-style: normal; color: var(--muted); border: 1px solid var(--line-strong); transition: color .2s, border-color .2s; }
.t1p-chi button[aria-selected="true"] .t1p-ini { color: var(--ink); border-color: var(--ink); }
.t1p-griglia { margin-top: 64px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.t1p-carta { margin: 0; padding: 24px; border: 1px solid var(--line); border-radius: 12px; background: var(--bg); display: flex; flex-direction: column; gap: 14px; }
.t1p-carta .t1p-stelle i { width: 13px; height: 13px; }
.t1p-carta blockquote { margin: 0; font-size: 16px; line-height: 1.55; color: var(--ink); flex: 1; }
.t1p-carta figcaption { font-size: 13.5px; color: var(--muted); }
.t1p-carta figcaption strong { display: block; color: var(--ink); font-size: 15px; }
.t1p .t1-tp { margin-top: 32px; }
@media (max-width: 991px) {
  .t1p-testa { grid-template-columns: 1fr; }
  .nfk .t1p .t1p-chi { grid-template-columns: repeat(2, 1fr); row-gap: 8px; }
  .t1p-griglia { grid-template-columns: 1fr; }
  .t1p-scelta blockquote { min-height: 0; }
}

/* ---------- schermate dell'Interconnessione e di Extrafly ---------- */
.ic-box { width: 100%; }
.ic-fin { background: #f4f6f1; }
.ic-testa { height: 44px; flex: none; display: flex; align-items: center; gap: 16px; padding: 0 16px; background: linear-gradient(90deg, #2f4420, #1f2d16); color: #e8eedf; font-size: 12px; }
.ic-testa img { height: 22px; width: auto; }
.ic-bric { flex: 1; color: #c9d4bb; } .ic-bric em { font-style: normal; opacity: .6; margin: 0 4px; }
.ic-testa .vv-utente { color: #fff; font-size: 12px; }
.ic-testa .vv-utente i { background: #6f9a2e; }
.ic-pag { position: relative; flex: 1; min-height: 0; padding: 18px 20px; }
.ic-tit { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.ic-tit h5 { margin: 0; font: 700 18px "Poppins"; color: #1b1f17; letter-spacing: 0; }
.ic-tit h5 small { font-weight: 400; font-size: 12px; color: #7d8378; margin-left: 6px; }
.ic-chip { display: inline-flex; align-items: center; gap: 7px; font: 600 11.5px "Poppins"; padding: 5px 11px; border-radius: 99px; background: #e6eedb; color: #3c5a1c; }
.ic-chip i { width: 7px; height: 7px; border-radius: 50%; background: #5c9a1f; box-shadow: 0 0 0 3px #5c9a1f33; animation: ic-batti 1.6s infinite; }
.ic-chip.lav { background: #fdf3cf; color: #7a5a00; } .ic-chip.lav i { background: #e0a800; box-shadow: 0 0 0 3px #e0a80033; }
@keyframes ic-batti { 50% { box-shadow: 0 0 0 6px #5c9a1f00; } }

/* I1 tabella impianti, E1 tabella fatture */
.ic-tab { background: #fff; border-radius: 12px; box-shadow: 0 1px 3px #0000000f; overflow: hidden; }
.ic-r { display: grid; grid-template-columns: 1.25fr 1.05fr 1.2fr 1fr; align-items: center; gap: 12px; padding: 0 16px; height: 56px; border-top: 1px solid #eef0ea; font-size: 12.5px; color: #4a5045; transition: background .4s; }
.ic-r b { color: #1b1f17; font-weight: 600; font-size: 13px; }
.ic-h { height: 36px; border-top: 0; background: #f7f8f4; font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase; color: #8a8f84; }
.ic-stato { display: inline-flex; align-items: center; gap: 7px; }
.ic-stato i { width: 8px; height: 8px; border-radius: 50%; background: #5c9a1f; }
.ic-stato.lav i { background: #e0a800; }
.ic-r.batte .ic-stato i { animation: ic-lampo .6s; }
@keyframes ic-lampo { 0% { box-shadow: 0 0 0 0 #5c9a1f88; } 100% { box-shadow: 0 0 0 7px #5c9a1f00; } }
.ic-val strong { font: 700 16px "Poppins"; color: #1b1f17; font-variant-numeric: tabular-nums; }
.ic-r svg { width: 100%; height: 30px; }
.ic-r polyline { fill: none; stroke: #6f9a2e; stroke-width: 1.6; vector-effect: non-scaling-stroke; }
.ic-r.nuovo { background: #f1f7e6; }
.ic-piede { display: flex; justify-content: space-between; margin-top: 12px; font-size: 11px; color: #8a8f84; }

/* I2 la partita */
.ic-fasi { display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; }
.ic-fase { background: #fff; border-radius: 10px; padding: 12px 11px 14px; min-height: 108px; display: flex; flex-direction: column; gap: 4px; box-shadow: 0 1px 3px #0000000f; border: 1.5px solid transparent; transition: border-color .3s, background .3s, transform .3s; }
.ic-fase small { font-size: 10.5px; color: #9aa094; font-weight: 600; }
.ic-fase b { font-size: 13px; color: #1b1f17; }
.ic-fase span { margin-top: auto; font-size: 11.5px; color: #9aa094; }
.ic-fase.att { border-color: #e0a800; background: #fffbea; transform: translateY(-3px); }
.ic-fase.att span { color: #7a5a00; }
.ic-fase.fatto { border-color: #cfe1b4; }
.ic-fase.fatto span { color: #1b1f17; font-weight: 600; font-size: 12.5px; }
.ic-fase.fatto small { color: #5c9a1f; }
.ic-avanza { height: 6px; border-radius: 99px; background: #e3e7dc; margin: 16px 0 18px; overflow: hidden; }
.ic-avanza i { display: block; height: 100%; width: 0; background: #6f9a2e; border-radius: inherit; transition: width .8s cubic-bezier(.2,.7,.2,1); }
.ic-riep { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; }
.ic-riep div { background: #e9ece4; color: #9aa094; border-radius: 10px; padding: 14px 12px; transition: background .5s, color .5s; }
.ic-riep.vis div { background: #1f2d16; color: #e8eedf; }
.ic-riep small { display: block; font-size: 10.5px; color: inherit; opacity: .8; margin-bottom: 4px; }
.ic-riep b { font-size: 15px; font-variant-numeric: tabular-nums; }

/* I3 gramola */
.ic-grafico { position: relative; background: #fff; border-radius: 12px; padding: 14px 14px 10px; box-shadow: 0 1px 3px #0000000f; height: 252px; }
.ic-grafico svg { width: 100%; height: 100%; overflow: visible; }
.ic-grafico .griglia { stroke: #eef0ea; stroke-width: 1; vector-effect: non-scaling-stroke; }
.ic-grafico .soglia { stroke: #c0392b; stroke-width: 1.4; stroke-dasharray: 6 5; vector-effect: non-scaling-stroke; }
.ic-grafico polyline { fill: none; stroke: #6f9a2e; stroke-width: 3; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.ic-grafico circle { fill: #fff; stroke: #6f9a2e; stroke-width: 3; vector-effect: non-scaling-stroke; }
.ic-soglia { position: absolute; right: 22px; transform: translateY(-130%); font-size: 11px; font-weight: 600; color: #a5321f; background: #fff; padding: 0 4px; }
.ic-kpi4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-top: 12px; }
.ic-kpi4 div { background: #fff; border-radius: 10px; padding: 12px; box-shadow: 0 1px 3px #0000000f; }
.ic-kpi4 small { display: block; font-size: 10.5px; color: #8a8f84; margin-bottom: 4px; }
.ic-kpi4 b { font-size: 17px; color: #1b1f17; font-variant-numeric: tabular-nums; }

/* I4 dagli impianti al registro */
.ic-due { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; height: 100%; }
.ic-pannello { background: #fff; border-radius: 12px; box-shadow: 0 1px 3px #0000000f; padding: 14px; overflow: hidden; position: relative; }
.ic-pannello h6 { margin: 0 0 10px; font: 700 13px "Poppins"; color: #1b1f17; letter-spacing: 0; }
.ic-feed { display: flex; flex-direction: column; gap: 7px; }
.ic-msg { border-radius: 9px; background: #f4f6f1; padding: 9px 11px; font-size: 11.5px; display: grid; grid-template-columns: auto 1fr; gap: 1px 10px; animation: ic-entra .45s cubic-bezier(.2,.8,.2,1); }
.ic-msg small { color: #8a8f84; font-variant-numeric: tabular-nums; }
.ic-msg b { color: #1b1f17; }
.ic-msg span { grid-column: 2; color: #4a5045; }
.ic-msg:first-child { background: #eef5e2; }
@keyframes ic-entra { from { opacity: 0; transform: translateY(-14px); } }
.ic-campi { display: grid; gap: 7px; }
.ic-campo { display: flex; justify-content: space-between; align-items: center; border: 1px solid #e3e6dd; border-radius: 8px; padding: 0 12px; height: 40px; font-size: 11.5px; color: #8a8f84; transition: background .4s, border-color .4s; }
.ic-campo b { color: #1b1f17; font-size: 13px; }
.ic-campo.pieno { border-color: #cfe1b4; }
.ic-campo.lampo { background: #eef5e2; }
.ic-timbro { margin-top: 12px; text-align: center; font-size: 12px; font-weight: 600; color: #fff; background: #6f9a2e; border-radius: 8px; padding: 9px; opacity: 0; transform: scale(.96); transition: opacity .4s, transform .4s; }
.ic-timbro.vis { opacity: 1; transform: none; }

/* I5 quadro */
.ic-quadro { display: grid; grid-template-columns: 1.1fr .9fr; gap: 12px; }
.ic-kpi { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ic-kpi div { background: #fff; border-radius: 12px; padding: 16px 14px; box-shadow: 0 1px 3px #0000000f; min-height: 150px; display: flex; flex-direction: column; }
.ic-kpi small { font-size: 11px; color: #8a8f84; }
.ic-kpi b { font: 700 25px "Poppins"; color: #1b1f17; margin-top: 6px; font-variant-numeric: tabular-nums; }
.ic-barra { display: block; margin-top: auto; height: 6px; border-radius: 99px; background: #e9ece4; overflow: hidden; }
.ic-barra em { display: block; height: 100%; width: 0; background: #6f9a2e; border-radius: inherit; transition: width 1.4s cubic-bezier(.2,.7,.2,1); }
.ic-barra em.vis { width: calc(var(--p) * 100%); }
.ic-lista { background: #1f2d16; color: #e8eedf; border-radius: 12px; padding: 16px; }
.ic-lista h6 { margin: 0 0 12px; font: 700 14px "Poppins"; color: #fff; letter-spacing: 0; }
.ic-voce { display: flex; align-items: center; gap: 10px; padding: 11px 0; border-top: 1px solid #ffffff1a; font-size: 12.5px; opacity: .35; transition: opacity .4s; }
.ic-voce i { width: 18px; height: 18px; border-radius: 50%; border: 1.5px solid #a7b39a; flex: none; transition: background .3s, border-color .3s; }
.ic-voce span { margin-left: auto; font-size: 11px; color: #a7b39a; opacity: 0; transition: opacity .3s; }
.ic-voce.vis { opacity: 1; } .ic-voce.vis i { background: #8cc43a; border-color: #8cc43a; } .ic-voce.vis span { opacity: 1; color: #cde26c; }

/* E1 fatture allo SDI */
.ic-fatture .ic-r { grid-template-columns: 1fr 1.45fr .9fr 1fr; }
.ic-num { font-variant-numeric: tabular-nums; color: #1b1f17; font-weight: 600; }
.ic-sdi { justify-self: start; font: 600 11px "Poppins"; padding: 4px 10px; border-radius: 99px; background: #eef0ea; color: #6b7066; transition: background .3s, color .3s; }
.ic-sdi.att { background: #fdf3cf; color: #7a5a00; }
.ic-sdi.ok { background: #e3f0d2; color: #3c5a1c; }
.ic-passiva { opacity: 0; transform: translateY(10px); transition: opacity .4s, transform .4s; background: #f7faf2; }
.ic-passiva.vis { opacity: 1; transform: none; }

/* ---------- Extrafly: impaginazioni ---------- */
#extrafly .ef-logo img { width: 190px; height: auto; display: block; }
#extrafly .ef-sotto { margin-top: 14px; }
#extrafly .ef-h3 { font-size: 22px; margin: 28px 0 10px; }
#extrafly .ef-e1 .ef-logo { margin-bottom: 22px; }
#extrafly .ef-e1 .btn { margin-top: 14px; }
#extrafly .ef-e1 .col-md-7 { padding-left: 40px; }
#extrafly .ef-e2 { max-width: 820px; margin: 0 auto; text-align: center; }
#extrafly .ef-scheda { margin-top: 44px; padding: 40px 48px; border: 1px solid #e3e3de; border-radius: 14px; background: #fff; }
#extrafly .ef-e2 .ef-logo img { margin: 0 auto 4px; }
#extrafly .ef-e2 .ef-h3 { margin-top: 18px; }
#extrafly .ef-scheda .btn { margin-top: 12px; }
#extrafly .ef-e3 { align-items: start; }
#extrafly .ef-e3 h2 { margin-top: 0; }
#extrafly .ef-scheda-sx { margin-top: 0; }
#extrafly .ef-e3 .ef-h3 { margin-top: 20px; }
@media (max-width: 767px) {
  #extrafly .ef-e1 .col-md-7 { padding-left: 12px; margin-top: 36px; }
  #extrafly .ef-scheda { padding: 28px 22px; }
  #extrafly .ef-e3 .col-lg-7 { margin-top: 28px; }
}

/* T1: i loghi dei frantoi */
.t1p-loghi { margin-top: 56px; text-align: center; }
.t1p-loghi p { margin: 0 0 18px; font-size: 15px; color: var(--muted); }
.t1p-loghi div { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 18px 44px; }
.t1p-loghi img { height: 48px; width: auto; max-width: 110px; object-fit: contain; filter: grayscale(1); opacity: .75; transition: filter .2s, opacity .2s; }
.t1p-loghi img:hover { filter: none; opacity: 1; }
.t1p .t1-tp { margin-left: auto; margin-right: auto; }

/* ---------- Portale dell'Olio: schermate vere ---------- */
.pt-scena { position: relative; }
.pt-browser { border-radius: 12px; overflow: hidden; background: #fff; box-shadow: 0 0 0 1px #0000001a, 0 34px 64px -34px #0007; }
.pt-barra { height: 30px; display: flex; align-items: center; gap: 6px; padding: 0 12px; background: #f7f7f5; border-bottom: 1px solid #e3e3df; }
.pt-barra i { width: 9px; height: 9px; border-radius: 50%; background: #dcdcd6; }
.pt-barra span { margin: 0 auto; transform: translateX(-20px); font: 500 11px "Host Grotesk", sans-serif; color: #7a7d75; background: #ececE8; border-radius: 6px; padding: 3px 14px; }
.pt-browser > img { display: block; width: 100%; height: auto; }
/* P1 */
.pt-p1 { padding: 0 9% 12% 0; }
.pt-tel { position: absolute; right: 0; bottom: 0; width: 27%; aspect-ratio: 9 / 19; border-radius: 28px; padding: 7px; background: #0e0f0c; box-shadow: 0 30px 60px -24px #0008; }
.pt-tel-schermo { position: relative; width: 100%; height: 100%; border-radius: 22px; overflow: hidden; background: #f7f7f5; }
.pt-tel-testa { position: absolute; z-index: 2; top: 0; left: 0; width: 100%; }
.pt-tel-scorre { position: absolute; inset: 0; padding-top: 16.4%; }
.pt-tel-scorre img { width: 100%; display: block; animation: pt-scorri-tel 16s ease-in-out infinite; }
@keyframes pt-scorri-tel { 0%, 12% { transform: translateY(0); } 50%, 62% { transform: translateY(-62%); } 100% { transform: translateY(0); } }
/* P2 */
.pt-finestra { aspect-ratio: 16 / 11; overflow: hidden; }
.pt-finestra img { display: block; width: 100%; animation: pt-scorri 20s ease-in-out infinite; }
@keyframes pt-scorri { 0%, 10% { transform: translateY(0); } 45%, 60% { transform: translateY(-43%); } 100% { transform: translateY(0); } }
.pt-scena:hover img { animation-play-state: paused; }
/* P3 */
.pt-p3 { display: grid; grid-template-columns: .82fr 1.18fr; gap: 18px; align-items: center; }
.pt-mappa { width: 100%; border-radius: 16px; box-shadow: 0 0 0 1px #0000001a, 0 30px 60px -34px #0006; background: #fff; }
.pt-schede { display: grid; gap: 14px; }
.pt-schede img { width: 100%; border-radius: 14px; box-shadow: 0 0 0 1px #0000001a, 0 18px 36px -24px #0005; animation: pt-luce 7.5s infinite; }
.pt-schede img:nth-child(2) { animation-delay: 2.5s; } .pt-schede img:nth-child(3) { animation-delay: 5s; }
@keyframes pt-luce { 0%, 30%, 100% { transform: none; box-shadow: 0 0 0 1px #0000001a, 0 18px 36px -24px #0005; } 8%, 24% { transform: translateY(-4px); box-shadow: 0 0 0 2px #7a9c30, 0 26px 44px -24px #0006; } }
@media (prefers-reduced-motion: reduce) { .pt-scena img { animation: none !important; } }
@media (max-width: 767px) { .pt-scena { margin-bottom: 36px; } }

/* ---------- la prima schermata: titolo più grande ---------- */


/* ================= colori dei blocchi del kit (variabili dei token) ================= */
.nfk-t-bianco { --bg: #ffffff; --surface: #f1f1f1; --ink: #0e0f0c; --muted: #585a53; --line: #e3e3de; --line-strong: #c9c9c2; --accent: #0e0f0c; --accent-ink: #ffffff; --brand: #7a9c30; --spot: #cde26c; }
.nfk-d-notte { --deep: #1f2914; --deep-ink: #f4f6ee; --deep-muted: #aab49c; --deep-line: #34402a; --deep-accent: #cde26c; }
.nfk.nfk-t-bianco { background: var(--bg); color: var(--ink); }
/* i blocchi del kit sugli stessi margini del sito (container di Bootstrap) */
.nfk { --wrap: calc(100vw - 48px); }
@media (min-width: 576px) { .nfk { --wrap: 516px; } }
@media (min-width: 768px) { .nfk { --wrap: 696px; } }
@media (min-width: 992px) { .nfk { --wrap: 936px; } }
@media (min-width: 1200px) { .nfk { --wrap: 1116px; } }
@media (min-width: 1400px) { .nfk { --wrap: 1296px; } }
.nf-kit-sez { padding: 100px 0; }
@media (max-width: 767px) { .nf-kit-sez { padding: 70px 0; } }

/* il tema ha a:hover { color: #1f2914 !important }: nei blocchi del kit ogni link dichiara il suo */
.nfk .f-lk:hover, .nfk .f-legale a:hover { color: inherit !important; }
.nfk .pf-privacy a:hover, .nfk .t1-tp:hover, .nfk .t1p-voto:hover { color: var(--ink) !important; }
.nfk .btn--pieno:hover { color: var(--accent-ink) !important; }
.nfk .f-scuro .btn--pieno:hover { color: var(--deep) !important; }
.nfk .f-scuro .btn--bordo:hover { color: var(--deep-ink) !important; }

/* ================= caratteri del kit su tutto il sito ================= */
body, p, li, a, span, small, label, input, textarea, select, button, .btn, td, th { font-family: "Host Grotesk", system-ui, sans-serif; }
h1, h2, h3, h4, h5, h6 { font-family: "Host Grotesk", system-ui, sans-serif !important; font-weight: 600 !important; }
b:not(.nfk b), strong:not(.nfk strong) { font-family: "Satoshi", "Host Grotesk", sans-serif !important; font-weight: 900 !important; }

/* ================= pulsanti pieni neri (palette P2) ================= */
/* Pulsanti principali (decisione dell'utente, 11/11/2026):
   - nelle pagine fatte di sole strutture bianche: verde scuro del marchio (verde notte #1f2914);
   - nella home (body.nf-home), che ha già le sezioni colorate: neri;
   - sui fondi scuri: lime. I secondari restano neri o a bordo. */
.btn--theme, .btn--green-500, .nfc-btn-pieno { background-color: #1f2914 !important; border-color: #1f2914 !important; color: #fff !important; }
.btn--theme:hover, .btn--green-500:hover, .nfc-btn-pieno:hover { background-color: #0e0f0c !important; border-color: #0e0f0c !important; color: #fff !important; }
.nf-home :is(.btn--theme, .btn--green-500, .nfc-btn-pieno) { background-color: #0e0f0c !important; border-color: #0e0f0c !important; }
.nf-home :is(.btn--theme, .btn--green-500, .nfc-btn-pieno):hover { background-color: #2c2e28 !important; border-color: #2c2e28 !important; }
:is(.nf-notte, .nf-scuro, .nf-tono-nero, .nf-tono-notte) :is(.btn--theme, .btn--green-500, .nfc-btn-pieno) { background-color: #cde26c !important; border-color: #cde26c !important; color: #0e0f0c !important; }
/* in home l'Interconnessione (verde notte) tiene il pulsante nero, com'era nell'anteprima approvata */
.nf-home .nf-notte :is(.btn--theme, .btn--green-500, .nfc-btn-pieno) { background-color: #0e0f0c !important; border-color: #0e0f0c !important; color: #fff !important; }
.nfk .pf-invia { background: #1f2914; color: #fff; }
.nfk .pf-invia:hover { background: #0e0f0c; }
.nf-home .nfk .pf-invia { background: #0e0f0c; }
.nf-home .nfk .pf-invia:hover { background: #2c2e28; }

/* ================= prima schermata ================= */
.nf-hero-a h1 { font-size: clamp(2.9rem, 6.1vw, 5.6rem); line-height: 1.02; max-width: 13.5ch; margin-left: auto; margin-right: auto; }
.nfk-hero-vivo { position: relative; max-width: 1060px; margin: 56px auto 64px; }
.nfk-hero-vivo .tel { position: absolute; right: -2%; bottom: -6%; width: 21%; }
.nfk-colonna-viva { width: 100%; }

/* ================= toni delle sezioni della home ================= */
/* Numeri: bianco, riquadri chiari in verde notte */
.nf-tono-numeri { background-color: #fff !important; background-image: none !important; }
.nf-tono-numeri .nfc-mosaico > div:not(.nfc-alto):not(.nfc-pieno) { background: #1f2914; }
.nf-tono-numeri .nfc-mosaico > div:not(.nfc-alto):not(.nfc-pieno) :is(.nfc-num, h3, b, strong, a) { color: #f4f6ee !important; }
.nf-tono-numeri .nfc-mosaico > div:not(.nfc-alto):not(.nfc-pieno) p { color: #aab49c !important; }

/* Consulenze: lime */
.nf-tono-lime { background-color: #cde26c !important; background-image: none !important; }
.nf-tono-lime .txt-block :is(h2, h3, b, strong) { color: #0e0f0c !important; }
.nf-tono-lime .txt-block :is(p, li) { color: #2c330b !important; }
.nf-tono-lime .txt-block .cbox-1-ico, .nf-tono-lime .txt-block .flaticon-check { color: #0e0f0c !important; }
.nf-tono-lime .txt-block .btn { background-color: #0e0f0c !important; border-color: #0e0f0c !important; color: #fff !important; }

/* Assistenza: nero (le schede bianche restano com'erano) */
.nf-tono-nero { background-color: #0e0f0c !important; background-image: none !important; }
.nf-tono-nero .txt-block :is(h2, h3, b, strong) { color: #f4f6ee !important; }
.nf-tono-nero .txt-block :is(p, li) { color: #aab49c !important; }
.nf-tono-nero .txt-block .btn { background-color: #cde26c !important; border-color: #cde26c !important; color: #0e0f0c !important; }

/* Risorse: verde notte */
.nf-tono-notte { background-color: #1f2914 !important; background-image: none !important; }
.nf-tono-notte .section-title h2, .nf-tono-notte .nfc-colonne h3, .nf-tono-notte .nfc-colonne h3 a { color: #f4f6ee !important; }
.nf-tono-notte .section-title p, .nf-tono-notte .nfc-colonne p { color: #aab49c !important; }
.nf-tono-notte .nfc-colonne svg { color: #f4f6ee; }
.nf-tono-notte .nfc-colonne > div { border-color: #ffffff2e !important; }
.nf-tono-notte .nfc-colonne { border-color: #ffffff2e !important; }
.nf-tono-notte .btn { background-color: #cde26c !important; border-color: #cde26c !important; color: #0e0f0c !important; }

/* Extrafly: bianco */
.nf-tono-bianco { background-color: #fff !important; background-image: none !important; }

/* ================= T1: la frase di Trustpilot in evidenza ================= */
.nfk .t1p-voto { display: block; text-decoration: none; color: var(--ink); max-width: 520px; padding: 22px 24px; border: 1px solid var(--line); border-radius: 14px; background: var(--bg); transition: border-color .2s, transform .2s var(--ease), box-shadow .25s; }
.nfk .t1p-voto:hover { border-color: var(--ink); transform: translateY(-2px); box-shadow: 0 18px 36px -24px #0005; }
.nfk .t1p-voto-marchio { display: flex; align-items: center; gap: 14px; margin-bottom: 12px; }
.nfk .t1p-voto-marchio img { height: 26px; width: auto; }
.nfk .t1p-tp-stelle { display: inline-flex; gap: 3px; }
.nfk .t1p-tp-stelle i { width: 22px; height: 22px; background: #00b67a; position: relative; }
.nfk .t1p-tp-stelle i::after { content: ""; position: absolute; inset: 4px; background: #fff; clip-path: polygon(50% 0, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%); }
.nfk .t1p-tp-stelle i:last-child { background: linear-gradient(90deg, #00b67a 60%, #dcdce6 60%); }
.nfk .t1p-testa .t1p-voto p { font-size: clamp(19px, 1.7vw, 23px); line-height: 1.4; color: var(--ink); max-width: none; }
.nfk .t1p-scelta blockquote[hidden] { display: none; }
.nfk .t1-tp-testo span { display: block; }
.nfk .t1p-carta figcaption span { display: block; }

/* ================= C1 ================= */
.nfk .pc1-titolo { font-size: clamp(36px, 4vw, 56px); }
.nfk .pc1-passi p { color: var(--muted); font-size: 15px; }
.nfk .pc1-scheda-titolo { font-size: 22px; }
.nfk .pf-fatto h3 { font-size: 26px; }
.nfk [data-modulo-c1].inviato .pf-form { display: none; }
.nfk [data-modulo-c1].inviato .pf-fatto { display: block; }
.nfk .pf-errore { font-size: 14px; color: #c4372d; text-align: center; }
.nfk .pf-privacy.errore { color: #c4372d; }
.nfk .pf-invia[disabled] { opacity: .6; cursor: progress; }

/* ================= F2 su tutte le pagine ================= */
.nf-piede .f2 { position: relative; }
.nfk .f2 .f2-recapiti svg { width: 15px; height: 15px; vertical-align: -2px; margin-right: 6px; fill: var(--deep-accent); }
.nfk .f2 .f2-demo { margin-top: 24px; }
.nfk .f-legale p { margin: 0; }
.nfk .f2 .nf-footer-chiusura { --nf-linea: var(--deep-line); display: grid; grid-template-columns: 1.3fr 1fr; gap: 30px 60px; align-items: end; padding-bottom: 64px; margin-bottom: 64px; border-bottom: 1px solid var(--deep-line); }
.nfk .f2 .nf-footer-chiusura h2 { color: var(--deep-ink); font-size: clamp(32px, 3.4vw, 44px); line-height: 1.08; }
.nfk .f2 .nf-footer-chiusura p { color: var(--deep-muted); font-size: 18px; margin-bottom: 24px; }
.nfk .f2 .nf-footer-chiusura p b { color: var(--deep-ink); }
.nfk .f2 .nf-footer-fatti { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, 1fr); list-style: none; padding: 0; margin: 20px 0 0; border-top: 1px solid var(--deep-line); }
.nfk .f2 .nf-footer-fatti li { padding: 22px 24px 0; color: var(--deep-muted); }
.nfk .f2 .nf-footer-fatti li:first-child { padding-left: 0; }
.nfk .f2 .nf-footer-fatti li + li { border-left: 1px solid var(--deep-line); }
.nfk .f2 .nf-footer-fatti strong { display: block; font: 600 26px/1.1 var(--font-display) !important; color: var(--deep-ink); }
@media (max-width: 991px) {
  .nfk .f2 .nf-footer-chiusura { grid-template-columns: 1fr; gap: 26px; padding-bottom: 48px; margin-bottom: 48px; }
  .nfk .f2 .nf-footer-fatti { grid-template-columns: 1fr; }
  .nfk .f2 .nf-footer-fatti li { padding: 16px 0; }
  .nfk .f2 .nf-footer-fatti li + li { border-left: 0; border-top: 1px solid var(--deep-line); }
}
@media (max-width: 767px) {
  .nfk .f-legale { flex-direction: column; }
  body.nfc-con-barra .nf-piede .f2 { padding-bottom: 76px; }
}

/* T1: il testo delle recensioni è dentro <p> (per le traduzioni): prende la misura del blocco, non quella dei paragrafi del tema */
.nfk .t1p blockquote p { font: inherit; color: inherit; letter-spacing: inherit; margin: 0; }

/* Portale: le immagini hanno width e height per evitare salti nel caricamento, ma l altezza segue la larghezza */
.pt-scena img { height: auto; }

/* ================= D5: domande frequenti (blocco .nfc-domande del tema, su tutte le pagine) ================= */
.nfc-domande summary { font: 600 clamp(19px, 1.7vw, 24px)/1.3 "Host Grotesk", system-ui, sans-serif !important; letter-spacing: -0.02em; color: #0e0f0c; padding: 24px 0; }
.nfc-domande summary:hover { color: #0e0f0c; }
.nfc-domande summary::after, .nfc-domande details[open] summary::after { content: ""; width: 40px; height: 40px; flex: none; border-radius: 50%; border: 1px solid #c9c9c2; background: linear-gradient(#0e0f0c, #0e0f0c) center / 14px 2px no-repeat, linear-gradient(#0e0f0c, #0e0f0c) center / 2px 14px no-repeat; transition: transform .35s cubic-bezier(.2, .7, .2, 1), background-color .2s, border-color .2s; }
.nfc-domande details[open] summary::after { transform: rotate(45deg); background-color: #0e0f0c; border-color: #0e0f0c; background-image: linear-gradient(#fff, #fff), linear-gradient(#fff, #fff); }
.nfc-domande details > div { padding: 0 64px 26px 0; }
.nfc-domande details > div p, .nfc-domande details > div li { font-size: 17px; line-height: 1.6; color: #585a53; max-width: 780px; }
@media (max-width: 767px) { .nfc-domande summary::after, .nfc-domande details[open] summary::after { width: 34px; height: 34px; } .nfc-domande details > div { padding-right: 0; } }

/* pulsante bianco sui riquadri e sulle fasce scure: lime, come i pulsanti pieni del kit sui fondi scuri */
.nf-pulsante-bianco { background-color: #cde26c !important; border-color: #cde26c !important; color: #0e0f0c !important; }
.nf-pulsante-bianco:hover { background-color: #bfd631 !important; border-color: #bfd631 !important; color: #0e0f0c !important; }

/* assistenza-nextfuture.php: chat dell'assistenza con il riquadro dei tempi sovrapposto */
.nf-assist-vivo { position: relative; max-width: 520px; margin: 0 auto; }
.nf-assist-vivo .chat { width: 80%; margin-left: auto; }
.nf-assist-vivo .anello { position: relative; z-index: 2; width: 54%; margin-top: -34px; filter: drop-shadow(0 24px 40px #0003); }
@media (max-width: 767px) { .nf-assist-vivo { margin-top: 40px; } }

/* ================= C4 nella pagina contatti (modulo di sempre, aspetto del kit) ================= */
.nf-c4 { background: transparent !important; }
.nf-c4 .pc4 { border-radius: 16px; overflow: hidden; box-shadow: 0 0 0 1px var(--line), 0 30px 60px -36px #0005; background: var(--bg); }
.nf-c4 .pc4-sx { justify-content: flex-start; gap: 44px; }
.nfk .pc4-gruppo { font-size: clamp(30px, 3vw, 42px); color: var(--deep-ink); }
.nfk .pc4-nota { color: var(--deep-muted); font-size: 15px; margin: 8px 0 22px; }
.nfk .pc4-num a { display: flex; align-items: center; gap: 10px; }
.nfk .pc4-num a svg { width: .7em; height: .7em; fill: var(--deep-accent); flex: none; }
.nfk .pc4-num a.pc4-mail { font-size: clamp(20px, 1.7vw, 26px); }
.nfk .pc4-num a:hover { color: var(--deep-accent) !important; }
.nfk .pc4-titolo { font-size: 28px; }
.nfk .pc4-etichetta, .nfk .pf-campo > label { display: block; font-size: 14px; font-weight: 600; color: var(--ink); margin: 0 0 6px; }
.nfk .pc4-seg-4 { grid-template-columns: repeat(4, 1fr); }
.nfk .pc4-seg-4 i { width: calc((100% - 8px) / 4); opacity: 0; transition: transform .35s var(--ease), opacity .2s; }
.nfk .pc4-seg-4.scelto i { opacity: 1; }
.nfk .pc4-seg button { font-size: 14px; }
.nfk .pc4-dove { margin: 8px 0 0; }
.nfk .pc4-select { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.nfk .pc4-argomento { position: relative; }
.nfk .pf-campo .pc4-dove { margin: -2px 0 8px; }
.nfk .pf-campo input.error, .nfk .pf-campo textarea.error { border-color: #c4372d; box-shadow: 0 0 0 3px #c4372d22; }
.nfk .pf-campo label.error, .nfk .contact-form label.error { display: block; color: #c4372d; font-size: 13px; font-weight: 400; margin-top: 6px; }
.nfk .form-check.pf-privacy { padding-left: 0; }
.nfk .form-check.pf-privacy .form-check-input { float: none; margin: 1px 0 0; }
.nfk .form-check.error label { color: #c4372d; }
.nfk .contact-form-msg .loading { font-size: 15px; }
@media (max-width: 991px) { .nfk .pc4-seg-4 { grid-template-columns: repeat(2, 1fr); } .nfk .pc4-seg-4 i { display: none; } .nfk .pc4-seg-4 button[aria-pressed="true"] { background: var(--bg); border-radius: 7px; box-shadow: 0 1px 3px #0000001f, 0 0 0 1px var(--line); } }
/* I messaggi di errore hanno il loro posto fisso sotto il campo: comparendo e sparendo non spostano la pagina.
   Prima, compilata l'e-mail, il clic sul consenso spariva: al primo tocco l'errore dell'e-mail se ne andava,
   la spunta saliva di una riga e il clic finiva a vuoto (anche sul modulo di prima). */
.nfk .contact-form.pf-form { row-gap: 2px; }
.nfk .contact-form .pf-campo, .nfk .contact-form .pf-privacy { position: relative; padding-bottom: 24px; }
.nfk .contact-form label.error { position: absolute; left: 0; bottom: 3px; margin: 0; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.nfk .contact-form .pf-privacy label.error { left: 28px; max-width: calc(100% - 28px); }
.nfk .contact-form .form-control, .nfk .contact-form .form-select, .nfk .contact-form textarea { margin: 0 !important; }
.nfk .contact-form .form-check { margin: 0 !important; min-height: 0; }
.nfk .contact-form .contact-form-msg .loading { display: block; text-align: center; }
.nfk .contact-form .contact-form-notice p { text-align: left; margin: 0; }
.nfk .pc4-etichetta, .nfk .pc4-dove { padding-left: 0 !important; margin-left: 0 !important; }
/* barra da telefono (C3): la demo è un pulsante pieno, quindi nero come gli altri */
.nfc-barra .nfc-barra-demo { background: #1f2914 !important; border-color: #1f2914 !important; color: #fff !important; }
.nf-home .nfc-barra .nfc-barra-demo { background: #0e0f0c !important; border-color: #0e0f0c !important; }
.nfk .pc4-num .pc4-voce p { color: var(--deep-muted); font-size: 14px; margin: 4px 0 20px; }

/* Da telefono menu.css (tema Martex) faceva scorrere il <body> al posto della finestra:
   html { overflow: hidden; height: 100% } e body { height: 100%; overflow-y: auto }.
   La finestra restava ferma, gli script che ascoltano lo scorrimento della finestra (WOW, la barra C3)
   non lo vedevano, e su Android i blocchi animati potevano restare invisibili. Torna a scorrere la finestra. */
@media only screen and (max-width: 991px) {
  html { overflow-x: hidden; overflow-y: visible; height: auto; }
  body { height: auto; overflow: visible; }
}
/* F2: la riga legale come nel kit (13 px, tenue sul verde notte): i <p> prendevano misura e grigio del tema */
.nfk .f2 .f-legale p, .nfk .f2 .f-legale a { font-size: 13px; line-height: 1.5; color: var(--deep-muted); }
.nfk .f2 .f-legale a:hover { color: var(--deep-ink) !important; }

/* B1: pulsante squadrato del kit, pieno nel verde scuro del marchio («Richiedi il servizio» in servizi-aggiuntivi.php) */
.nf-b1 { display: inline-flex; align-items: center; justify-content: center; gap: 10px; height: 44px; padding: 0 20px; margin-top: 16px; border-radius: 6px; background: #1f2914; color: #fff !important; font: 700 15px "Host Grotesk", system-ui, sans-serif; text-decoration: none; transition: background-color .15s, transform .15s; }
.nf-b1:hover { background: #0e0f0c; color: #fff !important; transform: translateY(-1px); }
.nf-b1:active { transform: translateY(1px) scale(.985); }

/* Da telefono prima il titolo e il testo, poi l'immagine (regola dell'utente), in tutte le sezioni a due colonne */
@media (max-width: 767px) {
  .row > [class*="col-"]:has(> .txt-block), .row > [class*="col-"]:has(> .section-title) { order: -1 !important; }
}

/* D5: i titoli dei gruppi di domande devono leggersi come titoli di sezione, non come un'altra domanda */
.nfc-domande h3.nfc-domande-gruppo { display: flex; align-items: center; gap: 14px; margin: 72px 0 6px; padding: 0 0 18px; border: 0; font: 600 clamp(26px, 2.6vw, 36px)/1.15 "Host Grotesk", system-ui, sans-serif !important; letter-spacing: -0.03em; color: #0e0f0c; }
.nfc-domande h3.nfc-domande-gruppo:first-child { margin-top: 24px; }
.nfc-domande h3.nfc-domande-gruppo::before { content: ""; width: 6px; align-self: stretch; min-height: 1em; border-radius: 3px; background: #7a9c30; flex: none; }
.nfc-domande h3.nfc-domande-gruppo + details { border-top: 1px solid #c9c9c2; }
.nfc-domande summary { font-size: clamp(18px, 1.5vw, 21px) !important; }

/* ================= telefono: spazi di sezioni e componenti ================= */
@media (max-width: 767px) {
  /* nelle sezioni a due colonne l'immagine non si attacca al testo sopra */
  .row:has(> [class*="col-"] > .txt-block) > [class*="col-"]:not(:has(> .txt-block)) { margin-top: 40px; }
  .nfc-schede .nfc-schede-img { margin-top: 40px; }
  .pt-scena { margin-bottom: 0; }
  .txt-block .btn, .txt-block .nfc-btn { margin-top: 24px !important; }
  /* schede e numeri allineati a sinistra come il resto */
  .nf-scheda, .nf-scheda h3, .nf-scheda p { text-align: left !important; }
  .nf-scheda h3 { justify-content: flex-start !important; }
  .fbox-12-wrapper .row > [class*="col-"] { margin-top: 0; }
  .fbox-12-wrapper .nf-scheda { margin-bottom: 16px !important; }
  .fbox-12-wrapper { margin-top: 32px; }
}
@media (max-width: 575px) {
  /* i numeri della home: un riquadro per riga, così il testo non si spezza */
  .nf-mosaico-home { grid-template-columns: 1fr; grid-auto-rows: auto; gap: 12px; }
  .nf-mosaico-home > div { grid-column: auto !important; grid-row: auto !important; min-height: 0; gap: 10px; }
  .nf-mosaico-home .nfc-num { font-size: 2.6rem; }
  .nf-mosaico-home .nfc-alto .nfc-num { font-size: 3.2rem; }
  /* T1: i nomi delle recensioni in un elenco, uno per riga */
  .nfk .t1p .t1p-chi { grid-template-columns: 1fr; row-gap: 0; }
  .nfk .t1p .t1p-chi button { padding: 12px 0; }
  .nfk .t1p-testa { padding-bottom: 28px; }
  .nfk .t1p-scelta { padding-top: 32px; }
  .nfk .t1p-griglia { margin-top: 40px; gap: 12px; }
  .nfk .t1p-loghi { margin-top: 40px; }
  .nfk .t1p-loghi div { gap: 14px 26px; }
  .nfk .t1p-loghi img { height: 40px; }
}

/* toni delle sezioni anche per i blocchi con titolo centrato e colonne (usati su extrafly.it e sugli altri siti) */
.nf-tono-nero .section-title h2, .nf-tono-nero .nfc-colonne h3, .nf-tono-nero .nfc-colonne h3 a { color: #f4f6ee !important; }
.nf-tono-nero .section-title p, .nf-tono-nero .nfc-colonne p { color: #aab49c !important; }
.nf-tono-nero .section-title :is(b, strong) { color: #f4f6ee !important; }
.nf-tono-nero .nfc-colonne svg, .nf-tono-notte .nfc-colonne svg { color: #cde26c !important; }
.nf-tono-nero .nfc-colonne, .nf-tono-nero .nfc-colonne > div { border-color: #ffffff26 !important; }
.nf-tono-notte .section-title :is(b, strong) { color: #f4f6ee !important; }
.nf-tono-lime :is(.txt-block, .section-title) :is(.nfc-btn-pieno, .btn--theme) { background-color: #0e0f0c !important; border-color: #0e0f0c !important; color: #fff !important; }
.nf-tono-lime .txt-block svg { color: #0e0f0c !important; }

/* scena «archivio» (area riservata di Extrafly) */
.ic-cerca { display: flex; align-items: center; gap: 10px; height: 44px; padding: 0 14px; margin-bottom: 12px; background: #fff; border-radius: 10px; box-shadow: 0 0 0 1px #e3e6dd; font-size: 14px; color: #8a8f84; }
.ic-cerca b { color: #1b1f17; font-weight: 600; }
.ic-caret { width: 1.5px; height: 18px; background: #1b1f17; animation: ic-caret 1s steps(2) infinite; }
@keyframes ic-caret { 50% { opacity: 0; } }
.ic-schede { margin-left: auto; display: flex; gap: 6px; }
.ic-schede em { font-style: normal; font-size: 12px; padding: 4px 10px; border-radius: 99px; background: #f1f3ee; color: #6b7066; }
.ic-schede em.su { background: #1f2d16; color: #fff; }
.ic-formati { display: flex; gap: 6px; }
.ic-formati em { font: 600 10.5px "Poppins"; font-style: normal; padding: 3px 8px; border-radius: 6px; background: #eef0ea; color: #4a5045; }
.ic-r.via { opacity: .25; transition: opacity .4s; }
.ic-r.scelta { background: #f1f7e6; transition: background .4s; }
.ic-piede .vv-btn { font-size: 11px; }

/* scene di extravirginsoftware.it/evmini: pesata, magazzino, contabilità */
.ic-form { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 14px; }
.ic-campo2 { background: #fff; border-radius: 10px; padding: 10px 12px; box-shadow: 0 0 0 1px #e3e6dd; min-height: 58px; transition: box-shadow .3s, background .3s; }
.ic-campo2 small { display: block; font-size: 10.5px; color: #8a8f84; margin-bottom: 4px; }
.ic-campo2 b { font-size: 15px; color: #1b1f17; font-variant-numeric: tabular-nums; }
.ic-campo2.netto { background: #f1f7e6; box-shadow: 0 0 0 1px #cfe1b4; }
.ic-campo2.lampo { box-shadow: 0 0 0 2px #6f9a2e; }
.ic-oggi .ic-r { height: 50px; }
.ic-nuova { opacity: 0; transform: translateY(-8px); transition: opacity .4s, transform .4s; background: #f7faf2; }
.ic-nuova.vis { opacity: 1; transform: none; }
.ic-cisterne { display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; margin-bottom: 14px; }
.ic-cist { background: #fff; border-radius: 10px; padding: 10px; box-shadow: 0 1px 3px #0000000f; display: flex; flex-direction: column; gap: 6px; border: 1.5px solid transparent; transition: border-color .3s; }
.ic-cist b { font-size: 12px; color: #1b1f17; }
.ic-cist i { position: relative; height: 120px; border-radius: 8px; background: #eef0ea; overflow: hidden; }
.ic-cist em { position: absolute; left: 0; right: 0; bottom: 0; height: 0; background: linear-gradient(#a8cc45, #6f9a2e); transition: height 1.1s cubic-bezier(.2, .7, .2, 1); }
.ic-cist.pieno em { height: calc(var(--p) * 100%); }
.ic-cist span { font: 600 11.5px "Poppins"; color: #1b1f17; font-variant-numeric: tabular-nums; }
.ic-cist small { font-size: 10px; color: #8a8f84; }
.ic-cist.att { border-color: #e0a800; }
.ic-mag b { font-size: 15px; }
.ic-mov { font-size: 12px !important; color: #3c5a1c !important; }
.ic-conti { display: grid; grid-template-columns: 1.45fr 1fr; gap: 12px; }
.ic-pn .ic-r { grid-template-columns: .5fr 1.6fr .9fr .9fr; height: 54px; font-size: 11.5px; opacity: 0; transform: translateX(-8px); transition: opacity .35s, transform .35s; }
.ic-pn .ic-r.ic-h, .ic-pn .ic-r.vis { opacity: 1; transform: none; }
.ic-pn .ic-r b { font-size: 12px; }
.ic-pn .ent { color: #3c5a1c; } .ic-pn .usc { color: #a5321f; }
.ic-bil { background: #fff; border-radius: 12px; box-shadow: 0 1px 3px #0000000f; padding: 14px; display: flex; flex-direction: column; gap: 16px; }
.ic-bil h6 { margin: 0; font: 700 13px "Poppins"; color: #1b1f17; letter-spacing: 0; }
.ic-bar small { display: block; font-size: 11px; color: #8a8f84; margin-bottom: 6px; }
.ic-bar i { display: block; height: 14px; border-radius: 99px; background: #eef0ea; overflow: hidden; }
.ic-bar em { display: block; height: 100%; width: 0; border-radius: inherit; background: #6f9a2e; transition: width 1s cubic-bezier(.2, .7, .2, 1); }
.ic-bar[data-b="1"] em { background: #c0392b; }
.ic-bar[data-b="2"] em { background: #1f2d16; }
.ic-bar.pieno em { width: calc(var(--p) * 100%); }
.ic-bar b { display: block; margin-top: 6px; font-size: 15px; color: #1b1f17; font-variant-numeric: tabular-nums; }

/* scene di Extravirgin per Windows (extravirginsoftware.it: BASE, CONF, PRO, Funzionalità) */
.ic-kpi3 { grid-template-columns: repeat(3, 1fr); margin: 0 0 12px; }
.ic-kpi3 b { font-size: 20px; }
.ic-tre { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 12px; }
.ic-pannello2 { background: #fff; border-radius: 12px; box-shadow: 0 1px 3px #0000000f; padding: 12px; display: flex; flex-direction: column; gap: 8px; min-height: 210px; }
.ic-pannello2 h6 { margin: 0 0 2px; font: 700 12.5px "Poppins"; color: #1b1f17; letter-spacing: 0; }
.ic-voce2 { border-radius: 8px; background: #f4f6f1; padding: 8px 10px; font-size: 11.5px; color: #4a5045; display: flex; flex-direction: column; gap: 2px; }
.ic-voce2 b { color: #1b1f17; font-size: 12.5px; }
.ic-grande { font: 700 40px/1 "Poppins"; color: #1b1f17; margin: 6px 0; }
.ic-foglio { background: #fff; border-radius: 12px; box-shadow: 0 1px 3px #0000000f; padding: 18px 20px; display: flex; flex-direction: column; gap: 14px; }
.ic-foglio-testa { display: flex; justify-content: space-between; padding-bottom: 12px; border-bottom: 1px solid #eef0ea; }
.ic-foglio-testa b { display: block; font-size: 15px; color: #1b1f17; }
.ic-foglio-testa small { font-size: 11.5px; color: #8a8f84; }
.ic-dx { text-align: right; }
.ic-righe { display: flex; flex-direction: column; }
.ic-riga { display: grid; grid-template-columns: 1.4fr 1fr .8fr; gap: 10px; padding: 11px 0; border-bottom: 1px solid #eef0ea; font-size: 12px; color: #4a5045; opacity: 0; transform: translateX(-8px); transition: opacity .35s, transform .35s; }
.ic-riga.vis { opacity: 1; transform: none; }
.ic-riga b { color: #1b1f17; font-size: 12.5px; }
.ic-riga .ic-num { text-align: right; }
.ic-totali { display: grid; gap: 6px; margin-left: auto; width: 46%; }
.ic-totali div { display: flex; justify-content: space-between; font-size: 12.5px; color: #4a5045; }
.ic-totali b { color: #1b1f17; font-variant-numeric: tabular-nums; }
.ic-totali .tot { padding-top: 8px; border-top: 1.5px solid #1b1f17; font-size: 14px; }
.ic-totali .tot b { font-size: 17px; }
.ic-lotto { display: grid; grid-template-columns: .8fr .2fr 1.6fr; gap: 10px; align-items: center; }
.ic-cist-grande i { height: 240px; }
.ic-cist-grande em { transition: height .9s cubic-bezier(.2, .7, .2, 1); }
.ic-freccia { font: 600 26px "Poppins"; color: #6f9a2e; text-align: center; }
.ic-conf { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ic-conf .ic-campo2:nth-child(3) { grid-column: 1 / -1; }
.ic-etichetta { grid-column: 1 / -1; border-radius: 10px; padding: 14px; background: #1f2d16; color: #e8eedf; display: flex; flex-direction: column; gap: 4px; font-size: 12px; opacity: .2; transform: scale(.97); transition: opacity .4s, transform .4s; }
.ic-etichetta.vis { opacity: 1; transform: none; }
.ic-etichetta b { color: #fff; font-size: 14px; }
.ic-etichetta em { font-style: normal; color: #cde26c; font-weight: 600; }
.ic-dist .ic-r { grid-template-columns: 1.4fr .8fr 1fr 1.1fr; }
.ic-pn-r { opacity: 0; transform: translateX(-8px); transition: opacity .35s, transform .35s; }
.ic-pn-r.vis { opacity: 1; transform: none; }
.ic-pn-r .ent { color: #3c5a1c; } .ic-pn-r .usc { color: #a5321f; }
/* dentro la finestra di Windows di extravirginsoftware.it la barra del browser non c'è */
.ev-app .vv-barra { display: none; }
.ev-app .vv-fin { border-radius: 0; box-shadow: none; }
