/* =========================================================
   ¿CÓMO LO HACEMOS? — PREMIUM V14
   Solo afecta #como-lo-hacemos.
   Backend / panel / campos dinámicos intactos.
   ========================================================= */

#como-lo-hacemos.care-method{
  --care-burgundy:#6f2535;
  --care-burgundy-deep:#552131;
  --care-cream:#f7f1e8;
  --care-white:#ffffff;
  --care-ink:#312c2f;
  --care-muted:#746d71;
  --care-line:rgba(85,33,49,.12);

  width:min(1440px,calc(100% - 48px)) !important;
  max-width:1440px !important;
  margin:0 auto !important;
  padding:clamp(5rem,8vw,8rem) 0 !important;

  display:block !important;

  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  overflow:visible !important;
}

#como-lo-hacemos.care-method::before,
#como-lo-hacemos.care-method::after{
  display:none !important;
}

#como-lo-hacemos .care-method-copy{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
}


/* =========================================================
   ENCABEZADO
   ========================================================= */

#como-lo-hacemos .care-heading{
  display:block !important;

  margin:0 0 clamp(2.6rem,5vw,4.4rem) !important;
  padding:0 0 clamp(1.5rem,3vw,2.1rem) !important;

  border:0 !important;
  border-bottom:1px solid var(--care-line) !important;
}

#como-lo-hacemos .care-heading>div{
  width:min(100%,900px);
}

#como-lo-hacemos .care-heading .eyebrow{
  margin-bottom:.7rem !important;
}

#como-lo-hacemos .care-heading h2{
  max-width:11ch;

  margin:0 !important;

  color:var(--care-burgundy-deep) !important;

  font-family:Georgia,"Times New Roman",serif !important;
  font-size:clamp(3.1rem,5.2vw,5.25rem) !important;
  font-weight:500 !important;
  letter-spacing:-.045em !important;
  line-height:1.02 !important;
}

/* Se elimina visualmente el antiguo + aunque sobreviva en otro CSS */
#como-lo-hacemos .care-heading-mark{
  display:none !important;
}


/* =========================================================
   PRESENTACIÓN 60 / 40
   ========================================================= */

#como-lo-hacemos .care-introduction{
  display:grid !important;
  grid-template-columns:minmax(0,3fr) minmax(300px,2fr) !important;
  gap:clamp(2.5rem,6vw,6rem) !important;
  align-items:start !important;

  margin:0 0 clamp(4rem,7vw,6.5rem) !important;
}

#como-lo-hacemos .care-intro-main{
  min-width:0;
}

#como-lo-hacemos .care-lead{
  max-width:20ch;

  margin:0 0 2.1rem !important;

  color:var(--care-burgundy-deep) !important;

  font-family:Georgia,"Times New Roman",serif !important;
  font-size:clamp(1.9rem,3vw,3.1rem) !important;
  font-weight:500 !important;
  letter-spacing:-.025em !important;
  line-height:1.25 !important;
}


/* ---------- 3 ideas conceptuales ---------- */

#como-lo-hacemos .care-principles{
  display:grid;

  gap:0;

  width:min(100%,760px);

  margin:0;
}

#como-lo-hacemos .care-principle{
  display:grid;
  grid-template-columns:54px minmax(0,1fr);
  gap:1.15rem;
  align-items:center;

  padding:1rem 0;

  border-bottom:1px solid var(--care-line);
}

#como-lo-hacemos .care-principle:first-child{
  padding-top:0;
}

#como-lo-hacemos .care-principle:last-child{
  padding-bottom:0;
  border-bottom:0;
}

#como-lo-hacemos .care-principle-icon{
  display:grid;
  place-items:center;

  width:54px;
  height:54px;

  color:var(--care-burgundy);

  background:var(--care-cream);

  border-radius:15px;
}

#como-lo-hacemos .care-principle-icon svg{
  width:28px;
  height:28px;

  fill:none;
  stroke:currentColor;
  stroke-width:1.65;
  stroke-linecap:round;
  stroke-linejoin:round;
}

#como-lo-hacemos .care-principle strong{
  display:block;

  margin:0 0 .16rem;

  color:var(--care-ink);

  font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:.94rem;
  font-weight:760;
  line-height:1.35;
}

#como-lo-hacemos .care-principle small{
  display:block;

  color:var(--care-muted);

  font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:.78rem;
  font-weight:500;
  line-height:1.55;
}


/* ---------- caja destacada ---------- */

#como-lo-hacemos .care-body-card{
  min-width:0;

  padding:clamp(2rem,4vw,3.8rem);

  background:var(--care-cream);

  border-radius:22px;
}

#como-lo-hacemos .care-body-card::before{
  content:"“";

  display:block;

  height:.8em;

  margin:0 0 1.2rem;

  color:rgba(111,37,53,.10);

  font-family:Georgia,"Times New Roman",serif;
  font-size:5.5rem;
  line-height:.8;
}

#como-lo-hacemos .care-body{
  margin:0 !important;
  padding:0 !important;

  color:var(--care-burgundy-deep) !important;

  font-family:Georgia,"Times New Roman",serif !important;
  font-size:clamp(1.35rem,2vw,2rem) !important;
  font-weight:500 !important;
  letter-spacing:-.015em !important;
  line-height:1.45 !important;

  border:0 !important;
  background:transparent !important;
}


/* =========================================================
   APOYOS COMPLEMENTARIOS
   ========================================================= */

#como-lo-hacemos .care-support{
  margin:0 0 clamp(3.5rem,6vw,5.5rem) !important;
  padding:0 !important;

  background:transparent !important;
  border:0 !important;
}

#como-lo-hacemos .care-support-label{
  display:flex !important;
  align-items:center;

  gap:1rem;

  margin:0 0 1.5rem !important;

  color:var(--care-burgundy) !important;

  font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif !important;
  font-size:.7rem !important;
  font-weight:850 !important;
  letter-spacing:.13em !important;
  text-transform:uppercase !important;
}

#como-lo-hacemos .care-support-label::after{
  content:"";

  width:64px;
  height:1px;

  background:rgba(111,37,53,.22);
}

#como-lo-hacemos .care-support-items{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;

  gap:1.4rem !important;
}

#como-lo-hacemos .care-support-items article{
  display:grid !important;
  grid-template-columns:78px minmax(0,1fr) !important;
  gap:1.4rem !important;
  align-items:start !important;

  min-width:0 !important;
  min-height:0 !important;

  padding:clamp(1.6rem,3vw,2.35rem) !important;

  background:var(--care-white) !important;

  border:0 !important;
  border-radius:20px !important;

  box-shadow:
    0 16px 42px rgba(53,40,46,.065) !important;
}


/* reemplazo del antiguo cuadrado / número */
#como-lo-hacemos .care-support-icon{
  display:grid !important;
  place-items:center !important;

  width:78px !important;
  height:78px !important;

  margin:0 !important;

  color:var(--care-burgundy) !important;

  background:var(--care-cream) !important;

  border:0 !important;
  border-radius:50% !important;
}

#como-lo-hacemos .care-support-icon svg{
  width:42px;
  height:42px;

  fill:none;
  stroke:currentColor;
  stroke-width:1.45;
  stroke-linecap:round;
  stroke-linejoin:round;
}

#como-lo-hacemos .care-support-items article>div{
  min-width:0;
}

#como-lo-hacemos .care-support-items h3{
  margin:.05rem 0 .55rem !important;

  color:var(--care-burgundy-deep) !important;

  font-family:Georgia,"Times New Roman",serif !important;
  font-size:clamp(1.45rem,2vw,2rem) !important;
  font-weight:500 !important;
  letter-spacing:-.02em !important;
  line-height:1.1 !important;
}

