/* =========================================================
   Página de destino: calibracion-de-basculas-balanzas.html
   Clases con prefijo .cal- para no chocar con estilos.css ni Bootstrap
   ========================================================= */
.cal{--cal-azul:#2670A6; --cal-azul-osc:#1d5a87; --cal-cian:#00BAD2; --cal-gris:#f3f5f7; --cal-texto:#2b2f36; --cal-suave:#5b6370;
  color:var(--cal-texto); font-size:16px; line-height:1.6}
.cal *{box-sizing:border-box}
.cal-wrap{max-width:1140px; margin:0 auto; padding:0 16px}
.cal h1, .cal h2, .cal h3{font-family:'Lato-Black', Arial, sans-serif; color:#222; margin:0}
.cal .azul{color:var(--cal-azul)}
.cal .azulClaro{color:var(--cal-cian)}
.cal-seccion{padding:56px 0}
.cal-seccion.gris{background:var(--cal-gris)}
.cal-h2{font-size:1.9em; line-height:1.25; text-align:center; margin-bottom:12px}
.cal-h2 + .cal-lead{text-align:center; max-width:760px; margin:0 auto 32px; color:var(--cal-suave)}

/* Botones */
.cal-btn{display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:52px; padding:0 28px; border-radius:999px;
  background:#25D366; color:#fff; font-family:'Lato-Black', Arial, sans-serif; font-size:1.05em; letter-spacing:.3px; text-decoration:none;
  box-shadow:0 8px 20px rgba(37,211,102,.28); transition:transform .15s, background .15s}
.cal-btn:hover, .cal-btn:focus{background:#1EBE5A; color:#fff; text-decoration:none; transform:translateY(-1px)}
.cal-btn svg{width:22px; height:22px; flex:0 0 auto}
.cal-btn-linea{background:transparent; color:var(--cal-azul); border:2px solid var(--cal-azul); box-shadow:none}
.cal-btn-linea:hover, .cal-btn-linea:focus{background:var(--cal-azul); color:#fff}

/* Hero */
.cal-hero{padding:56px 0 48px; background:linear-gradient(180deg,#fff 0%, #eef5fa 100%)}
.cal-hero-grid{display:grid; grid-template-columns:1.15fr .85fr; gap:40px; align-items:center}
.cal-eyebrow{display:inline-block; margin-bottom:14px; padding:6px 14px; border-radius:999px; background:#e3f1fa; color:var(--cal-azul);
  font-family:'Lato-Black', Arial, sans-serif; font-size:.85em; letter-spacing:.5px; text-transform:uppercase}
.cal-hero h1{font-size:2.6em; line-height:1.1; margin-bottom:16px}
.cal-hero p.cal-sub{font-size:1.2em; color:var(--cal-suave); margin:0 0 24px}
.cal-hero-acciones{display:flex; flex-wrap:wrap; gap:12px; margin-bottom:24px}
.cal-sellos{display:flex; flex-wrap:wrap; gap:8px 18px; margin:0; padding:0; list-style:none; font-weight:bold; font-size:.95em}
.cal-sellos li{display:flex; align-items:center; gap:8px}
.cal-sellos li::before{content:"✓"; display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; border-radius:999px;
  background:var(--cal-cian); color:#fff; font-size:13px}
.cal-hero-img{position:relative}
.cal-hero-img img{width:100%; height:auto; border-radius:18px; box-shadow:0 20px 50px rgba(15,40,70,.18); display:block}
.cal-hero-badge{position:absolute; left:-18px; bottom:22px; background:#fff; border-radius:14px; padding:12px 16px; box-shadow:0 10px 30px rgba(15,40,70,.18);
  font-family:'Lato-Black', Arial, sans-serif; color:var(--cal-azul); line-height:1.2}
.cal-hero-badge small{display:block; font-family:Arial, sans-serif; font-weight:normal; color:var(--cal-suave); font-size:.8em; margin-top:2px}

/* Tarjetas de beneficios */
.cal-cards{display:grid; grid-template-columns:repeat(4, 1fr); gap:18px}
.cal-card{background:#fff; border-radius:16px; padding:24px 20px; box-shadow:0 2px 10px rgba(15,40,70,.07); border-top:4px solid var(--cal-cian)}
.cal-card h3{font-size:1.15em; margin-bottom:8px}
.cal-card p{margin:0; color:var(--cal-suave); font-size:.97em}
.cal-ico{display:inline-flex; align-items:center; justify-content:center; width:46px; height:46px; border-radius:12px; background:#e3f1fa; color:var(--cal-azul); margin-bottom:14px}
.cal-ico svg{width:24px; height:24px}

/* Qué incluye */
.cal-incluye{display:grid; grid-template-columns:.9fr 1.1fr; gap:40px; align-items:center}
.cal-incluye img{width:100%; height:auto; border-radius:18px; display:block}
.cal-lista{margin:18px 0 0; padding:0; list-style:none}
.cal-lista li{position:relative; padding:10px 0 10px 34px; border-bottom:1px solid #e3e8ee}
.cal-lista li:last-child{border-bottom:0}
.cal-lista li::before{content:""; position:absolute; left:4px; top:17px; width:16px; height:9px; border-left:3px solid var(--cal-cian); border-bottom:3px solid var(--cal-cian); transform:rotate(-45deg)}
.cal-lista strong{color:#222}

/* Equipos */
.cal-equipos{display:grid; grid-template-columns:1fr 1fr; gap:18px}
.cal-equipo{background:#fff; border-radius:16px; padding:26px 24px; box-shadow:0 2px 10px rgba(15,40,70,.07)}
.cal-equipo h3{font-size:1.3em; margin-bottom:14px}
.cal-chips{display:flex; flex-wrap:wrap; gap:8px; margin:0; padding:0; list-style:none}
.cal-chips li{padding:6px 14px; border-radius:999px; background:var(--cal-gris); font-size:.95em}

/* Proceso */
.cal-pasos{display:grid; grid-template-columns:repeat(4, 1fr); gap:18px; margin:0; padding:0; list-style:none; counter-reset:paso}
.cal-pasos li{counter-increment:paso; position:relative; background:#fff; border-radius:16px; padding:56px 20px 22px; box-shadow:0 2px 10px rgba(15,40,70,.07)}
.cal-pasos li::before{content:counter(paso); position:absolute; top:18px; left:20px; width:30px; height:30px; border-radius:999px; background:var(--cal-azul); color:#fff;
  display:flex; align-items:center; justify-content:center; font-family:'Lato-Black', Arial, sans-serif}
.cal-pasos strong{display:block; font-family:'Lato-Black', Arial, sans-serif; font-weight:normal; color:#222; margin-bottom:6px; font-size:1.05em}
.cal-pasos span{color:var(--cal-suave); font-size:.97em}
.cal-centro{text-align:center; margin-top:32px}

/* Marcas */
/* Los logos son cuadrados de 250×250 con margen blanco propio: se muestran grandes dentro de tarjetas */
.cal-marcas{display:flex; flex-wrap:wrap; justify-content:center; gap:18px}
.cal-marcas img{display:block; width:190px; max-width:calc(50% - 9px); height:auto; aspect-ratio:1/1; object-fit:contain; background:#fff; border-radius:16px;
  box-shadow:0 2px 10px rgba(15,40,70,.07); transition:transform .2s, box-shadow .2s}
.cal-marcas img:hover{transform:translateY(-3px); box-shadow:0 10px 24px rgba(15,40,70,.12)}

/* Preguntas frecuentes */
.cal-faq{max-width:820px; margin:0 auto}
.cal-faq details{background:#fff; border-radius:12px; margin-bottom:10px; box-shadow:0 1px 6px rgba(15,40,70,.07)}
.cal-faq summary{cursor:pointer; list-style:none; padding:18px 52px 18px 20px; position:relative; font-family:'Lato-Black', Arial, sans-serif; color:#222; font-size:1.05em}
.cal-faq summary::-webkit-details-marker{display:none}
.cal-faq summary::after{content:"+"; position:absolute; right:20px; top:50%; transform:translateY(-50%); font-size:1.5em; color:var(--cal-azul); line-height:1}
.cal-faq details[open] summary::after{content:"–"}
.cal-faq details p{margin:0; padding:0 20px 18px; color:var(--cal-suave)}

/* Cierre */
.cal-cierre{background:var(--cal-azul); color:#fff; text-align:center; padding:56px 0}
.cal-cierre h2{color:#fff; font-size:1.9em; margin-bottom:10px}
.cal-cierre p{color:#d6ecf7; margin:0 auto 26px; max-width:640px; font-size:1.1em}

/* Responsive */
@media (max-width:991px){
  .cal-hero-grid, .cal-incluye{grid-template-columns:1fr}
  .cal-hero-img{max-width:560px}
  .cal-cards, .cal-pasos{grid-template-columns:repeat(2, 1fr)}
}
@media (max-width:600px){
  .cal-seccion, .cal-cierre{padding:40px 0}
  .cal-hero{padding:32px 0}
  .cal-hero h1{font-size:2em}
  .cal-hero p.cal-sub{font-size:1.05em}
  .cal-h2, .cal-cierre h2{font-size:1.5em}
  .cal-cards, .cal-pasos, .cal-equipos{grid-template-columns:1fr}
  .cal-marcas{gap:12px}
  .cal-marcas img{width:170px; max-width:calc(50% - 6px)}
  .cal-btn{width:100%}
  .cal-hero-badge{left:12px; bottom:12px}
}
@media (prefers-reduced-motion:reduce){ .cal-btn{transition:none} }