:root {
  --nav-bg: #201f4b;
  --nav-text: #ffffff;
  --nav-text-muted: #c9c9e6;
  --nav-active-border: #7fd3e8;
  --container-max-width: 1200px;
  --container-padding-desktop: 2.5rem;
  --container-padding-mobile: 1rem;
  --btn-primary-bg: #7fd3e8;
  --btn-primary-text: #111827;
  --btn-secondary-border: #ffffff;
  --navbar-height: 70px;
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  font-family: "Montserrat", system-ui, -apple-system, BlinkMacSystemFont,
    "Segoe UI", sans-serif;
  font-weight: 400; /* Regular por defecto */
  background: #D7E0EB; /* si en index usas body-index puedes sobrescribirlo ahí */
  color: #111827;
}

img {
  max-width: 100%;
  display: block;
}

/* ===== NAVBAR SUPERIOR ===== */
.navbar {
  background-color: var(--nav-bg);
  color: var(--nav-text);
  position: sticky;
  top: 0;
  z-index: 1000;
}

.navbar__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: var(--navbar-height);
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding-desktop);
  width: 100%;
}

.navbar__logo {
  display: flex;
  align-items: center;
  gap: 0.6rem;
}

.navbar__logo img {
  height: 52px;
  width: auto;
  object-fit: contain;
}

.navbar__links {
  display: flex;
  align-items: center;
  gap: 1.2rem;
  list-style: none;
}

.navbar__links a,
.mobile-menu__links a {
  text-decoration: none;
  color: var(--nav-text-muted);
  font-size: 0.95rem;
  font-weight: 500;
  padding: 0.15rem 0.9rem;
  border-radius: 999px;
  border: 1px solid transparent;
  transition: color 0.2s, border-color 0.2s, background-color 0.2s,
    transform 0.2s;
  display: inline-block;
}

.navbar__links a:hover,
.mobile-menu__links a:hover {
  color: #ffffff;
  transform: translateY(-1px);
}

.menu-link--active {
  color: #ffffff !important;
  border-color: var(--nav-active-border);
  background-color: transparent;
}

.navbar__actions {
  display: flex;
  align-items: center;
  gap: 0.8rem;
}

.navbar__search,
.mobile-menu__search {
  display: flex;
  align-items: center;
  background: rgba(255, 255, 255, 0.08);
  border-radius: 999px;
  padding: 0.25rem 0.7rem;
  border: 1px solid rgba(255, 255, 255, 0.14);
}

.navbar__search input,
.mobile-menu__search input {
  background: transparent;
  border: none;
  outline: none;
  color: var(--nav-text);
  font-size: 0.9rem;
  width: 100%;
}

.navbar__search input::placeholder,
.mobile-menu__search input::placeholder {
  color: var(--nav-text-muted);
}

.navbar__search button,
.mobile-menu__search button {
  background: none;
  border: none;
  color: var(--nav-text-muted);
  cursor: pointer;
}

.navbar__social {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  font-size: 1.3rem;
}

.navbar__social a {
  color: var(--nav-text-muted);
  transition: color 0.2s, transform 0.2s;
}

.navbar__social a:hover {
  color: #ffffff;
  transform: translateY(-1px);
}

.navbar__toggle {
  display: none;
  background: none;
  border: none;
  color: var(--nav-text);
  font-size: 1.6rem;
  cursor: pointer;
}

/* ===== MENÚ LATERAL MÓVIL ===== */
.mobile-menu {
  position: fixed;
  top: 0;
  right: 0;
  height: 70vh;
  width: 30vw;
  min-width: 220px;
  background-color: var(--nav-bg);
  color: var(--nav-text);
  box-shadow: -8px 0 18px rgba(0, 0, 0, 0.4);
  padding: 1.4rem 1rem;
  display: none;
  flex-direction: column;
  gap: 1rem;
  transform: translateX(100%);
  transition: transform 0.25s ease-out;
  z-index: 1200;
}

.mobile-menu--open {
  transform: translateX(0);
}

.mobile-menu__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.5rem;
}

.mobile-menu__title {
  font-size: 0.95rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--nav-text-muted);
}

.mobile-menu__close {
  background: none;
  border: none;
  color: var(--nav-text);
  font-size: 1.4rem;
  cursor: pointer;
}

.mobile-menu__links {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  margin-top: 0.25rem;
}

.mobile-menu__social {
  margin-top: auto;
  display: flex;
  gap: 0.7rem;
  font-size: 1.3rem;
}

.mobile-menu__social a {
  color: var(--nav-text-muted);
}

.mobile-menu__social a:hover {
  color: #ffffff;
}

/* ===== BOTONES GENERALES ===== */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.55rem 1.4rem;
  border-radius: 999px;
  font-size: 0.95rem;
  font-weight: 600;
  border: 1.5px solid transparent;
  cursor: pointer;
  text-decoration: none;
  transition: background-color 0.2s, color 0.2s, border-color 0.2s,
    transform 0.2s;
  white-space: nowrap;
}

.btn--primary {
  background-color: var(--btn-primary-bg);
  color: var(--btn-primary-text);
  border-color: var(--btn-primary-bg);
}

.btn--primary:hover {
  background-color: #a3e2f2;
  border-color: #a3e2f2;
  transform: translateY(-1px);
}

.btn--secondary {
  background-color: transparent;
  color: #ffffff;
  border-color: var(--btn-secondary-border);
}

/* Botones alineados */
.scholarships__actions {
  display: flex;
  gap: 0.8rem;
  margin-top: 1rem;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
}

.scholarships__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 190px;
  text-align: center;
}

/* Hacer visible el botón secundario dentro de Becas */
.scholarships__col--highlight .btn--secondary {
  background-color: transparent;
  color: var(--nav-bg);                /* texto azul CAE */
  border-color: rgba(32, 31, 75, 0.9); /* borde azul visible */
}

