/* ===================================================================
   OFERTA + METODOLOGÍA  — versión limpia (sin duplicados)
   ===================================================================*/

/* ---------- OFERTA (imagen + texto) ---------- */

/* Intro centrada y con ancho cómodo */
.oferta .intro{
  max-width: 820px;
  margin: 0 auto 1.8rem;
}

/* Fila: imagen + texto */
.oferta .item{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  column-gap: 32px;
  row-gap: 16px;
  margin-bottom: 2rem;
}

/* Alterna orden en filas "inverse" (sólo desktop) */
.oferta .item.inverse .img-col{ order: 2; }
.oferta .item.inverse .txt-col{ order: 1; }

/* Columnas base */
.oferta .img-col{
  flex: 0 0 280px;      /* ancho columna icono en desktop */
  max-width: 280px;
  display:flex; align-items:center; justify-content:center;
}
.oferta .txt-col{ flex: 1 1 520px; min-width: 260px; }

/* Icono sin marco (versión final) */
.oferta .media{
  background: transparent;
  border: 0;
  box-shadow: none;
  padding: 0;
  max-width: 240px;     /* tope real del icono */
  margin: 0 auto;
}
.oferta .media img{
  display:block;
  max-width:100%;
  height:auto;
  max-height:140px;
  object-fit:contain;
}

/* Tipografía */
.oferta h3{
  font-family:"Lora", serif;
  color:#4b5842;
  margin:0 0 .4rem 0;
}
.oferta p{ margin:0 0 .8rem 0; }

/* Breakpoints (únicos) */
@media (min-width:1200px){
  .oferta .img-col{ flex-basis:260px; max-width:260px; }
  .oferta .media{ max-width:220px; }
  .oferta .media img{ max-height:130px; }
}
@media (max-width:992px){
  .oferta .img-col{ flex-basis:220px; max-width:220px; }
  .oferta .media{ max-width:200px; }
  .oferta .media img{ max-height:120px; }
}
@media (max-width:600px){
  .oferta .item{ column-gap:20px; row-gap:10px; }
  .oferta .item.inverse .img-col{ order:1; }
  .oferta .item.inverse .txt-col{ order:2; }
  .oferta .img-col{ flex-basis:100%; max-width:100%; }
  .oferta .media{ max-width:180px; }
  .oferta .media img{ max-height:110px; }
}

/* ---------- METODOLOGÍA DE DISEÑO ---------- */

.metodo .lead{
  max-width:62ch;
  margin:0 auto 1.25rem;
  color:#4b5842;
  font-size:1.06rem;
}



/* === Quitar la raya entre chips y CTA dentro de la sección .metodo === */

/* nada de bordes ni sombras en los bloques finales */
.section.metodo .metodo-tools,
.section.metodo .metodo-cta{
  border: 0 !important;
  box-shadow: none !important;
}

/* por si el separador es un pseudo-elemento */
.section.metodo .metodo-tools::before,
.section.metodo .metodo-tools::after,
.section.metodo .metodo-cta::before,
.section.metodo .metodo-cta::after{
  content: none !important;
  display: none !important;
}

/* si el tema lo pinta en el contenedor */
.section.metodo .container::before,
.section.metodo .container::after{
  content: none !important;
  display: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* si estuviera en el propio listado de chips */
.section.metodo .chips,
.section.metodo .chips::before,
.section.metodo .chips::after{
  border: 0 !important;
  box-shadow: none !important;
  content: none !important;
}

/* aseguramos que no haya <hr> “suelto” */
.section.metodo hr, 
.section.metodo .divider{ display:none !important; }

/* respiración entre chips y botón sin raya */
.section.metodo .metodo-tools + .metodo-cta{
  margin-top: .75rem;
  padding-top: 0 !important;
}