/* imp-mx.css — lo único que no trae el CSS de disufix.com (2026-10-02):
   fotos (no recortes) en tarjetas y en el bloque oscuro, el contador del carrito del sitio y el botón «Pagar ahora». */
.promo--foto .promo__media{padding:0;overflow:hidden}
.promo--foto .promo__media img{width:100%;height:100%;object-fit:cover;filter:none;position:absolute;inset:0}
.promo--foto:hover .promo__media img{transform:none}
.kcard--foto .pcard__media img{padding:0!important}
.offer__media--xl .offer__photo.offer__photo--foto{width:min(100%,440px);border-radius:24px;aspect-ratio:1/1;object-fit:cover;filter:drop-shadow(0 40px 46px rgba(0,0,0,.45))}
.gw__car .gw__cap{top:auto;bottom:44px}
.hdr__cart{cursor:pointer;background:none;font:inherit}
.hdr__cart b[hidden]{display:none}
.promo__btn,.pcard__cta{cursor:pointer;font-family:inherit;border:0}
.carro .btn--rojo{background:#F00001;color:#fff}
/* 2026-10-05 noche · paleta de Lluvia Cero en TODA la página (José: «quítale el tono de Colombia»).
   Mismos componentes de venta y selección; cambian colores y títulos (itálica, como el resto de lluviacero.com). */
.gi{--accent:#F00001;--gold:#F00001;--accent-deep:#002DA2;--blue:#056ADC;--dark:#0E1B42;--dark-2:#002DA2;--ink:#0E1B42;--ink-2:#455480;--bg-2:#EAF2FD;--line:rgba(5,106,220,.18);--green:#25D366}
.gi .hl,.gi .ans__name .hl{background:#F00001;color:#fff;box-shadow:rgba(240,0,1,.3) 0 14px 28px -16px}
.gi .hl-mark{background-image:linear-gradient(transparent 58%,rgba(240,0,1,.26) 58% 94%,transparent 94%);color:var(--ink)}
.gi .btn--accent{background:linear-gradient(135deg,#FF2A2A,#F00001 55%,#C80000);color:#fff;box-shadow:rgba(240,0,1,.38) 0 16px 32px -14px}
.gi .btn--ink{background:linear-gradient(135deg,#FF2A2A,#F00001 55%,#C80000);color:#fff}
.gi .sticker,.gi .promo__tag{background:#F00001;color:#fff}
.gi .eyebrow{color:#F00001}
.gi .eyebrow--light,.gi .gpromo .eyebrow,.gi .offer .eyebrow{color:#fff}
.gi .gpromo{border-bottom-color:#F00001}
.gi .gpromo__all .btn--ink{background:#fff;color:#F00001}
.gi .trust--ledger.gl{background:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px) 0 0/46px 46px,linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px) 0 0/46px 46px,linear-gradient(135deg,#002DA2,#056ADC);color:#fff}
.gi .gl .ledger__lbl,.gi .gl .ledger__n,.gi .gl .ledger__d{color:#fff}
.gi .gl .ledger__lbl{opacity:.8}.gi .gl .ledger__cell{border-left-color:rgba(255,255,255,.22)}
.gi .offer{border-top-color:#F00001;border-bottom-color:#F00001}
.gi .ptab:hover{border-color:rgba(255,255,255,.6)}
.gi .ptab.is-on{background:#F00001;border-color:#F00001;color:#fff}
.gi .kside__opt.is-on{background:#002DA2;border-color:#002DA2;color:#fff}
.gi .sec__title,.gi .offer__title,.gi .gk__title,.gi .mf__title,.gi .cta-band__title,.gi .ans__name{font-style:italic;font-weight:800!important;letter-spacing:-.01em}
/* 2026-10-05 · José: «Lluvia Cero es azul y rojo». De «Comprar es así de simple» al pie, en orden:
   ROJO (cómo comprar) → AZUL MARINO (franja) → BLANCO (por qué) → AZUL CLARO (preguntas) → ROJO (manda la foto) → AZUL (pie).
   Sin colores planos: degradado + cuadrícula fina de 46 px, como el resto de lluviacero.com. */
.gk,.mq--accent,.gw,.gq,.cta-band,.gi .ft{--accent:#F00001;--gold:#F00001;--accent-deep:#056ADC;--blue:#056ADC;--dark:#002DA2;--dark-2:#056ADC;--ink:#0E1B42}
.gk{background:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px) 0 0/46px 46px,linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px) 0 0/46px 46px,radial-gradient(90% 120% at 85% 0%,#ff4a3d 0%,transparent 55%),linear-gradient(135deg,#F00001 0%,#C80000 60%,#9E0000 100%)}
.gk__title .hl{background:#fff;color:#F00001}
.gk__no{color:#fff}
.gk__lead,.gk__step p{color:rgba(255,255,255,.86)}
.gk__steps,.gk__step{border-color:rgba(255,255,255,.28)}
.gk .eyebrow{color:#fff}
.gk__photo{background:#002DA2}
.gk__photo .sticker{background:#002DA2;color:#fff}
.mq--accent{background:linear-gradient(90deg,#002DA2,#056ADC 50%,#002DA2)}
.mq--accent .mq__t{color:#fff}
.gw.why--mf{background:linear-gradient(rgba(5,106,220,.045) 1px,transparent 1px) 0 0/46px 46px,linear-gradient(90deg,rgba(5,106,220,.045) 1px,transparent 1px) 0 0/46px 46px,radial-gradient(70% 90% at 100% 0%,rgba(5,106,220,.12),transparent 60%),#fff;color:#0E1B42;border-top:0;border-bottom:0}
.gw .mf__ghost{-webkit-text-stroke:1.5px rgba(5,106,220,.08)}
.gw .eyebrow{color:#056ADC}
.gw .mf__title{color:#0E1B42}
.gw .mf__title .hl{background:#F00001;color:#fff;box-shadow:rgba(240,0,1,.35) 0 16px 30px -16px}
.gw .mf__title .struck:after{background:#F00001}
.gw .mf__lead{color:#3c4a66}
.gw .mf__list{border-top-color:rgba(5,106,220,.18)}
.gw .mf__row{border-bottom-color:rgba(5,106,220,.18)}
.gw .mf__no{color:#F00001}
.gw .mf__fear{color:#6b7896;text-decoration-color:rgba(240,0,1,.75)}
.gw .mf__ans{color:#0E1B42}
.gw .mf__ans b{color:#056ADC}
.gw__photo .sticker{background:#F00001;color:#fff}
.gq{background:linear-gradient(rgba(5,106,220,.05) 1px,transparent 1px) 0 0/46px 46px,linear-gradient(90deg,rgba(5,106,220,.05) 1px,transparent 1px) 0 0/46px 46px,#EAF2FD;border-top:0}
.gq .eyebrow{color:#056ADC}
.gq .hl-mark{background-image:linear-gradient(transparent 58%,rgba(240,0,1,.28) 58% 94%,transparent 94%);color:#0E1B42}
.gq .fq summary{color:#0E1B42}
.gq .fq__ic{border-color:rgba(5,106,220,.4)}
.gq .fq[open] .fq__ic{background:#F00001;border-color:#F00001;color:#fff}
.cta-band{background:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px) 0 0/46px 46px,linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px) 0 0/46px 46px,linear-gradient(135deg,#F00001 0%,#C80000 60%,#9E0000 100%);color:#fff}
.cta-band__title{color:#fff}
.cta-band .struck:after{background:#fff}
.cta-band .btn--ink{background:#fff;color:#F00001;box-shadow:rgba(0,0,0,.25) 0 16px 32px -14px}
.gi .ft{background:radial-gradient(80% 120% at 0% 0%,rgba(5,106,220,.45),transparent 60%),linear-gradient(160deg,#002DA2,#0E1B42)}
.gi .ft .brand__dot{color:#F00001}
/* catálogo completo en el teléfono: la de Colombia escondía «Todos» y la fila de tamaños (allá son 5 productos) */
@media(max-width:720px){.gcat .kside{display:grid;gap:2px}.gcat .kside__grp+.kside__grp{display:flex}.gcat .kside__opt[data-v=all]{display:inline-flex}}
/* ── 06-10 · José: «todo se ve gigantesco y desordenado, sigue el tamaño de impermeabilizantes de disufix.com» ──
   PORTADA = el marco de la imagen de Colombia (2125×740 → 502 px de alto en 1440, 136 en 390). Mientras José no manda la
   suya, el contenido va en HTML y escala con el ancho como una imagen (vw: la portada va de borde a borde). */
.gi .gh--img{background:#fff}
.lcb-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.lcb{text-decoration:none;color:inherit}
.lcb__in{position:relative;width:100%;aspect-ratio:2125/740;overflow:hidden;isolation:isolate;background:#fff}
.lcb__in::before{content:"";position:absolute;inset:0;z-index:-3;background-image:linear-gradient(rgba(14,27,66,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(14,27,66,.04) 1px,transparent 1px);background-size:3.2vw 3.2vw}
.lcb__panel{position:absolute;top:0;right:0;bottom:4.6vw;left:44vw;z-index:-2;background:radial-gradient(120% 90% at 30% 20%,rgba(255,255,255,.18),transparent 55%),linear-gradient(150deg,#056ADC,#002DA2);clip-path:polygon(16% 0,100% 0,100% 100%,0 100%)}
.lcb__raya{position:absolute;right:-1vw;bottom:4.6vw;width:34vw;height:2.3vw;z-index:-1;background:#F00001;transform:rotate(-9deg);transform-origin:right bottom;box-shadow:rgba(240,0,1,.4) 0 1.1vw 2.2vw -1vw}
/* .gi .gh__banner img{width:100%} de Colombia es para SU imagen: el envase lo pisa con más especificidad */
.gi .lcb .lcb__prod{position:absolute;left:63vw;bottom:5.4vw;width:21vw;height:auto;filter:drop-shadow(0 2vw 2.3vw rgba(0,0,0,.35))}
.lcb__txt{position:absolute;left:2.6vw;top:0;bottom:4.6vw;width:44vw;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.lcb__eye{font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#056ADC;font-size:.9vw}
.lcb__t{font-family:var(--font-display);font-weight:900;font-style:italic;text-transform:uppercase;font-size:4.3vw;line-height:.92;letter-spacing:-.02em;color:#0E1B42;margin:.8vw 0 1vw}
.lcb__hl{background:#F00001;color:#fff;padding:0 .12em;border-radius:.16em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.lcb__lead{font-size:1.2vw;font-weight:600;font-style:italic;line-height:1.45;color:#0E1B42;max-width:31vw;margin:0}
.lcb__btn{display:inline-flex;align-items:center;gap:.6vw;margin-top:1.5vw;font-weight:800;font-size:1.05vw;line-height:1.6;padding:.85vw 1.8vw;border-radius:999px;color:#fff;background:linear-gradient(135deg,#FF2A2A,#F00001 55%,#C80000);box-shadow:rgba(240,0,1,.4) 0 1.1vw 2.2vw -1vw;transition:transform .2s}
.lcb:hover .lcb__btn{transform:translateY(-2px)}
.lcb:focus-visible{outline:3px solid #056ADC;outline-offset:-3px}
.lcb__bar{position:absolute;left:0;right:0;bottom:0;height:4.6vw;display:flex;align-items:center;justify-content:space-between;gap:2vw;padding:0 2.6vw;background:#fff;border-top:1px solid var(--line)}
.lcb__desde{font-weight:900;color:#056ADC;text-transform:uppercase;letter-spacing:.02em;font-size:.95vw;white-space:nowrap}
.lcb__ico{list-style:none;margin:0;padding:0;display:flex;gap:2vw}
.lcb__ico li{display:flex;align-items:center;gap:.5vw;font-weight:700;font-size:.95vw;color:#0E1B42;white-space:nowrap}
.lcb__ico svg{width:1.6vw;height:1.6vw;color:#056ADC;flex:none}
/* en el teléfono la de Colombia es la misma imagen, chica (136 px): acá queda el título, el botón y el envase */
@media(max-width:640px){
  .lcb__eye,.lcb__lead,.lcb__bar{display:none}
  .lcb__panel{bottom:0;left:56vw}
  .lcb__raya{bottom:0}
  .gi .lcb .lcb__prod{left:71vw;bottom:2.4vw;width:25vw}
  .lcb__txt{left:4.4vw;bottom:0;width:58vw}
  .lcb__t{font-size:5.6vw;margin:0 0 2.4vw}
  .lcb__btn{font-size:3vw;padding:1.7vw 3.4vw;margin-top:0;gap:1.4vw}
}
/* PRESENTACIONES: 6 tarjetas, la misma rejilla que Colombia (3 / 2 / 1 columnas). «Desde» chico junto al precio. */
.gi .promo__price .promo__desde{font-size:13px;font-weight:700;color:var(--ink-2);text-transform:uppercase;letter-spacing:.06em}
/* los botones de las tarjetas son <button>: sin esto medían 42 px y los de Colombia (<a>) 46 */
.promo__btn,.pcard__cta{line-height:1.6}
/* CATÁLOGO: en PC el título va en una línea («1 L · Transparente»); en el teléfono en dos (tamaño / color), parejo. */
@media(max-width:720px){.gcat .kt-sep{display:none}.gcat .kt-b{display:block}}