/* /cotizar/ · sobria: el formulario manda, nada distrae. El contrato no cambia. */
/* ── FORMULARIO · común a /comprar/ y /cotizar/ ─────────────────────────────
   Campos grandes, etiqueta siempre visible, foco blanco y error escrito debajo
   del campo. Letra de 18 px en los campos: por debajo, iPhone amplía la página
   al enfocar. Ningún nombre, id ni validación cambia: esto es solo aspecto. */
.cx{--cx-m:clamp(16px,3.4vw,48px)}
.cx p{font-size:1.0625rem;line-height:1.5}
.cx a{color:#fff;text-underline-offset:4px}
.cx .cx-lead{font-size:clamp(1.1875rem,1.6vw,1.4375rem);line-height:1.38}
.hidden{position:absolute;left:-9999px;opacity:0}
.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}
.cx h1{font-size:clamp(3rem,6.2vw,6.6rem)}
.cx-h{font-size:clamp(2rem,3vw,2.875rem)!important;margin-bottom:10px!important}
.cx-sub{font:800 clamp(1.5rem,2vw,1.875rem)/1.05 "Barlow Condensed",sans-serif!important;text-transform:uppercase;margin:clamp(30px,5vh,44px) 0 16px!important;padding-top:clamp(20px,3vh,28px);border-top:1px solid var(--pm-borde)}
.form-label{display:block;margin:0 0 8px;font:600 1.0625rem/1.3 Barlow,sans-serif;letter-spacing:0;text-transform:none;color:#fff}
.req{color:var(--pm-gris);font-weight:700}
.cx .form-input,.cx .form-select,.cx .form-textarea{width:100%;min-height:58px;padding:14px 16px;border-radius:0;background-color:#141414;border:1px solid #767676;color:#fff;font:400 1.125rem/1.35 Barlow,sans-serif;box-shadow:none;transition:border-color .15s,background-color .15s;color-scheme:dark}
.cx .form-select{padding-right:44px;background-position:right 18px center;background-size:12px 8px}
.cx .form-textarea{min-height:128px;resize:vertical}
.cx .form-input::placeholder,.cx .form-textarea::placeholder{color:#A8A8A8;opacity:1}
.cx .form-input:hover,.cx .form-select:hover,.cx .form-textarea:hover{border-color:#fff}
.cx .form-input:focus,.cx .form-select:focus,.cx .form-textarea:focus{outline:3px solid #fff;outline-offset:2px;border-color:#fff;background-color:#1C1C1C;box-shadow:none}
.cx .form-input:disabled,.cx .form-select:disabled{background-color:#0B0B0B;border-color:#3A3A3A;color:#9A9A9A;cursor:not-allowed}
.form-row-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 18px}
.form-group{margin:0 0 20px;min-width:0}
.form-ayuda,.cx .fine{font:400 1.0625rem/1.45 Barlow,sans-serif;color:var(--pm-gris)}
.form-ayuda{margin:8px 0 0}
.cx input[type=checkbox]{width:24px;height:24px;flex:none;margin:1px 0 0;accent-color:var(--pm-rojo);cursor:pointer}
.cx input[type=checkbox]:focus-visible{outline:3px solid #fff;outline-offset:3px}
/* Error: se escribe debajo del campo que falla */
.cx .cx-mal{border-color:#FF6B55!important;box-shadow:inset 3px 0 0 #FF6B55!important}
.cx .cx-error{display:flex;gap:8px;margin:8px 0 0;color:#FF8E7C;font:600 1.0625rem/1.35 Barlow,sans-serif}
.cx .cx-error[hidden]{display:none}
.cx-resumen-error{margin:14px 0 0;padding:12px 14px;border:1px solid #FF6B55;color:#fff;font:600 1.0625rem/1.4 Barlow,sans-serif}
.cx-resumen-error[hidden]{display:none}
/* El WhatsApp flotante no tapa el campo que se está escribiendo */
body.cx-escribiendo .wa-float,body.cx-en-form .wa-float{opacity:0;pointer-events:none}
@media (max-width:640px){.form-row-2{grid-template-columns:minmax(0,1fr)}}

.cz-pag.form-page{padding:clamp(104px,15vh,150px) var(--cx-m) clamp(60px,10vh,110px)}
.cz-cab{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(20px,5vw,90px);align-items:end;margin-bottom:clamp(30px,6vh,60px)}
.form-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:clamp(30px,5vw,90px);align-items:start;border-top:1px solid var(--pm-borde);padding-top:clamp(28px,5vh,48px)}
.cz .form-card>form>.form-ayuda:first-of-type{margin:0 0 clamp(20px,3vh,30px)}
.form-check-group{display:flex;align-items:flex-start;gap:14px}
.form-check-group label{font-size:1.0625rem;line-height:1.45;cursor:pointer}
.cz-enviar{display:flex;align-items:center;justify-content:center;width:100%;min-height:66px;margin-top:8px;padding:12px 18px;border:1px solid var(--pm-rojo);background:var(--pm-rojo);color:#fff;font:700 1.25rem/1.15 Barlow,sans-serif;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.cz-enviar:hover{background:#fff;color:#000;border-color:#fff}
.cz-enviar:focus-visible{outline:3px solid #fff;outline-offset:3px}
.cz-enviar:disabled{opacity:.7;cursor:progress}
.cz .cz-pie{margin-top:14px}
/* El aviso de envío lo escribe la página con sus colores: aquí solo se lee mejor */
.cz form [role="status"]{margin-top:14px!important;padding:14px 16px!important;border-radius:0!important;background:#141414!important;color:#fff!important;font:500 1.0625rem/1.45 Barlow,sans-serif!important;border:1px solid #767676}
.cz form [role="status"][style*="253, 236, 236"]{border-color:#FF6B55;color:#FF8E7C!important}
.cz form [role="status"] a{color:#fff}
/* Lado */
.cz-lado>*+*{margin-top:clamp(26px,5vh,44px)}
.wa-alt-card h2,.despues h2{font-size:clamp(2rem,3vw,2.875rem)}
.wa-alt-card p{margin:12px 0 18px}
.cz-wa{width:100%;min-height:58px;font-size:1.125rem}
.cz-tel{display:flex;flex-wrap:wrap;align-items:center;gap:0 12px;min-height:48px;margin-top:10px;color:#fff;font-weight:700;font-size:1.0625rem}
.cz-tel__h{font-weight:400;color:var(--pm-gris)}
.cotiza-escena{margin:clamp(26px,5vh,44px) 0 0;max-width:380px}
.cotiza-escena img{display:block;width:100%;height:auto}
.cotiza-escena figcaption{margin-top:10px;font-size:1.0625rem}
.despues ul{list-style:none;margin:14px 0 0;padding:0}
.despues li{padding:12px 0;border-top:1px solid var(--pm-borde);font-size:1.0625rem;line-height:1.4}
.cz .cz-cobertura{margin-top:4px;padding-top:12px;border-top:1px solid var(--pm-borde);color:var(--pm-gris)}
.cz-cobertura b{color:#fff;font-weight:700}
/* Equipos */
.cz-equipos{padding:clamp(60px,10vh,120px) 0 clamp(40px,6vh,70px);border-top:1px solid var(--pm-borde)}
.cz-equipos>h2{font-size:clamp(2.4rem,4.8vw,4.8rem);padding-inline:var(--cx-m);margin-bottom:clamp(24px,4vh,40px)}
.cz-eq{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) clamp(130px,16vw,230px);gap:clamp(14px,3vw,48px);align-items:center;padding:clamp(16px,2.6vh,26px) var(--cx-m);border-top:1px solid var(--pm-borde);color:#fff;text-decoration:none;transition:background .25s}
.cz-eq:hover{background:var(--pm-panel)}
.cz-eq h3{font-size:clamp(2.4rem,4.6vw,4.6rem)}
.cz-eq p{font-size:1.0625rem}
.cz-eq p b{display:block;margin-top:6px;font:800 clamp(1.5rem,2.1vw,2rem)/1.05 "Barlow Condensed",sans-serif}
.cz-eq img{display:block;width:100%;height:auto;max-height:200px;object-fit:contain}
@media (max-width:1100px){
  .cz-cab,.form-layout{grid-template-columns:minmax(0,1fr)}
  .cotiza-escena{max-width:520px}
}
@media (max-width:640px){
  .cx h1{font-size:clamp(2.9rem,14vw,4.4rem)}
  .cz-eq{grid-template-columns:minmax(0,1fr) 120px}
  .cz-eq h3{grid-column:1/-1}
}
.wa-float .wa-text,.wa-float{font-size:1.0625rem}

/* Un solo rojo fuerte: el del titular */
aside h2 .rojo{color:#fff!important}

/* El formulario va en su panel, como los demás datos de la marca. */
form[name="cotizacion-ruta-segura"][method="POST"]{background:#101010;border:1px solid #3A3A3A;padding:clamp(18px,2.6vw,36px)}

/* Entrada de la cotización */
.cz-ap{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden;background:#000;padding:clamp(110px,14vh,140px) clamp(16px,3.4vw,48px) clamp(50px,9vh,90px)}
.cz-ap__f{position:absolute;inset:0;overflow:hidden}
.cz-ap__f img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 60%;transform:scale(calc(1.02 + var(--z,0)*.12))}
.cz-ap::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#000 0,rgba(0,0,0,.84) 40%,rgba(0,0,0,0) 74%),linear-gradient(180deg,rgba(0,0,0,.6) 0,rgba(0,0,0,0) 22%);pointer-events:none}
.cz-ap__tx{position:relative;z-index:3;max-width:min(78vw,1100px)}
.cz .cz-ap h1{font-size:clamp(3rem,7.4vw,8rem);line-height:.9}
.cz-ap .cx-lead{margin:clamp(12px,2.2vh,22px) 0 clamp(18px,3vh,28px);max-width:32em}
.cz-ap+.cz-pag{padding-top:clamp(50px,8vh,90px);scroll-margin-top:70px}
@media (max-width:980px){
  .cz-ap{min-height:88svh;padding:96px 16px 34px}
  .cz-ap__tx{max-width:none}
  .cz .cz-ap h1{font-size:clamp(2.8rem,12.6vw,5rem)}
}

/* La escena sigue detrás del formulario. */
.cz-pag{background:linear-gradient(rgba(0,0,0,.84),rgba(0,0,0,.84)),url(/assets/portada/hero-foto.webp) center/cover no-repeat fixed}
.form-card form{background:rgba(14,14,14,.82)}

.pm-btn--blanco{background:#fff!important;border-color:#fff!important;color:#000!important}
.cz-eq{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) clamp(150px,22vw,330px)}
.cz-eq img{max-height:300px}
.cz-pag .form-layout aside img,.cz-pag .cz-quien img{max-width:none}