.scholarships__col--highlight .btn--secondary:hover {
  background-color: rgba(32, 31, 75, 0.06);
}


.btn--secondary:hover {
  background-color: rgba(255, 255, 255, 0.08);
  transform: translateY(-1px);
}

/* ===== HERO / CARRUSEL ===== */
.hero {
  margin-top: 0;
  margin-bottom: 3rem;
}

.hero__inner {
  max-width: 100%;
  margin: 0;
  padding: 0;
}

.hero__viewport {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 100vh;
  min-height: 360px;
  background: #111827;
}

.hero-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 0.5s ease;
}

.hero-slide picture {
  width: 100%;
  height: 100%;
  display: block;
}

.hero-slide img {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: cover;
}

.hero-slide--active {
  opacity: 1;
}

.hero__overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  padding: 1rem;
}

.hero__card {
  pointer-events: auto;
  background: rgba(15, 16, 60, 0.88);
  border-radius: 18px;
  padding: 1.75rem 2.25rem;
  max-width: 520px;
  text-align: center;
  color: #ffffff;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.4);
  border: 1px solid rgba(255, 255, 255, 0.14);
  backdrop-filter: blur(8px);
}

.hero__title {
  font-family: "Montserrat", system-ui, -apple-system, BlinkMacSystemFont,
    "Segoe UI", sans-serif;
  font-size: 1.9rem;
  font-weight: 700;
  margin-bottom: 0.6rem;
}

.hero__subtitle {
  font-family: "Montserrat", system-ui, -apple-system, BlinkMacSystemFont,
    "Segoe UI", sans-serif;
  font-size: 0.98rem;
  font-weight: 400;
  color: var(--nav-text-muted);
  margin-bottom: 1.2rem;
}

.hero__buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  justify-content: center;
}

.hero__arrows {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  pointer-events: none;
  padding: 0 0.75rem;
}

.hero__arrow-btn {
  pointer-events: auto;
  background: rgba(0, 0, 0, 0.35);
  border-radius: 999px;
  width: 38px;
  height: 38px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: #ffffff;
  transition: background-color 0.2s, transform 0.2s;
}

.hero__arrow-btn:hover {
  background: rgba(0, 0, 0, 0.55);
  transform: translateY(-1px);
}

.hero__dots {
  position: absolute;
  left: 50%;
  bottom: 14px;
  transform: translateX(-50%);
  display: flex;
  gap: 0.4rem;
  pointer-events: auto;
}

.hero__dot {
  width: 9px;
  height: 9px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.6);
  background: transparent;
  cursor: pointer;
  padding: 0;
}

.hero__dot--active {
  background: #ffffff;
  transform: scale(1.05);
}

/* ===== FOOTER ===== */
.footer {
  background-color: var(--nav-bg);
  color: var(--nav-text);
  margin-top: 3rem;
  padding: 3rem 0 1.5rem;
}

.footer__inner {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding-desktop);
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) repeat(3, minmax(0, 1fr));
  gap: 2rem;
  align-items: flex-start;
}

.footer__brand img {
  height: 64px;
  width: auto;
  object-fit: contain;
  margin-bottom: 1.1rem;
}

.footer__social {
  display: flex;
  gap: 0.85rem;
  font-size: 1.4rem;
}

.footer__social a {
  color: var(--nav-text-muted);
  transition: color 0.2s, transform 0.2s;
}

.footer__social a:hover {
  color: #ffffff;
  transform: translateY(-1px);
}

.footer__col-title {
  font-size: 0.95rem;
  font-weight: 600;
  margin-bottom: 0.75rem;
  color: #ffffff;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.footer__list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  font-size: 0.9rem;
  color: var(--nav-text-muted);
}

.footer__list a {
  color: var(--nav-text-muted);
  text-decoration: none;
}

.footer__list a:hover {
  color: #ffffff;
}

.footer__contact-item {
  display: flex;
  align-items: flex-start;
  gap: 0.4rem;
}

.footer__contact-item i {
  margin-top: 0.1rem;
}

.footer__bottom {
  max-width: var(--container-max-width);
  margin: 2rem auto 0;
  padding: 1rem var(--container-padding-desktop) 0;
  border-top: 1px solid rgba(255, 255, 255, 0.18);
  text-align: center;
  font-size: 0.8rem;
  color: var(--nav-text-muted);
}

/* ===== RESPONSIVE ===== */
@media (max-width: 900px) {
  .navbar__inner {
    padding: 0 var(--container-padding-mobile);
  }

  .navbar__links,
  .navbar__actions {
    display: none;
  }

  .navbar__toggle {
    display: block;
  }

  .mobile-menu {
    display: flex;
  }

  .hero__inner {
    padding: 0;
  }

  .hero__viewport {
    height: 100vh;
    min-height: 320px;
    background: #000;
  }

  .hero-slide picture,
  .hero-slide img {
    width: 100%;
    height: 100%;
  }

  .hero-slide img {
    object-fit: cover;
  }

  .hero__card {
    padding: 1.4rem 1.4rem;
  }

  .hero__title {
    font-size: 1.55rem;
  }

  .footer__inner {
    padding: 0 var(--container-padding-mobile);
    grid-template-columns: 1fr 1fr;
    row-gap: 2rem;
  }

  .footer__brand {
    grid-column: 1 / -1;
  }

  .footer__bottom {
    padding: 1rem var(--container-padding-mobile) 0;
  }
}

@media (min-width: 901px) {
  .mobile-menu {
    display: none;
  }
}


/* ===== SECCIÓN QUIÉNES SOMOS ===== */

.about {
  padding: 4rem 0 4.5rem;
  background: #f9fafb;
}

.about__inner {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding-desktop);
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
  gap: 3rem;
  align-items: center;
}

.about__content {
  display: flex;
  flex-direction: column;
  gap: 1.75rem;
}

.about__eyebrow {
  font-size: 0.8rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #6b7280;
  font-weight: 600;
}