#como-lo-hacemos .care-support-items p{
  margin:0 !important;

  color:var(--care-muted) !important;

  font-size:.86rem !important;
  line-height:1.7 !important;
}

#como-lo-hacemos .care-support-brand{
  display:block !important;

  width:max-content;
  max-width:100%;

  margin:1rem 0 0 !important;
  padding:.38rem .65rem !important;

  color:var(--care-burgundy) !important;

  background:#fff !important;

  border:1px solid rgba(111,37,53,.25) !important;
  border-radius:8px !important;

  font-size:.7rem !important;
  font-weight:550 !important;
  line-height:1.3 !important;
}

#como-lo-hacemos .care-support-brand strong{
  color:var(--care-burgundy-deep) !important;
  font-weight:850 !important;
}


/* =========================================================
   IMAGEN OPCIONAL DE LA SECCIÓN
   ========================================================= */

#como-lo-hacemos .care-method-image{
  width:100% !important;

  margin:0 0 clamp(3rem,5vw,4.5rem) !important;

  overflow:hidden !important;

  aspect-ratio:16/6 !important;

  border-radius:20px !important;

  background:var(--care-cream) !important;
}

#como-lo-hacemos .care-method-image img{
  display:block !important;

  width:100% !important;
  height:100% !important;

  object-fit:cover !important;
  object-position:center !important;

  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}


/* =========================================================
   EVOLUCIÓN + DISCLAIMER
   ========================================================= */

#como-lo-hacemos .care-closing{
  display:block !important;

  margin:0 !important;
  padding:0 !important;

  background:transparent !important;
  border:0 !important;
}

#como-lo-hacemos .care-outcome{
  display:grid !important;
  grid-template-columns:auto minmax(0,1fr);
  gap:1.25rem;
  align-items:center;

  width:100% !important;

  margin:0 !important;
  padding:1.5rem 1.7rem !important;

  background:var(--care-white) !important;

  border:0 !important;
  border-left:5px solid var(--care-burgundy) !important;
  border-radius:0 16px 16px 0 !important;

  box-shadow:
    0 12px 32px rgba(53,40,46,.045) !important;

  color:var(--care-ink) !important;
}

#como-lo-hacemos .care-outcome-icon{
  display:grid;
  place-items:center;

  width:50px;
  height:50px;

  color:var(--care-burgundy);

  background:var(--care-cream);

  border-radius:50%;
}

#como-lo-hacemos .care-outcome-icon svg{
  width:27px;
  height:27px;

  fill:none;
  stroke:currentColor;
  stroke-width:1.6;
  stroke-linecap:round;
  stroke-linejoin:round;
}

#como-lo-hacemos .care-outcome-copy{
  min-width:0;
}

#como-lo-hacemos .care-outcome span{
  display:block !important;

  margin:0 0 .3rem !important;

  color:var(--care-burgundy) !important;

  font-size:.7rem !important;
  font-weight:850 !important;
  letter-spacing:.1em !important;
  line-height:1.3 !important;
  text-transform:uppercase !important;
}

#como-lo-hacemos .care-outcome strong{
  display:block !important;

  margin:0 !important;

  color:var(--care-ink) !important;

  font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif !important;
  font-size:.92rem !important;
  font-weight:550 !important;
  line-height:1.65 !important;
}

#como-lo-hacemos .care-disclaimer{
  display:block !important;

  width:min(100%,980px) !important;

  margin:1.4rem auto 0 !important;

  color:#8a8287 !important;

  font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif !important;
  font-size:.72rem !important;
  font-weight:450 !important;
  line-height:1.65 !important;
  text-align:center !important;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media(max-width:960px){

  #como-lo-hacemos.care-method{
    width:min(100% - 40px,1440px) !important;
  }

  #como-lo-hacemos .care-introduction{
    grid-template-columns:1fr !important;
    gap:2.5rem !important;
  }

  #como-lo-hacemos .care-lead{
    max-width:26ch;
  }

  #como-lo-hacemos .care-body-card{
    width:100%;
  }

  #como-lo-hacemos .care-support-items{
    grid-template-columns:1fr !important;
  }
}


@media(max-width:600px){

  #como-lo-hacemos.care-method{
    width:calc(100% - 28px) !important;
    padding:4rem 0 !important;
  }

  #como-lo-hacemos .care-heading{
    margin-bottom:2.1rem !important;
    padding-bottom:1.35rem !important;
  }

  #como-lo-hacemos .care-heading h2{
    max-width:none;
    font-size:clamp(2.8rem,13vw,4rem) !important;
    line-height:1.04 !important;
  }

  #como-lo-hacemos .care-introduction{
    gap:2rem !important;
    margin-bottom:3.5rem !important;
  }

  #como-lo-hacemos .care-lead{
    max-width:none;
    margin-bottom:1.6rem !important;

    font-size:clamp(1.7rem,8vw,2.2rem) !important;
    line-height:1.28 !important;
  }

  #como-lo-hacemos .care-principle{
    grid-template-columns:46px minmax(0,1fr);
    gap:.85rem;
    padding:.85rem 0;
  }

  #como-lo-hacemos .care-principle-icon{
    width:46px;
    height:46px;
    border-radius:13px;
  }

  #como-lo-hacemos .care-principle-icon svg{
    width:24px;
    height:24px;
  }

  #como-lo-hacemos .care-principle strong{
    font-size:.88rem;
  }

  #como-lo-hacemos .care-principle small{
    font-size:.72rem;
  }

  #como-lo-hacemos .care-body-card{
    padding:1.6rem;
    border-radius:17px;
  }

  #como-lo-hacemos .care-body-card::before{
    margin-bottom:.8rem;
    font-size:4.2rem;
  }

  #como-lo-hacemos .care-body{
    font-size:clamp(1.25rem,6vw,1.65rem) !important;
    line-height:1.4 !important;
  }

  #como-lo-hacemos .care-support{
    margin-bottom:3.2rem !important;
  }

  #como-lo-hacemos .care-support-items{
    gap:1rem !important;
  }

  #como-lo-hacemos .care-support-items article{
    grid-template-columns:60px minmax(0,1fr) !important;
    gap:1rem !important;

    padding:1.3rem !important;

    border-radius:17px !important;
  }

  #como-lo-hacemos .care-support-icon{
    width:60px !important;
    height:60px !important;
  }

  #como-lo-hacemos .care-support-icon svg{
    width:33px;
    height:33px;
  }

  #como-lo-hacemos .care-support-items h3{
    font-size:1.4rem !important;
  }

  #como-lo-hacemos .care-support-items p{
    font-size:.8rem !important;
    line-height:1.6 !important;
  }

  #como-lo-hacemos .care-method-image{
    aspect-ratio:4/3 !important;
    border-radius:16px !important;
  }

  #como-lo-hacemos .care-outcome{
    grid-template-columns:44px minmax(0,1fr);

    gap:.9rem;

    padding:1.2rem 1rem !important;

    border-left-width:4px !important;
    border-radius:0 14px 14px 0 !important;
  }

  #como-lo-hacemos .care-outcome-icon{
    width:44px;
    height:44px;
  }

  #como-lo-hacemos .care-outcome strong{
    font-size:.82rem !important;
    line-height:1.55 !important;
  }

  #como-lo-hacemos .care-disclaimer{
    margin-top:1.1rem !important;
    font-size:.67rem !important;
  }
}


@media(prefers-reduced-motion:reduce){

  #como-lo-hacemos *{
    scroll-behavior:auto !important;
  }
}


/* =========================================================
   ¿CÓMO LO HACEMOS? V15 — COMPACTO
   Solo reduce espacios. No cambia estructura ni estilo visual.
   ========================================================= */

