/* provehome.com — modal Certifica + Verifica (condiviso IT/EN/DE/ES/FR/PT) */
.ph-ovl{position:fixed;inset:0;background:rgba(18,33,30,.55);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;padding:20px;z-index:100}
.ph-ovl[hidden]{display:none}
.ph-mod{background:#fff;border-radius:var(--r-xl,16px);max-width:580px;width:100%;padding:32px 36px;box-shadow:var(--sh-lg,0 24px 64px rgba(0,0,0,.18));position:relative;overflow:visible}
.ph-mod h3{font-size:22px;margin-bottom:6px}
.ph-mod .sub{color:var(--muted,#6b8079);font-size:14px;margin-bottom:20px;line-height:1.55}
.ph-mod .x{position:absolute;top:16px;right:16px;width:32px;height:32px;border:0;background:var(--surf,#f4f7f6);border-radius:9px;color:var(--muted,#6b8079);font-size:17px;cursor:pointer;line-height:1;display:flex;align-items:center;justify-content:center;transition:background .15s}
.ph-mod .x:hover{background:#e8eeec}
.ph-mod label{display:block;font-size:13px;font-weight:700;color:#12211e;margin:0 0 8px}
.ph-mod .fld{margin-bottom:18px}
.ph-mod input[type=email],.ph-mod input[type=text],.ph-mod input[type=tel]{width:100%;padding:14px 16px;border:1.5px solid #d8e0dd;border-radius:12px;transition:border-color .15s,box-shadow .15s;font:500 15px var(--font,inherit);color:var(--ink,#12211e);outline:none;box-sizing:border-box}
.ph-mod input[type=email]:focus,.ph-mod input[type=text]:focus,.ph-mod input[type=tel]:focus{border-color:#0d9488;box-shadow:0 0 0 3px rgba(13,148,136,.15)}
/* phone-input component: .phi-wrap owns the border; inner .phi-num must be borderless.
   Specificity bump: input[type=tel].phi-num (0,3,1) beats .ph-mod input[type=tel] (0,2,1). */
.ph-mod input[type=tel].phi-num{border:0;border-radius:0;padding:14px 16px;background:transparent;min-width:0;box-shadow:none}
.ph-mod input[type=tel].phi-num:focus{border:0;box-shadow:none}
.ph-mod .err{color:#c0392b;font-size:13px;margin:-6px 0 14px;display:none}
/* Invalid-field highlight (missing/wrong inputs in step 1) */
.ph-mod input.ph-invalid{border-color:#c0392b!important;box-shadow:0 0 0 3px rgba(192,57,43,.14)!important;animation:ph-shake .3s ease}
.ph-mod .phi-wrap.phi-invalid{border-color:#c0392b!important;box-shadow:0 0 0 3px rgba(192,57,43,.14)!important;animation:ph-shake .3s ease}
@keyframes ph-shake{10%,90%{transform:translateX(-2px)}30%,70%{transform:translateX(3px)}50%{transform:translateX(-3px)}}
.ph-mod .mut{font-size:12.5px;color:#6b8079;line-height:1.5;margin-top:6px}
.ph-mod .sum{background:var(--a-soft,#eef8f4);border:1px solid var(--a-line,#bcefe5);border-radius:12px;padding:14px 16px;margin-bottom:20px}
.ph-mod .sum div{font-size:14px;color:var(--ink,#12211e);padding:5px 0;word-break:break-word}
.ph-mod .sum span{display:block;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--a-ink,#0d9488);margin-bottom:2px}
.ph-mod .row{display:flex;gap:10px}
.ph-mod .row .btn{flex:1;justify-content:center}
.ph-mod .ok{text-align:center;padding:8px 0}
.ph-mod .ok .ic{width:54px;height:54px;border-radius:50%;background:var(--ok-soft,#e6faf6);color:var(--ok-ink,#0d9488);display:flex;align-items:center;justify-content:center;margin:0 auto 14px}
.ph-mod .ok .ic.info{background:#eef4ff;color:#3b6fd4}
.ph-mod .ok .ic svg{width:26px;height:26px}
.ph-mod .ok.no .ic{background:#fdecec;color:#b3261e}
.ph-mod .spin{width:54px;height:54px;border-radius:50%;border:3px solid var(--a-soft,#eef8f4);border-top-color:var(--a1,#0d9488);margin:0 auto 14px;animation:ph-sp .9s linear infinite}
@keyframes ph-sp{to{transform:rotate(360deg)}}
.ph-mod .ph-acks{margin:6px 0 18px;padding:14px 16px;background:#fff7e6;border:1px solid #f0d28a;border-radius:12px}
.ph-mod .ph-ck{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;color:var(--ink-2,#39504a);line-height:1.5;margin-bottom:10px;cursor:pointer}
.ph-mod .ph-ck:last-of-type{margin-bottom:6px}
.ph-mod .ph-ck input{width:18px;height:18px;margin:1px 0 0;accent-color:var(--a1,#0d9488);flex:none}
.ph-mod .ph-acks .fld label{font-size:12.5px;color:var(--muted,#6b8079);font-weight:700}
.ph-mod .ph-acks input[type=email]{margin-top:6px}
.ph-mod .ph-send:disabled{opacity:.45;cursor:not-allowed;filter:grayscale(.3)}
.ph-mod .ph-chan-opt:has(input:checked){border-color:#0d9488;background:#eef8f4;color:#12211e}

/* Primary / ghost button polish */
.ph-mod .ph-next,.ph-mod .ph-send{padding:15px 20px;font-size:15px;font-weight:700;border-radius:12px;transition:transform .1s,box-shadow .2s,filter .15s,background .15s}
.ph-mod .ph-next:not(:disabled):hover,.ph-mod .ph-send:not(:disabled):hover{transform:translateY(-1px);box-shadow:0 8px 20px -6px rgba(13,148,136,.4)}
.ph-mod .ph-next:active,.ph-mod .ph-send:active{transform:translateY(0)}

/* Step indicator */
.ph-mod .ph-steps{display:flex;align-items:center;gap:6px;margin:0 0 22px;padding:0;list-style:none}
.ph-mod .ph-step{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:#9fb3ad;position:relative}
.ph-mod .ph-step-n{width:26px;height:26px;border-radius:50%;background:#f4f7f6;border:2px solid #d8e0dd;display:flex;align-items:center;justify-content:center;font-size:12px;color:#9fb3ad;transition:all .2s}
.ph-mod .ph-step.active .ph-step-n{background:linear-gradient(135deg,#14b8a6,#10b981);border-color:transparent;color:#fff;box-shadow:0 4px 12px -4px rgba(20,184,166,.5)}
.ph-mod .ph-step.active{color:#12211e}
.ph-mod .ph-step.done .ph-step-n{background:#e6faf6;border-color:#bcefe5;color:#0d9488}
.ph-mod .ph-step.done .ph-step-l{color:#0d9488}
.ph-mod .ph-step:not(:last-child)::after{content:"";position:absolute;top:13px;left:60%;right:-40%;height:2px;background:#e0e7e4;z-index:-1}
.ph-mod .ph-step.done:not(:last-child)::after{background:#bcefe5}

/* Confirm step sum rows (cert) */
.ph-mod .ph-sum-row{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;border:1.5px solid transparent;border-radius:9px;transition:background .2s,border-color .2s;margin-bottom:6px}

/* Step transition support */
.ph-mod > div{transition:opacity .18s,transform .18s}

@media (max-width:600px){
  .ph-mod{padding:24px 18px;border-radius:14px}
}

@media (max-width:420px) {
  .ph-mod .ph-otp-d { width:42px !important; height:50px !important; font-size:22px !important }
  .ph-mod .ph-otp-grid { gap:6px !important }
}