.about__title {
  font-size: 2rem;
  font-weight: 700;
  color: #111827;
  margin-bottom: 0.25rem;
}

.about__block {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.about__block-title {
  font-size: 1rem;
  font-weight: 600;
  color: #111827;
}

.about__block-text {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #4b5563;
}

.about__media {
  display: flex;
  justify-content: center;
}

.about__image-wrapper {
  width: 100%;
  max-width: 420px;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 18px 45px rgba(15, 23, 42, 0.25);
  border: 1px solid rgba(15, 23, 42, 0.08);
  background: #111827;
}

.about__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Responsive para la sección Quiénes somos */
@media (max-width: 900px) {
  .about {
    padding: 3rem 0 3.5rem;
  }

  .about__inner {
    padding: 0 var(--container-padding-mobile);
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }

  .about__content {
    order: 2;
  }

  .about__media {
    order: 1;
  }

  .about__title {
    font-size: 1.7rem;
  }

  .about__image-wrapper {
    max-width: 100%;
  }
}

/* ===== SECCIÓN QUIÉNES SOMOS – V2 ===== */

.about-v2 {
  padding: 4.5rem 0 5rem;
  background: #f9fafb;
}

.about-v2__inner {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding-desktop);
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
  gap: 3.5rem;
  align-items: center;
}

.about-v2__text {
  display: flex;
  flex-direction: column;
  gap: 1.75rem;
}

.about-v2__tag {
  font-size: 0.8rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #6b7280;
  font-weight: 600;
}

.about-v2__title {
  font-size: 2.1rem;
  font-weight: 700;
  color: #111827;
}

.about-v2__intro {
  font-size: 0.98rem;
  color: #4b5563;
  max-width: 520px;
  line-height: 1.7;
}

.about-v2__cards {
  display: flex;
  flex-direction: column;
  gap: 1.1rem;
}

.about-v2__card {
  padding: 0.9rem 1.1rem;
  border-radius: 14px;
  background: #ffffff;
  border: 1px solid rgba(15, 23, 42, 0.06);
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.06);
}

.about-v2__card-title {
  font-size: 0.95rem;
  font-weight: 600;
  color: #111827;
  margin-bottom: 0.25rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.about-v2__card-text {
  font-size: 0.93rem;
  line-height: 1.7;
  color: #4b5563;
}

/* Imagen vertical lado derecho */
.about-v2__media {
  display: flex;
  justify-content: flex-end;
}

.about-v2__image-shell {
  max-width: 360px;
  width: 100%;
  padding: 0.9rem;
  border-radius: 22px;
  background: radial-gradient(circle at top, #7fd3e8 0, #201f4b 60%, #020617 100%);
  box-shadow: 0 22px 55px rgba(15, 23, 42, 0.4);
  border: 1px solid rgba(255, 255, 255, 0.18);
}

.about-v2__image-frame {
  border-radius: 18px;
  overflow: hidden;
  background: #020617;
  aspect-ratio: 3 / 4; /* Imagen vertical */
}

.about-v2__image {
  width: 100%;
  height: 100%;
  object-fit: cover; /* rellena el frame vertical */
  display: block;
}

/* ===== RESPONSIVE QUIÉNES SOMOS V2 ===== */
@media (max-width: 900px) {
  .about-v2 {
    padding: 3.2rem 0 4rem;
  }

  .about-v2__inner {
    padding: 0 var(--container-padding-mobile);
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }

  .about-v2__media {
    justify-content: center;
    order: 1;
  }

  .about-v2__text {
    order: 2;
  }

  .about-v2__title {
    font-size: 1.8rem;
  }

  .about-v2__image-shell {
    max-width: 320px;
  }
}

/* ===== POR QUÉ ELEGIRNOS ===== */

.reasons {
  padding: 4rem 0 4.5rem;
  background: #ffffff;
}

.reasons__inner {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding-desktop);
}

.reasons__header {
  text-align: center;
  max-width: 640px;
  margin: 0 auto 2.5rem;
}

.reasons__tag {
  font-size: 0.8rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #6b7280;
  font-weight: 600;
}

.reasons__title {
  font-size: 2rem;
  font-weight: 700;
  color: #111827;
  margin-top: 0.5rem;
}

.reasons__subtitle {
  font-size: 0.98rem;
  color: #4b5563;
  margin-top: 0.75rem;
  line-height: 1.7;
}

.reasons__grid {
  margin-top: 2.5rem;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.7rem;
}

.reasons__card {
  background: #f9fafb;
  border-radius: 18px;
  padding: 1.6rem 1.5rem;
  border: 1px solid rgba(15, 23, 42, 0.06);
  box-shadow: 0 14px 35px rgba(15, 23, 42, 0.06);
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.reasons__icon {
  width: 40px;
  height: 40px;
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(127, 211, 232, 0.12);
  color: #0f172a;
  margin-bottom: 0.4rem;
  font-size: 1.3rem;
}

.reasons__card-title {
  font-size: 1rem;
  font-weight: 600;
  color: #111827;
}

.reasons__card-text {
  font-size: 0.93rem;
  line-height: 1.7;
  color: #4b5563;
}

@media (max-width: 900px) {
  .reasons__inner {
    padding: 0 var(--container-padding-mobile);
  }

  .reasons__grid {
    grid-template-columns: 1fr;
  }

  .reasons__title {
    font-size: 1.7rem;
  }
}

/* ===== TESTIMONIOS ===== */

.testimonials {
  padding: 4.5rem 0 5rem;
  background: #f9fafb;
}

.testimonials__inner {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding-desktop);
  text-align: center;
}

.testimonials__header {
  max-width: 640px;
  margin: 0 auto 2.5rem;
}

.testimonials__tag {
  font-size: 0.8rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #6b7280;
  font-weight: 600;
}

.testimonials__title {
  font-size: 2rem;
  font-weight: 700;
  color: #111827;
  margin-top: 0.5rem;
}

.testimonials__subtitle {
  font-size: 0.98rem;
  color: #4b5563;
  margin-top: 0.75rem;
  line-height: 1.7;
}

.testimonials__viewport {
  position: relative;
  max-width: 720px;
  margin: 0 auto;
  min-height: 230px;
}

.testimonials__item {
  position: absolute;
  inset: 0;
  opacity: 0;
  transform: translateY(8px);
  transition: opacity 0.35s ease, transform 0.35s ease;
  padding: 2rem 2.4rem;
  background: #ffffff;
  border-radius: 22px;
  box-shadow: 0 18px 45px rgba(15, 23, 42, 0.08);
  border: 1px solid rgba(15, 23, 42, 0.05);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
}

.testimonials__item--active {
  opacity: 1;
  transform: translateY(0);
  position: relative;
}

.testimonials__stars {
  display: flex;
  gap: 0.2rem;
  justify-content: center;
  font-size: 1rem;
}

.testimonials__stars i {
  color: #facc15; /* estrellas doradas */
}

.testimonials__text {
  font-size: 0.96rem;
  line-height: 1.8;
  color: #374151;
  max-width: 620px;
}

.testimonials__name {
  font-size: 0.96rem;
  font-weight: 600;
  color: #111827;
}

.testimonials__role {
  font-size: 0.86rem;
  color: #6b7280;
}

/* Flechas debajo de los testimonios */
.testimonials__nav {
  margin-top: 2.2rem;
  display: flex;
  justify-content: center;
  gap: 1rem;
}

.testimonials__arrow {
  width: 40px;
  height: 40px;
  border-radius: 999px;
  border: 1px solid rgba(15, 23, 42, 0.18);
  background: #ffffff;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  color: #111827;
  transition: background-color 0.2s, transform 0.2s, box-shadow 0.2s;
}

.testimonials__arrow:hover {
  background: #e5f4fa;
  transform: translateY(-1px);
  box-shadow: 0 10px 25px rgba(15, 23, 42, 0.12);
}

@media (max-width: 900px) {
  .testimonials__inner {
    padding: 0 var(--container-padding-mobile);
  }

  .testimonials__title {
    font-size: 1.7rem;
  }

  .testimonials__item {
    padding: 1.7rem 1.5rem;
  }

  .testimonials__viewport {
    min-height: 260px;
  }
}


/* ===== CURSOS RECOMENDADOS ===== */

.courses {
  padding: 4rem 0 4.5rem;
  background: #ffffff;
}

.courses__inner {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding-desktop);
}