#como-lo-hacemos.care-method{
  padding:clamp(3.8rem,5vw,5.3rem) 0 !important;
}

#como-lo-hacemos .care-heading{
  margin-bottom:clamp(1.7rem,2.8vw,2.5rem) !important;
  padding-bottom:clamp(1.15rem,2vw,1.55rem) !important;
}

#como-lo-hacemos .care-heading h2{
  max-width:12ch !important;
  font-size:clamp(3rem,4.7vw,4.85rem) !important;
  line-height:1 !important;
}

#como-lo-hacemos .care-introduction{
  grid-template-columns:minmax(0,1.55fr) minmax(300px,1fr) !important;
  gap:clamp(2rem,3.5vw,3.5rem) !important;
  margin-bottom:clamp(3rem,4.5vw,4.2rem) !important;
}

#como-lo-hacemos .care-lead{
  max-width:22ch !important;
  margin-bottom:1.55rem !important;
  font-size:clamp(1.75rem,2.55vw,2.7rem) !important;
  line-height:1.2 !important;
}

#como-lo-hacemos .care-principles{
  width:min(100%,700px) !important;
}

#como-lo-hacemos .care-principle{
  grid-template-columns:48px minmax(0,1fr) !important;
  gap:.95rem !important;
  padding:.72rem 0 !important;
}

#como-lo-hacemos .care-principle-icon{
  width:48px !important;
  height:48px !important;
  border-radius:13px !important;
}

#como-lo-hacemos .care-principle-icon svg{
  width:24px !important;
  height:24px !important;
}

#como-lo-hacemos .care-principle strong{
  font-size:.88rem !important;
}

#como-lo-hacemos .care-principle small{
  font-size:.73rem !important;
  line-height:1.45 !important;
}

#como-lo-hacemos .care-body-card{
  padding:clamp(1.7rem,2.8vw,2.5rem) !important;
  border-radius:18px !important;
}

#como-lo-hacemos .care-body-card::before{
  margin-bottom:.75rem !important;
  font-size:4.5rem !important;
}

#como-lo-hacemos .care-body{
  font-size:clamp(1.25rem,1.7vw,1.7rem) !important;
  line-height:1.38 !important;
}

#como-lo-hacemos .care-support{
  margin-bottom:clamp(2.8rem,4vw,3.8rem) !important;
}

#como-lo-hacemos .care-support-label{
  margin-bottom:1.15rem !important;
}

#como-lo-hacemos .care-support-items{
  gap:1rem !important;
}

#como-lo-hacemos .care-support-items article{
  grid-template-columns:68px minmax(0,1fr) !important;
  gap:1.15rem !important;
  padding:clamp(1.3rem,2vw,1.8rem) !important;
  border-radius:17px !important;
}

#como-lo-hacemos .care-support-icon{
  width:68px !important;
  height:68px !important;
}

#como-lo-hacemos .care-support-icon svg{
  width:36px !important;
  height:36px !important;
}

#como-lo-hacemos .care-support-items h3{
  margin-bottom:.4rem !important;
  font-size:clamp(1.3rem,1.65vw,1.7rem) !important;
}

#como-lo-hacemos .care-support-items p{
  font-size:.81rem !important;
  line-height:1.58 !important;
}

#como-lo-hacemos .care-support-brand{
  margin-top:.75rem !important;
}

#como-lo-hacemos .care-method-image{
  margin-bottom:clamp(2.5rem,3.8vw,3.5rem) !important;
}

#como-lo-hacemos .care-outcome{
  padding:1.25rem 1.45rem !important;
}

#como-lo-hacemos .care-disclaimer{
  margin-top:1rem !important;
}

/* Tablet */
@media(max-width:960px){
  #como-lo-hacemos.care-method{
    padding:3.6rem 0 !important;
  }

  #como-lo-hacemos .care-introduction{
    gap:1.8rem !important;
    margin-bottom:3rem !important;
  }

  #como-lo-hacemos .care-body-card{
    padding:1.55rem !important;
  }
}

/* Móvil */
@media(max-width:600px){
  #como-lo-hacemos.care-method{
    padding:3.2rem 0 !important;
  }

  #como-lo-hacemos .care-heading{
    margin-bottom:1.55rem !important;
    padding-bottom:1rem !important;
  }

  #como-lo-hacemos .care-introduction{
    gap:1.55rem !important;
    margin-bottom:2.7rem !important;
  }

  #como-lo-hacemos .care-lead{
    margin-bottom:1.25rem !important;
  }

  #como-lo-hacemos .care-principle{
    padding:.68rem 0 !important;
  }

  #como-lo-hacemos .care-body-card{
    padding:1.35rem !important;
  }

  #como-lo-hacemos .care-support{
    margin-bottom:2.6rem !important;
  }
}


/* =========================================================
   ¿CÓMO LO HACEMOS? V16 — COMPACTO INTENSIVO
   SOLO reduce altura total y espacios internos.
   No cambia colores, contenido, iconos ni estructura.
   ========================================================= */

#como-lo-hacemos.care-method{
  padding:2.6rem 0 3rem !important;
}

/* Cabecera */
#como-lo-hacemos .care-heading{
  margin-bottom:1.15rem !important;
  padding-bottom:.9rem !important;
}

#como-lo-hacemos .care-heading .eyebrow{
  margin-bottom:.35rem !important;
}

#como-lo-hacemos .care-heading h2{
  max-width:12ch !important;
  font-size:clamp(2.7rem,4.2vw,4.3rem) !important;
  line-height:.98 !important;
}

/* Bloque 60 / 40 */
#como-lo-hacemos .care-introduction{
  align-items:center !important;
  gap:2.2rem !important;
  margin-bottom:2.1rem !important;
}

#como-lo-hacemos .care-lead{
  max-width:24ch !important;
  margin-bottom:1rem !important;
  font-size:clamp(1.55rem,2.2vw,2.25rem) !important;
  line-height:1.16 !important;
}

/* Las 3 ideas ocupan menos alto */
#como-lo-hacemos .care-principles{
  width:min(100%,680px) !important;
}

#como-lo-hacemos .care-principle{
  grid-template-columns:42px minmax(0,1fr) !important;
  gap:.75rem !important;
  padding:.48rem 0 !important;
}

#como-lo-hacemos .care-principle-icon{
  width:42px !important;
  height:42px !important;
  border-radius:11px !important;
}

#como-lo-hacemos .care-principle-icon svg{
  width:21px !important;
  height:21px !important;
}

#como-lo-hacemos .care-principle strong{
  margin-bottom:.05rem !important;
  font-size:.8rem !important;
  line-height:1.25 !important;
}

#como-lo-hacemos .care-principle small{
  font-size:.65rem !important;
  line-height:1.35 !important;
}

/* Caja crema más baja */
#como-lo-hacemos .care-body-card{
  padding:1.45rem 1.6rem !important;
  border-radius:16px !important;
}

#como-lo-hacemos .care-body-card::before{
  height:.55em !important;
  margin-bottom:.45rem !important;
  font-size:3.5rem !important;
}

#como-lo-hacemos .care-body{
  font-size:clamp(1.1rem,1.45vw,1.45rem) !important;
  line-height:1.34 !important;
}

/* Apoyos casi inmediatamente después */
#como-lo-hacemos .care-support{
  margin-bottom:1.9rem !important;
}

#como-lo-hacemos .care-support-label{
  gap:.7rem !important;
  margin-bottom:.75rem !important;
  font-size:.62rem !important;
}

#como-lo-hacemos .care-support-label::after{
  width:44px !important;
}

#como-lo-hacemos .care-support-items{
  gap:.8rem !important;
}

#como-lo-hacemos .care-support-items article{
  grid-template-columns:54px minmax(0,1fr) !important;
  gap:.9rem !important;
  padding:1rem 1.1rem !important;
  border-radius:14px !important;
}

