/* ====== ESTILOS GENERALES ====== */
.hero{
  background:url('https://via.placeholder.com/1600x800') no-repeat center center/cover;
  color:#fff;
  padding:100px 0;
}
.benefits-icon{ font-size:2rem; }
.testimonial-stars{ color:#28a745; }

.text-shadow{ text-shadow:2px 2px 8px rgba(0,0,0,.7); }

.hero-label{
  display:inline-block;
  background-color:rgba(0,0,0,.6);
  color:#fff;
  padding:.5rem 1rem;
  border-radius:8px;
  font-weight:500;
}

/* Contenedores de la página actual (opcional, neutro en desktop) */
.bv-section{ /* puedes ajustar si quieres más/menos alto en desktop */
  padding:36px 0;
}
.bv-media{ border-radius:12px; overflow:hidden; }
.bv-media-img{ display:block; width:100%; height:auto; }

/* ====== MEGA MENÚ ====== */
.mega-menu{
  position:absolute; top:100%; left:0;
  width:max-content; min-width:600px;
  background:#fff; opacity:0; visibility:hidden;
  transform:translateY(10px);
  transition:all .3s ease-in-out;
  z-index:1000;
  box-shadow:0 8px 16px rgba(0,0,0,.1);
}
.nav-item:hover .mega-menu{
  opacity:1; visibility:visible; transform:translateY(0);
}

/* ====== POPUPS / ICON WRAPPER ====== */
.benefit-popup{
  position:absolute; bottom:100%; left:50%;
  transform:translateX(-50%) translateY(-10px);
  width:220px; background:#fff; color:#198754;
  border-radius:.5rem; padding:.75rem;
  box-shadow:0 8px 20px rgba(0,0,0,.15);
  opacity:0; visibility:hidden;
  transition:all .3s ease-in-out; z-index:10;
  font-size:.875rem; font-weight:500;
}
.group:hover .benefit-popup{
  opacity:1; visibility:visible; transform:translateX(-50%) translateY(-15px);
}
.benefits-icon-wrapper{
  display:flex; align-items:center; justify-content:center;
  width:60px; height:60px; background:#fff; color:#198754;
  border-radius:50%; border:2px solid #198754; transition:all .3s ease;
}
.group:hover .benefits-icon-wrapper{ transform:scale(1.1); box-shadow:0 0 10px rgba(255,255,255,.5); }

/* ========= PÁGINA GRACIAS Biovect ========= */
.bv-gracias{
  --accent:#1f8a42; --accent-2:#33c465;
  --bg1:#f5fff8; --bg2:#e6f6ed; --ink:#0f2318;
  min-height:100vh;
  background:linear-gradient(180deg,var(--bg1),#fff 40%,var(--bg2) 100%);
  display:flex; align-items:center; justify-content:center;
  font-size:16px; color:var(--ink);
}
.bv-wrap{ width:100%; max-width:880px; padding:20px; }
.bv-card{
  border:0; border-radius:20px; background:#fff;
  box-shadow:0 18px 50px rgba(0,0,0,.1); overflow:hidden;
}
.bv-card-banner{
  background:linear-gradient(135deg,var(--accent),var(--accent-2));
  color:#fff; padding:30px 20px; text-shadow:0 1px 2px rgba(0,0,0,.25);
}
.bv-tick{
  width:88px; height:88px; border-radius:50%; border:6px solid #fff;
  display:flex; align-items:center; justify-content:center;
  margin:0 auto 12px; transform:scale(.7);
  animation:bv-pop .6s ease forwards .1s;
}
.bv-tick::after{
  content:"✓"; font-size:58px; font-weight:800; color:#fff;
  transform:scale(0); animation:bv-scaleUp .5s ease forwards .5s;
}
@keyframes bv-pop{ to{ transform:scale(1) } }
@keyframes bv-scaleUp{ to{ transform:scale(1) } }
.bv-card-body{ padding:25px 20px 35px; }
.bv-lead{ font-size:1.15rem; line-height:1.6; color:#333; }
.bv-chips{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-top:12px; }
.bv-chip{
  background:#f0fff4; border:1px solid #ccefd8; color:#145d34;
  padding:.45rem .8rem; border-radius:999px; font-size:.9rem;
}
.bv-btn-success{ background:var(--accent); border-color:var(--accent); color:#fff; }
.bv-btn-success:hover{ filter:brightness(.95); }
.bv-btn-outline{ border:1px solid var(--accent); color:var(--accent); }
.bv-btn-outline:hover{ background:var(--accent); color:#fff; }

/* ====== AJUSTES TARJETAS (neutro desktop) ====== */
.bv-card.steps{ /* si en algún momento usas esta clase compuesta */
  text-align:center;
}

/* =======================================================
   FIXES EXCLUSIVOS PARA MÓVIL (≤576px)
   ======================================================= */
@media (max-width:576px){

  /* Secciones menos altas en móvil */
  .bv-section{ padding-top:18px; padding-bottom:18px; }

  /* Separación entre la imagen (col izquierda) y el texto al apilarse */
  .bv-section .row > .col-md-6:first-child{ margin-bottom:14px; }

  /* Asegurar aire bajo el wrapper de imagen */
  .bv-media{ margin-bottom:14px !important; }

  /* Imagen dentro de .ratio sin “salto” ni deformación */
  .bv-media.ratio > img,
  .bv-media-img{
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:center !important;
    display:block;
  }

  /* Tipografía del bloque descriptivo */
  .bv-section h2{ font-size:1.2rem; line-height:1.25; margin:.25rem 0 .5rem; }
  .bv-section p, .bv-section li{ font-size:.96rem; line-height:1.55; }

  /* Tarjetas del paso a paso compactas */
  .steps .col-md-4{ margin-bottom:.75rem; }
  .steps .col-md-4:last-child{ margin-bottom:0; }
  .bv-card{ padding:14px; border-radius:12px; }
  .bv-icon{ font-size:1.7rem; margin-bottom:.2rem; }

  /* Eliminar espacio en blanco grande al final */
  .bv-section:last-of-type{ padding-bottom:8px !important; margin-bottom:0 !important; }
  main:last-child, section:last-child, .container:last-child{ margin-bottom:0 !important; padding-bottom:0 !important; }

  /* Evitar desbordes horizontales en móvil */
  html, body{ overflow-x:hidden; }
}