.courses__header {
  text-align: center;
  max-width: 640px;
  margin: 0 auto 2.5rem;
}

.courses__tag {
  font-size: 0.8rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #6b7280;
  font-weight: 600;
}

.courses__title {
  font-size: 2rem;
  font-weight: 700;
  color: #111827;
  margin-top: 0.5rem;
}

.courses__subtitle {
  font-size: 0.98rem;
  color: #4b5563;
  margin-top: 0.75rem;
  line-height: 1.7;
}

.courses__grid {
  margin-top: 2.5rem;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.8rem;
}

.courses__card {
  background: #f9fafb;
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(15, 23, 42, 0.06);
  box-shadow: 0 14px 35px rgba(15, 23, 42, 0.06);
  display: flex;
  flex-direction: column;
}

.courses__image-wrapper {
  width: 100%;
  aspect-ratio: 4 / 3;
  overflow: hidden;
}

.courses__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
}

.courses__card:hover .courses__image {
  transform: scale(1.05);
}

.courses__card-title {
  padding: 1.1rem 1.4rem 1.3rem;
  font-size: 1rem;
  font-weight: 600;
  color: #111827;
}

.courses__actions {
  margin-top: 2.8rem;
  display: flex;
  justify-content: center;
}

/* Responsive cursos recomendados */
@media (max-width: 900px) {
  .courses__inner {
    padding: 0 var(--container-padding-mobile);
  }

  .courses__grid {
    grid-template-columns: 1fr;
  }

  .courses__title {
    font-size: 1.7rem;
  }
}





/* ===== PÁGINA DE CURSO ===== */

.course-page {
  padding: 3rem 0 4rem;
  background: #ffffff;
}

.course-page__inner {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding-desktop);
}

.course-layout {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 1.3fr);
  gap: 2.5rem;
  align-items: flex-start;
}

.course-facts__title {
  font-size: 1.4rem;
  font-weight: 700;
  margin-bottom: 0.75rem;
  color: #111827;
}

.course-facts__intro {
  font-size: 0.98rem;
  color: #4b5563;
  margin-bottom: 1.4rem;
  line-height: 1.7;
}

.course-facts__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem 1.5rem;
}

.course-facts__label {
  font-size: 0.9rem;
  font-weight: 600;
  color: #354BA0;
}

.course-facts__value {
  font-size: 0.9rem;
  color: #4b5563;
}

/* ===== FORMULARIO FLOTANTE ===== */

.course-contact {
  position: sticky;
  top: 100px;
}

.course-contact__card {
  background: #ffffff;
  border-radius: 18px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: 0 16px 40px rgba(15, 23, 42, 0.09);
  padding: 1.5rem 1.5rem 1.25rem;
  display: flex;
  flex-direction: column;
}

.course-contact__title {
  font-size: 1rem;
  font-weight: 700;
  /* hacemos que el título sea una banda azul arriba del formulario */
  background: #354BA0;        /* mismo azul del menú */
  color: #ffffff;                   /* texto en blanco */
  margin: -1.5rem -1.5rem 1rem;     /* que ocupe todo el ancho de la card */
  padding: 0.85rem 1.5rem;
  border-radius: 18px 18px 0 0;     /* redondeado solo arriba */
}
.course-contact__form {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
}

.form-field {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  font-size: 0.9rem;
}

.form-field label {
  font-weight: 600;
  color: #111827;
}