#como-lo-hacemos .care-support-icon{
  width:54px !important;
  height:54px !important;
}

#como-lo-hacemos .care-support-icon svg{
  width:29px !important;
  height:29px !important;
}

#como-lo-hacemos .care-support-items h3{
  margin:0 0 .28rem !important;
  font-size:clamp(1.12rem,1.4vw,1.42rem) !important;
  line-height:1.08 !important;
}

#como-lo-hacemos .care-support-items p{
  font-size:.69rem !important;
  line-height:1.45 !important;
}

#como-lo-hacemos .care-support-brand{
  margin-top:.5rem !important;
  padding:.28rem .48rem !important;
  font-size:.61rem !important;
}

/* Si existe imagen opcional, también reducimos su separación */
#como-lo-hacemos .care-method-image{
  margin-bottom:1.8rem !important;
}

/* Evolución más compacta */
#como-lo-hacemos .care-outcome{
  grid-template-columns:38px minmax(0,1fr) !important;
  gap:.75rem !important;
  padding:.85rem 1rem !important;
  border-left-width:4px !important;
  border-radius:0 12px 12px 0 !important;
}

#como-lo-hacemos .care-outcome-icon{
  width:38px !important;
  height:38px !important;
}

#como-lo-hacemos .care-outcome-icon svg{
  width:21px !important;
  height:21px !important;
}

#como-lo-hacemos .care-outcome span{
  margin-bottom:.08rem !important;
  font-size:.6rem !important;
}

#como-lo-hacemos .care-outcome strong{
  font-size:.72rem !important;
  line-height:1.42 !important;
}

/* Disclaimer pegado al bloque anterior sin competir */
#como-lo-hacemos .care-disclaimer{
  width:min(100%,900px) !important;
  margin:.65rem auto 0 !important;
  font-size:.6rem !important;
  line-height:1.4 !important;
}


/* Tablet */
@media(max-width:960px){

  #como-lo-hacemos.care-method{
    padding:2.6rem 0 !important;
  }

  #como-lo-hacemos .care-introduction{
    gap:1.35rem !important;
    margin-bottom:1.9rem !important;
  }

  #como-lo-hacemos .care-body-card{
    padding:1.25rem !important;
  }

  #como-lo-hacemos .care-support{
    margin-bottom:1.7rem !important;
  }
}


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

  #como-lo-hacemos.care-method{
    padding:2.5rem 0 !important;
  }

  #como-lo-hacemos .care-heading{
    margin-bottom:1.15rem !important;
    padding-bottom:.8rem !important;
  }

  #como-lo-hacemos .care-heading h2{
    font-size:clamp(2.6rem,12vw,3.6rem) !important;
  }

  #como-lo-hacemos .care-introduction{
    gap:1.2rem !important;
    margin-bottom:1.9rem !important;
  }

  #como-lo-hacemos .care-lead{
    margin-bottom:.9rem !important;
    font-size:clamp(1.5rem,7vw,1.9rem) !important;
  }

  #como-lo-hacemos .care-principle{
    grid-template-columns:40px minmax(0,1fr) !important;
    gap:.7rem !important;
    padding:.45rem 0 !important;
  }

  #como-lo-hacemos .care-principle-icon{
    width:40px !important;
    height:40px !important;
  }

  #como-lo-hacemos .care-body-card{
    padding:1.15rem !important;
  }

  #como-lo-hacemos .care-body{
    font-size:1.12rem !important;
  }

  #como-lo-hacemos .care-support{
    margin-bottom:1.6rem !important;
  }

  #como-lo-hacemos .care-support-items{
    gap:.7rem !important;
  }

  #como-lo-hacemos .care-support-items article{
    grid-template-columns:50px minmax(0,1fr) !important;
    gap:.75rem !important;
    padding:.9rem !important;
  }

  #como-lo-hacemos .care-support-icon{
    width:50px !important;
    height:50px !important;
  }

  #como-lo-hacemos .care-support-items h3{
    font-size:1.18rem !important;
  }

  #como-lo-hacemos .care-outcome{
    padding:.8rem .85rem !important;
  }

  #como-lo-hacemos .care-disclaimer{
    margin-top:.55rem !important;
    font-size:.58rem !important;
  }
}


/* =========================================================
   ¿CÓMO LO HACEMOS? V17 — FIX EXCLUSIVO MÓVIL
   No cambia escritorio ni otras secciones.
   ========================================================= */
@media (max-width: 600px){

  #como-lo-hacemos.care-method{
    width:calc(100% - 28px) !important;
    max-width:none !important;
    margin:0 auto !important;
    padding:2.6rem 0 !important;
    overflow:visible !important;
  }

  /* Encabezado */
  #como-lo-hacemos .care-heading{
    width:100% !important;
    margin:0 0 1.35rem !important;
    padding:0 0 1rem !important;
  }

  #como-lo-hacemos .care-heading>div{
    width:100% !important;
    max-width:none !important;
  }

  #como-lo-hacemos .care-heading h2{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    font-size:clamp(2.8rem,12vw,3.8rem) !important;
    line-height:1.02 !important;
    letter-spacing:-.04em !important;
    overflow-wrap:normal !important;
    word-break:normal !important;
    hyphens:none !important;
  }

  /* Forzar UNA sola columna real */
  #como-lo-hacemos .care-introduction{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    width:100% !important;
    gap:1.35rem !important;
    margin:0 0 2rem !important;
  }

  #como-lo-hacemos .care-intro-main,
  #como-lo-hacemos .care-body-card{
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
  }

  /* Evita palabras partidas como "especializa / da" */
  #como-lo-hacemos .care-lead{
    width:100% !important;
    max-width:none !important;
    margin:0 0 1rem !important;
    font-size:clamp(1.55rem,7vw,2rem) !important;
    line-height:1.22 !important;
    overflow-wrap:normal !important;
    word-break:normal !important;
    hyphens:none !important;
  }

  /* Principios clínicos */
  #como-lo-hacemos .care-principles{
    width:100% !important;
    max-width:none !important;
  }

  #como-lo-hacemos .care-principle{
    display:grid !important;
    grid-template-columns:42px minmax(0,1fr) !important;
    gap:.8rem !important;
    width:100% !important;
    padding:.62rem 0 !important;
  }

  #como-lo-hacemos .care-principle>div{
    min-width:0 !important;
  }

  #como-lo-hacemos .care-principle strong,
  #como-lo-hacemos .care-principle small{
    overflow-wrap:normal !important;
    word-break:normal !important;
    hyphens:none !important;
  }

  #como-lo-hacemos .care-principle strong{
    font-size:.84rem !important;
  }

  #como-lo-hacemos .care-principle small{
    font-size:.69rem !important;
    line-height:1.4 !important;
  }

  /* Caja crema debajo, a ancho completo */
  #como-lo-hacemos .care-body-card{
    order:2 !important;
    margin:0 !important;
    padding:1.25rem 1.3rem !important;
    border-radius:16px !important;
  }

  #como-lo-hacemos .care-body-card::before{
    height:auto !important;
    margin:0 0 .35rem !important;
    font-size:3.4rem !important;
    line-height:.7 !important;
  }

  #como-lo-hacemos .care-body{
    width:100% !important;
    max-width:none !important;
    font-size:1.13rem !important;
    line-height:1.42 !important;
    overflow-wrap:normal !important;
    word-break:normal !important;
    hyphens:none !important;
  }

  /* Apoyos complementarios */
  #como-lo-hacemos .care-support{
    width:100% !important;
    margin:0 0 1.8rem !important;
  }

  #como-lo-hacemos .care-support-items{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:.8rem !important;
    width:100% !important;
  }

  #como-lo-hacemos .care-support-items article{
    display:grid !important;
    grid-template-columns:52px minmax(0,1fr) !important;
    gap:.8rem !important;
    width:100% !important;
    padding:1rem !important;
  }

  #como-lo-hacemos .care-support-items article>div{
    min-width:0 !important;
  }

  #como-lo-hacemos .care-support-items h3,
  #como-lo-hacemos .care-support-items p,
  #como-lo-hacemos .care-support-brand{
    overflow-wrap:normal !important;
    word-break:normal !important;
    hyphens:none !important;
  }

  #como-lo-hacemos .care-support-items h3{
    font-size:1.22rem !important;
  }

  /* Evolución */
  #como-lo-hacemos .care-outcome{
    grid-template-columns:40px minmax(0,1fr) !important;
    gap:.8rem !important;
    width:100% !important;
    padding:.9rem 1rem !important;
  }

  #como-lo-hacemos .care-outcome-copy{
    min-width:0 !important;
  }

  #como-lo-hacemos .care-outcome strong{
    overflow-wrap:normal !important;
    word-break:normal !important;
    hyphens:none !important;
  }

  #como-lo-hacemos .care-disclaimer{
    width:100% !important;
    max-width:none !important;
    margin:.75rem auto 0 !important;
    padding:0 .35rem !important;
    font-size:.62rem !important;
    line-height:1.45 !important;
  }
}

