/* Modal "Contatta l'agenzia" (scheda annuncio) e "Verifica la fattibilità" (/mutuo): stesso disegno per entrambi.
   La classe .vq-modal è ripetuta nei selettori per prevalere sulle vecchie regole di mutuo.css e scheda.css. */

.modal.vq-modal.vq-modal { padding: 28px 14px; background: rgba(16, 26, 51, .66); }
.vq-modal.vq-modal .vq-dialog { max-width: 960px; margin: 0 auto; position: relative; }

.vq-modal.vq-modal .vq-card {
    position: relative; display: grid; grid-template-columns: minmax(0, 350px) minmax(0, 1fr);
    background: #fff; border-radius: 26px; overflow: hidden; box-shadow: 0 30px 80px rgba(16, 26, 51, .45);
}

/* ---------- pannello a sinistra ---------- */
.vq-modal.vq-modal .vq-lato {
    position: relative; display: flex; flex-direction: column; gap: 14px; padding: 38px 32px 32px; color: #fff; overflow: hidden;
    background: radial-gradient(420px 280px at 0% 0%, rgba(255, 101, 8, .40), transparent 70%), linear-gradient(165deg, #1d2f57, #101a33);
}
.vq-modal.vq-modal .vq-lato::after {
    content: ""; position: absolute; right: -80px; bottom: -80px; width: 240px; height: 240px; border-radius: 50%;
    border: 36px solid rgba(255, 255, 255, .06); pointer-events: none;
}
.vq-modal.vq-modal .vq-logo { width: 48px; height: 48px; padding: 6px; border-radius: 13px; background: #fff; object-fit: contain; }
.vq-modal.vq-modal .vq-kicker { margin: 8px 0 0; font-size: 12px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #ffb27d; }
.vq-modal.vq-modal .vq-lato h2 { margin: 0; font-size: 28px; line-height: 1.15; font-weight: 800; color: #fff; letter-spacing: -.01em; }
.vq-modal.vq-modal .vq-sub { margin: 0; font-size: 14.5px; line-height: 1.6; color: #d6dcea; }
.vq-modal.vq-modal .vq-punti { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 13px; }
.vq-modal.vq-modal .vq-punti li { display: flex; gap: 11px; align-items: flex-start; font-size: 14px; line-height: 1.45; color: #fff; }
.vq-modal.vq-modal .vq-punti li::before {
    content: ""; flex: none; width: 22px; height: 22px; border-radius: 50%;
    background: #ff6508 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7'/%3E%3C/svg%3E") center / 13px no-repeat;
}
.vq-modal.vq-modal .vq-immobile {
    margin-top: auto; padding: 14px 16px; border-radius: 16px; font-size: 13px; line-height: 1.4; color: #d6dcea;
    background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .14); position: relative; z-index: 1;
}
.vq-modal.vq-modal .vq-immobile strong { display: block; margin-bottom: 2px; font-size: 15px; color: #fff; }

/* ---------- form a destra ---------- */
.vq-modal.vq-modal .vq-corpo { padding: 36px 36px 30px; background: #fff; }
.vq-modal.vq-modal .vq-corpo h3 { margin: 0 44px 4px 0; font-size: 20px; font-weight: 800; color: #172541; letter-spacing: -.01em; }
.vq-modal.vq-modal .vq-corpo .vq-intro { margin: 0 0 20px; font-size: 14px; line-height: 1.55; color: #6b7488; }
.vq-modal.vq-modal .vq-griglia { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 16px; }
.vq-modal.vq-modal .vq-pieno { grid-column: 1 / -1; }
.vq-modal.vq-modal .vq-campo { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.vq-modal.vq-modal .vq-campo label { font-size: 11.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: #6b7488; }
.vq-modal.vq-modal .vq-campo label i { color: #ff6508; font-style: normal; }
.vq-modal.vq-modal .vq-campo input,
.vq-modal.vq-modal .vq-campo select,
.vq-modal.vq-modal .vq-campo textarea {
    width: 100%; margin: 0; padding: 13px 14px; font: inherit; font-size: 15px; line-height: 1.3; color: #172541;
    background: #fff; border: 1.5px solid #dfe3ea; border-radius: 14px; outline: none; box-shadow: none; appearance: auto;
    transition: border-color .15s, box-shadow .15s;
}
.vq-modal.vq-modal .vq-campo select { appearance: none; padding-right: 38px; cursor: pointer;
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7488' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") right 12px center / 18px no-repeat; }
.vq-modal.vq-modal .vq-campo textarea { min-height: 84px; resize: vertical; }
.vq-modal.vq-modal .vq-campo input::placeholder,
.vq-modal.vq-modal .vq-campo textarea::placeholder { color: #9aa3b5; }
.vq-modal.vq-modal .vq-campo input:focus,
.vq-modal.vq-modal .vq-campo select:focus,
.vq-modal.vq-modal .vq-campo textarea:focus { border-color: #ff6508; box-shadow: 0 0 0 4px rgba(255, 101, 8, .14); }

.vq-modal.vq-modal .vq-consensi { display: grid; gap: 11px; margin-top: 18px; }
.vq-modal.vq-modal .vq-consenso { display: flex; gap: 10px; align-items: flex-start; font-size: 11px; line-height: 1.5; color: #4a556f; cursor: pointer; }
.vq-modal.vq-modal .vq-consenso input { flex: none; width: 17px; height: 17px; min-width: 17px; margin: 1px 0 0; padding: 0; accent-color: #ff6508; appearance: auto; cursor: pointer; }
.vq-modal.vq-modal .vq-consenso a { color: #e85d09; text-decoration: underline; font-weight: 600; }

.vq-modal.vq-modal .vq-invia {
    display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; margin-top: 20px; padding: 16px 22px;
    border: 0; border-radius: 14px; background: #ff6508; color: #fff; font: inherit; font-size: 16px; font-weight: 800; cursor: pointer;
    box-shadow: 0 10px 26px rgba(255, 101, 8, .30); transition: background .15s, transform .08s, box-shadow .15s;
}
.vq-modal.vq-modal .vq-invia:hover { background: #ef5900; box-shadow: 0 12px 30px rgba(255, 101, 8, .36); }
.vq-modal.vq-modal .vq-invia:active { transform: translateY(1px); }
.vq-modal.vq-modal .vq-invia svg { width: 18px; height: 18px; flex: none; }
.vq-modal.vq-modal .vq-nota { margin: 12px 0 0; text-align: center; font-size: 12px; color: #8b94a8; }

/* ---------- chiusura ---------- */
.vq-modal.vq-modal .vq-chiudi {
    position: absolute; top: 16px; right: 16px; z-index: 4; display: flex; align-items: center; justify-content: center;
    width: 40px; height: 40px; padding: 0; border: 0; border-radius: 50%; background: #f1f3f7; color: #172541; cursor: pointer;
    transition: background .15s;
}
.vq-modal.vq-modal .vq-chiudi:hover { background: #e4e8ef; }
.vq-modal.vq-modal .vq-chiudi svg { width: 18px; height: 18px; }

/* ---------- conferma dopo l'invio ---------- */
.vq-modal.vq-modal .vq-ok { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; min-height: 100%; padding: 36px 8px; text-align: center; }
.vq-modal.vq-modal .vq-ok-ico { width: 76px; height: 76px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: #e6f6ee; color: #1a9e5c; }
.vq-modal.vq-modal .vq-ok-ico svg { width: 38px; height: 38px; }
.vq-modal.vq-modal .vq-ok h3 { margin: 6px 0 0; font-size: 24px; }
.vq-modal.vq-modal .vq-ok p { margin: 0; max-width: 380px; font-size: 15px; line-height: 1.6; color: #4a556f; }
.vq-modal.vq-modal .vq-ok .vq-invia { width: auto; margin-top: 12px; padding: 14px 28px; }

/* ---------- telefono ---------- */
@media (max-width: 820px) {
    .modal.vq-modal.vq-modal { padding: 10px 8px; }
    .vq-modal.vq-modal .vq-card { grid-template-columns: 1fr; border-radius: 22px; }
    .vq-modal.vq-modal .vq-lato { padding: 26px 22px 22px; gap: 10px; }
    .vq-modal.vq-modal .vq-lato h2 { margin-right: 44px; font-size: 23px; }
    .vq-modal.vq-modal .vq-sub { font-size: 13.5px; line-height: 1.5; }
    .vq-modal.vq-modal .vq-logo { width: 40px; height: 40px; }
    .vq-modal.vq-modal .vq-punti, .vq-modal.vq-modal .vq-immobile { display: none; }
    .vq-modal.vq-modal .vq-corpo { padding: 24px 20px 22px; }
    .vq-modal.vq-modal .vq-griglia { grid-template-columns: 1fr; }
    .vq-modal.vq-modal .vq-chiudi { top: 12px; right: 12px; background: rgba(255, 255, 255, .16); color: #fff; }
    .vq-modal.vq-modal .vq-chiudi:hover { background: rgba(255, 255, 255, .28); }
}
