/* ============================================================
   Lanzo · Formulario de demo (compartido)
   Reproduce uploads/formulario_demo.html. Scope: .lz-demo
   No pisa estilos existentes: todo cuelga de .lz-demo
   ============================================================ */
.lz-demo{
  --df-card:#FFFFFF; --df-border:#E4E4EC; --df-line:#ECECF2; --df-field:#FCFBFA;
  --df-midnight:#1B1F3B; --df-ink:#3A3F5C; --df-soft:#4A50A8; --df-tint:#E8E9F5; --df-muted:#6B7194;
  --df-emerald:#00C49A; --df-emerald-deep:#00A882;
  --df-sans:"Plus Jakarta Sans",system-ui,sans-serif;
  max-width:560px; margin:52px auto 0; font-family:var(--df-sans); color:var(--df-midnight);
}

.lz-demo .df-card{ background:var(--df-card); border:.5px solid var(--df-border); border-radius:16px; padding:26px 26px 24px; }

.lz-demo .df-eyebrow{ display:inline-block; background:var(--df-tint); color:var(--df-soft); font-size:11px; font-weight:600; letter-spacing:.05em; text-transform:uppercase; padding:5px 11px; border-radius:8px; margin-bottom:14px; }
.lz-demo h3.df-title{ margin:0 0 6px; font-size:23px; font-weight:600; letter-spacing:-.01em; color:var(--df-midnight); line-height:1.2; }
.lz-demo .df-sub{ font-size:14px; color:var(--df-muted); margin:0 0 22px; line-height:1.5; }

.lz-demo .df-row{ display:flex; gap:12px; }
.lz-demo .df-field{ margin-bottom:15px; flex:1; min-width:0; }
.lz-demo .df-field label{ display:block; font-size:12.5px; font-weight:500; color:var(--df-midnight); margin-bottom:6px; }
.lz-demo .df-opt{ color:var(--df-muted); font-weight:400; }
.lz-demo .df-req{ color:var(--df-soft); font-weight:600; }
.lz-demo .df-inp{ width:100%; background:var(--df-field); border:.5px solid var(--df-border); border-radius:9px; padding:11px 12px; font:inherit; font-size:14px; color:var(--df-ink); height:auto; }
.lz-demo .df-inp::placeholder{ color:#A6A9BD; }
.lz-demo .df-inp:focus{ outline:none; border-color:var(--df-soft); box-shadow:0 0 0 3px rgba(74,80,168,.10); }
.lz-demo select.df-inp{ appearance:none; -webkit-appearance:none; background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%236B7194' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><path d='m4 6 4 4 4-4'/></svg>"); background-repeat:no-repeat; background-position:right 12px center; }

.lz-demo .df-chips{ display:flex; flex-wrap:wrap; gap:8px; }
.lz-demo .df-chip{ font-size:13px; font-weight:500; color:var(--df-ink); background:var(--df-field); border:.5px solid var(--df-border); border-radius:9px; padding:9px 13px; cursor:pointer; user-select:none; }
.lz-demo .df-chip.sel{ background:var(--df-tint); border-color:var(--df-soft); color:var(--df-soft); font-weight:600; }

.lz-demo textarea.df-inp{ resize:none; min-height:64px; }

.lz-demo .df-consents{ margin-top:6px; border-top:.5px solid var(--df-line); padding-top:16px; }
.lz-demo .df-check{ display:flex; gap:11px; align-items:flex-start; margin-bottom:12px; cursor:pointer; }
.lz-demo .df-box{ flex:0 0 auto; width:20px; height:20px; border-radius:6px; border:1.2px solid #C7C9D6; background:var(--df-card); margin-top:1px; position:relative; }
.lz-demo .df-box.on{ background:var(--df-emerald); border-color:var(--df-emerald); }
.lz-demo .df-box.on::after{ content:""; position:absolute; left:6.5px; top:3px; width:5px; height:9px; border:solid #fff; border-width:0 2px 2px 0; transform:rotate(45deg); }
.lz-demo .df-ctxt{ font-size:12.5px; line-height:1.5; color:var(--df-ink); }
.lz-demo .df-ctxt a{ color:var(--df-soft); text-decoration:underline; text-underline-offset:2px; }

.lz-demo .df-error{ font-size:12.5px; color:#C2410C; margin:-4px 0 12px; display:none; }
.lz-demo .df-error.show{ display:block; }

.lz-demo .df-cta{ width:100%; margin-top:8px; background:var(--df-emerald); color:#fff; border:0; border-radius:11px; padding:14px; font:inherit; font-size:15px; font-weight:600; cursor:pointer; transition:background .15s ease-out; }
.lz-demo .df-cta:hover{ background:var(--df-emerald-deep); }
.lz-demo .df-trust{ display:flex; align-items:center; justify-content:center; gap:7px; font-size:12.5px; color:var(--df-muted); margin-top:13px; text-align:center; }
.lz-demo .df-trust svg{ width:14px; height:14px; color:var(--df-emerald-deep); flex:none; }

/* estado de gracias */
.lz-demo .df-thanks{ display:none; text-align:center; padding:34px 26px; }
.lz-demo.is-sent .df-form{ display:none; }
.lz-demo.is-sent .df-thanks{ display:block; }
.lz-demo .df-ring{ width:54px; height:54px; color:var(--df-emerald); margin:0 auto 16px; }
.lz-demo .df-thanks h3{ font-size:22px; margin:0 0 8px; font-weight:600; color:var(--df-midnight); }
.lz-demo .df-thanks p{ font-size:14.5px; color:var(--df-muted); line-height:1.55; margin:0 auto 20px; max-width:380px; }
.lz-demo .df-wa{ display:inline-flex; align-items:center; gap:9px; background:var(--df-card); border:.5px solid var(--df-border); border-radius:11px; padding:11px 18px; font-size:14px; font-weight:600; color:var(--df-midnight); cursor:pointer; }
.lz-demo .df-wa svg{ width:17px; height:17px; color:var(--df-emerald-deep); }

@media (max-width:520px){ .lz-demo .df-row{ flex-direction:column; flex-wrap:nowrap; gap:0; } }