/* Teléfonos muy estrechos */
@media (max-width: 380px){

  #como-lo-hacemos.care-method{
    width:calc(100% - 22px) !important;
  }

  #como-lo-hacemos .care-heading h2{
    font-size:2.65rem !important;
  }

  #como-lo-hacemos .care-lead{
    font-size:1.48rem !important;
  }

  #como-lo-hacemos .care-principle{
    grid-template-columns:38px minmax(0,1fr) !important;
    gap:.7rem !important;
  }

  #como-lo-hacemos .care-principle-icon{
    width:38px !important;
    height:38px !important;
  }
}


/* =========================================================
   ¿CÓMO LO HACEMOS? V18 — COHESIÓN TARJETA IZQUIERDA
   SOLO afecta el bloque introductorio izquierdo:
   "Brindando atención..." + los 3 pasos.
   ========================================================= */

/*
 * 1) La fila superior toma la altura del elemento más alto.
 *    El contenido izquierdo se centra verticalmente como un bloque.
 */
#como-lo-hacemos .care-introduction{
  align-items:stretch !important;
}

#como-lo-hacemos .care-intro-main{
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;

  min-width:0 !important;
  height:100% !important;
}

/*
 * 2) Separación editorial simétrica:
 *    mismo espacio arriba y abajo de la línea.
 */
#como-lo-hacemos .care-lead{
  margin:0 !important;
  padding-bottom:.9rem !important;

  border-bottom:1px solid rgba(85,33,49,.10) !important;
}

#como-lo-hacemos .care-principles{
  margin:0 !important;
  padding-top:.9rem !important;
}

/*
 * 3) Los tres pasos funcionan visualmente como una sola lista.
 *    Reducimos ligeramente el aire interno entre ellos.
 */
#como-lo-hacemos .care-principle{
  padding:.36rem 0 !important;
}

#como-lo-hacemos .care-principle:first-child{
  padding-top:0 !important;
}

#como-lo-hacemos .care-principle:last-child{
  padding-bottom:0 !important;
}


/* Tablet: conserva la cohesión sin aumentar altura */
@media (max-width:960px){

  #como-lo-hacemos .care-lead{
    padding-bottom:.8rem !important;
  }

  #como-lo-hacemos .care-principles{
    padding-top:.8rem !important;
  }

  #como-lo-hacemos .care-principle{
    padding:.34rem 0 !important;
  }
}


/* Móvil: respeta la columna única ya aprobada */
@media (max-width:600px){

  #como-lo-hacemos .care-intro-main{
    height:auto !important;
    justify-content:flex-start !important;
  }

  #como-lo-hacemos .care-lead{
    margin:0 !important;
    padding-bottom:.75rem !important;
  }

  #como-lo-hacemos .care-principles{
    padding-top:.75rem !important;
  }

  #como-lo-hacemos .care-principle{
    padding:.4rem 0 !important;
  }
}


/* =========================================================
   ¿CÓMO LO HACEMOS? V19 — REFERENCIA EDITORIAL
   Replica la composición de la referencia proporcionada.
   SOLO afecta #como-lo-hacemos.
   ========================================================= */

#como-lo-hacemos.care-method{
  --care-ref-bg:#f7f1e8;
  --care-ref-white:#fff;
  --care-ref-cream:#f0eadf;
  --care-ref-plum:#5a3853;
  --care-ref-plum-deep:#4d3048;
  --care-ref-coral:#dd755e;
  --care-ref-sage:#9db39e;
  --care-ref-ink:#4b4048;
  --care-ref-muted:#8b8188;
  --care-ref-line:rgba(90,56,83,.13);

  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:clamp(3.4rem,5vw,5rem) max(1.5rem,calc((100vw - 1320px)/2)) clamp(3rem,4.5vw,4rem) !important;

  background:var(--care-ref-bg) !important;
  overflow:visible !important;
}

#como-lo-hacemos .care-method-copy{
  width:min(100%,1320px) !important;
  max-width:1320px !important;
  margin:0 auto !important;

  display:grid !important;
  grid-template-columns:minmax(0,1.18fr) minmax(340px,.82fr) !important;
  grid-template-areas:
    "heading heading"
    "intro quote"
    "intro support"
    "closing closing"
    "image image" !important;
  gap:1.35rem 1.5rem !important;
  align-items:stretch !important;
}

/* =========================================================
   ENCABEZADO COMO REFERENCIA
   ========================================================= */

#como-lo-hacemos .care-heading{
  grid-area:heading !important;

  margin:0 0 .35rem !important;
  padding:0 !important;

  border:0 !important;
}

#como-lo-hacemos .care-heading>div{
  width:100% !important;
  max-width:none !important;
}

#como-lo-hacemos .care-heading .eyebrow{
  display:flex !important;
  align-items:center !important;
  gap:.8rem !important;

  margin:0 0 .65rem !important;

  color:#9b8f98 !important;

  font-size:.64rem !important;
  font-weight:760 !important;
  letter-spacing:.11em !important;
  text-transform:uppercase !important;
}

#como-lo-hacemos .care-heading .eyebrow::before{
  content:"";

  width:30px;
  height:1px;

  background:rgba(90,56,83,.22);
}

#como-lo-hacemos .care-heading h2{
  max-width:none !important;

  margin:0 !important;

  color:var(--care-ref-plum) !important;

  font-family:Georgia,"Times New Roman",serif !important;
  font-size:clamp(2.8rem,4.2vw,4.5rem) !important;
  font-weight:500 !important;
  letter-spacing:-.045em !important;
  line-height:.98 !important;
}


/* =========================================================
   CONVERTIR care-introduction EN CONTENEDOR TRANSPARENTE
   Sus hijos participan directamente en el grid principal.
   ========================================================= */

#como-lo-hacemos .care-introduction{
  display:contents !important;
}


/* =========================================================
   TARJETA IZQUIERDA
   ========================================================= */

#como-lo-hacemos .care-intro-main{
  grid-area:intro !important;

  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;

  min-width:0 !important;
  min-height:470px !important;

  padding:clamp(2.3rem,4vw,3.6rem) !important;

  background:var(--care-ref-white) !important;

  border:1px solid rgba(90,56,83,.08) !important;
  border-radius:26px !important;

  box-shadow:0 2px 0 rgba(90,56,83,.05) !important;
}

