/* ============================================================
   DARTEL — «Envíenos su plano» (Catastro + plano + envío)
   Sección de la home, 4 idiomas. Todo scoped a #plano-dartel
   para no pisar (ni ser pisado por) el CSS del sitio.
   ============================================================ */

#plano-dartel{max-width:760px;margin:0 auto}
#plano-dartel .pl-paso{display:none}
#plano-dartel .pl-paso.on{display:block}
#plano-dartel .pl-card{background:var(--white);border:1px solid var(--line);border-radius:20px;padding:22px;margin-bottom:16px;box-shadow:var(--sh-sm)}
#plano-dartel .pl-lbl{display:block;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-3);margin-bottom:6px}
#plano-dartel .pl-field{position:relative;margin-top:14px}
#plano-dartel input[type=text],#plano-dartel input[type=tel],#plano-dartel input[type=email],#plano-dartel textarea,#plano-dartel select{width:100%;font-family:var(--font-body);font-size:16px;padding:13px 15px;border:1px solid var(--line);border-radius:13px;background:var(--white);color:var(--ink-1);outline:none}
#plano-dartel textarea{resize:vertical;min-height:74px}
#plano-dartel input:focus,#plano-dartel select:focus,#plano-dartel textarea:focus{border-color:var(--green);box-shadow:0 0 0 3px rgba(24,169,87,.16)}
#plano-dartel input[type=text]:disabled{background:var(--paper-2);color:var(--ink-3)}
#plano-dartel .pl-sel{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236B756D' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:18px;padding-right:38px}
#plano-dartel .pl-sug{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:30;background:var(--white);border:1px solid var(--line);border-radius:14px;box-shadow:0 12px 32px rgba(15,23,20,.13);overflow:hidden;display:none;max-height:320px;overflow-y:auto}
#plano-dartel .pl-sug.on{display:block}
#plano-dartel .pl-sug button{width:100%;display:flex;align-items:center;gap:10px;text-align:left;border:0;background:none;padding:11px 14px;cursor:pointer;font-family:var(--font-body);border-bottom:1px solid var(--paper)}
#plano-dartel .pl-sug button:last-child{border-bottom:0}
#plano-dartel .pl-sug button:hover{background:var(--paper-2)}
#plano-dartel .pl-sug b{display:block;font-size:14.5px;font-weight:600;color:var(--ink-1)}
#plano-dartel .pl-sug small{display:block;font-size:12px;color:var(--ink-3)}
#plano-dartel .pl-sug .tag{font-size:10.5px;font-weight:700;color:var(--ink-2);background:var(--paper);border-radius:6px;padding:2px 6px;flex:none}
#plano-dartel .pl-sug .hint{padding:12px 14px;font-size:13.5px;color:var(--ink-2)}
#plano-dartel .pl-spin{display:inline-block;width:12px;height:12px;margin-right:7px;border:2px solid var(--line);border-top-color:var(--green);border-radius:50%;animation:pl-gira .7s linear infinite;vertical-align:-1px}
@keyframes pl-gira{to{transform:rotate(360deg)}}
#plano-dartel .pl-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:8px}
#plano-dartel .pl-chip{border:1px solid var(--line);background:var(--white);border-radius:999px;padding:7px 13px;font-family:var(--font-body);font-size:13px;font-weight:600;color:var(--ink-2);cursor:pointer}
#plano-dartel .pl-chip.on{background:var(--ink);color:#fff;border-color:var(--ink)}
#plano-dartel .pl-tiny{font-size:12.5px;color:var(--ink-3)}
#plano-dartel .pl-volver{border:0;background:none;color:var(--ink-2);font-family:var(--font-body);font-size:14px;font-weight:600;cursor:pointer;padding:6px 0}
#plano-dartel .pl-reconoce{background:linear-gradient(180deg,#E8F7EE,var(--white));border:1px solid #BFE9CF;border-radius:20px;padding:20px 22px;margin-bottom:16px}
#plano-dartel .pl-reconoce .ok{display:flex;align-items:center;gap:9px;font-size:13px;font-weight:700;color:var(--green-deep);margin-bottom:10px}
#plano-dartel .pl-reconoce .ok svg{width:17px;height:17px;stroke:var(--green-deep);fill:none;stroke-width:2.4}
#plano-dartel .pl-reconoce h3{font-family:var(--font-display);font-size:clamp(19px,3.6vw,24px);letter-spacing:-.02em;margin:0 0 3px;line-height:1.25;color:var(--ink-1)}
#plano-dartel .pl-reconoce .d{font-size:13.5px;color:var(--ink-2);margin:0 0 15px}
#plano-dartel .pl-ficha{display:flex;flex-wrap:wrap;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:14px;overflow:hidden}
#plano-dartel .pl-ficha div{background:var(--white);padding:12px 13px;flex:1 1 122px}
#plano-dartel .pl-ficha dt{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-3);margin:0 0 2px}
#plano-dartel .pl-ficha dd{margin:0;font-family:var(--font-display);font-size:18px;font-weight:700;letter-spacing:-.02em;line-height:1.25;color:var(--ink-1)}
#plano-dartel .pl-ficha dd small{font-family:var(--font-body);font-size:12px;font-weight:500;color:var(--ink-3);letter-spacing:0}
#plano-dartel .pl-drop{border:2px dashed var(--line);border-radius:16px;padding:24px;text-align:center;cursor:pointer;transition:all .15s;background:var(--paper-2);display:block}
#plano-dartel .pl-drop:hover{border-color:var(--green);background:#E8F7EE}
#plano-dartel .pl-drop b{display:block;font-size:15.5px;margin-bottom:3px;color:var(--ink-1)}
#plano-dartel .pl-drop small{color:var(--ink-2);font-size:13px}
#plano-dartel .pl-drop svg{width:27px;height:27px;stroke:var(--green-deep);fill:none;stroke-width:1.7;margin-bottom:8px}
#plano-dartel .pl-planos{display:flex;flex-wrap:wrap;gap:10px;margin-top:13px}
#plano-dartel .pl-planos figure{margin:0;position:relative;width:100px}
#plano-dartel .pl-planos img{width:100px;height:100px;object-fit:cover;border-radius:11px;border:1px solid var(--line);display:block}
#plano-dartel .pl-planos .pdf{width:100px;height:100px;border-radius:11px;border:1px solid var(--line);background:var(--paper-2);display:grid;place-items:center;font-size:11px;font-weight:700;color:var(--ink-2);text-align:center;padding:8px;word-break:break-word}
#plano-dartel .pl-planos figcaption{font-size:10.5px;color:var(--ink-3);margin-top:3px;text-align:center}
#plano-dartel .pl-planos figure button{position:absolute;top:-6px;right:-6px;width:23px;height:23px;border-radius:50%;border:1px solid var(--line);background:var(--white);color:var(--ink-2);font-size:14px;line-height:1;cursor:pointer;box-shadow:0 2px 6px rgba(15,23,20,.14)}
#plano-dartel .pl-btn{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;border:0;border-radius:15px;padding:15px;font-family:var(--font-body);font-size:15.5px;font-weight:700;cursor:pointer;text-decoration:none;color:var(--ink-1)}
#plano-dartel .pl-btn.g{background:var(--green);color:#fff}
#plano-dartel .pl-btn.g:hover{background:var(--green-deep)}
#plano-dartel .pl-btn.g[disabled]{background:var(--paper);color:var(--ink-3);cursor:not-allowed}
#plano-dartel .pl-btn.gh{background:var(--white);border:1px solid var(--line)}
#plano-dartel .pl-btn.gh:hover{border-color:var(--border-strong)}
#plano-dartel .pl-btn svg{width:19px;height:19px;flex:none}
#plano-dartel .pl-acc{display:flex;flex-direction:column;gap:9px}
#plano-dartel .pl-o{display:flex;align-items:center;gap:12px;margin:16px 0 12px;color:var(--ink-3);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.06em}
#plano-dartel .pl-o:before,#plano-dartel .pl-o:after{content:'';flex:1;height:1px;background:var(--line)}
#plano-dartel .pl-aviso{background:#FFFBEB;border:1px solid #FDE68A;border-radius:14px;padding:12px 14px;font-size:13.5px;color:#92400E;margin-top:12px}
#plano-dartel .pl-hecho{background:#E8F7EE;border:1px solid #BFE9CF;border-radius:16px;padding:18px;text-align:center}
#plano-dartel .pl-hecho b{display:block;font-family:var(--font-display);font-size:19px;color:var(--green-deep);margin-bottom:4px}
#plano-dartel .pl-carga{text-align:center;padding:56px 0}
#plano-dartel .pl-carga .bar{height:4px;background:var(--paper);border-radius:999px;overflow:hidden;max-width:280px;margin:18px auto 0}
#plano-dartel .pl-carga .bar i{display:block;height:100%;background:var(--green);width:32%;border-radius:999px;animation:pl-corre 1.5s ease-in-out infinite}
@keyframes pl-corre{0%{margin-left:-32%}100%{margin-left:100%}}