.form-field input,
.form-field select {
  border-radius: 999px;
  border: 1px solid #d1d5db;
  padding: 0.45rem 0.9rem;
  font-size: 0.9rem;
  outline: none;
}

.form-field input:focus,
.form-field select:focus {
  border-color: var(--nav-bg);
}

.form-field--phone .phone-input {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  border-radius: 999px;
  border: 1px solid #d1d5db;
  padding: 0.3rem 0.9rem;
  background: #ffffff;
}

.phone-flag {
  font-size: 1.1rem;
}

.phone-input input {
  border: none;
  outline: none;
  flex: 1;
  font-size: 0.9rem;
}

.form-field--checkbox label {
  font-weight: 400;
  display: flex;
  align-items: flex-start;
  gap: 0.4rem;
  color: #4b5563;
}

.form-field--checkbox input[type="checkbox"] {
  margin-top: 2px;
}

.recaptcha-placeholder {
  border-radius: 8px;
  border: 1px solid #e5e7eb;
  padding: 0.8rem;
  text-align: center;
  font-size: 0.8rem;
  color: #6b7280;
  background: #f9fafb;
}

/* Bloque inferior gris "QUIERO MÁS INFORMACIÓN" */
.course-contact__footer {
  margin-top: 0.8rem;
  padding: 0.8rem 1rem 0.4rem;
  border-radius: 0 0 16px 16px;
  margin-left: -1.5rem;
  margin-right: -1.5rem;
  margin-bottom: -1.25rem;
  background: #fff; /* gris CAE */
}

.btn--full {
  width: 100%;
  justify-content: center;
  background: #D7E0EB;
}

/* Responsive curso + formulario */
@media (max-width: 900px) {
  .course-page__inner {
    padding: 0 var(--container-padding-mobile);
  }

  .course-layout {
    grid-template-columns: 1fr;
  }

  .course-contact {
    position: static;
  }

  .course-contact__card {
    margin-top: 2rem;
  }

  .course-facts__grid {
    grid-template-columns: 1fr;
  }
}


/* Fondo general para páginas de curso (basado en el degradado de la imagen) */
.body-course {
  background: linear-gradient(
    90deg,
    #cfd8e3 0%,
    #d7e0eb 25%,
    #dfe5ef 50%,
    #e6eaf3 75%,
    #edf0f7 100%
  );
}

/* Que la sección del curso no tape el degradado */
.body-course .course-page {
  background: transparent;
}


/* ===== SECCIÓN BECAS ===== */
.scholarships {
  padding: 3rem 0 4rem;
}

.scholarships__inner {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding-desktop);
}

/* Marco con efecto suave */
.scholarships__card-wrap {
  border-radius: 20px;
  padding: 2px;
  background: radial-gradient(circle at top left,
    rgba(127, 211, 232, 0.55),
    rgba(32, 31, 75, 0.9),
    rgba(32, 31, 75, 0.98)
  );
  box-shadow: 0 18px 45px rgba(15, 23, 42, 0.35);
}

.scholarships__card {
  background: #ffffff;
  border-radius: 18px;
  padding: 2.2rem 2.4rem;
  display: flex;
  flex-direction: column;
  gap: 1.8rem;
  position: relative;
  overflow: hidden;
}

.scholarships__card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at top right,
    rgba(127, 211, 232, 0.12),
    transparent 55%
  );
  opacity: 0.9;
  pointer-events: none;
}

/* Contenido por encima del efecto */
.scholarships__card > * {
  position: relative;
  z-index: 1;
}

/* Header */
.scholarships__header {
  max-width: 720px;
}

.scholarships__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.18rem 0.7rem;
  border-radius: 999px;
  font-size: 0.75rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  background: rgba(32, 31, 75, 0.06);
  color: #111827;
  border: 1px solid rgba(127, 211, 232, 0.6);
}

.scholarships__eyebrow::before {
  content: "🎓";
}

.scholarships__title {
  font-size: 1.6rem;
  font-weight: 700;
  margin-top: 0.7rem;
  margin-bottom: 0.6rem;
  color: #111827;
}

.scholarships__intro {
  font-size: 0.98rem;
  color: #4b5563;
  line-height: 1.9;
  text-align: justify;
}

/* Grid de columnas */
.scholarships__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.4fr);
  gap: 2rem;
}

.scholarships__col {
  font-size: 0.95rem;
  color: #4b5563;
}

.scholarships__col--highlight {
  background: rgba(248, 250, 252, 0.98);
  border-radius: 14px;
  padding: 1.4rem 1.5rem;
  border: 1px solid rgba(148, 163, 184, 0.7);
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.12);
}

/* Títulos dentro de columnas */
.scholarships__subtitle {
  font-size: 1.02rem;
  font-weight: 600;
  margin-bottom: 0.7rem;
  color: #111827;
}

/* Listas */
.scholarships__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.scholarships__list li {
  position: relative;
  padding-left: 1.1rem;
  margin-bottom: 0.4rem;
  line-height: 1.7;
  text-align: justify;
}

.scholarships__list li::before {
  content: "•";
  position: absolute;
  left: 0;
  top: 0.18rem;
  font-size: 0.8rem;
  color: var(--nav-bg);
}

.scholarships__list--compact li {
  margin-bottom: 0.35rem;
}

.scholarships__text {
  margin-bottom: 0.7rem;
  text-align: justify;
}