#como-lo-hacemos .care-lead{
  max-width:24ch !important;

  margin:0 !important;
  padding:0 0 1.45rem !important;

  color:var(--care-ref-plum) !important;

  font-family:Georgia,"Times New Roman",serif !important;
  font-size:clamp(1.65rem,2.4vw,2.35rem) !important;
  font-weight:500 !important;
  letter-spacing:-.025em !important;
  line-height:1.25 !important;

  border-bottom:1px solid var(--care-ref-line) !important;
}

#como-lo-hacemos .care-principles{
  width:100% !important;
  max-width:none !important;

  margin:0 !important;
  padding:1.45rem 0 0 !important;

  display:grid !important;
  gap:.75rem !important;
}

#como-lo-hacemos .care-principle{
  display:grid !important;
  grid-template-columns:48px minmax(0,1fr) !important;
  gap:1rem !important;
  align-items:center !important;

  padding:0 !important;

  border:0 !important;
}

#como-lo-hacemos .care-principle-icon{
  width:48px !important;
  height:48px !important;

  color:var(--care-ref-sage) !important;

  background:#f6f7f3 !important;

  border-radius:14px !important;
}

#como-lo-hacemos .care-principle-icon svg{
  width:23px !important;
  height:23px !important;
}

#como-lo-hacemos .care-principle strong{
  margin:0 0 .2rem !important;

  color:var(--care-ref-plum-deep) !important;

  font-family:Georgia,"Times New Roman",serif !important;
  font-size:.92rem !important;
  font-weight:600 !important;
  line-height:1.3 !important;
}

#como-lo-hacemos .care-principle small{
  color:#948991 !important;

  font-size:.76rem !important;
  line-height:1.45 !important;
}


/* =========================================================
   CITA DERECHA SUPERIOR
   ========================================================= */

#como-lo-hacemos .care-body-card{
  grid-area:quote !important;

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

  min-width:0 !important;
  min-height:160px !important;

  margin:0 !important;
  padding:clamp(1.8rem,3vw,2.6rem) !important;

  background:var(--care-ref-cream) !important;

  border:0 !important;
  border-radius:26px !important;

  box-shadow:none !important;
}

#como-lo-hacemos .care-body-card::before{
  display:none !important;
}

#como-lo-hacemos .care-body{
  margin:0 !important;

  color:#725e6b !important;

  font-family:Georgia,"Times New Roman",serif !important;
  font-size:clamp(1.25rem,1.7vw,1.65rem) !important;
  font-style:italic !important;
  font-weight:500 !important;
  letter-spacing:-.015em !important;
  line-height:1.42 !important;
}


/* =========================================================
   APOYOS DERECHA INFERIOR
   ========================================================= */

#como-lo-hacemos .care-support{
  grid-area:support !important;

  margin:0 !important;
  padding:clamp(1.7rem,2.7vw,2.3rem) !important;

  background:var(--care-ref-white) !important;

  border:1px solid rgba(90,56,83,.08) !important;
  border-radius:26px !important;

  box-shadow:0 2px 0 rgba(90,56,83,.05) !important;
}

#como-lo-hacemos .care-support-label{
  display:block !important;

  margin:0 0 1.15rem !important;
  padding:0 0 1rem !important;

  color:var(--care-ref-coral) !important;

  font-size:.62rem !important;
  font-weight:850 !important;
  letter-spacing:.11em !important;
  line-height:1.3 !important;
  text-transform:uppercase !important;

  border-bottom:1px solid var(--care-ref-line) !important;
}

#como-lo-hacemos .care-support-label::after{
  display:none !important;
}

#como-lo-hacemos .care-support-items{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:0 !important;
}

#como-lo-hacemos .care-support-items article{
  position:relative !important;

  display:block !important;

  min-width:0 !important;

  margin:0 !important;
  padding:1rem 0 1rem 1.35rem !important;

  background:transparent !important;

  border:0 !important;
  border-radius:0 !important;

  box-shadow:none !important;
}

#como-lo-hacemos .care-support-items article + article{
  border-top:1px solid rgba(90,56,83,.08) !important;
}

#como-lo-hacemos .care-support-items article::before{
  content:"";

  position:absolute;
  left:.05rem;
  top:1.5rem;

  width:5px;
  height:5px;

  background:var(--care-ref-coral);

  border-radius:50%;
}

#como-lo-hacemos .care-support-icon{
  display:none !important;
}

#como-lo-hacemos .care-support-items h3{
  margin:0 0 .42rem !important;

  color:var(--care-ref-plum-deep) !important;

  font-family:Georgia,"Times New Roman",serif !important;
  font-size:1.03rem !important;
  font-weight:600 !important;
  letter-spacing:-.01em !important;
  line-height:1.28 !important;
}

#como-lo-hacemos .care-support-items p{
  margin:0 !important;

  color:#91868e !important;

  font-size:.75rem !important;
  line-height:1.55 !important;
}

#como-lo-hacemos .care-support-brand{
  display:inline-flex !important;

  width:auto !important;

  margin:.65rem 0 0 !important;
  padding:.3rem .55rem !important;

  color:#8c777f !important;

  background:#f8f2eb !important;

  border:1px solid rgba(90,56,83,.10) !important;
  border-radius:999px !important;

  font-size:.61rem !important;
  line-height:1.2 !important;
}

#como-lo-hacemos .care-support-brand strong{
  color:var(--care-ref-plum-deep) !important;
}


/* =========================================================
   CIERRE BURDEOS INFERIOR
   ========================================================= */

#como-lo-hacemos .care-closing{
  grid-area:closing !important;

  display:grid !important;
  grid-template-columns:minmax(0,.95fr) minmax(0,1.25fr) !important;
  align-items:center !important;
  gap:1.6rem !important;

  margin:.1rem 0 0 !important;
  padding:1.35rem 1.8rem !important;

  color:#fff !important;

  background:var(--care-ref-plum) !important;

  border:0 !important;
  border-radius:24px !important;

  box-shadow:0 16px 34px rgba(73,45,67,.12) !important;
}

#como-lo-hacemos .care-outcome{
  display:grid !important;
  grid-template-columns:54px minmax(0,1fr) !important;
  align-items:center !important;
  gap:1rem !important;

  width:100% !important;

  margin:0 !important;
  padding:0 1.5rem 0 0 !important;

  color:#fff !important;
  background:transparent !important;

  border:0 !important;
  border-right:1px solid rgba(255,255,255,.20) !important;
  border-radius:0 !important;

  box-shadow:none !important;
}

#como-lo-hacemos .care-outcome-icon{
  width:54px !important;
  height:54px !important;

  color:#ef876c !important;

  background:rgba(255,255,255,.10) !important;

  border-radius:50% !important;
}

#como-lo-hacemos .care-outcome-icon svg{
  width:25px !important;
  height:25px !important;
}

#como-lo-hacemos .care-outcome span{
  margin:0 0 .25rem !important;

  color:#ef876c !important;

  font-size:.6rem !important;
  font-weight:850 !important;
  letter-spacing:.08em !important;
}

#como-lo-hacemos .care-outcome strong{
  color:#fff !important;

  font-family:Georgia,"Times New Roman",serif !important;
  font-size:1rem !important;
  font-weight:600 !important;
  line-height:1.4 !important;
}

#como-lo-hacemos .care-disclaimer{
  width:100% !important;
  max-width:none !important;

  margin:0 !important;
  padding:0 !important;

  color:rgba(255,255,255,.76) !important;

  font-size:.68rem !important;
  line-height:1.55 !important;
  text-align:left !important;
}


/* =========================================================
   IMAGEN OPCIONAL
   ========================================================= */