/* Cabecera de la sección en la home */
.plano-sec{background:var(--paper)}
.plano-sec .plano-head{max-width:760px;margin:0 auto 18px}
.plano-sec .plano-head h2{font-family:var(--font-display);font-weight:800;font-size:clamp(1.5rem,3.4vw,2.1rem);letter-spacing:-.02em;line-height:1.15;color:var(--ink-1);margin:0 0 8px}
.plano-sec .plano-head p{margin:0;color:var(--ink-2);font-size:1rem;line-height:1.6;max-width:620px}

/* Aviso de confidencialidad. Va ARRIBA, antes de que escriba nada: mandar el plano de
   su casa es dar un dato personal, y quien lo va a hacer tiene que saber a dónde va
   ANTES, no en una línea pequeña al final. */
.plano-sec .pl-priv{display:flex;gap:11px;align-items:flex-start;max-width:760px;margin:0 auto 20px;padding:13px 15px;border:1px solid #BFE9CF;border-radius:16px;background:linear-gradient(180deg,#E8F7EE,var(--white))}
.plano-sec .pl-priv svg{flex:0 0 18px;width:18px;height:18px;margin-top:2px;stroke:var(--green-deep);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.plano-sec .pl-priv p{margin:0;font-size:.85rem;line-height:1.55;color:var(--ink-2)}
.plano-sec .pl-priv b{color:var(--green-deep);font-weight:700}
.plano-sec .pl-priv a{color:var(--ink-2);text-decoration:underline}
@media (max-width:520px){.plano-sec .pl-priv{padding:12px 13px}.plano-sec .pl-priv p{font-size:.81rem}}