:root{
  --navy:#0a2b49;--blue:#0b6ea8;--sky:#eef6fb;--line:#d8e5ee;
  --text:#0a2b49;--muted:#61788d;--yellow:#f9b91e;--white:#fff;
}
*{box-sizing:border-box}
body{margin:0;color:var(--text);background:#fff;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
a{color:inherit}
.wrap{width:min(1180px,calc(100% - 40px));margin:0 auto}
.topbar{background:#0b3152;color:#fff;font-size:12px}
.topbar__inner{display:flex;justify-content:space-between;gap:20px;padding:8px 0}
.topbar a{text-decoration:none;color:#fff;font-weight:700}
.header{background:#fff;border-bottom:1px solid #e8eef3;position:sticky;top:0;z-index:30}
.nav{min-height:78px;display:flex;align-items:center;gap:32px}
.brand img{display:block;width:150px;height:54px;object-fit:contain}
.navlinks{margin-left:auto;display:flex;align-items:center;gap:27px}
.navlinks a{text-decoration:none;font-size:14px;font-weight:700;padding:29px 0 24px;border-bottom:3px solid transparent}
.navlinks a:hover,.navlinks a.active{color:#0873ad;border-color:#0873ad}
.cta{display:inline-flex;align-items:center;justify-content:center;padding:14px 20px;border-radius:10px;text-decoration:none;font-weight:800;font-size:14px;border:1px solid transparent}
.cta--blue{background:#0873ad;color:#fff;box-shadow:0 10px 25px rgba(8,115,173,.18)}
.cta--yellow{background:var(--yellow);color:#071d30}
.cta--outline{background:#fff;border-color:#bdd2e0;color:var(--text)}
.catalog-hero,.supply-hero{padding:72px 0;background:linear-gradient(120deg,#fff 0%,#f5fafe 55%,#eaf4fa 100%)}
.eyebrow{font-size:12px;font-weight:900;letter-spacing:.13em;color:#006aa6}
.eyebrow--light{color:#83d2ff}
.hero-grid{display:grid;grid-template-columns:1.35fr .65fr;gap:60px;align-items:end;margin-top:16px}
h1{font-size:48px;line-height:1.06;margin:0 0 18px;letter-spacing:-.035em;max-width:760px}
h2{font-size:34px;line-height:1.1;margin:7px 0 0;letter-spacing:-.025em}
h3{font-size:20px;margin:8px 0 10px}
.lead{font-size:18px;line-height:1.65;color:var(--muted);max-width:750px}
.hero-note{padding:25px;border:1px solid var(--line);background:rgba(255,255,255,.8);border-radius:18px;box-shadow:0 18px 40px rgba(26,72,102,.08)}
.hero-note strong{font-size:18px}
.hero-note p{margin-bottom:0;color:var(--muted);line-height:1.6}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.chips span{padding:7px 12px;border-radius:999px;background:#e9f4fa;border:1px solid #d2e8f3;font-size:12px;font-weight:800}
.search-box{margin-top:38px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:13px 16px;display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;box-shadow:0 12px 30px rgba(16,67,98,.06)}
.search-box label{font-size:13px;font-weight:900}
.search-box input{border:1px solid #c9dce8;border-radius:10px;padding:13px 14px;font:inherit;outline:none}
.search-box input:focus{border-color:#0a7ab5;box-shadow:0 0 0 3px rgba(10,122,181,.1)}
#resultCount{font-size:12px;font-weight:800;color:var(--muted)}
.catalog-section{padding:68px 0}
.catalog-section--light{background:#f3f8fc}
.section-head{display:flex;justify-content:space-between;gap:40px;align-items:flex-end;margin-bottom:28px}
.section-head p{max-width:430px;text-align:right;color:var(--muted);margin:0}
.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.product-grid--2{grid-template-columns:repeat(2,1fr)}
.product-grid--3{grid-template-columns:repeat(3,1fr)}
.product-card{overflow:hidden;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:0 12px 30px rgba(20,66,94,.07);transition:.2s ease}
.product-card:hover{transform:translateY(-3px);box-shadow:0 18px 35px rgba(20,66,94,.11)}
.product-media{height:255px;background:#f7fafc;display:flex;align-items:center;justify-content:center;border-bottom:1px solid #edf2f5;overflow:hidden}
.product-media img{display:block;width:100%;height:100%;object-fit:cover}
.product-media--contain img{object-fit:contain;padding:10px}
.product-body{padding:20px}
.product-body p{color:var(--muted);line-height:1.55;min-height:72px}
.source-tag{display:inline-flex;padding:5px 8px;background:#e8f4fb;color:#006ca7;border-radius:6px;font-size:10px;font-weight:900;letter-spacing:.08em}
.source-link{display:inline-block;margin-top:8px;text-decoration:none;font-size:13px;font-weight:900;color:#006ca7}
.line-strip{margin-top:22px;padding:18px 20px;border:1px solid var(--line);border-radius:14px;background:#fff;display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.line-strip span{padding:7px 10px;background:#f0f6fa;border-radius:8px;font-size:12px;color:#3f5c70}
.wide-visuals{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:24px}
.wide-visuals figure{margin:0;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#fff}
.wide-visuals img{width:100%;height:100%;min-height:250px;object-fit:contain;display:block}
.quote-band{padding:48px 0;background:linear-gradient(100deg,#0b3152,#0b6d9f);color:#fff}
.quote-band h2{font-size:36px}
.quote-band p{color:#dcecf6}
.quote-band__inner{display:flex;align-items:center;justify-content:space-between;gap:40px}
.quote-actions{display:flex;flex-direction:column;gap:10px;align-items:stretch;min-width:235px}
.mail-btn{color:#fff;border:1px solid rgba(255,255,255,.35);border-radius:10px;padding:12px 15px;text-align:center;text-decoration:none;font-weight:800;font-size:13px}
.simple-footer{background:#061e32;color:#fff;padding:42px 0}
.simple-footer img{width:155px;background:#fff;border-radius:8px;padding:6px}
.simple-footer p{color:#d4e2ec;max-width:680px}
.simple-footer .legal{font-size:11px;line-height:1.6;color:#8fa9bb;margin-top:20px}
.supply-hero__grid{display:grid;grid-template-columns:1fr 1.08fr;gap:70px;align-items:center}
.supply-hero__grid h1{font-size:47px}
.hero-actions{display:flex;gap:12px;margin-top:28px}
.supply-hero__media{position:relative;background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden;min-height:370px;box-shadow:0 18px 45px rgba(15,62,91,.1)}
.supply-hero__media img{width:100%;height:370px;display:block;object-fit:contain;padding:18px}
.supply-hero__media span{position:absolute;left:16px;bottom:14px;background:#0b3152;color:#fff;border-radius:999px;padding:7px 10px;font-size:10px;font-weight:800}
.visual-category-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.visual-category{min-height:360px;position:relative;overflow:hidden;border-radius:18px;text-decoration:none;background:#0b3152;box-shadow:0 14px 32px rgba(14,57,83,.13)}
.visual-category img{width:100%;height:100%;position:absolute;inset:0;object-fit:contain;background:#fff;padding:8px}
.visual-category:after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(3,24,41,.9) 0%,rgba(3,24,41,.5) 32%,rgba(3,24,41,0) 62%)}
.visual-category div{position:absolute;z-index:2;left:20px;right:20px;bottom:18px;color:#fff}
.visual-category small{font-size:10px;font-weight:900;color:#ffca3a;letter-spacing:.08em}
.visual-category strong{display:block;font-size:20px;line-height:1.15;margin:7px 0}
.visual-category span{font-size:12px;color:#e8f3fa}
.catalog-hidden{display:none!important}
@media (max-width:960px){
  .navlinks{display:none}.hero-grid,.supply-hero__grid{grid-template-columns:1fr}
  .product-grid,.product-grid--2,.product-grid--3,.visual-category-grid{grid-template-columns:1fr 1fr}
  .section-head{align-items:flex-start;flex-direction:column}.section-head p{text-align:left}
  .quote-band__inner{align-items:flex-start;flex-direction:column}
}
@media (max-width:620px){
  .wrap{width:min(100% - 28px,1180px)}.topbar__inner span{display:none}.nav{gap:14px}.brand img{width:125px}.header .cta{margin-left:auto;padding:11px 12px;font-size:11px}
  h1,.supply-hero__grid h1{font-size:37px}h2{font-size:29px}.catalog-hero,.supply-hero{padding:46px 0}
  .hero-grid{gap:25px}.search-box{grid-template-columns:1fr}.product-grid,.product-grid--2,.product-grid--3,.visual-category-grid,.wide-visuals{grid-template-columns:1fr}
  .product-media{height:235px}.visual-category{min-height:320px}.quote-band h2{font-size:30px}
}


/* ===== V8: Análisis de líquidos ===== */
.breadcrumbs{display:flex;align-items:center;gap:9px;flex-wrap:wrap;font-size:12px;color:#678095;margin-bottom:18px}
.breadcrumbs a{text-decoration:none;color:#42657c;font-weight:750}
.breadcrumbs strong{color:var(--text)}
.liquid-hero{padding:48px 0 38px;background:linear-gradient(120deg,#fff 0%,#f5fafe 58%,#eaf4fa 100%);border-bottom:1px solid #e3edf3}
.liquid-hero h1{margin-top:7px;margin-bottom:12px}
.liquid-hero .lead{max-width:860px;margin-bottom:0}
.liquid-catalog{padding:34px 0 64px;background:#f7fafc}
.liquid-layout{display:grid;grid-template-columns:220px 1fr;gap:24px;align-items:start}
.liquid-sidebar{position:sticky;top:112px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:14px;box-shadow:0 10px 28px rgba(20,66,94,.06)}
.liquid-sidebar>strong{display:block;font-size:14px;margin:2px 4px 10px}
.liquid-filter{width:100%;border:0;border-bottom:1px solid #edf2f5;background:transparent;color:var(--text);text-align:left;padding:12px 10px;font:inherit;font-size:13px;font-weight:750;cursor:pointer;border-radius:8px;transition:.18s ease}
.liquid-filter:last-child{border-bottom:0}
.liquid-filter:hover,.liquid-filter.active{background:#eaf5fb;color:#006fa9}
.liquid-filter.active{box-shadow:inset 3px 0 0 var(--yellow)}
.liquid-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:16px}
.liquid-toolbar>span{font-size:13px;font-weight:850;color:#49677c}
.liquid-toolbar input{width:min(330px,100%);border:1px solid #cbdce7;border-radius:10px;background:#fff;padding:11px 13px;font:inherit;color:var(--text);outline:none}
.liquid-toolbar input:focus{border-color:#0a7ab5;box-shadow:0 0 0 3px rgba(10,122,181,.09)}
.liquid-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.liquid-card{display:block;overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:15px;text-decoration:none;color:inherit;box-shadow:0 9px 24px rgba(20,66,94,.055);transition:.2s ease}
.liquid-card:hover{transform:translateY(-3px);border-color:#b8d2e2;box-shadow:0 16px 30px rgba(20,66,94,.11)}
.liquid-card__media{height:205px;background:#f7fafc;display:flex;align-items:center;justify-content:center;overflow:hidden;border-bottom:1px solid #edf2f5;position:relative}
.liquid-card__media img{display:block;width:100%;height:100%;object-fit:contain;padding:14px}
.liquid-card__media:after{content:'→';position:absolute;right:12px;top:12px;width:29px;height:29px;border-radius:999px;background:rgba(255,255,255,.94);border:1px solid #d7e5ee;display:grid;place-items:center;font-size:13px;font-weight:900;color:#0a6da6;box-shadow:0 4px 12px rgba(14,57,83,.08)}
.image-missing:before{content:'Imagen temporalmente no disponible';font-size:12px;color:#7890a2;text-align:center;padding:20px}
.liquid-card__body{padding:15px 16px 17px}
.liquid-card__body span{font-size:10px;color:#0873ad;font-weight:900;letter-spacing:.09em;text-transform:uppercase}
.liquid-card__body h3{font-size:18px;margin:6px 0 7px}
.liquid-card__body p{font-size:13px;line-height:1.45;color:var(--muted);margin:0;min-height:57px}
.liquid-empty{padding:28px;border:1px dashed #bfd1dc;border-radius:14px;background:#fff;text-align:center;color:var(--muted)}

/* Detalle de producto */
.product-detail-hero{padding:38px 0 52px;background:linear-gradient(120deg,#fff 0%,#f7fbfd 60%,#edf6fb 100%)}
.product-detail-grid{display:grid;grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);gap:54px;align-items:center}
.product-detail-media{min-height:430px;background:#fff;border:1px solid var(--line);border-radius:20px;display:flex;align-items:center;justify-content:center;overflow:hidden;box-shadow:0 16px 38px rgba(20,66,94,.08)}
.product-detail-media img{display:block;width:100%;height:430px;object-fit:contain;padding:28px}
.product-detail-copy h1{font-size:46px;margin:10px 0 16px}
.product-detail-copy .lead{font-size:17px}
.detail-actions{display:flex;flex-wrap:wrap;gap:11px;margin-top:26px}
.product-detail-section{padding:58px 0 70px;background:#fff}
.product-info-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(280px,.6fr);gap:42px;align-items:start}
.spec-table-wrap{margin-top:24px;border:1px solid var(--line);border-radius:15px;overflow:hidden}
.spec-table{width:100%;border-collapse:collapse;background:#fff;font-size:14px}
.spec-table th,.spec-table td{padding:14px 16px;border-bottom:1px solid #e7eff4;text-align:left;vertical-align:top}
.spec-table tr:last-child th,.spec-table tr:last-child td{border-bottom:0}
.spec-table th{width:36%;background:#f4f9fc;color:#173b55;font-weight:850}
.spec-table td{color:#526c7e}
.applications-box{border:1px solid var(--line);border-radius:17px;padding:24px;background:#f7fbfd;box-shadow:0 12px 28px rgba(20,66,94,.055)}
.applications-box h3{margin:6px 0 12px}
.applications-box ul{padding-left:20px;color:#4f687a;line-height:1.7}
.applications-box p{font-size:12px;line-height:1.6;color:#71889a;margin:20px 0}

@media (max-width:960px){
  .liquid-layout{grid-template-columns:1fr}.liquid-sidebar{position:static;display:flex;gap:7px;overflow:auto;padding:10px}.liquid-sidebar>strong{display:none}.liquid-filter{width:auto;white-space:nowrap;border:1px solid #e0eaf0;padding:9px 12px}.liquid-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .product-detail-grid,.product-info-grid{grid-template-columns:1fr}.product-detail-media{min-height:350px}.product-detail-media img{height:350px}
}
@media (max-width:620px){
  .liquid-hero{padding:34px 0 28px}.liquid-toolbar{align-items:stretch;flex-direction:column}.liquid-toolbar input{width:100%}.liquid-grid{grid-template-columns:1fr}.liquid-card__media{height:230px}
  .product-detail-copy h1{font-size:37px}.product-detail-media{min-height:300px}.product-detail-media img{height:300px;padding:18px}.detail-actions{flex-direction:column}.detail-actions .cta{width:100%}
}

/* ===== AJUSTES V8.4 ===== */

/* Garantiza que el filtro realmente oculte las tarjetas */
.liquid-card[hidden]{
  display:none !important;
}

/* Productos ligeramente más grandes dentro de las tarjetas */
.liquid-card__media img{
  padding:4px;
  transform:scale(1.10);
  transform-origin:center;
}

/* Mejor contraste del CTA superior */
.header .cta.cta--blue{
  color:#fff !important;
}

/* Mantener texto blanco incluso tras visitar el enlace */
.header .cta.cta--blue:visited{
  color:#fff !important;
}

/* ===== NAVEGACIÓN V8.5 ===== */

/* Sin selección permanente */
.navlinks a,
.navlinks a.active{
  border-bottom:0 !important;
  text-decoration:none !important;
  position:relative;
}

/* Línea única, inicialmente oculta */
.navlinks a::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:16px;
  height:2px;
  background:#0873ad;
  border-radius:2px;
  transform:scaleX(0);
  transform-origin:center;
  transition:transform .18s ease;
}

/* Solo aparece al pasar el mouse */
.navlinks a:hover{
  color:#0873ad !important;
}

.navlinks a:hover::after{
  transform:scaleX(1);
}

/* Protección por si alguna página conserva class="active" */
.navlinks a.active:not(:hover)::after{
  transform:scaleX(0) !important;
}

/* ===== PILL CAUDAL V8.6 ===== */

.line-strip .line-pill-link{
  padding:7px 10px;
  background:#f0f6fa;
  border-radius:8px;
  font-size:12px;
  color:#3f5c70;
  text-decoration:none;
  transition:.18s ease;
}

.line-strip .line-pill-link:hover{
  background:#e0f0f9;
  color:#0873ad;
}

/* ======================================================
   SUPPLY FAMILY V90
====================================================== */

.supply-family-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:20px;
  margin-top:28px;
}

.supply-family-card{
  display:block;
  overflow:hidden;
  border:1px solid #d9e5ed;
  border-radius:18px;
  background:#fff;
  color:#0d2944;
  text-decoration:none;
  box-shadow:0 12px 32px rgba(13,41,68,.06);
  transition:transform .18s ease,box-shadow .18s ease;
}

.supply-family-card:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 40px rgba(13,41,68,.12);
}

.supply-family-card__media{
  height:220px;
  background:#f5f9fb;
  overflow:hidden;
}

.supply-family-card__media img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.supply-family-card__body{
  padding:22px;
}

.supply-family-card__body span{
  display:block;
  color:#0873ad;
  font-weight:800;
  font-size:12px;
  letter-spacing:.08em;
  margin-bottom:8px;
}

.supply-family-card__body h3{
  margin:0 0 10px;
  font-size:21px;
  line-height:1.2;
}

.supply-family-card__body p{
  margin:0 0 18px;
  color:#577286;
  line-height:1.55;
}

.supply-family-card__body strong{
  color:#0873ad;
  font-size:13px;
}

.supply-global-search{
  margin-top:24px;
  border:1px solid #d9e5ed;
  border-radius:16px;
  background:#f8fbfd;
  padding:18px 20px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}

.supply-global-search div{
  display:flex;
  flex-direction:column;
  gap:4px;
}

.supply-global-search span{
  color:#647f91;
}

.supply-global-search a{
  color:#0873ad;
  text-decoration:none;
  font-weight:800;
  white-space:nowrap;
}


/* Family hub pages */

.family-hero{
  padding:70px 0 54px;
  background:linear-gradient(110deg,#f7fbfd,#edf6fb);
  border-bottom:1px solid #dce7ee;
}

.family-hero__inner{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:40px;
}

.family-hero h1{
  margin:8px 0 12px;
  max-width:760px;
  font-size:48px;
  line-height:1.05;
  color:#0d2944;
}

.family-hero p{
  max-width:760px;
  margin:0;
  font-size:17px;
  line-height:1.65;
  color:#60798b;
}

.family-hero__actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.family-content{
  padding:52px 0 80px;
}

.family-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}

.family-option{
  display:block;
  min-height:230px;
  padding:26px;
  border:1px solid #d8e4ec;
  border-radius:17px;
  background:#fff;
  text-decoration:none;
  color:#0d2944;
  box-shadow:0 10px 28px rgba(13,41,68,.05);
}

.family-option--link{
  transition:transform .18s ease,box-shadow .18s ease;
}

.family-option--link:hover{
  transform:translateY(-3px);
  box-shadow:0 16px 38px rgba(13,41,68,.11);
}

.family-option > span{
  color:#0873ad;
  font-size:11px;
  letter-spacing:.09em;
  font-weight:800;
}

.family-option h2{
  font-size:23px;
  line-height:1.2;
  margin:14px 0 10px;
}

.family-option p{
  line-height:1.6;
  color:#60798b;
  margin-bottom:26px;
}

.family-option strong{
  color:#0873ad;
  font-size:13px;
}


/* CTA top always readable */
.header-cta,
.header-cta:visited,
.cta--blue,
.cta--blue:visited{
  color:#fff !important;
}


/* Catalog-family nav: no permanent underline */
.nav a,
.nav a.active{
  text-decoration:none !important;
}

@media(max-width:900px){

  .supply-family-grid,
  .family-grid{
    grid-template-columns:1fr 1fr;
  }

  .family-hero__inner{
    align-items:flex-start;
    flex-direction:column;
  }

  .family-hero h1{
    font-size:38px;
  }

}

@media(max-width:640px){

  .supply-family-grid,
  .family-grid{
    grid-template-columns:1fr;
  }

  .supply-global-search{
    align-items:flex-start;
    flex-direction:column;
  }

}

/* ======================================================
   FAMILY VISUAL V91
====================================================== */

.family-option--visual{
  padding:0 !important;
  overflow:hidden;
  min-height:0;
}

.family-option__media{
  height:220px;
  background:#f6f9fb;
  display:flex;
  align-items:center;
  justify-content:center;
  border-bottom:1px solid #e2ebf0;
}

.family-option__media img{
  width:100%;
  height:100%;
  object-fit:contain;
  padding:20px;
  box-sizing:border-box;
}

.family-option__body{
  padding:22px 24px 26px;
}

.family-option__body > span{
  display:block;
  color:#0873ad;
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
  margin-bottom:10px;
}

.family-option__body h2{
  margin:0 0 10px;
  font-size:22px;
  line-height:1.2;
}

.family-option__body p{
  min-height:72px;
  margin:0 0 18px;
  color:#60798b;
  line-height:1.55;
}

.family-option__body strong{
  color:#0873ad;
  font-size:13px;
}


/* Asegurar grid correcto en Suministros */

.supply-family-grid{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:20px !important;
}

.supply-family-card{
  min-width:0;
}

.supply-family-card__media{
  height:220px !important;
}

.supply-family-card__media img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  display:block !important;
}

@media(max-width:900px){

  .supply-family-grid,
  .family-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }

}

@media(max-width:640px){

  .supply-family-grid,
  .family-grid{
    grid-template-columns:1fr !important;
  }

}

/* ======================================================
   FONDO BLANCO IMAGENES V92
====================================================== */

/* Familias: Instrumentación, Eléctrico, etc. */
.family-option__media{
  background:#ffffff !important;
}

.family-option__media img{
  background:#ffffff !important;
}

/* Tarjetas de suministros */
.supply-family-card__media{
  background:#ffffff !important;
}

.supply-family-card__media img{
  background:#ffffff !important;
}

/* Tarjetas de productos de Análisis de líquidos, Caudal, etc. */
.product-card__media,
.product-image,
.product-visual{
  background:#ffffff !important;
}

.product-card__media img,
.product-image img,
.product-visual img{
  background:#ffffff !important;
}


/* ======================================================
   V93 - DIFERENCIAR IMAGEN VS CONTENIDO
====================================================== */

/* La parte de imagen se mantiene blanca */
.family-option__media,
.supply-family-card__media,
.product-card__media,
.product-image,
.product-visual{
  background:#ffffff !important;
}

/* La parte de contenido abajo se diferencia */
.family-option__body,
.family-option__content,
.supply-family-card__body,
.supply-family-card__content,
.product-card__body,
.product-card__content{
  background:#f7fbff !important;
  border-top:1px solid #dbe6f0 !important;
}

/* Si el texto está dentro del article completo */
.family-option,
.supply-family-card,
.product-card{
  overflow:hidden;
  border:1px solid #dbe6f0 !important;
  border-radius:20px;
}

/* Un poco más de contraste visual en títulos y texto */
.family-option__body h3,
.family-option__content h3,
.supply-family-card__body h3,
.supply-family-card__content h3,
.product-card__body h3,
.product-card__content h3,
.family-option__body h4,
.family-option__content h4,
.supply-family-card__body h4,
.supply-family-card__content h4,
.product-card__body h4,
.product-card__content h4{
  color:#0b2f55 !important;
}

.family-option__body p,
.family-option__content p,
.supply-family-card__body p,
.supply-family-card__content p,
.product-card__body p,
.product-card__content p{
  color:#5b7188 !important;
}


/* ======================================================
   V94 - TARJETAS DE PRODUCTO GLOBAL
   Imagen blanca + información diferenciada
====================================================== */

/* ------------------------------------------------------
   TARJETAS COMPLETAS
------------------------------------------------------ */

.family-option,
.supply-family-card,
.product-card,
.liquid-card,
.liquid-product-card,
.catalog-card,
.flow-card{
  background:#f7fbff !important;
  border:1px solid #dbe6f0 !important;
  border-radius:18px !important;
  overflow:hidden !important;
}


/* ------------------------------------------------------
   ZONA DE IMAGEN
------------------------------------------------------ */

.family-option__media,
.supply-family-card__media,
.product-card__media,
.liquid-card__media,
.liquid-product-card__media,
.catalog-card__media,
.flow-card__media,
.product-image,
.product-visual,
.product-media{
  background:#ffffff !important;
  border-bottom:1px solid #dbe6f0 !important;
}


/* La propia imagen también queda sobre blanco */

.family-option__media img,
.supply-family-card__media img,
.product-card__media img,
.liquid-card__media img,
.liquid-product-card__media img,
.catalog-card__media img,
.flow-card__media img,
.product-image img,
.product-visual img,
.product-media img{
  background:#ffffff !important;
}


/* ------------------------------------------------------
   ZONA DE INFORMACION
------------------------------------------------------ */

.family-option__body,
.family-option__content,

.supply-family-card__body,
.supply-family-card__content,

.product-card__body,
.product-card__content,

.liquid-card__body,
.liquid-card__content,

.liquid-product-card__body,
.liquid-product-card__content,

.catalog-card__body,
.catalog-card__content,

.flow-card__body,
.flow-card__content{
  background:#f7fbff !important;
}


/* ------------------------------------------------------
   ANALISIS DE LIQUIDOS / CAUDAL
   Protección adicional para las tarjetas ya existentes
------------------------------------------------------ */

.liquid-grid .product-card,
.products-grid .product-card,
.product-grid .product-card,
.catalog-grid .product-card{
  background:#f7fbff !important;
}

.liquid-grid .product-card > div:first-child,
.products-grid .product-card > div:first-child,
.product-grid .product-card > div:first-child,
.catalog-grid .product-card > div:first-child{
  background:#ffffff !important;
  border-bottom:1px solid #dbe6f0 !important;
}

.liquid-grid .product-card > div:last-child,
.products-grid .product-card > div:last-child,
.product-grid .product-card > div:last-child,
.catalog-grid .product-card > div:last-child{
  background:#f7fbff !important;
}


/* ------------------------------------------------------
   TEXTO
------------------------------------------------------ */

.family-option h2,
.family-option h3,

.supply-family-card h2,
.supply-family-card h3,

.product-card h2,
.product-card h3,

.liquid-card h2,
.liquid-card h3,

.liquid-product-card h2,
.liquid-product-card h3,

.catalog-card h2,
.catalog-card h3{
  color:#0d2944 !important;
}

.family-option p,
.supply-family-card p,
.product-card p,
.liquid-card p,
.liquid-product-card p,
.catalog-card p{
  color:#60798b !important;
}


/* ------------------------------------------------------
   HOVER UNIFORME
------------------------------------------------------ */

.family-option--link,
.supply-family-card,
.product-card,
.liquid-card,
.liquid-product-card,
.catalog-card{
  transition:
    transform .18s ease,
    box-shadow .18s ease,
    border-color .18s ease;
}

.family-option--link:hover,
.supply-family-card:hover,
.product-card:hover,
.liquid-card:hover,
.liquid-product-card:hover,
.catalog-card:hover{
  transform:translateY(-3px);
  border-color:#c8dbe8 !important;
  box-shadow:0 16px 34px rgba(13,41,68,.09);
}


/* ======================================================
   SUMINISTROS IMAGE CREDITS V99
====================================================== */

.supply-image-credits{
  padding-top:18px;
  padding-bottom:26px;
  font-size:11px;
  line-height:1.5;
  color:#8a9aaa;
  text-align:right;
}

.supply-image-credits a{
  color:#70879b;
  text-decoration:none;
}

.supply-image-credits a:hover{
  text-decoration:underline;
}


/* ======================================================
   V101 - HERO SUMINISTROS SIN IMAGEN
====================================================== */

.supply-hero__grid{
  display:grid !important;
  grid-template-columns:1fr !important;
}

.supply-hero__grid > div:first-child{
  max-width:900px !important;
}

.supply-hero__media{
  display:none !important;
}


/* ======================================================
   V114 - JERARQUIA PLC POR FAMILIAS
====================================================== */

.plc-family-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:20px;
}

.plc-family-card{
  display:flex;
  flex-direction:column;
  overflow:hidden;
  text-decoration:none;
  color:inherit;
  background:#fff;
  border:1px solid #dbe6f0;
  border-radius:20px;
  transition:
    transform .18s ease,
    box-shadow .18s ease,
    border-color .18s ease;
}

.plc-family-card:hover{
  transform:translateY(-3px);
  border-color:#b9d3e6;
  box-shadow:0 16px 34px rgba(25,67,98,.10);
}

.plc-family-card__media{
  height:225px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  background:#fff;
  border-bottom:1px solid #dbe6f0;
}

.plc-family-card__media img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  padding:18px;
  box-sizing:border-box;
  background:#fff;
}

.plc-family-card__media--label{
  padding:25px;
  box-sizing:border-box;
  text-align:center;
  background:#fff;
}

.plc-family-card__media--label div{
  width:100%;
  padding:28px 15px;
  box-sizing:border-box;
  border:1px solid #dbe6f0;
  border-radius:15px;
  background:#f7fbff;
}

.plc-family-card__media--label strong{
  display:block;
  color:#0b2f55;
  font-size:26px;
  line-height:1.15;
  margin-bottom:7px;
}

.plc-family-card__media--label span{
  color:#5b7188;
  font-size:14px;
}

.plc-family-card__body{
  flex:1;
  padding:22px 24px 26px;
  background:#f7fbff;
}

.plc-family-card__body > span{
  display:block;
  margin-bottom:9px;
  color:#0077b8;
  font-size:12px;
  line-height:1.2;
  font-weight:800;
  letter-spacing:.08em;
}

.plc-family-card__body h2{
  margin:0 0 10px;
  color:#0b2f55;
  font-size:22px;
  line-height:1.2;
}

.plc-family-card__body p{
  margin:0 0 20px;
  color:#5b7188;
  line-height:1.55;
}

.plc-family-card__body strong{
  display:block;
  margin-top:auto;
  color:#0077b8;
  font-size:14px;
}

.lifecycle-note{
  display:inline-flex;
  align-items:center;
  margin-top:10px;
  padding:5px 9px;
  border-radius:999px;
  background:#eef5fa;
  color:#4e6c82;
  font-size:11px;
  font-weight:700;
}

@media(max-width:980px){
  .plc-family-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media(max-width:650px){
  .plc-family-grid{
    grid-template-columns:1fr;
  }
}



/* HOME AUTOMATIZACION FULL WIDTH */
.home-auto-hero{
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(300px, 1fr) minmax(420px, 1.5fr);
  gap: 24px;
  align-items: stretch;
  width: 100%;
  padding: 28px;
  border-radius: 28px;
  text-decoration: none;
  background: linear-gradient(135deg, #031533 0%, #06224d 55%, #0a3471 100%);
  color: #ffffff;
  overflow: hidden;
  margin-bottom: 24px;
  box-sizing: border-box;
}

.home-auto-hero__content{
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 14px;
  min-width: 0;
}

.home-auto-hero__eyebrow{
  display: inline-block;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #f7c53b;
}

.home-auto-hero__content h3{
  margin: 0;
  font-size: 40px;
  line-height: 1.05;
  color: #ffffff;
}

.home-auto-hero__content p{
  margin: 0;
  font-size: 17px;
  line-height: 1.65;
  color: rgba(255,255,255,.88);
  max-width: 560px;
}

.home-auto-hero__content strong{
  display: inline-block;
  margin-top: 6px;
  font-size: 14px;
  color: #ffffff;
}

.home-auto-hero__gallery{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  align-content: center;
}

.home-auto-hero__item{
  position: relative;
  min-height: 170px;
  border-radius: 18px;
  overflow: hidden;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
}

.home-auto-hero__item img{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.home-auto-hero__item span{
  position: absolute;
  left: 14px;
  bottom: 12px;
  display: inline-block;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(3, 17, 40, .72);
  color: #ffffff;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
}

@media (max-width: 1100px){
  .home-auto-hero{
    grid-template-columns: 1fr;
  }

  .home-auto-hero__content h3{
    font-size: 34px;
  }
}

@media (max-width: 700px){
  .home-auto-hero{
    padding: 20px;
  }

  .home-auto-hero__gallery{
    grid-template-columns: 1fr;
  }

  .home-auto-hero__content h3{
    font-size: 28px;
  }

  .home-auto-hero__content p{
    font-size: 15px;
  }
}

/* BEGIN JJENERGY HEADER CATALOGO ALINEADO */

/* Barra superior igual a Inicio */
.topbar{
    background:#0d2944;
    color:#d7e6f2;
    font-size:11px;
    letter-spacing:.35px;
}

.topbar > .wrap{
    width:min(1320px,calc(100% - 64px));
    margin-inline:auto;
}

.topbar__inner{
    min-height:29px;
    padding:0;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
}


/* Contenedor completo del header */
.header > .wrap.nav{
    width:min(1320px,calc(100% - 64px));
    margin-inline:auto;

    min-height:84px;

    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:28px;
}


/* Logo exactamente como Inicio */
.header > .wrap.nav > .brand{
    flex:0 0 auto;
}

.header > .wrap.nav > .brand img{
    width:168px;
    height:auto;
    object-fit:contain;
}


/* IMPORTANTE:
   eliminar el margin-left:auto que desplazaba el menú
*/
.header .navlinks{
    margin-left:0 !important;

    display:flex;
    align-items:center;

    gap:28px;

    flex:0 1 auto;

    font-size:13px;
    font-weight:750;
}


/* Links iguales a Inicio */
.header .navlinks a{
    position:relative;

    padding:31px 0 29px;

    border:0;

    color:#314a61;

    font-size:13px;
    font-weight:750;
}


.header .navlinks a::after{
    content:"";

    position:absolute;
    left:0;
    right:0;
    bottom:20px;

    height:2px;

    background:#0f6ea8;

    transform:scaleX(0);

    transition:.2s;
}


.header .navlinks a:hover,
.header .navlinks a.active{
    color:#0f6ea8;
}


.header .navlinks a:hover::after,
.header .navlinks a.active::after{
    transform:scaleX(1);
}


/* Botón igual a Inicio */
.header > .wrap.nav > .cta.cta--blue{
    flex:0 0 auto;

    padding:13px 19px;

    border-radius:12px;

    font-size:13px;
    font-weight:850;

    white-space:nowrap;

    background:linear-gradient(
        135deg,
        #0f6ea8,
        #0a5a8b
    );

    color:#fff;

    box-shadow:
        0 8px 25px
        rgba(15,110,168,.22);
}


/* Tablet */
@media(max-width:1100px) and (min-width:761px){

    .topbar > .wrap,
    .header > .wrap.nav{
        width:min(100% - 40px,1320px);
    }

    .header .navlinks{
        gap:16px;
    }

}


/* Móvil */
@media(max-width:760px){

    .topbar{
        display:none;
    }

    .header > .wrap.nav{
        width:calc(100% - 28px);
        min-height:72px;
        gap:14px;
    }

    .header > .wrap.nav > .brand img{
        width:142px;
    }

    .header .navlinks{
        display:none;
    }

    .header > .wrap.nav > .cta.cta--blue{
        margin-left:auto;
        padding:10px 12px;
        font-size:11px;
    }
}

/* END JJENERGY HEADER CATALOGO ALINEADO */

/* BEGIN JJENERGY HEADER ALTURA EXACTA */

/*
   Igualar altura blanca del header técnico
   con Inicio / Servicios.
*/

@media (min-width:761px){

    .header > .wrap.nav{
        height:84px !important;
        min-height:84px !important;
        max-height:84px !important;

        padding-top:0 !important;
        padding-bottom:0 !important;

        align-items:center !important;
    }


    /* El menú no debe aumentar la altura del header */
    .header .navlinks{
        height:84px !important;

        align-items:center !important;
    }


    .header .navlinks a{
        height:84px !important;

        padding:0 !important;

        display:flex !important;
        align-items:center !important;

        line-height:1 !important;
    }


    /* Línea azul del elemento activo */
    .header .navlinks a::after{
        bottom:18px !important;
    }


    /* Logo contenido dentro de los 84px */
    .header > .wrap.nav > .brand{
        height:84px;

        display:flex;
        align-items:center;
    }


    .header > .wrap.nav > .brand img{
        width:168px;
        height:auto;
        max-height:60px;
    }


    /* Botón centrado */
    .header > .wrap.nav > .cta.cta--blue{
        margin-top:0 !important;
        margin-bottom:0 !important;

        align-self:center !important;
    }

}

/* END JJENERGY HEADER ALTURA EXACTA */


/* BEGIN JJENERGY MENU ACTIVO TECNICO */

/*
   Igualar indicador de página activa
   con Inicio / Servicios.
*/

@media (min-width:761px){

    .header .navlinks a{
        position:relative !important;
    }

    .header .navlinks a::after{
        content:"" !important;

        position:absolute !important;

        left:0 !important;
        right:0 !important;
        bottom:18px !important;

        height:2px !important;

        background:#0f6ea8 !important;

        transform:scaleX(0) !important;
        transform-origin:center !important;

        opacity:0 !important;

        transition:
            transform .2s ease,
            opacity .2s ease !important;
    }

    .header .navlinks a:hover::after,
    .header .navlinks a.active::after,
    .header .navlinks a[aria-current="page"]::after{
        transform:scaleX(1) !important;
        opacity:1 !important;
    }

    .header .navlinks a.active,
    .header .navlinks a[aria-current="page"]{
        color:#0f6ea8 !important;
    }

}

/* END JJENERGY MENU ACTIVO TECNICO */