#como-lo-hacemos .care-method-image{
  grid-area:image !important;

  margin:.25rem 0 0 !important;
}


/* =========================================================
   TABLET
   ========================================================= */

@media(max-width:960px){

  #como-lo-hacemos.care-method{
    padding:3.1rem 1.25rem !important;
  }

  #como-lo-hacemos .care-method-copy{
    grid-template-columns:1fr !important;
    grid-template-areas:
      "heading"
      "intro"
      "quote"
      "support"
      "closing"
      "image" !important;

    gap:1rem !important;
  }

  #como-lo-hacemos .care-intro-main{
    min-height:0 !important;
  }

  #como-lo-hacemos .care-closing{
    grid-template-columns:1fr !important;
    gap:1rem !important;
  }

  #como-lo-hacemos .care-outcome{
    padding:0 0 1rem !important;

    border-right:0 !important;
    border-bottom:1px solid rgba(255,255,255,.18) !important;
  }
}


/* =========================================================
   MÓVIL
   ========================================================= */

@media(max-width:600px){

  #como-lo-hacemos.care-method{
    width:100% !important;
    max-width:none !important;

    padding:2.8rem 1rem 3rem !important;
  }

  #como-lo-hacemos .care-heading{
    margin-bottom:.25rem !important;
  }

  #como-lo-hacemos .care-heading h2{
    font-size:clamp(2.65rem,12vw,3.6rem) !important;
  }

  #como-lo-hacemos .care-intro-main{
    padding:1.55rem 1.25rem !important;

    border-radius:20px !important;
  }

  #como-lo-hacemos .care-lead{
    max-width:none !important;

    padding-bottom:1rem !important;

    font-size:clamp(1.5rem,7vw,1.9rem) !important;
    line-height:1.28 !important;
  }

  #como-lo-hacemos .care-principles{
    padding-top:1rem !important;
    gap:.7rem !important;
  }

  #como-lo-hacemos .care-principle{
    grid-template-columns:42px minmax(0,1fr) !important;
    gap:.75rem !important;
  }

  #como-lo-hacemos .care-principle-icon{
    width:42px !important;
    height:42px !important;
  }

  #como-lo-hacemos .care-body-card,
  #como-lo-hacemos .care-support{
    padding:1.35rem !important;

    border-radius:20px !important;
  }

  #como-lo-hacemos .care-body{
    font-size:1.15rem !important;
  }

  #como-lo-hacemos .care-closing{
    padding:1.25rem !important;

    border-radius:20px !important;
  }

  #como-lo-hacemos .care-outcome{
    grid-template-columns:46px minmax(0,1fr) !important;
  }

  #como-lo-hacemos .care-outcome-icon{
    width:46px !important;
    height:46px !important;
  }

  #como-lo-hacemos .care-disclaimer{
    font-size:.64rem !important;
  }
}


/* =========================================================
   ¿CÓMO LO HACEMOS? V20 — CENTRADO ICONO DE EVOLUCIÓN
   ÚNICO cambio: centra correctamente el calendario dentro
   de su círculo en escritorio y móvil.
   ========================================================= */

#como-lo-hacemos .care-outcome-icon{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  position:relative !important;

  padding:0 !important;
  margin:0 !important;

  flex:none !important;
}

#como-lo-hacemos .care-outcome-icon svg{
  display:block !important;

  position:static !important;
  inset:auto !important;

  flex:none !important;

  margin:0 !important;
  padding:0 !important;

  transform:none !important;
  translate:none !important;

  transform-origin:center !important;
}

/* Móvil: mismo centrado exacto con el círculo de 46px existente */
@media(max-width:600px){
  #como-lo-hacemos .care-outcome-icon{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
  }

  #como-lo-hacemos .care-outcome-icon svg{
    margin:0 !important;
    transform:none !important;
  }
}


/* =========================================================
   CÓMO LO HACEMOS V21 — DOS FOTOGRAFÍAS
   Solo afecta el nuevo bloque .care-method-gallery.
   ========================================================= */

#como-lo-hacemos .care-method-gallery{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(.8rem,1.6vw,1.25rem);

  width:100%;
  margin:clamp(1.35rem,2.2vw,2rem) 0 0;
}

#como-lo-hacemos .care-method-gallery.is-single{
  grid-template-columns:minmax(0,1fr);
}

#como-lo-hacemos .care-method-gallery.is-single .care-method-photo{
  max-width:760px;
}

#como-lo-hacemos .care-method-photo{
  position:relative;
  margin:0;

  aspect-ratio:4 / 3;

  overflow:hidden;

  background:#f2ece7;

  border:1px solid rgba(77,48,73,.10);
  border-radius:18px;

  box-shadow:0 10px 28px rgba(58,43,54,.055);
}

#como-lo-hacemos .care-method-photo img{
  display:block;

  width:100%;
  height:100%;

  object-fit:cover;
  object-position:center;
}

@media(max-width:700px){
  #como-lo-hacemos .care-method-gallery,
  #como-lo-hacemos .care-method-gallery.is-single{
    grid-template-columns:1fr;
    gap:.75rem;

    margin-top:1.15rem;
  }

  #como-lo-hacemos .care-method-gallery.is-single .care-method-photo{
    max-width:none;
  }

  #como-lo-hacemos .care-method-photo{
    aspect-ratio:4 / 3;
    border-radius:14px;
    box-shadow:0 8px 22px rgba(58,43,54,.05);
  }
}


/* =========================================================
   CÓMO LO HACEMOS V22 — 4 IMÁGENES AGRUPADAS
   2 Cámara hiperbárica + 2 Resonancias.
   SOLO afecta la zona visual de esta sección.
   ========================================================= */

/*
 * El layout anterior colocaba "closing" antes de "image".
 * Ahora la zona de fotos ("visuals") aparece antes del cierre burdeos.
 */
#como-lo-hacemos .care-method-copy{
  grid-template-areas:
    "heading heading"
    "intro quote"
    "intro support"
    "visuals visuals"
    "closing closing" !important;
}

/* El bloque nuevo ocupa todo el ancho del contenido */
#como-lo-hacemos .care-visuals{
  grid-area:visuals !important;

  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(1rem,2vw,1.5rem);

  width:100%;
  margin:.35rem 0 .15rem;
}

/* Cada categoría funciona como un pequeño capítulo visual */
#como-lo-hacemos .care-visual-group{
  min-width:0;

  padding:1rem;

  background:rgba(255,253,249,.72);

  border:1px solid rgba(90,56,83,.085);
  border-radius:20px;
}

#como-lo-hacemos .care-visual-heading{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:1rem;

  margin:0 0 .8rem;
  padding:0 0 .7rem;

  border-bottom:1px solid rgba(90,56,83,.10);
}

#como-lo-hacemos .care-visual-heading span{
  color:#d96e58;

  font-size:.58rem;
  font-weight:850;
  letter-spacing:.11em;
  line-height:1.2;
  text-transform:uppercase;
}

#como-lo-hacemos .care-visual-group-resonance .care-visual-heading span{
  color:#7f927e;
}

#como-lo-hacemos .care-visual-heading h3{
  margin:0;

  color:#55364f;

  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(1.15rem,1.45vw,1.45rem);
  font-weight:600;
  line-height:1.08;
  text-align:right;
}

#como-lo-hacemos .care-visual-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.65rem;
}

#como-lo-hacemos .care-visual-grid.care-visual-count-1{
  grid-template-columns:minmax(0,1fr);
}

#como-lo-hacemos .care-visual-photo{
  display:grid;
  place-items:center;

  min-width:0;
  height:clamp(180px,15vw,245px);

  margin:0;
  padding:.45rem;

  overflow:hidden;

  background:#f1ebe6;

  border:1px solid rgba(90,56,83,.08);
  border-radius:14px;
}

