:root{
    --bg:#f6f8fb;
    --card:#ffffff;
    --ink:#0f172a;
    --muted:#64748b;
    --accent:#2563eb;
    --accent-2:#60a5fa;
    --ring: rgba(37,99,235,.35);
    --ok:#16a34a;
    --warn:#ca8a04;
    --err:#dc2626;
    --chip:#eef2ff;
    --chip-text:#3730a3;
    --border: rgba(15,23,42,0.08);
    --gap: 14px;
    --radius: 14px;
    --shadow: 0 10px 30px rgba(15,23,42,.08);
}

*{box-sizing:border-box}
body{
    margin:0; font: 16px/1.45 system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji","Segoe UI Emoji";
    color:var(--ink); background:linear-gradient(180deg,#f7f9ff 0,#f6f8fb 100%);
}
.wrap{ width:min(960px, 95%); margin: 28px auto 40px; }
header.brand{
    display:flex; align-items:center; justify-content:center; gap:10px; margin: 10px 0 22px;
}
header.brand img{ height:36px; width:auto; display:block }

.card{
    background:var(--card); border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow);
    padding: clamp(18px, 3.6vw, 30px);
}
.card h1{
    font-size: clamp(22px, 3.2vw, 30px); margin:0 0 6px; letter-spacing:.2px;
}
.card p.lead{ color:var(--muted); margin:0 0 18px; }

form{ display:grid; gap: clamp(14px, 2.4vw, 18px); }
.grid{ display:grid; gap: var(--gap); grid-template-columns: repeat(12, 1fr); }
.col-6{ grid-column: span 6; }
.col-12{ grid-column: span 12; }
@media (max-width: 800px){ .col-6{ grid-column: span 12; } }

label{ display:block; font-weight:600; font-size: 0.925rem; margin-bottom:6px; }
.hint{ color:var(--muted); font-size:.86rem; margin-top:6px; }
input[type="text"], input[type="email"], input[type="tel"], input[type="number"], textarea, select{
    width:100%; padding:12px 12px; border:1px solid var(--border); border-radius:10px; background:#fff;
    outline:none; transition: box-shadow .15s ease, border-color .15s ease;
    font: inherit;
}
textarea{ min-height:120px; resize:vertical; }
input:focus, textarea:focus, select:focus{ box-shadow:0 0 0 4px var(--ring); border-color: transparent; }

.chips{ display:flex; flex-wrap:wrap; gap:8px; }
.chip{
    background:var(--chip); color:var(--chip-text); border:1px solid rgba(55,48,163,.15);
    padding:6px 10px; border-radius:999px; font-size:.86rem; display:inline-flex; align-items:center; gap:6px;
}
.chip button{ border:none; background:transparent; cursor:pointer; font-size:16px; line-height:1; color:#6b7280; }

.options{
    display:grid; gap:10px; grid-template-columns: repeat(3, minmax(0,1fr));
}
@media (max-width:900px){ .options{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width:580px){ .options{ grid-template-columns: 1fr; } }

.opt{
    border:1px solid var(--border); border-radius:10px; padding:10px 12px; display:flex; gap:10px; align-items:flex-start;
    transition: border-color .15s ease, background-color .15s ease;
}
.opt input{ margin-top:3px; }
.opt:hover{ border-color: rgba(37,99,235,.35); background: #f8fbff; }

.row-inline{ display:flex; gap:12px; align-items:center; flex-wrap:wrap; }

.actions{ display:flex; gap:10px; align-items:center; justify-content:flex-start; flex-wrap:wrap; }
.btn{
    appearance:none; border:none; border-radius:999px; padding:12px 18px; cursor:pointer; font-weight:700; font-size:0.96rem;
    background:linear-gradient(135deg, var(--accent), var(--accent-2)); color:#fff;
    transition: transform .12s ease, filter .12s ease;
}
.btn.secondary{ background:#eef2ff; color:#111827; }
.btn:disabled{ opacity:.6; cursor:not-allowed; }
.btn:hover{ filter:brightness(1.05); transform: translateY(-1px); }

.status{ font-size:.9rem; }
.ok{ color:var(--ok) }
.warn{ color:var(--warn) }
.err{ color:var(--err) }

/* error inline */
.field-error{ margin-top:6px; color:var(--err); font-size:.86rem; }

/* honeypot – visibile ai bot, invisibile agli umani/screen reader */
.hp-wrap{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
/* reCAPTCHA placeholder */
.captcha{ border:1px dashed rgba(37,99,235,.35); padding:10px; border-radius:10px; background:#f8fbff; color:#1e293b; font-size:.9rem; }

footer.note{ color:var(--muted); font-size:.86rem; margin-top:10px; }
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;}

.options {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: .5rem .75rem;
}
.opt { display: inline-flex; align-items: center; gap: .5rem; cursor: pointer; }

.chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .75rem; }
.chip {
  border: 1px solid #ddd;
  background: #f8f8f8;
  padding: .25rem .5rem;
  border-radius: 999px;
  font-size: .9rem;
  line-height: 1;
}
.chip:hover { background: #f0f0f0; }
.chip-close { margin-left: .35rem; font-weight: 700; }