/* Efecto hover suave en la tarjeta completa */
.scholarships__card:hover {
  transform: translateY(-2px);
  box-shadow: 0 24px 55px rgba(15, 23, 42, 0.4);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

/* Responsivo */
@media (max-width: 900px) {
  .scholarships__inner {
    padding: 0 var(--container-padding-mobile);
  }

  .scholarships__card {
    padding: 1.8rem 1.6rem;
  }

  .scholarships__grid {
    grid-template-columns: 1fr;
  }

  .scholarships__actions {
    display: flex;
    gap: 0.8rem;
    margin-top: 1rem;
    align-items: center;        /* Alinea verticalmente los dos botones */
    justify-content: center;    /* Los centra en la misma fila */
    flex-wrap: wrap;            /* Permite que hagan salto si la pantalla es muy pequeña */
  }

  .scholarships__btn {
    display: inline-flex;       /* Asegura mismo comportamiento en ambos */
    align-items: center;
    justify-content: center;
    min-width: 190px;           /* Mismo ancho visual aproximado */
    text-align: center;
  }
}


/* Contenedor del contenido superior del hero */
.course-hero-header {
  max-width: 1100px;
  margin: 0 auto 1.5rem;
  padding: 1.5rem 1rem 0;
  text-align: left;
}

/* Título principal del curso */
.course-hero-header__title {
  font-size: 1.9rem;
  line-height: 1.2;
  font-weight: 700;
  margin: 0 0 0.75rem;
}

/* Descripción breve */
.course-hero-header__subtitle {
  font-size: 1rem;
  line-height: 1.5;
  margin: 0 0 0.75rem;
  max-width: 720px;
}

/* Fecha de inicio del curso */
.course-hero-header__date {
  font-size: 0.9rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin: 0 0 1rem;
}

/* Contenedor de botones */
.course-hero-header__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

/* Botones del hero (estilos propios para evitar conflictos) */
.course-hero-header__btn {
  display: inline-block;
  padding: 0.8rem 1.4rem;
  border-radius: 999px;
  font-size: 0.95rem;
  font-weight: 600;
  text-decoration: none;
  border: 2px solid transparent;
  cursor: pointer;
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

/* Botón principal */
.course-hero-header__btn--primary {
  background-color: #1f62ff;      /* ajusta al color de marca */
  color: #ffffff;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.16);
}

/* Hover botón principal */
.course-hero-header__btn--primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.22);
}

/* Botón secundario */
.course-hero-header__btn--secondary {
  background-color: #ffffff;
  color: #1f62ff;
  border-color: #1f62ff;
}

/* Hover botón secundario */
.course-hero-header__btn--secondary:hover {
  background-color: #1f62ff;
  color: #ffffff;
}

/* Responsive para pantallas grandes */
@media (min-width: 900px) {
  .course-hero-header {
    padding: 2rem 0 1.5rem;
    margin-bottom: 2rem;
  }

  .course-hero-header__title {
    font-size: 2.2rem;
  }

  .course-hero-header__subtitle {
    font-size: 1.05rem;
  }
}

/* Responsive para móviles */
@media (max-width: 600px) {
  .course-hero-header {
    padding: 1.25rem 1rem 0;
  }

  .course-hero-header__title {
    font-size: 1.6rem;
  }

  .course-hero-header__actions {
    flex-direction: column;
    align-items: flex-start;
  }

  .course-hero-header__btn {
    width: auto;
  }
}



/* Contenedor overlay del texto sobre el hero */
.course-hero-header {
  position: absolute;
  inset: 0; /* top:0; right:0; bottom:0; left:0 */
  display: flex;
  align-items: center;      /* centra verticalmente */
  justify-content: flex-start;
  pointer-events: none;     /* evita bloquear el hero si hay zonas clicables */
  background: transparent;  /* sin fondo gris */
}

/* Contenido interno, alineado a la izquierda */
.course-hero-header__content {
  pointer-events: auto; /* los botones sí deben ser clicables */
  max-width: 640px;
  margin-left: 5%;
  margin-right: 5%;
  text-align: left;
  color: #ffffff;        /* asumimos hero oscuro; ajusta si tu imagen es clara */
}

/* Título principal del curso */
.course-hero-header__title {
  font-size: 2rem;
  line-height: 1.2;
  font-weight: 700;
  margin: 0 0 0.75rem;
}

/* Descripción breve */
.course-hero-header__subtitle {
  font-size: 1rem;
  line-height: 1.5;
  margin: 0 0 0.75rem;
}

/* Fecha de inicio del curso */
.course-hero-header__date {
  font-size: 0.9rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin: 0 0 1rem;
}

/* Contenedor de botones */
.course-hero-header__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

/* Botones del hero (estilos propios para evitar conflictos) */
.course-hero-header__btn {
  display: inline-block;
  padding: 0.8rem 1.4rem;
  border-radius: 999px;
  font-size: 0.95rem;
  font-weight: 600;
  text-decoration: none;
  border: 2px solid transparent;
  cursor: pointer;
  transition:
    transform 0.15s ease,
    box-shadow 0.15s ease,
    background-color 0.15s ease,
    color 0.15s ease,
    border-color 0.15s ease;
}

/* Botón principal */
.course-hero-header__btn--primary {
  background-color: #1f62ff;  /* ajusta a tu color de marca */
  color: #ffffff;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.16);
}

/* Hover botón principal */
.course-hero-header__btn--primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.22);
}

/* Botón secundario */
.course-hero-header__btn--secondary {
  background-color: transparent;
  color: #ffffff;
  border-color: #ffffff;
}

/* Hover botón secundario */
.course-hero-header__btn--secondary:hover {
  background-color: #ffffff;
  color: #1f62ff;
}

/* Responsive para pantallas grandes */
@media (min-width: 900px) {
  .course-hero-header__title {
    font-size: 2.4rem;
  }

  .course-hero-header__subtitle {
    font-size: 1.05rem;
  }
}

/* Responsive para móviles */
@media (max-width: 600px) {
  .course-hero-header {
    align-items: flex-end; /* texto un poco más abajo en mobile si quieres */
  }

  .course-hero-header__content {
    margin-left: 1rem;
    margin-right: 1rem;
  }

  .course-hero-header__title {
    font-size: 1.7rem;
  }

  .course-hero-header__actions {
    flex-direction: column;
    align-items: flex-start;
  }
}


/* Contenedor de botones (se mantiene igual) */
.course-hero-header__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

