/* --- PALETA RGA · PLAN DISFRUTA SEGURO VIDA + DECESOS 2026 --- */
:root {
  --verde-rga: #004937;
  --verde-hero: #0f7b55;
  --verde-texto: #007C5A;
  --verde-bosque: #0b4a3a;
  --amarillo-rga: #FFCB00;
  --gris-texto: #333333;
  --gris-legal: #4a4a4a;
}

/* --- GENERALES --- */
body {
  background-color: #f0f2f5 !important;
  font-family: 'Open Sans', sans-serif !important;
  color: var(--gris-texto) !important;
}

.main-wrapper {
  max-width: 1150px !important;
  margin: 0 auto !important;
  background: #fff !important;
}

/* --- HERO (imagen completa) --- */
.seccion-hero {
  max-width: 1250px !important;
  margin: 0 auto !important;
}

.hero-main-container {
  border-radius: 0 !important;     /* la esquina inferior derecha redondeada viene en la propia imagen */
  overflow: hidden !important;
  width: 100% !important;
}

.hero-img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
}

/* --- INTRO --- */
.intro-title {
  color: var(--gris-texto) !important;
  font-family: 'Open Sans', sans-serif !important;
  font-weight: 700 !important;
  font-size: 1.35rem !important;
  line-height: 1.35 !important;
  max-width: 700px !important;
  margin: 0 auto !important;
}

/* --- SEGUROS: dos columnas con checks --- */
.seguro-titulo {
  color: var(--gris-texto) !important;
  font-family: 'Open Sans', sans-serif !important;
  font-weight: 700 !important;
  font-size: 1.15rem !important;
  margin-bottom: 22px !important;
}

.seguro-titulo em {
  font-style: italic !important;
}

.check-item {
  display: flex !important;
  align-items: flex-start !important;
  margin-bottom: 22px !important;
}

.check-icon {
  flex: 0 0 62px !important;
  width: 62px !important;
  height: 43px !important;
  margin-right: 8px !important;
  margin-top: -10px !important;   /* el tick sobresale por arriba de la pastilla verde */
}

.check-item p {
  margin: 0 !important;
  font-size: 1.05rem !important;
  line-height: 1.45 !important;
  color: var(--gris-texto) !important;
}

.check-item b {
  color: var(--verde-texto) !important;
  font-weight: 700 !important;
}

/* --- BIZUM (banda amarilla) --- */
.bizum-section {
  background-color: var(--amarillo-rga) !important;
}

.bloque-bizum {
  max-width: 900px !important;
}

.bizum-visual {
  position: relative !important;
  width: 260px !important;
  height: 240px !important;
  margin: 0 !important;
}

