/* Tarjeta promocional cuadrada. Todas las medidas en cqw (1cqw = 1% del ancho),
   así la misma tarjeta se ve igual en miniatura, en grande o exportada a 1080 px. */
.promo {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  container-type: inline-size;
  overflow: hidden;
  color: #fff;
  font-family: 'Rubik', system-ui, sans-serif;
  background:
    radial-gradient(circle at 38% 34%, #00b2e6 0%, #0a83d6 20%, #0b55b5 45%, #0a2f86 72%, #071a5a 100%);
}
.promo > * { position: absolute; margin: 0; }

.promo-cinta {
  left: 15%; right: 15%; top: 0; height: 10.4%;
  background: #fff;
  border-radius: 0 0 9cqw 9cqw;
  display: flex; align-items: center; justify-content: center;
}
.promo-cinta span {
  color: #e30613; font-weight: 800; font-size: 6.1cqw; letter-spacing: -0.05cqw; white-space: nowrap;
}

.promo-foto {
  left: 2.5%; top: 14%; width: 50%; height: 53%;
  display: flex; align-items: center; justify-content: center;
}
.promo-foto img {
  max-width: 100%; max-height: 100%; object-fit: contain;
  filter: drop-shadow(0 1.2cqw 1.6cqw rgba(0, 10, 50, .45));
}
.promo-sin-foto {
  width: 80%; aspect-ratio: 1; border: .4cqw dashed rgba(255,255,255,.5); border-radius: 3cqw;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  font-size: 3cqw; opacity: .8; text-align: center;
}

.promo-titulo {
  left: 54%; right: 3%; top: 18.5%; height: 15%;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; font-weight: 700; line-height: 1.12;
  text-shadow: 0 .3cqw .8cqw rgba(0, 0, 40, .35);
  overflow: hidden;
}
.promo-titulo.t-lg { font-size: 4.4cqw; }
.promo-titulo.t-md { font-size: 3.7cqw; }
.promo-titulo.t-sm { font-size: 3.05cqw; }
.promo-titulo.t-xs { font-size: 2.55cqw; }
.promo-titulo small { display: block; margin-top: .6cqw; font-size: .68em; font-weight: 500; color: #bfeaff; }

.promo-precios {
  left: 53%; right: 5%; top: 35%; height: 28.5%;
  box-sizing: border-box;
  border: .9cqw solid #2bb8f0; border-radius: 2.6cqw;
  padding: 1.5cqw 4.5cqw;
  display: flex; flex-direction: column; justify-content: space-evenly;
}
.pr { display: flex; flex-direction: column; }
.pr-et { font-family: 'Barlow', 'Rubik', sans-serif; font-weight: 500; font-size: 2.6cqw; letter-spacing: .02cqw; }
.pr-val { font-weight: 800; font-size: 4.7cqw; line-height: 1.05; white-space: nowrap; }
.pr-val sup { font-size: .5em; vertical-align: .9em; margin-left: .3cqw; }
.pr-destacado .pr-val { font-size: 6.4cqw; }
.pr-solo .pr-et { font-size: 3.2cqw; }
.pr-solo .pr-val { font-size: 8cqw; }
.pr-consulta { align-items: center; text-align: center; }
.pr-consulta .pr-et { font-size: 3cqw; font-weight: 600; }
.pr-consulta .pr-tel { font-size: 6.4cqw; }

.promo-franja {
  left: 22%; right: 0; top: 66.5%; height: 9.6%;
  background: linear-gradient(90deg, #0b5cc0, #0a4ea6);
  border-radius: 4.5cqw 0 0 0;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .5cqw;
}
.promo-franja strong { font-weight: 800; font-size: 2.95cqw; white-space: nowrap; }
.promo-franja span { font-weight: 700; font-size: 2cqw; color: #3cc7f7; white-space: nowrap; }

.promo-especial {
  left: 25%; right: 0; top: 77.4%; height: 10%;
  text-align: center; display: flex; flex-direction: column; justify-content: center;
}
.promo-especial strong { font-weight: 700; font-size: 2.2cqw; line-height: 1.38; }
.promo-especial span { font-family: 'Barlow', 'Rubik', sans-serif; font-weight: 400; font-size: 2.85cqw; margin-top: .3cqw; }

.promo-pie {
  left: 0; right: 0; bottom: 0; height: 10.6%;
  background: #fff; color: #0b3d9a;
  display: grid; grid-template-columns: 42% 1fr auto; align-items: center;
}
.pie-logo {
  position: absolute; left: 0; bottom: 0; width: 42%; height: 122%;
  background: #fff; border-radius: 0 5cqw 0 0;
  display: flex; align-items: center; padding-left: 2.8cqw; box-sizing: border-box;
}
.pie-logo img { width: 35cqw; height: auto; }
.pie-contacto { grid-column: 2; display: flex; flex-direction: column; align-items: center; line-height: 1.05; }
.pie-tel { display: flex; align-items: center; gap: .8cqw; font-weight: 800; font-size: 3.9cqw; }
.pie-tel svg { width: 3.5cqw; height: 3.5cqw; }
.pie-lugar { font-weight: 800; font-size: 3.2cqw; }
.pie-redes { grid-column: 3; display: flex; gap: .9cqw; padding-right: 2.6cqw; }
.pie-redes i { width: 5.4cqw; height: 5.4cqw; border-radius: 50%; background: #0b3d9a; color: #fff; display: flex; align-items: center; justify-content: center; }
.pie-redes svg { width: 3.1cqw; height: 3.1cqw; }