/* Estilo base del botón */
.course-hero-header__btn {
  display: inline-block;
  padding: 0.8rem 1.4rem;
  border-radius: 999px;
  font-size: 0.95rem;
  font-weight: 600;
  text-decoration: none;
  border: 2px solid transparent;
  cursor: pointer;
  transition:
    transform 0.15s ease,
    box-shadow 0.15s ease,
    background-color 0.15s ease,
    color 0.15s ease,
    border-color 0.15s ease;
}

/* Botón gris con flecha */
.course-hero-header__btn--info {
  background-color: #e0e0e0;  /* gris claro */
  color: #333333;
  border-color: #c4c4c4;
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.12);
  position: relative;
}

/* Flecha al final del texto */
.course-hero-header__btn--info::after {
  content: "\2192"; /* flecha → */
  display: inline-block;
  margin-left: 0.5rem;
  transition: transform 0.15s ease;
}

/* Hover */
.course-hero-header__btn--info:hover {
  background-color: #d5d5d5;
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.18);
}

.course-hero-header__btn--info:hover::after {
  transform: translateX(3px);
}


/* Botón gris con flecha usando el color de la imagen */
.course-hero-header__btn--info {
  background-color: #DAE2ED;  /* gris/azulado igual al fondo de la imagen */
  color: #333333;
  border-color: #C2CFDF;
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.12);
  position: relative;
}

/* Flecha al final del texto */
.course-hero-header__btn--info::after {
  content: "\2192"; /* flecha → */
  display: inline-block;
  margin-left: 0.5rem;
  transition: transform 0.15s ease;
}

/* Hover */
.course-hero-header__btn--info:hover {
  background-color: #CCD8E6; /* un tono apenas más oscuro del mismo color */
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.18);
}

.course-hero-header__btn--info:hover::after {
  transform: translateX(3px);
}


.course-hero-header__title {
  position: relative;
  display: inline-block;          /* para que la barra se ajuste al ancho del texto */
  margin: 0 0 0.75rem;
  font-size: 2rem;
  line-height: 1.2;
  font-weight: 700;
  color: #ffffff;                 /* texto blanco sobre barra azul */
  z-index: 1;
}

/* Barra azul detrás del título */
.course-hero-header__title::before {
  content: "";
  position: absolute;
  inset: 0 -0.5rem;               /* un poco más ancho que el texto a los lados */
  background-color: #354BA0;      /* color solicitado */
  border-radius: 6px;
  z-index: -1;                    /* se coloca detrás del texto */
}


.course-hero-header__date {
  font-size: 0.9rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin: 0 0 1rem;
  color: #354BA0;   /* NUEVO color de texto */
}



/* Contenedor general del bloque Plan de Estudios */
.course-syllabus {
  margin-top: 2rem;
}

/* Título con barra debajo de color #354BA0 */
.course-syllabus__title {
  position: relative;
  display: inline-block;
  font-size: 1.4rem;
  font-weight: 700;
  margin: 0 0 1rem;
}

.course-syllabus__title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -0.4rem;
  width: 60%;
  max-width: 180px;
  height: 4px;
  background-color: #354BA0;
  border-radius: 999px;
}

/* Descripción breve debajo del título */
.course-syllabus__intro {
  margin: 0 0 1rem;
  font-size: 0.98rem;
  line-height: 1.5;
}

/* Lista de viñetas con color #354BA0 */
.course-syllabus__list {
  margin: 0 0 1.5rem 1.2rem;
  padding: 0;
  list-style: none;
}

.course-syllabus__list li {
  position: relative;
  margin-bottom: 0.45rem;
  padding-left: 1.2rem;
  font-size: 0.96rem;
}

/* Viñeta personalizada del color solicitado */
.course-syllabus__list li::before {
  content: "•";
  position: absolute;
  left: 0;
  top: 0;
  color: #354BA0;
  font-weight: 700;
}

/* Botón para descargar el plan de estudios */
.course-syllabus__btn {
  display: inline-block;
  padding: 0.75rem 1.6rem;
  border-radius: 999px;
  background-color: #D7E0EB;   /* color solicitado */
  color: #1b1b1b;
  text-decoration: none;
  font-weight: 600;
  font-size: 0.95rem;
  border: none;
  cursor: pointer;
  transition:
    background-color 0.15s ease,
    transform 0.15s ease,
    box-shadow 0.15s ease;
}

/* Hover del botón */
.course-syllabus__btn:hover {
  background-color: #c6d2e1;   /* un tono ligeramente más oscuro */
  transform: translateY(-1px);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.12);
}

/* Ajustes responsive suaves */
@media (max-width: 600px) {
  .course-syllabus__title {
    font-size: 1.25rem;
  }

  .course-syllabus__list {
    margin-left: 1rem;
  }
}

.course-syllabus__btn {
  display: inline-block;
  padding: 0.75rem 1.6rem;
  border-radius: 999px;
  background-color: #D7E0EB;   /* fondo */
  color: #1b1b1b;
  text-decoration: none;
  font-weight: 600;
  font-size: 0.95rem;
  border: 2px solid #354BA0;   /* ← línea/borde del color solicitado */
  cursor: pointer;
  transition:
    background-color 0.15s ease,
    transform 0.15s ease,
    box-shadow 0.15s ease,
    border-color 0.15s ease;
}

/* Hover del botón */
.course-syllabus__btn:hover {
  background-color: #c6d2e1;   /* un tono ligeramente más oscuro */
  border-color: #354BA0;       /* mantiene el borde azul */
  transform: translateY(-1px);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.12);
}



/* ===== LISTADO DE CURSOS CAE (página cursos.html) ===== */

.courses-list {
  padding: 3.5rem 0 4rem;
  background: transparent; /* sin gris claro; deja ver el fondo general de la página */
}

.courses-list__inner {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding-desktop);
}

.courses-list__header {
  text-align: center;
  max-width: 620px;
  margin: 0 auto 2.5rem;
}