.bizum-circle {
  position: absolute !important;
  left: 60px !important;
  top: 40px !important;
  width: 200px !important;
  height: 200px !important;
  border-radius: 50% !important;
  background-color: var(--verde-bosque) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.bizum-circle img {
  width: 110px !important;
  height: auto !important;
}

.bizum-fecha {
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  width: 120px !important;
  height: 120px !important;
  border-radius: 50% !important;
  background-color: var(--verde-hero) !important;
  color: #fff !important;
  font-family: 'Gilroy', sans-serif !important;
  font-weight: 700 !important;
  font-size: 1rem !important;
  line-height: 1.15 !important;
  text-align: center !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 18px !important;
  z-index: 2 !important;
}

.bizum-texto {
  color: var(--verde-rga) !important;
  font-size: 1.3rem !important;
  width: 430px !important;       /* ancho fijo: 4 líneas como en el diseño */
  max-width: 100% !important;
  line-height: 1.4 !important;
  margin: 0 !important;
}

.bizum-texto b {
  font-weight: 700 !important;
}

/* --- 8% BONIFICACIÓN --- */
.ocho-section {
  background: #fff !important;
}

.bloque-ocho {
  max-width: 860px !important;
}

.ocho-texto {
  color: var(--gris-texto) !important;
  font-family: 'Open Sans', sans-serif !important;
  font-weight: 700 !important;
  font-size: 1.35rem !important;
  line-height: 1.35 !important;
  margin: 0 !important;
  width: 360px !important;       /* ancho fijo: 4 líneas a 1,35rem; con col-auto el max-width no basta */
  max-width: 100% !important;
}

.ocho-box {
  background-color: var(--verde-hero) !important;
  border-radius: 0 0 45px 0 !important;
  padding: 26px 30px 26px 28px !important;
  width: fit-content !important;        /* la caja mide lo que mide su contenido: claim + número pegados */
  max-width: 100% !important;
  display: flex !important;
  align-items: center !important;
  color: #fff !important;
  font-family: 'Gilroy', sans-serif !important;
  font-weight: 700 !important;
}

.ocho-box .ocho-claim {
  font-size: 1.6rem !important;
  line-height: 1.1 !important;
  margin: 0 !important;
  flex: 0 0 auto !important;
}

.ocho-box .ocho-claim span {
  color: var(--amarillo-rga) !important;
}

.ocho-box .ocho-numero {
  color: var(--amarillo-rga) !important;
  font-size: 7.2rem !important;
  line-height: 0.9 !important;
  margin: 0 0 0 4px !important;
  white-space: nowrap !important;
}

.ocho-box .ocho-numero small {
  font-size: 2.4rem !important;
  vertical-align: baseline !important;
}

/* --- FOOTER LEGAL --- */
.legal-footer {
  background: #ededed !important;
  border: 0 !important;
}

.legal-footer p {
  font-size: 12px !important;
  color: var(--gris-legal) !important;
  line-height: 1.35em !important;
  margin-bottom: 10px !important;
  padding-left: 0 !important;
  text-indent: 0 !important;
}

.legal-footer p.sin-asterisco {
  text-indent: 0 !important;
}

.legal-footer a {
  color: var(--gris-legal) !important;
  font-weight: 400 !important;
}

/* --- RESPONSIVO --- */
@media (max-width: 991px) {
  .intro-title { font-size: 1.25rem !important; }

  /* Bizum: visual centrado y texto centrado debajo */
  .bizum-visual { margin: 0 auto 10px auto !important; }
  .bizum-texto { width: auto !important; max-width: 480px !important; margin: 0 auto !important; text-align: center !important; font-size: 1.25rem !important; }

  /* 8%: texto centrado arriba, caja centrada debajo */
  .ocho-texto { width: auto !important; text-align: center !important; margin: 0 auto 25px auto !important; max-width: 480px !important; }
  .ocho-box { margin: 0 auto !important; }
  .ocho-box .ocho-numero { font-size: 6rem !important; }
}

@media only screen and (max-width: 600px) {
  .main-wrapper { box-shadow: none !important; }

  .intro-title { font-size: 1.1rem !important; }
  .seguro-titulo { font-size: 1.05rem !important; }
  .check-item p { font-size: 1rem !important; }
  .check-icon { flex-basis: 50px !important; width: 50px !important; height: 35px !important; margin-top: -8px !important; }

  /* Bizum: tamaños reales reducidos (sin transform, para no dejar hueco fantasma) */
  .bizum-visual { width: 220px !important; height: 205px !important; }
  .bizum-circle { left: 50px !important; top: 35px !important; width: 170px !important; height: 170px !important; }
  .bizum-circle img { width: 90px !important; }
  .bizum-fecha { width: 105px !important; height: 105px !important; font-size: 0.85rem !important; padding: 12px !important; }
  .bizum-texto { font-size: 1.1rem !important; }

  /* 8%: caja apilada */
  .ocho-texto { font-size: 1.1rem !important; }
  .ocho-box { flex-direction: column !important; text-align: center !important; border-radius: 0 0 40px 0 !important; padding: 25px 20px !important; }
  .ocho-box .ocho-claim { font-size: 1.35rem !important; }
  .ocho-box { width: 100% !important; }
  .ocho-box .ocho-numero { margin: 12px 0 0 0 !important; font-size: 5rem !important; }
  .ocho-box .ocho-numero small { font-size: 2rem !important; }

  .legal-footer p { font-size: 11px !important; }
}