﻿  /* ===== Banner principal MediSel (clases con prefijo "lpb-" para no chocar con su sitio) ===== */
  .lpb{
    --lpb-verde:#2E8B4F;          /* mismo verde que .lpi-destacado */
    --lpb-verde-oscuro:#1F5C33;
    --lpb-verde-claro:#8FE0A8;    /* acento legible sobre fondo oscuro */
    position:relative; overflow:hidden;
    min-height:560px; display:flex; align-items:center;
    padding:96px 24px;
    font-family:'Open Sans', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
    color:#fff;
    background-color:#1B2A33;     /* color de respaldo mientras carga la foto */
    /* AJUSTAR: ruta de la foto del banner */
    background-image:url('../Imagenes/BannerHomePage/MediSel_HomePage_2019.jpg');
    background-size:cover; background-position:center right;
  }
  .lpb *,.lpb *::before,.lpb *::after{box-sizing:border-box}

  /* Capa oscura: más intensa a la izquierda, donde va el texto; la foto se ve a la derecha */
  .lpb::before{
    content:""; position:absolute; inset:0;
    background:linear-gradient(90deg, rgba(14,24,31,.92) 0%, rgba(14,24,31,.80) 42%, rgba(14,24,31,.35) 75%, rgba(14,24,31,.20) 100%);
  }

  .lpb__wrap{position:relative; width:100%; max-width:1200px; margin:0 auto}
  .lpb__contenido{max-width:900px}
  .lpb__titulo,.lpb__etiqueta{max-width:680px}

  .lpb__etiqueta{
    display:inline-flex; align-items:center; gap:8px; margin:0 0 20px;
    font-size:13px; font-weight:600; letter-spacing:.12em; text-transform:uppercase;
    color:var(--lpb-verde-claro);
  }
  .lpb__etiqueta::before{content:""; width:28px; height:2px; background:var(--lpb-verde-claro); border-radius:2px}

  .lpb__titulo{
    margin:0 0 20px;
    font-family:'Poppins', sans-serif; font-weight:600;
    font-size:clamp(32px, 4.2vw, 54px); line-height:1.12; letter-spacing:-.015em;
    color:#fff;
  }
  .lpb__titulo .lpb__destacado{color:var(--lpb-verde-claro)}

  .lpb__texto{
    margin:0 0 32px; max-width:560px;
    font-size:clamp(16px, 1.4vw, 19px); line-height:1.65; color:rgba(255,255,255,.88);
  }

  /* Botones */
  .lpb__botones{display:flex; flex-wrap:wrap; gap:12px; margin-bottom:40px}
  .lpb__btn{
    display:inline-flex; align-items:center; justify-content:center; gap:10px;
    min-height:54px; padding:0 30px; border-radius:999px;
    font-family:'Poppins', sans-serif; font-weight:600; font-size:16px;
    text-decoration:none; transition:background .2s ease, border-color .2s ease, transform .2s ease;
  }
  .lpb__btn--principal{background:var(--lpb-verde); color:#fff; border:2px solid var(--lpb-verde)}
  .lpb__btn--principal:hover{background:var(--lpb-verde-oscuro); border-color:var(--lpb-verde-oscuro); color:#fff; transform:translateY(-1px)}
  .lpb__btn--secundario{background:rgba(255,255,255,.06); color:#fff; border:2px solid rgba(255,255,255,.55)}
  .lpb__btn--secundario:hover{background:rgba(255,255,255,.14); border-color:#fff; color:#fff}
  .lpb__btn:focus-visible{outline:3px solid var(--lpb-verde-claro); outline-offset:3px}

  /* Franja de confianza */
  .lpb__confianza{
    display:flex; flex-wrap:wrap; gap:16px 32px;
    padding-top:28px; border-top:1px solid rgba(255,255,255,.18);
    margin:0; list-style:none; padding-left:0;
  }
  .lpb__dato{display:flex; align-items:center; gap:12px}
  .lpb__icono{
    flex:none; display:inline-flex; align-items:center; justify-content:center;
    width:42px; height:42px; border-radius:12px;
    background:rgba(143,224,168,.14); color:var(--lpb-verde-claro);
  }
  .lpb__dato strong{display:block; font-family:'Poppins', sans-serif; font-weight:600; font-size:16px; color:#fff; line-height:1.3}
  .lpb__dato div span,.lpb__dato a span{display:block; font-size:13.5px; color:rgba(255,255,255,.75); line-height:1.4}
  .lpb__dato a{color:inherit; text-decoration:none}
  .lpb__dato a:hover strong{text-decoration:underline; text-underline-offset:3px}

  .lpb h1,.lpb p{float:none; clear:both; padding:0}
.lpb li{padding:0}
.lpb ul.lpb__confianza{padding:28px 0 0}

  /* ---------- Tabletas y celulares ---------- */
  @media (max-width: 900px){
    .lpb{min-height:0; padding:72px 20px; background-position:center}
    .lpb::before{background:linear-gradient(180deg, rgba(14,24,31,.82) 0%, rgba(14,24,31,.90) 100%)}
  }
  @media (max-width: 560px){
    .lpb{padding:56px 16px}
    .lpb__btn{width:100%}
    .lpb__confianza{flex-direction:column; gap:16px}
  }
  @media (prefers-reduced-motion: reduce){
    .lpb__btn{transition:none}
  }