/* Cámara: fotografía normal, encuadre agradable */
#como-lo-hacemos .care-visual-group-hyperbaric .care-visual-photo img{
  width:100%;
  height:100%;

  object-fit:cover;
  object-position:center;

  border-radius:9px;
}

/* Resonancias: nunca se recortan */
#como-lo-hacemos .care-visual-group-resonance .care-visual-photo{
  background:#eeeae6;
}

#como-lo-hacemos .care-visual-group-resonance .care-visual-photo img{
  width:100%;
  height:100%;

  object-fit:contain;
  object-position:center;

  border-radius:8px;
}

/* La franja burdeos queda realmente como cierre final */
#como-lo-hacemos .care-closing{
  grid-area:closing !important;
  margin-top:.25rem !important;
}

/* Neutraliza la galería antigua por si queda alguna regla heredada */
#como-lo-hacemos .care-method-gallery{
  display:none !important;
}

/* TABLET */
@media(max-width:960px){
  #como-lo-hacemos .care-method-copy{
    grid-template-areas:
      "heading"
      "intro"
      "quote"
      "support"
      "visuals"
      "closing" !important;
  }

  #como-lo-hacemos .care-visuals{
    grid-template-columns:1fr;
    gap:.85rem;
  }

  #como-lo-hacemos .care-visual-photo{
    height:clamp(210px,30vw,300px);
  }
}

/* MÓVIL */
@media(max-width:600px){
  #como-lo-hacemos .care-visual-group{
    padding:.75rem;
    border-radius:16px;
  }

  #como-lo-hacemos .care-visual-heading{
    align-items:flex-start;
    flex-direction:column;
    gap:.25rem;

    margin-bottom:.65rem;
    padding-bottom:.55rem;
  }

  #como-lo-hacemos .care-visual-heading h3{
    font-size:1.14rem;
    text-align:left;
  }

  /* Mantiene las dos imágenes juntas para no alargar demasiado la sección */
  #como-lo-hacemos .care-visual-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:.45rem;
  }

  #como-lo-hacemos .care-visual-grid.care-visual-count-1{
    grid-template-columns:1fr;
  }

  #como-lo-hacemos .care-visual-photo{
    height:170px;
    padding:.32rem;
    border-radius:11px;
  }

  #como-lo-hacemos .care-visual-group-hyperbaric .care-visual-photo img,
  #como-lo-hacemos .care-visual-group-resonance .care-visual-photo img{
    border-radius:7px;
  }
}

@media(max-width:390px){
  #como-lo-hacemos .care-visual-photo{
    height:150px;
  }
}


/* =========================================================
   CÓMO LO HACEMOS V23 — FOTOS VERTICALES + HORIZONTALES
   Todas las imágenes se muestran completas, sin recorte.
   ========================================================= */

#como-lo-hacemos .care-visual-photo{
  display:grid !important;
  place-items:center !important;

  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  aspect-ratio:4 / 3 !important;

  padding:.65rem !important;

  background:#f2ece7 !important;

  border:1px solid rgba(90,56,83,.085) !important;
  border-radius:14px !important;

  overflow:hidden !important;
}

/* Tanto cámara como resonancias admiten cualquier orientación */
#como-lo-hacemos .care-visual-group-hyperbaric .care-visual-photo img,
#como-lo-hacemos .care-visual-group-resonance .care-visual-photo img{
  display:block !important;

  width:100% !important;
  height:100% !important;
  max-width:100% !important;
  max-height:100% !important;

  object-fit:contain !important;
  object-position:center !important;

  background:transparent !important;

  border-radius:9px !important;
}

/* Cuando solo existe una imagen, no se estira demasiado */
#como-lo-hacemos .care-visual-grid.care-visual-count-1{
  grid-template-columns:minmax(0,520px) !important;
}

/* Tablet */
@media(max-width:960px){
  #como-lo-hacemos .care-visual-photo{
    aspect-ratio:4 / 3 !important;
    padding:.55rem !important;
  }
}

/* Móvil */
@media(max-width:600px){
  #como-lo-hacemos .care-visual-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }

  #como-lo-hacemos .care-visual-grid.care-visual-count-1{
    grid-template-columns:1fr !important;
  }

  #como-lo-hacemos .care-visual-photo{
    height:auto !important;
    min-height:0 !important;
    aspect-ratio:4 / 3 !important;

    padding:.35rem !important;
    border-radius:11px !important;
  }

  #como-lo-hacemos .care-visual-group-hyperbaric .care-visual-photo img,
  #como-lo-hacemos .care-visual-group-resonance .care-visual-photo img{
    border-radius:7px !important;
  }
}

/* Pantallas muy estrechas: prioriza legibilidad sobre densidad */
@media(max-width:360px){
  #como-lo-hacemos .care-visual-grid{
    grid-template-columns:1fr !important;
  }

  #como-lo-hacemos .care-visual-photo{
    aspect-ratio:4 / 3 !important;
  }
}


/* =========================================================
   CÓMO LO HACEMOS V24 — IMÁGENES GRANDES SIN RECORTE
   Corrige V23: no reduce las fotos.
   Verticales crecen en altura; horizontales aprovechan el ancho.
   ========================================================= */

#como-lo-hacemos .care-visual-grid{
  align-items:stretch !important;
}

/* Marco grande y estable */
#como-lo-hacemos .care-visual-photo{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  width:100% !important;
  height:clamp(270px,20vw,340px) !important;
  min-height:270px !important;

  aspect-ratio:auto !important;

  padding:.55rem !important;

  background:#eee8e3 !important;

  border:1px solid rgba(90,56,83,.085) !important;
  border-radius:14px !important;

  overflow:hidden !important;
}

/*
 * La imagen conserva su proporción natural.
 * - horizontal: aprovecha el ancho
 * - vertical: aprovecha la altura
 * - nunca se recorta
 */
#como-lo-hacemos .care-visual-group-hyperbaric .care-visual-photo img,
#como-lo-hacemos .care-visual-group-resonance .care-visual-photo img{
  display:block !important;

  width:auto !important;
  height:auto !important;

  max-width:100% !important;
  max-height:100% !important;

  object-fit:contain !important;
  object-position:center !important;

  flex:none !important;

  background:transparent !important;

  border-radius:9px !important;
}

/* Si una imagen es muy panorámica, puede ocupar todo el ancho disponible */
#como-lo-hacemos .care-visual-photo img{
  min-width:0 !important;
}

/* Mantener una sola foto con presencia suficiente */
#como-lo-hacemos .care-visual-grid.care-visual-count-1{
  grid-template-columns:minmax(0,620px) !important;
}

/* Monitores grandes: que no se vean pequeñas */
@media(min-width:1400px){
  #como-lo-hacemos .care-visual-photo{
    height:360px !important;
  }
}

/* Tablet */
@media(max-width:960px){
  #como-lo-hacemos .care-visual-photo{
    height:clamp(260px,36vw,330px) !important;
    min-height:260px !important;
  }
}

/* Móvil */
@media(max-width:600px){
  #como-lo-hacemos .care-visual-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }

  #como-lo-hacemos .care-visual-grid.care-visual-count-1{
    grid-template-columns:1fr !important;
  }

  #como-lo-hacemos .care-visual-photo{
    height:220px !important;
    min-height:220px !important;

    padding:.35rem !important;

    border-radius:11px !important;
  }
}

/* En celulares estrechos sí conviene una por fila para que una vertical
   no termine demasiado angosta */
@media(max-width:390px){
  #como-lo-hacemos .care-visual-grid{
    grid-template-columns:1fr !important;
  }

  #como-lo-hacemos .care-visual-photo{
    height:280px !important;
    min-height:280px !important;
  }
}