/* coherencia-mx.css (08-10) — el mismo lenguaje en todo el sitio. Va al final del <head> de las 15 páginas.
   Los !important son a propósito: cada familia de páginas (inicio y fichas, Impermeabilizantes y Productos, legales) trae
   sus propias hojas con selectores fuertes, y esta capa es la que las iguala. */

/* letra: Montserrat en todo (las legales caían en Times en lo que no tenía letra propia; las flechas del carrusel en Arial) */
body{font-family:Montserrat,system-ui,-apple-system,"Segoe UI",sans-serif}
.gw__arrow,.saltar,button,input,select,textarea{font-family:inherit}

/* títulos: de página 48 px (antes 50, 52 y 54), de ficha 42 (la cinta tenía 32), de sección 38 (la ficha transparente, 48) */
.hero-copy>h1,.catp-hero h1,.cab--centro>h1,.pg-hero h1{font-size:clamp(30px,3.6vw,48px)!important;line-height:1.02!important}
.gt-compra h1{font-size:clamp(28px,3.4vw,42px)!important;line-height:1.04!important}
h2.tt,.wrap>.cab>h2{font-size:clamp(28px,3vw,38px)!important;line-height:1.05!important}
.cta-band .cta-band__title{font-size:clamp(28px,3vw,40px)!important}

/* etiqueta sobre los títulos: la cinta roja del resto del sitio también en Impermeabilizantes y Productos (antes «// texto») */
.eyebrow{display:inline-block!important;width:fit-content!important;align-self:flex-start;position:relative;z-index:0;padding:5px 14px!important;margin-left:4px;
  color:#fff!important;font-size:13px!important;font-weight:800!important;font-style:italic!important;letter-spacing:.06em!important;text-transform:uppercase;line-height:1.3!important}
.eyebrow:before{content:none!important}
.eyebrow:after{content:"";position:absolute;inset:0;z-index:-1;background:#F00001;transform:skew(-10deg)}
.gk .eyebrow{color:#F00001!important}.gk .eyebrow:after{background:#fff}
.cab--centro .eyebrow,.offer__head .eyebrow,.catp-hero .eyebrow,.cta-band .eyebrow{align-self:center}

/* botones: cursiva 800 en todos (Impermeabilizantes y Productos los tenían rectos), sin flecha y en tres alturas */
body .btn{font-style:italic!important;font-weight:800!important}
.btn .ar{display:none!important}
.lc-dos>.btn,.cta-banda .btn,.pedido-acciones .btn,.cta-band__row .btn,.ans__foot .btn,.legal-ayuda .btn,.c-cta .btn{
  min-height:52px!important;padding-top:0!important;padding-bottom:0!important;display:inline-flex!important;align-items:center;justify-content:center}
.fx-tam__card .btn,.fx-color .btn,.c-tam__c .btn,.c-ft__duda .btn,.gpromo__all .btn,.gpromo .promo__btn{
  min-height:46px!important;padding-top:0!important;padding-bottom:0!important;display:inline-flex!important;align-items:center;justify-content:center}
.kcard .pcard__cta{min-height:40px!important;padding-top:0!important;padding-bottom:0!important}
/* WhatsApp: un solo verde (la cinta agotada usaba un verde azulado) */
.gt-compra a.btn[href*="wa.me"]{background:#25D366!important;color:#fff!important;border-color:#25D366!important}

/* pie: el del inicio en todas (Productos tenía «México» grande, la cinta los enlaces legales grandes, la transparente un degradado) */
footer:not(.carro__pie){background:#002DA2!important;background-image:none!important}
footer .palabra .micro{font-size:14px!important;font-weight:600!important}
footer .gt-pie-legal{margin-top:10px!important}
footer .gt-pie-legal a{font-size:12px!important}
@media(max-width:600px){footer .palabra .micro{font-size:13px!important}footer .gt-pie-legal a{font-size:11.2px!important}}

/* «Elegir…» (elige el tamaño y sube a la compra) en azul en todas las fichas; el rojo queda para comprar */
.c-tam__c .btn,.fx-tam__card .btn,.fx-color .btn{background:#002DA2!important;background-image:none!important;color:#fff!important;border-color:#002DA2!important;box-shadow:0 10px 22px -14px rgba(0,45,162,.8)!important}
/* «Avísame» (va a WhatsApp) en verde también en el catálogo de Impermeabilizantes */
.kcard a.pcard__cta[href*="wa.me"]{background:#25D366!important;background-image:none!important;color:#fff!important;border-color:#25D366!important}
/* tarjetas de Productos como las del catálogo de Impermeabilizantes: nombre sin subrayar y «Comprar» + carrito */
.catpage .pcard__titlelink,.catpage .pcard__title{text-decoration:none!important}
.catpage .pcard__foot{flex-wrap:wrap;row-gap:10px}
.catpage .pcard__foot .lc-k-btns{flex-basis:100%;display:flex;gap:6px}
.catpage .lc-k-comprar{background:linear-gradient(135deg,#ff2a2b,#F00001 55%,#c80001)!important;color:#fff!important;border:0!important;flex:1 1 auto;min-height:40px!important;display:inline-flex!important;align-items:center;justify-content:center;padding:0 14px!important;font-size:13px!important;margin:0}
.catpage .lc-k-carro{flex:0 0 42px;width:42px;min-height:40px;display:inline-flex;align-items:center;justify-content:center;padding:0;border:1.5px solid #002DA2;background:#fff;color:#002DA2;border-radius:999px;cursor:pointer}
.catpage .lc-k-carro:hover{background:#eef4ff}
.catpage .lc-k-carro svg{width:19px;height:19px}
/* la burbuja de WhatsApp sube sobre la barra fija de Impermeabilizantes (tapaba «Elegir el mío»), como en las fichas */
@media(max-width:900px){body:has(.buybar) .wa-flot{bottom:calc(86px + env(safe-area-inset-bottom))!important}}
/* Productos: el catálogo alineado con el logo (estaba 18 px corrido) */
@media(min-width:601px){.catpage{max-width:var(--lc-ancho,1200px)!important;padding-left:24px!important;padding-right:24px!important}}
/* …sin agrandar las tarjetas (miden lo mismo que en el catálogo de Colombia, 263 px): el ancho que sobra va a los espacios */
@media(min-width:1181px){.catpage .catpage-grid{grid-template-columns:repeat(4,minmax(0,263px))!important;justify-content:space-between}}