.courses-list__title {
  font-size: 2rem;
  font-weight: 700;
  color: #111827;
}

.courses-list__subtitle {
  font-size: 0.98rem;
  color: #4b5563;
  margin-top: 0.75rem;
  line-height: 1.7;
}

/* Grid de tarjetas de cursos */
.courses-list__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 1.75rem;
}

/* Tarjeta de curso */
.courses-list__card {
  background-color: #ffffff;
  border-radius: 16px;
  padding: 1.25rem 1.25rem 1.5rem;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.06);
  display: flex;
  flex-direction: column;
  height: 100%;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.courses-list__card:hover {
  transform: translateY(-4px);
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.10);
}

/* Imagen del curso */
.courses-list__image-wrapper {
  border-radius: 12px;
  overflow: hidden;
  margin-bottom: 1rem;
}

.courses-list__image {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

/* Texto de la tarjeta */
.courses-list__name {
  font-size: 1.05rem;
  font-weight: 600;
  color: #111827;
  margin: 0 0 0.35rem;
}

.courses-list__price {
  font-size: 0.95rem;
  font-weight: 700;
  color: #0f766e;
  margin: 0 0 0.9rem;
}

/* Botón "Conocer más" pegado abajo de la card */
.courses-list__more {
  margin-top: auto;
}

/* Responsive para móviles */
@media (max-width: 900px) {
  .courses-list__inner {
    padding: 0 var(--container-padding-mobile);
  }

  .courses-list__title {
    font-size: 1.7rem;
  }
}


.about-v2,
.reasons,
.testimonials,
.courses {
  background: transparent;  /* deja ver el #D7E0EB del body-index */
}


/* Cards del index en blanco puro */
.about-v2__card,
.reasons__card,
.testimonials__item,
.courses__card {
  background: #ffffff;
}


/* === Sistema tipográfico: TÍTULOS en Montserrat Bold === */

h1,
h2,
h3,
h4,
h5,
h6,
.hero__title,
.courses-list__title,
.course-facts__title,
.about__title,
.about-v2__title,
.reasons__title,
.testimonials__title,
.courses__title,
.course-syllabus__title,
.scholarships__title,
.course-contact__title,
.courses-list__name,
.courses__card-title,
.reasons__card-title,
.about-v2__card-title {
  font-weight: 700; /* Bold */
}


/* === Sistema tipográfico: DESCRIPCIONES en Montserrat Regular === */

.hero__subtitle,
.courses-list__subtitle,
.course-facts__intro,
.course-facts__value,
.about__block-text,
.about-v2__intro,
.about-v2__card-text,
.reasons__subtitle,
.reasons__card-text,
.testimonials__subtitle,
.testimonials__text,
.courses__subtitle,
.course-syllabus__intro,
.course-syllabus__list li,
.scholarships__intro,
.scholarships__text,
.scholarships__list li {
  font-weight: 400; /* Regular */
}



/* ===== BOTÓN FLOTANTE WHATSAPP ===== */

.whatsapp-float {
  position: fixed;
  right: 18px;
  bottom: 18px;
  width: 54px;
  height: 54px;
  border-radius: 50%;
  background-color: #25D366;      /* verde clásico WhatsApp */
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.8rem;
  text-decoration: none;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.25);
  z-index: 1200;
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease,
    background-color 0.2s ease;
}

.whatsapp-float:hover {
  background-color: #1ebe5d;
  transform: translateY(-3px);
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.3);
}

.whatsapp-float i {
  line-height: 1;
}

/* Un poco más pequeño en pantallas muy chicas */
@media (max-width: 480px) {
  .whatsapp-float {
    right: 12px;
    bottom: 12px;
    width: 50px;
    height: 50px;
    font-size: 1.6rem;
  }
}



/* ===== BARRA DE COOKIES ===== */

.cookie-bar {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1300;
  background-color: #ffffff;
  box-shadow: 0 -6px 20px rgba(15, 23, 42, 0.26);
  border-top: 1px solid rgba(15, 23, 42, 0.08);
  padding: 0.9rem 0;
  font-size: 0.9rem;
  display: none; /* por defecto oculta; solo se muestra si no hay consentimiento */
}

.cookie-bar__inner {
  max-width: 1200px; /* puedes usar var(--container-max-width) si prefieres */
  margin: 0 auto;
  padding: 0 1.5rem;
  display: flex;
  align-items: center;
  gap: 1rem;
  justify-content: space-between;
  flex-wrap: wrap;
}

.cookie-bar__message {
  margin: 0;
  line-height: 1.5;
  color: #111827;
}

.cookie-bar__link {
  color: #354BA0;
  font-weight: 600;
  text-decoration: underline;
}

.cookie-bar__link:hover {
  text-decoration: none;
}

.cookie-bar__actions {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  flex-shrink: 0;
}

.cookie-bar__btn {
  font-family: inherit;
  font-size: 0.9rem;
  font-weight: 600;
  border-radius: 999px;
  padding: 0.45rem 1.4rem;
  border: 1.5px solid transparent;
  cursor: pointer;
  transition:
    background-color 0.2s ease,
    color 0.2s ease,
    border-color 0.2s ease,
    box-shadow 0.2s ease,
    transform 0.2s ease;
}

.cookie-bar__btn--accept {
  background-color: #7fd3e8;     /* tu color de botón primario */
  color: #111827;
  border-color: #7fd3e8;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.18);
}

.cookie-bar__btn--accept:hover {
  background-color: #a3e2f2;
  border-color: #a3e2f2;
  transform: translateY(-1px);
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.24);
}

/* Responsive: barra más compacta en móviles */
@media (max-width: 600px) {
  .cookie-bar__inner {
    align-items: flex-start;
    padding: 0 1rem;
  }

  .cookie-bar__actions {
    width: 100%;
    justify-content: flex-start;
  }

  .cookie-bar__btn--accept {
    width: auto;
  }
}