/* ==========================================================================
   Landing Assemblea Nazionale ANCI 2026 – NV Group  (v3)
   Mobile-first. Palette e font dal manuale di identità NV Group e dall'invito ANCI 2026.
   Scelte v3: colori pieni (niente gradienti, glow o vetro), raggi 4–8px, ombre minime,
   layout asimmetrico, reticolato NV Group a bassa opacità solo in hero, programma e angolo del footer.
   ========================================================================== */

/* ---------- Font self-hosted (max due famiglie) ---------- */
@font-face { font-family: "Montserrat"; font-weight: 800; font-style: normal; font-display: swap;
  src: url("../fonts/montserrat-latin-800-normal.woff2") format("woff2"); }
@font-face { font-family: "Montserrat"; font-weight: 900; font-style: normal; font-display: swap;
  src: url("../fonts/montserrat-latin-900-normal.woff2") format("woff2"); }
@font-face { font-family: "Open Sans"; font-weight: 400; font-style: normal; font-display: swap;
  src: url("../fonts/open-sans-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Open Sans"; font-weight: 600; font-style: normal; font-display: swap;
  src: url("../fonts/open-sans-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Open Sans"; font-weight: 700; font-style: normal; font-display: swap;
  src: url("../fonts/open-sans-latin-700-normal.woff2") format("woff2"); }

/* ---------- Design token ---------- */
/* Layout: colonne asimmetriche (testo largo + elemento stretto), un blocco "Stand 92" che sborda dall'hero */
:root {
  /* Colori presi dal logo NV Group (campionati dal file del logo), colori pieni */
  --nv-blu: #0080AD;          /* Blu del logo: riempimenti, numeri grandi, reticolato */
  --nv-blu-testo: #00769F;    /* Blu del logo, tonalità del bordo: link e testo blu piccolo (5.13:1 su bianco, 4.78:1 su grigio chiaro) */
  --nv-azzurro: #00A3DF;      /* Azzurro del logo: icone e reticolato su fondo scuro */
  --nv-lime: #9BC43D;         /* Verde del logo: accenti; mai testo su bianco */
  --nv-notte: #011D68;        /* Blu notte: hero, sezione modulo, bottoni primari */
  --nv-antracite: #393F4E;    /* Testo corrente (10.53:1) */
  /* Neutri */
  --white: #FFFFFF;
  --ink: #1A1A1A;             /* testo footer (17.4:1) */
  --ink-2: #3D434C;           /* link footer (10.4:1) */
  --bg-tint: #F4F7FB;
  --line: #E5E5E5;            /* separatori e bordo footer */
  --line-strong: #C9D1DC;
  --muted: #5A6170;           /* 6.22:1 sul bianco */
  --field-border: #8A94A6;    /* 3.06:1: contrasto componenti UI */
  /* Stati */
  --error: #B3261E; --error-bg: #FDECEA;
  --ok-text: #3D4F00; --ok-bg: #F3F8E3;
  --warn-text: #7A5B00; --warn-bg: #FFF4D6;
  --orange: #F28C28;          /* avviso "Ultimi posti" (testo blu notte sopra: 6.21:1) */
  --orange-text: #A84A00;     /* testo arancione su grigio chiaro (5.36:1) */
  /* Reticolato */
  --grid-step: 32px;
  --grid-on-light: rgba(0, 128, 173, .08);    /* blu del logo all'8% */
  --grid-on-dark: rgba(0, 163, 223, .16);     /* azzurro del logo al 16%: più visibile sul blu scuro */

  /* Tipografia */
  --font-title: "Montserrat", "Arial Black", Arial, sans-serif;
  --font-body: "Open Sans", "Segoe UI", Arial, sans-serif;
  --fs-body: 1rem;
  --fs-small: .875rem;
  --fs-h1: clamp(2rem, 4vw + .75rem, 3.25rem);
  --fs-h2: clamp(1.5rem, 2vw + .9rem, 2.1rem);
  --lh-body: 1.65;

  /* Forme */
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --shadow-soft: 0 1px 2px rgba(1, 29, 104, .08);
  --focus: 0 0 0 3px var(--white), 0 0 0 6px var(--nv-notte);

  /* Spaziature */
  --space-1: .25rem; --space-2: .5rem; --space-3: .75rem; --space-4: 1rem;
  --space-5: 1.5rem; --space-6: 2rem; --space-7: 3rem; --space-8: 4.5rem; --space-9: 6rem;
  --container: 1120px;
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition: none !important; animation: none !important; } }
body { margin: 0; font-family: var(--font-body); font-size: var(--fs-body); line-height: var(--lh-body);
  color: var(--nv-antracite); background: var(--white); }
img, svg { max-width: 100%; height: auto; }
h1, h2, h3 { font-family: var(--font-title); font-weight: 800; color: var(--nv-notte); line-height: 1.2; margin: 0 0 var(--space-4); text-wrap: balance; }
h3 { font-size: 1.25rem; }
p { margin: 0 0 var(--space-4); }
a { color: var(--nv-blu-testo); text-underline-offset: 3px; }
a:hover { color: var(--nv-notte); }
:focus-visible { outline: none; box-shadow: var(--focus); border-radius: var(--radius-sm); }
sup { font-size: .6em; }
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.container { width: 100%; max-width: var(--container); margin: 0 auto; padding-left: var(--space-4); padding-right: var(--space-4); }
.narrow { max-width: 820px; }
[hidden] { display: none !important; }

.skip-link { position: absolute; left: var(--space-4); top: -100px; z-index: 100; background: var(--nv-notte); color: var(--white);
  padding: var(--space-3) var(--space-4); border-radius: var(--radius-sm); font-weight: 700; }
.skip-link:focus { top: var(--space-4); color: var(--white); }

/* Parola chiave: colore pieno, senza riquadro (titoli meno urlati) */
.hl { color: var(--nv-blu-testo); }
/* Sottolineatura "a mano" in lime: una sola, sulla parola chiave dell'hero */
.hand-underline { position: relative; white-space: nowrap; color: inherit; }
.hand-underline::after { content: ""; position: absolute; left: -2%; right: -2%; bottom: -.18em; height: .32em; pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 18' preserveAspectRatio='none'%3E%3Cpath d='M3 12 C 60 4, 120 3, 180 7 S 270 12, 297 5' fill='none' stroke='%239BC43D' stroke-width='5' stroke-linecap='round'/%3E%3Cpath d='M40 15 C 110 9, 190 10, 250 12' fill='none' stroke='%239BC43D' stroke-width='2.5' stroke-linecap='round' opacity='.7'/%3E%3C/svg%3E") no-repeat center / 100% 100%; }

/* ---------- Reticolato NV Group ---------- */
/* Griglia di linee sottili in CSS puro: leggera, responsive, sempre dietro al testo (z-index 0). */
.has-grid { position: relative; isolation: isolate; }
.has-grid::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image:
    linear-gradient(to right, var(--grid-color, var(--grid-on-light)) 1px, transparent 1px),
    linear-gradient(to bottom, var(--grid-color, var(--grid-on-light)) 1px, transparent 1px);
  background-size: var(--grid-step) var(--grid-step);
  -webkit-mask-image: var(--grid-mask, none); mask-image: var(--grid-mask, none); }

/* ---------- Bottoni (raggio contenuto, come sul sito) ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2);
  min-height: 48px; padding: 12px 22px; border: 2px solid transparent; border-radius: var(--radius-sm);
  font-family: var(--font-body); font-weight: 700; font-size: 1rem; line-height: 1.2; text-decoration: none;
  cursor: pointer; transition: background-color .15s, color .15s, border-color .15s; }
.btn--primary { background: var(--nv-lime); color: var(--nv-notte); }
.btn--primary:hover { background: var(--nv-notte); color: var(--white); }
.btn--outline { background: transparent; color: var(--nv-blu-testo); border-color: var(--nv-blu-testo); }
.btn--outline:hover { background: var(--nv-lime); border-color: var(--nv-lime); color: var(--nv-notte); }
.btn--small { min-height: 44px; padding: 8px 14px; font-size: .9rem; }
.btn--lg { min-height: 52px; padding: 13px 24px; font-size: 1.05rem; }
.btn--block { width: 100%; }
.btn-arrow { display: inline-flex; width: 20px; transition: transform .15s; }
.btn-arrow svg { width: 20px; fill: currentColor; }
.btn:hover .btn-arrow { transform: translateX(3px); }
.btn[disabled] { opacity: .7; cursor: progress; }
.spinner { display: none; width: 20px; height: 20px; border: 3px solid rgba(1,29,104,.25); border-top-color: var(--nv-notte); border-radius: 50%; animation: spin .8s linear infinite; }
.is-loading .spinner { display: inline-block; }
@keyframes spin { to { transform: rotate(360deg); } }

/* ---------- Header ---------- */
.site-header { background: var(--white); border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 10; }
/* logo a sinistra, CTA esattamente al centro della barra */
.header-inner { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; min-height: 64px; gap: var(--space-3); }
.brand { display: inline-flex; padding: var(--space-1); justify-self: start; }
.brand img { display: block; width: 88px; height: auto; }
.header-cta { justify-self: center; white-space: nowrap; }

/* ---------- Hero: colore pieno + reticolato sfumato a destra ---------- */
.hero { background: var(--nv-notte); color: var(--white);
  --grid-color: var(--grid-on-dark);
  --grid-mask: linear-gradient(to right, rgba(0,0,0,.45), #000 55%); }
.hero-inner { display: grid; gap: var(--space-6); padding-top: var(--space-7); padding-bottom: var(--space-7); }
.hero-eyebrow { display: flex; align-items: center; gap: var(--space-3); margin: 0 0 var(--space-5);
  font-size: var(--fs-small); font-weight: 600; color: #DCE4F2; letter-spacing: .02em; }
.hero-eyebrow::before { content: ""; width: 28px; height: 3px; background: var(--nv-lime); border-radius: 2px; }
.hero-title { color: var(--white); font-size: var(--fs-h1); letter-spacing: -.01em; max-width: 18ch; margin-bottom: var(--space-5); }
.br-md { display: none; }
.hero-lead { font-size: 1.1rem; max-width: none; color: #E6ECF7; } /* tutta la larghezza: niente a capo a metà pagina */
.hero-lead strong { color: var(--white); font-weight: 600; }
.event-facts { list-style: none; padding: 0; margin: var(--space-5) 0 var(--space-6); display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-5);
  color: var(--white); font-weight: 600; }
.event-facts li { display: inline-flex; align-items: center; gap: var(--space-2); }
.ico { width: 20px; height: 20px; flex: none; fill: none; stroke: var(--nv-lime); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.hero .btn--primary:hover { background: var(--white); color: var(--nv-notte); }
.hero :focus-visible { box-shadow: 0 0 0 3px var(--nv-notte), 0 0 0 6px var(--white); }

/* Blocco "Stand 92" ripreso dall'invito; su desktop esce di poco dall'hero */
.hero-head, .hero-body { min-width: 0; }
.stand-box { position: relative; isolation: isolate; overflow: hidden; margin: 0; align-self: start; justify-self: start; display: grid; justify-items: center; gap: 2px; min-width: 200px;
  padding: var(--space-5) var(--space-6); background: transparent; color: var(--white); border: 1px solid rgba(255,255,255,.75); border-radius: var(--radius-sm);
  font-family: var(--font-title); text-align: center; }
.stand-box .sb-label { font-size: .8rem; letter-spacing: .3em; padding-left: .3em; font-weight: 800; }
.stand-box .sb-brand { font-family: var(--font-body); font-size: .85rem; font-weight: 600; color: var(--white); }
.stand-box .sb-num { font-size: 4.5rem; line-height: 1; font-weight: 900; margin: 4px 0; color: var(--nv-lime); font-variant-numeric: tabular-nums; }
.stand-box .sb-place { font-family: var(--font-body); font-size: .9rem; border-top: 1px solid rgba(255,255,255,.35); padding-top: 8px; width: 100%; }

/* ---------- Sezioni (ritmo variato) ---------- */
.section { padding-top: var(--space-8); padding-bottom: var(--space-8); }
.section--airy { padding-top: var(--space-9); padding-bottom: var(--space-9); }
.section--compact { padding-top: var(--space-7); padding-bottom: var(--space-7); }
.section--tint { background: var(--bg-tint); }
.kicker { display: flex; align-items: center; gap: var(--space-3); margin: 0 0 var(--space-3);
  font-size: var(--fs-small); font-weight: 700; color: var(--nv-blu-testo); }
.kicker::before { content: ""; width: 24px; height: 3px; background: var(--nv-lime); border-radius: 2px; }
.section-title { font-size: var(--fs-h2); }
.section-lead { font-size: 1.05rem; max-width: 62ch; }

/* Prodotti: righe alternate testo / foto, colonne di larghezza diversa */
.product-rows { display: grid; gap: var(--space-7); margin-top: var(--space-6); }
.product-row { display: grid; gap: var(--space-5); align-items: center; }
.product-row + .product-row { padding-top: var(--space-7); border-top: 1px solid var(--line); }
.product-text { min-width: 0; }
.product-num { display: inline-grid; place-items: center; width: 36px; height: 36px; margin-bottom: var(--space-3);
  border-radius: 50%; background: var(--nv-lime); color: var(--nv-notte); font-family: var(--font-title); font-weight: 900; }
.product-text h3 { font-size: 1.6rem; margin-bottom: var(--space-3); }
.product-text p { max-width: 52ch; }
.product-meta { font-size: var(--fs-small); font-weight: 600; color: var(--muted); }
.product-meta::before { content: "◷ "; color: var(--nv-lime); }

/* Segnaposto foto: chiaramente marcato, da sostituire con una foto reale */
.photo-ph { margin: 0; aspect-ratio: 3 / 2; max-width: 100%; display: grid; place-content: center; gap: var(--space-2); text-align: center;
  padding: var(--space-5); border: 1px dashed var(--line-strong); border-radius: var(--radius-md); background: var(--bg-tint); color: var(--muted); }
.photo-ph .ph-tag { justify-self: center; font-size: .75rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  color: var(--warn-text); background: var(--warn-bg); padding: 3px 8px; border-radius: var(--radius-sm); }
.photo-ph figcaption { font-size: var(--fs-small); max-width: 34ch; }
.photo-ph svg { justify-self: center; width: 40px; fill: none; stroke: var(--line-strong); stroke-width: 1.5; }

/* Programma: reticolato sfumato in alto e in basso */
.section--grid { --grid-mask: linear-gradient(to bottom, transparent, #000 25%, #000 70%, transparent); }
.agenda { display: grid; gap: var(--space-6); margin-top: var(--space-5); }
.agenda-col { min-width: 0; }
.agenda-h { font-size: 1.2rem; margin: 0 0 var(--space-2); padding-bottom: var(--space-2); border-bottom: 3px solid var(--nv-lime); }
.agenda-list { list-style: none; padding: 0; margin: 0; }
.agenda-list li { display: grid; grid-template-columns: 1fr auto; grid-template-areas: "day state" "time state"; align-items: center;
  gap: 0 var(--space-3); padding: 10px 2px; border-bottom: 1px solid var(--line-strong); }
.ag-day { grid-area: day; font-size: var(--fs-small); color: var(--muted); }
.ag-time { grid-area: time; font-weight: 700; color: var(--nv-notte); font-variant-numeric: tabular-nums; font-size: 1.05rem; }
.ag-state { grid-area: state; display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-small); font-weight: 600; color: var(--ok-text); }
.ag-state::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--nv-lime); }
.agenda-list li.is-full .ag-time { color: var(--muted); text-decoration: line-through; }
.agenda-list li.is-full .ag-state { color: var(--error); }
.agenda-list li.is-full .ag-state::before { background: var(--error); }
.agenda-note { margin: var(--space-4) 0 0; font-style: italic; color: var(--muted); }
.perks { list-style: none; padding: 0; margin: var(--space-6) 0 0; display: grid; gap: var(--space-3); }
.perks li { display: grid; gap: 2px; padding-left: var(--space-4); border-left: 3px solid var(--nv-lime); }
.perks strong { color: var(--nv-notte); }

/* Dati reali + citazione */
.section--green { background: var(--ok-bg); }
.facts { display: grid; gap: var(--space-6); align-items: start; }
.quote { margin: 0; padding: var(--space-5) var(--space-5) var(--space-5) var(--space-6); position: relative; border-left: 4px solid var(--nv-lime); background: var(--white); }
.quote::before { content: "“"; position: absolute; left: 12px; top: -6px; font-family: var(--font-title); font-weight: 900; font-size: 3.5rem; color: var(--nv-lime); line-height: 1; }
.quote p { font-size: 1.15rem; line-height: 1.55; color: var(--nv-notte); margin-bottom: var(--space-3); }
.quote footer { font-size: var(--fs-small); color: var(--muted); }
.quote--ph { border-left-style: dashed; }
.quote--ph .ph-tag { display: inline-block; margin: 0 0 var(--space-3) var(--space-4); font-size: .75rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  color: var(--warn-text); background: var(--warn-bg); padding: 3px 8px; border-radius: var(--radius-sm); }
.numbers { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--space-4); }
.numbers li { display: grid; grid-template-columns: 5.5rem 1fr; gap: var(--space-3); align-items: baseline; padding-bottom: var(--space-3); border-bottom: 2px solid var(--nv-lime); }
.numbers .n { font-family: var(--font-title); font-weight: 900; font-size: 2rem; color: var(--nv-blu); font-variant-numeric: tabular-nums; line-height: 1; }
.numbers .t { font-size: .95rem; }

/* ---------- Form ---------- */
.section--form { background: var(--nv-notte); position: relative; }
.section--form:focus { outline: none; }
.kicker--light { color: #DCE4F2; }
.section-title--light { color: var(--white); }
.section-title--light .hl { color: var(--nv-lime); }
.form-intro { color: #E6ECF7; }
.form-intro .req { color: var(--nv-lime); }
.form-card { background: var(--white); border-radius: var(--radius-lg); padding: var(--space-5); }

.field { margin: 0 0 var(--space-5); }
fieldset.field { border: 0; padding: 0; min-width: 0; }
label, legend { display: block; font-weight: 600; color: var(--nv-notte); margin-bottom: var(--space-2); }
legend { padding: 0; }
.req { color: var(--error); font-weight: 700; }
.opt { font-weight: 400; color: var(--muted); }
.hint { font-size: var(--fs-small); color: var(--muted); margin: var(--space-1) 0 0; }
fieldset .hint { margin: -.25rem 0 var(--space-2); }

input[type="text"], input[type="email"], input[type="tel"], select, textarea {
  width: 100%; min-height: 48px; padding: 10px 14px; font: inherit; color: var(--nv-antracite);
  background: var(--white); border: 1px solid var(--field-border); border-radius: var(--radius-sm); transition: border-color .15s, box-shadow .15s; }
textarea { resize: vertical; min-height: 96px; }
select { appearance: none; padding-right: 40px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23011D68' stroke-width='2' d='M7 10l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 10px center; background-size: 20px; }
input:hover, select:hover, textarea:hover { border-color: var(--nv-blu-testo); }
input:focus-visible, select:focus-visible, textarea:focus-visible { border-color: var(--nv-notte); box-shadow: 0 0 0 3px rgba(0,163,223,.45); }
[aria-invalid="true"] { border-color: var(--error) !important; background-color: #FFFBFA; }

.field-error { display: flex; gap: .4em; align-items: flex-start; color: var(--error); font-size: var(--fs-small); font-weight: 600; margin: var(--space-2) 0 0; }
.field-error::before { content: "!"; flex: none; display: inline-grid; place-items: center; width: 1.2em; height: 1.2em; margin-top: .15em;
  border-radius: 50%; background: var(--error); color: var(--white); font-size: .8em; }
.field-warning { color: var(--warn-text); font-size: var(--fs-small); margin: var(--space-2) 0 0; }

.choices { display: grid; gap: var(--space-2); }
.choice { display: flex; align-items: center; gap: var(--space-3); margin: 0; min-height: 52px; padding: 10px 14px;
  border: 1px solid var(--line-strong); border-radius: var(--radius-md); font-weight: 400; cursor: pointer; transition: border-color .15s, background .15s; }
.choice:hover { border-color: var(--nv-blu-testo); }
.choice:has(input:checked) { border-color: var(--nv-lime); box-shadow: inset 0 0 0 1px var(--nv-lime); background: var(--ok-bg); }
.choice input { width: 22px; height: 22px; margin: 0; accent-color: var(--nv-notte); flex: none; }
.choice input:focus-visible { box-shadow: var(--focus); border-radius: 50%; }
.choice-group[aria-invalid="true"] .choice { border-color: var(--error); }
.choice--product span { display: grid; gap: 2px; }
.choice--product small { color: var(--muted); font-size: var(--fs-small); }

.step-n { display: inline-grid; place-items: center; width: 24px; height: 24px; margin-right: 6px; border-radius: 50%;
  background: var(--nv-lime); color: var(--nv-notte); font-family: var(--font-title); font-weight: 900; font-size: .8rem; vertical-align: 1px; }
.step-title { font-weight: 700; color: var(--nv-notte); font-size: 1.05rem; margin: var(--space-2) 0 var(--space-4); padding-top: var(--space-4); border-top: 1px solid var(--line); }
.slot-step { min-height: 52px; }
.slot-group { border: 0; padding: 0; margin: 0; min-width: 0; }
.slot-placeholder { margin: 0; padding: 14px; border: 1px dashed var(--line-strong); border-radius: var(--radius-md); color: var(--muted); font-size: var(--fs-small); }
.choice.slot strong { font-variant-numeric: tabular-nums; }
.slot-badge { margin-left: auto; white-space: nowrap; font-style: normal; font-size: .8rem; font-weight: 600; }
.slot-badge:empty { display: none; }
.choice.slot.is-full { background: var(--bg-tint); border-style: dashed; cursor: not-allowed; color: var(--muted); }
.choice.slot.is-full strong { text-decoration: line-through; }
.choice.slot.is-full .slot-badge { padding: 2px 8px; border-radius: var(--radius-sm); background: var(--error-bg); color: var(--error); }
/* "Ultimi posti" in arancione */
.choice.slot.is-few .slot-badge { padding: 2px 8px; border-radius: var(--radius-sm); background: var(--orange); color: var(--nv-notte); font-weight: 700; }
.agenda-list li.is-few .ag-state { color: var(--orange-text); font-weight: 700; }
.agenda-list li.is-few .ag-state::before { background: var(--orange); }

.check { display: grid; grid-template-columns: 24px 1fr; gap: var(--space-3); align-items: start; }
.check input { width: 22px; height: 22px; margin: 2px 0 0; accent-color: var(--nv-notte); }
.check label { font-weight: 400; color: var(--nv-antracite); margin: 0; }
.check .field-error { grid-column: 2; }

.privacy-short { margin: 0 0 var(--space-5); border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--bg-tint); font-size: var(--fs-small); }
.privacy-short summary { cursor: pointer; padding: var(--space-3) var(--space-4); font-weight: 600; color: var(--nv-notte); min-height: 44px; display: flex; align-items: center; }
.privacy-short > div { padding: 0 var(--space-4) var(--space-3); }
.privacy-short p { margin-bottom: var(--space-2); }

.hp { position: absolute !important; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.turnstile-box { min-height: 65px; }

.error-summary { border: 2px solid var(--error); background: var(--error-bg); border-radius: var(--radius-md); padding: var(--space-4) var(--space-5); margin-bottom: var(--space-5); }
.error-summary h3 { color: var(--error); font-size: 1.05rem; margin-bottom: var(--space-2); }
.error-summary ul { margin: 0; padding-left: 1.2em; }
.error-summary a { color: var(--error); font-weight: 600; }
.error-summary:focus { outline: 3px solid var(--nv-notte); outline-offset: 2px; }
.form-status:not(:empty) { margin-bottom: var(--space-4); padding: var(--space-3) var(--space-4); border-radius: var(--radius-sm); background: var(--bg-tint); font-weight: 600; color: var(--nv-notte); }
.form-status.is-error { background: var(--error-bg); color: var(--error); }

.confirm { text-align: center; padding: var(--space-4) 0; animation: fadein .3s ease-out; }
@keyframes fadein { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
.confirm-ico { width: 56px; height: 56px; margin-bottom: var(--space-4); fill: var(--nv-lime); }
.confirm h3 { font-size: 1.5rem; }
.confirm h3:focus { outline: none; }
.summary { text-align: left; display: grid; grid-template-columns: max-content 1fr; gap: var(--space-2) var(--space-4); max-width: 480px;
  margin: var(--space-5) auto; padding: var(--space-4) var(--space-5); background: var(--bg-tint); border-radius: var(--radius-md); }
.summary dt { font-weight: 700; color: var(--nv-notte); }
.summary dd { margin: 0; overflow-wrap: anywhere; }
.small { font-size: var(--fs-small); }

/* ---------- Footer bianco, reticolato nell'angolo in alto a destra ---------- */
.site-footer { background: var(--white); color: var(--ink); border-top: 1px solid var(--line); font-size: .9rem;
  padding-top: var(--space-7); padding-bottom: var(--space-5); position: relative; overflow: hidden; isolation: isolate; }
.site-footer::before { content: ""; position: absolute; top: 0; right: 0; width: min(420px, 70%); height: 260px; z-index: -1; pointer-events: none;
  background-image: linear-gradient(to right, var(--grid-on-light) 1px, transparent 1px), linear-gradient(to bottom, var(--grid-on-light) 1px, transparent 1px);
  background-size: var(--grid-step) var(--grid-step);
  -webkit-mask-image: radial-gradient(circle at 100% 0, #000 20%, transparent 70%); mask-image: radial-gradient(circle at 100% 0, #000 20%, transparent 70%); }
.site-footer a { color: var(--ink-2); }
.site-footer a:hover { color: var(--nv-blu-testo); }
.footer-grid { display: grid; gap: var(--space-5); text-align: center; }
.footer-logo { display: inline-flex; justify-self: center; margin-bottom: var(--space-3); }
.footer-logo img { display: block; height: 40px; width: auto; }
.footer-h { color: var(--nv-blu-testo); font-weight: 700; font-size: .85rem; margin: 0 0 var(--space-1); }
.footer-grid p { margin-bottom: var(--space-3); }
.footer-links { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--space-1); }
.footer-links a { display: inline-block; padding: 6px 0; min-height: 32px; }
.footer-bottom { margin-top: var(--space-6); padding-top: var(--space-4); border-top: 1px solid var(--line); position: relative; font-size: .8rem; color: var(--muted); text-align: center; }
.footer-bottom p { margin: 0 0 var(--space-1); }

/* ---------- Breakpoint: tablet ---------- */
@media (min-width: 600px) {
  .grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 var(--space-4); }
  .choices--2 { grid-template-columns: 1fr 1fr; }
  .slot-group .choices { grid-template-columns: 1fr 1fr; }
  .form-card { padding: var(--space-6); }
  .footer-grid { grid-template-columns: 1fr 1fr; text-align: left; }
  .footer-logo { justify-self: start; }
  .footer-bottom { text-align: left; }
  .brand img { width: 150px; }
  .perks { grid-template-columns: repeat(3, 1fr); }
}

/* ---------- Breakpoint: desktop ---------- */
@media (min-width: 900px) {
  .container { padding-left: var(--space-5); padding-right: var(--space-5); }
  /* titolo a sinistra, blocco Stand a destra; il testo sotto occupa tutta la larghezza */
  .hero-inner { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "head box" "body body"; column-gap: var(--space-7);
    padding-top: var(--space-8); padding-bottom: var(--space-8); }
  .hero-head { grid-area: head; align-self: end; }
  .hero-body { grid-area: body; }
  .br-md { display: inline; }
  /* il blocco Stand 92 sporge leggermente sopra il bordo dell'hero, fuori dalla griglia */
  .stand-box { grid-area: box; justify-self: end; align-self: start; min-width: 320px; padding: var(--space-6) var(--space-7); gap: 4px; }
  .stand-box .sb-label { font-size: 1rem; }
  .stand-box .sb-brand { font-size: 1.05rem; }
  .stand-box .sb-place { font-size: 1.1rem; padding-top: 12px; }
  .stand-box .sb-num { font-size: 8rem; margin: 6px 0; }
  .product-row { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: var(--space-8); }
  .product-row--rev { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); }
  .product-row--rev .photo-ph { order: -1; }
  .agenda { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--space-7); }
  .facts { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: var(--space-8); }
  .footer-grid { grid-template-columns: 1.3fr 1fr 1fr 1fr; }
}

/* Frase introduttiva su una sola riga dove c'è spazio */
.section-lead--one { max-width: none; }
@media (min-width: 1000px) { .section-lead--one { white-space: nowrap; } }

@media print {
  .site-header, .section--form, .skip-link, .has-grid::before { display: none; }
  .hero { color: #000; background: none; }
}

/* Mobile: blocco Stand verticale come su desktop, a tutta larghezza */
@media (max-width: 899px) {
  .stand-box { justify-self: stretch; padding: var(--space-5); }
  .stand-box .sb-label { font-size: .9rem; }
  .stand-box .sb-brand { font-size: 1rem; }
  .stand-box .sb-num { font-size: 5.5rem; }
  .stand-box .sb-place { font-size: 1rem; max-width: 260px; }
}


/* Accento verde: trattino sotto il logo del footer */
.footer-logo { position: relative; padding-bottom: var(--space-2); }
.footer-logo::after { content: ""; position: absolute; left: 0; bottom: 0; width: 40px; height: 3px; background: var(--nv-lime); border-radius: 2px; }
@media (max-width: 599px) { .footer-logo::after { left: 50%; transform: translateX(-50%); } }

/* Reticolato anche dentro il riquadro dello Stand, sfumato verso il centro */
.stand-box::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image: linear-gradient(to right, rgba(0,163,223,.28) 1px, transparent 1px), linear-gradient(to bottom, rgba(0,163,223,.28) 1px, transparent 1px);
  background-size: 16px 16px; background-position: center;
  -webkit-mask-image: radial-gradient(circle at 50% 50%, transparent 25%, #000 85%); mask-image: radial-gradient(circle at 50% 50%, transparent 25%, #000 85%); }

/* Immagini dei prodotti (dalle grafiche delle pareti dello stand) */
.product-photo { margin: 0; min-width: 0; }
.product-photo img { display: block; width: 100%; height: auto; border-radius: var(--radius-md); }
.product-photo--portrait { justify-self: center; width: 100%; max-width: 240px; }
@media (min-width: 900px) { .product-photo--portrait { max-width: 300px; } }
@media (min-width: 900px) { .product-row--rev .product-photo { order: -1; } }

/* Numero 1 / 2 a fianco del nome del servizio */
.product-title { display: flex; align-items: center; gap: var(--space-3); }
.product-title .product-num { margin-bottom: 0; flex: none; }

/* Etichette con il trattino verde (sopra i titoli): carattere più grande */
.kicker, .hero-eyebrow { font-size: 1.1rem; }
.kicker::before, .hero-eyebrow::before { width: 32px; height: 4px; }
@media (min-width: 900px) { .kicker, .hero-eyebrow { font-size: 1.2rem; } }

/* Testi giustificati, con sillabazione italiana per evitare spazi larghi tra le parole */
main p, main .hint, .privacy-short p, .perks span, .check label { text-align: justify; -webkit-hyphens: auto; hyphens: auto; }
.confirm p { text-align: center; }
/* I nomi dei servizi in grassetto non vanno mai spezzati */
main strong { -webkit-hyphens: none; hyphens: none; white-space: nowrap; }

/* Logo dell'Assemblea ANCI nell'hero */
.anci-logo { display: block; width: 100%; max-width: 360px; height: auto; margin: 0 0 var(--space-5);
  border: 1px solid rgba(255,255,255,.25); border-radius: var(--radius-md); }
@media (min-width: 900px) { .anci-logo { max-width: 400px; } }

/* ==========================================================================
   Reticolato NV Group (rete di nodi e linee, come nel logo) al posto della griglia a quadretti.
   Solo nel riquadro blu in alto; nessuna griglia nelle altre sezioni.
   ========================================================================== */
.has-grid::before { background-image: none; }
.site-footer::before, .stand-box::before { content: none; }
.hero.has-grid::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='480' height='480' viewBox='0 0 480 480'%3E%3Cpath d='M-51 -64L-38 58 M-51 -64L32 23 M-38 58L32 23 M-38 58L-23 109 M-38 58L27 -34 M-23 109L19 122 M-23 109L19 200 M-47 218L19 200 M-47 218L-57 264 M-47 218L19 122 M-57 264L37 259 M-57 264L-53 359 M-53 359L-51 416 M-53 359L37 259 M-51 416L-38 538 M-51 416L32 503 M-38 538L32 503 M-38 538L-23 589 M-38 538L27 446 M27 -34L99 -61 M27 -34L32 23 M27 -34L127 -126 M32 23L124 35 M32 23L19 122 M19 122L98 137 M19 122L19 200 M19 122L124 35 M19 200L103 182 M19 200L37 259 M37 259L135 265 M37 259L103 182 M36 376L127 354 M36 376L27 446 M36 376L99 419 M27 446L99 419 M27 446L32 503 M27 446L127 354 M32 503L124 515 M32 503L19 602 M99 -61L182 -44 M124 35L209 37 M124 35L98 137 M124 35L182 -44 M98 137L204 118 M98 137L103 182 M98 137L214 210 M103 182L214 210 M103 182L135 265 M103 182L204 118 M135 265L127 354 M135 265L211 350 M127 354L211 350 M127 354L99 419 M127 354L204 281 M99 419L182 436 M124 515L209 517 M124 515L98 617 M124 515L182 436 M182 -44L296 -99 M209 37L263 39 M209 37L204 118 M209 37L288 133 M204 118L288 133 M204 118L214 210 M204 118L263 39 M214 210L204 281 M214 210L285 284 M204 281L211 350 M204 281L298 191 M211 350L296 381 M211 350L182 436 M211 350L288 419 M182 436L296 381 M209 517L263 519 M209 517L204 598 M209 517L288 613 M288 -61L378 -60 M288 -61L263 39 M288 -61L367 64 M263 39L367 64 M263 39L288 133 M263 39L378 -60 M288 133L350 115 M288 133L298 191 M288 133L337 198 M298 191L337 198 M298 191L285 284 M296 381L288 419 M296 381L342 259 M288 419L378 420 M288 419L263 519 M288 419L367 544 M263 519L367 544 M263 519L288 613 M263 519L378 420 M378 -60L427 -121 M367 64L442 58 M367 64L350 115 M367 64L457 109 M350 115L457 109 M350 115L442 58 M342 259L423 264 M342 259L342 348 M342 259L433 218 M342 348L427 359 M342 348L378 420 M342 348L429 416 M378 420L427 359 M367 544L442 538 M367 544L350 595 M367 544L457 589 M429 -64L442 58 M429 -64L512 23 M442 58L512 23 M442 58L457 109 M442 58L507 -34 M457 109L499 122 M457 109L499 200 M433 218L499 200 M433 218L423 264 M433 218L499 122 M423 264L517 259 M423 264L427 359 M427 359L429 416 M427 359L517 259 M429 416L442 538 M429 416L512 503 M442 538L512 503 M442 538L457 589 M442 538L507 446 M507 -34L579 -61 M507 -34L512 23 M507 -34L607 -126 M512 23L604 35 M512 23L499 122 M499 122L578 137 M499 122L499 200 M499 122L604 35 M499 200L583 182 M499 200L517 259 M517 259L615 265 M517 259L583 182 M516 376L607 354 M516 376L507 446 M516 376L579 419 M507 446L579 419 M507 446L512 503 M507 446L607 354 M512 503L604 515 M512 503L499 602' stroke='%2300A3DF' stroke-width='1' stroke-opacity='.55' fill='none'/%3E%3Ccircle cx='32' cy='23' r='3.9' fill='%2300A3DF'/%3E%3Ccircle cx='19' cy='122' r='3.2' fill='%2300A3DF'/%3E%3Ccircle cx='19' cy='200' r='2.3' fill='%2300A3DF'/%3E%3Ccircle cx='37' cy='259' r='2.4' fill='%2300A3DF'/%3E%3Ccircle cx='36' cy='376' r='2.5' fill='%2300A3DF'/%3E%3Ccircle cx='27' cy='446' r='4.7' fill='%23FFFFFF'/%3E%3Ccircle cx='124' cy='35' r='4.7' fill='%23FFFFFF'/%3E%3Ccircle cx='98' cy='137' r='3.0' fill='%2300A3DF'/%3E%3Ccircle cx='103' cy='182' r='3.0' fill='%2300A3DF'/%3E%3Ccircle cx='135' cy='265' r='3.7' fill='%2300A3DF'/%3E%3Ccircle cx='127' cy='354' r='3.6' fill='%2300A3DF'/%3E%3Ccircle cx='99' cy='419' r='2.7' fill='%2300A3DF'/%3E%3Ccircle cx='209' cy='37' r='3.0' fill='%2300A3DF'/%3E%3Ccircle cx='204' cy='118' r='3.0' fill='%2300A3DF'/%3E%3Ccircle cx='214' cy='210' r='2.8' fill='%2300A3DF'/%3E%3Ccircle cx='204' cy='281' r='4.5' fill='%23FFFFFF'/%3E%3Ccircle cx='211' cy='350' r='4.7' fill='%23FFFFFF'/%3E%3Ccircle cx='182' cy='436' r='4.2' fill='%2300A3DF'/%3E%3Ccircle cx='263' cy='39' r='2.3' fill='%2300A3DF'/%3E%3Ccircle cx='288' cy='133' r='3.7' fill='%2300A3DF'/%3E%3Ccircle cx='298' cy='191' r='4.0' fill='%2300A3DF'/%3E%3Ccircle cx='285' cy='284' r='3.4' fill='%2300A3DF'/%3E%3Ccircle cx='296' cy='381' r='3.4' fill='%2300A3DF'/%3E%3Ccircle cx='288' cy='419' r='4.0' fill='%2300A3DF'/%3E%3Ccircle cx='367' cy='64' r='4.3' fill='%2300A3DF'/%3E%3Ccircle cx='350' cy='115' r='3.9' fill='%2300A3DF'/%3E%3Ccircle cx='337' cy='198' r='2.6' fill='%2300A3DF'/%3E%3Ccircle cx='342' cy='259' r='4.2' fill='%2300A3DF'/%3E%3Ccircle cx='342' cy='348' r='3.2' fill='%2300A3DF'/%3E%3Ccircle cx='378' cy='420' r='3.4' fill='%2300A3DF'/%3E%3Ccircle cx='442' cy='58' r='4.3' fill='%2300A3DF'/%3E%3Ccircle cx='457' cy='109' r='3.3' fill='%2300A3DF'/%3E%3Ccircle cx='433' cy='218' r='4.7' fill='%23FFFFFF'/%3E%3Ccircle cx='423' cy='264' r='2.8' fill='%2300A3DF'/%3E%3Ccircle cx='427' cy='359' r='3.7' fill='%2300A3DF'/%3E%3Ccircle cx='429' cy='416' r='3.3' fill='%2300A3DF'/%3E%3C/svg%3E");
  background-size: 480px 480px; background-position: 70% 30%;
  opacity: .5;
  -webkit-mask-image: linear-gradient(to right, rgba(0,0,0,.35) 0%, rgba(0,0,0,.6) 40%, #000 75%);
          mask-image: linear-gradient(to right, rgba(0,0,0,.35) 0%, rgba(0,0,0,.6) 40%, #000 75%); }
@media (max-width: 599px) { .hero.has-grid::before { background-size: 360px 360px; opacity: .4; } }

/* Reticolato NV Group anche nel fondo blu della prenotazione (dietro al modulo) */
.section--form { isolation: isolate; overflow: hidden; }
.section--form::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='480' height='480' viewBox='0 0 480 480'%3E%3Cpath d='M-51 -64L-38 58 M-51 -64L32 23 M-38 58L32 23 M-38 58L-23 109 M-38 58L27 -34 M-23 109L19 122 M-23 109L19 200 M-47 218L19 200 M-47 218L-57 264 M-47 218L19 122 M-57 264L37 259 M-57 264L-53 359 M-53 359L-51 416 M-53 359L37 259 M-51 416L-38 538 M-51 416L32 503 M-38 538L32 503 M-38 538L-23 589 M-38 538L27 446 M27 -34L99 -61 M27 -34L32 23 M27 -34L127 -126 M32 23L124 35 M32 23L19 122 M19 122L98 137 M19 122L19 200 M19 122L124 35 M19 200L103 182 M19 200L37 259 M37 259L135 265 M37 259L103 182 M36 376L127 354 M36 376L27 446 M36 376L99 419 M27 446L99 419 M27 446L32 503 M27 446L127 354 M32 503L124 515 M32 503L19 602 M99 -61L182 -44 M124 35L209 37 M124 35L98 137 M124 35L182 -44 M98 137L204 118 M98 137L103 182 M98 137L214 210 M103 182L214 210 M103 182L135 265 M103 182L204 118 M135 265L127 354 M135 265L211 350 M127 354L211 350 M127 354L99 419 M127 354L204 281 M99 419L182 436 M124 515L209 517 M124 515L98 617 M124 515L182 436 M182 -44L296 -99 M209 37L263 39 M209 37L204 118 M209 37L288 133 M204 118L288 133 M204 118L214 210 M204 118L263 39 M214 210L204 281 M214 210L285 284 M204 281L211 350 M204 281L298 191 M211 350L296 381 M211 350L182 436 M211 350L288 419 M182 436L296 381 M209 517L263 519 M209 517L204 598 M209 517L288 613 M288 -61L378 -60 M288 -61L263 39 M288 -61L367 64 M263 39L367 64 M263 39L288 133 M263 39L378 -60 M288 133L350 115 M288 133L298 191 M288 133L337 198 M298 191L337 198 M298 191L285 284 M296 381L288 419 M296 381L342 259 M288 419L378 420 M288 419L263 519 M288 419L367 544 M263 519L367 544 M263 519L288 613 M263 519L378 420 M378 -60L427 -121 M367 64L442 58 M367 64L350 115 M367 64L457 109 M350 115L457 109 M350 115L442 58 M342 259L423 264 M342 259L342 348 M342 259L433 218 M342 348L427 359 M342 348L378 420 M342 348L429 416 M378 420L427 359 M367 544L442 538 M367 544L350 595 M367 544L457 589 M429 -64L442 58 M429 -64L512 23 M442 58L512 23 M442 58L457 109 M442 58L507 -34 M457 109L499 122 M457 109L499 200 M433 218L499 200 M433 218L423 264 M433 218L499 122 M423 264L517 259 M423 264L427 359 M427 359L429 416 M427 359L517 259 M429 416L442 538 M429 416L512 503 M442 538L512 503 M442 538L457 589 M442 538L507 446 M507 -34L579 -61 M507 -34L512 23 M507 -34L607 -126 M512 23L604 35 M512 23L499 122 M499 122L578 137 M499 122L499 200 M499 122L604 35 M499 200L583 182 M499 200L517 259 M517 259L615 265 M517 259L583 182 M516 376L607 354 M516 376L507 446 M516 376L579 419 M507 446L579 419 M507 446L512 503 M507 446L607 354 M512 503L604 515 M512 503L499 602' stroke='%2300A3DF' stroke-width='1' stroke-opacity='.55' fill='none'/%3E%3Ccircle cx='32' cy='23' r='3.9' fill='%2300A3DF'/%3E%3Ccircle cx='19' cy='122' r='3.2' fill='%2300A3DF'/%3E%3Ccircle cx='19' cy='200' r='2.3' fill='%2300A3DF'/%3E%3Ccircle cx='37' cy='259' r='2.4' fill='%2300A3DF'/%3E%3Ccircle cx='36' cy='376' r='2.5' fill='%2300A3DF'/%3E%3Ccircle cx='27' cy='446' r='4.7' fill='%23FFFFFF'/%3E%3Ccircle cx='124' cy='35' r='4.7' fill='%23FFFFFF'/%3E%3Ccircle cx='98' cy='137' r='3.0' fill='%2300A3DF'/%3E%3Ccircle cx='103' cy='182' r='3.0' fill='%2300A3DF'/%3E%3Ccircle cx='135' cy='265' r='3.7' fill='%2300A3DF'/%3E%3Ccircle cx='127' cy='354' r='3.6' fill='%2300A3DF'/%3E%3Ccircle cx='99' cy='419' r='2.7' fill='%2300A3DF'/%3E%3Ccircle cx='209' cy='37' r='3.0' fill='%2300A3DF'/%3E%3Ccircle cx='204' cy='118' r='3.0' fill='%2300A3DF'/%3E%3Ccircle cx='214' cy='210' r='2.8' fill='%2300A3DF'/%3E%3Ccircle cx='204' cy='281' r='4.5' fill='%23FFFFFF'/%3E%3Ccircle cx='211' cy='350' r='4.7' fill='%23FFFFFF'/%3E%3Ccircle cx='182' cy='436' r='4.2' fill='%2300A3DF'/%3E%3Ccircle cx='263' cy='39' r='2.3' fill='%2300A3DF'/%3E%3Ccircle cx='288' cy='133' r='3.7' fill='%2300A3DF'/%3E%3Ccircle cx='298' cy='191' r='4.0' fill='%2300A3DF'/%3E%3Ccircle cx='285' cy='284' r='3.4' fill='%2300A3DF'/%3E%3Ccircle cx='296' cy='381' r='3.4' fill='%2300A3DF'/%3E%3Ccircle cx='288' cy='419' r='4.0' fill='%2300A3DF'/%3E%3Ccircle cx='367' cy='64' r='4.3' fill='%2300A3DF'/%3E%3Ccircle cx='350' cy='115' r='3.9' fill='%2300A3DF'/%3E%3Ccircle cx='337' cy='198' r='2.6' fill='%2300A3DF'/%3E%3Ccircle cx='342' cy='259' r='4.2' fill='%2300A3DF'/%3E%3Ccircle cx='342' cy='348' r='3.2' fill='%2300A3DF'/%3E%3Ccircle cx='378' cy='420' r='3.4' fill='%2300A3DF'/%3E%3Ccircle cx='442' cy='58' r='4.3' fill='%2300A3DF'/%3E%3Ccircle cx='457' cy='109' r='3.3' fill='%2300A3DF'/%3E%3Ccircle cx='433' cy='218' r='4.7' fill='%23FFFFFF'/%3E%3Ccircle cx='423' cy='264' r='2.8' fill='%2300A3DF'/%3E%3Ccircle cx='427' cy='359' r='3.7' fill='%2300A3DF'/%3E%3Ccircle cx='429' cy='416' r='3.3' fill='%2300A3DF'/%3E%3C/svg%3E");
  background-size: 480px 480px; background-position: 20% 10%; opacity: .5;
  -webkit-mask-image: linear-gradient(to bottom, #000 0%, rgba(0,0,0,.7) 60%, rgba(0,0,0,.35) 100%);
          mask-image: linear-gradient(to bottom, #000 0%, rgba(0,0,0,.7) 60%, rgba(0,0,0,.35) 100%); }
@media (max-width: 599px) { .section--form::before { background-size: 360px 360px; opacity: .4; } }
