/*
Theme Name: RTVE Instituto
Author: RTVE / Javi
Version: 1.9.2
Description: Tema para plataforma de cursos tipo OTT con WooCommerce.
Text Domain: rtve-instituto
*/

@font-face {
  font-family: "RTVE Officina Serif Regular";
  src: url("fonts/itc-officina-serif-std-book.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "RTVE Officina Serif Bold";
  src: url("fonts/itc-officina-serif-std-bold.otf") format("opentype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  --rtve-black: #050505;
  --rtve-ink: #111520;
  --rtve-panel: #1c2230;
  --rtve-panel-soft: #252b39;
  --rtve-text: #ffffff;
  --rtve-muted: #c9ced8;
  --rtve-orange: #ff8700;
  --rtve-orange-deep: #e36800;
  --rtve-pink: #f51b63;
  --rtve-green: #79b493;
  --rtve-blue: #9fd4dc;
  --rtve-border: rgba(255, 255, 255, 0.2);
  --rtve-display: "RTVE Officina Sans Bold", "RTVE Officina Serif Bold", "ITC Officina RTVE", "Arial", sans-serif;
  --rtve-secondary: "RTVE Officina Sans Regular", "RTVE Officina Serif Regular", "Arial", sans-serif;
  --rtve-sans: "Roboto", Arial, Helvetica, sans-serif;
  color-scheme: dark;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 88px;
}

body {
  margin: 0;
  min-width: 320px;
  background: var(--rtve-black);
  color: var(--rtve-text);
  font-family: var(--rtve-sans);
  line-height: 1.5;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -2;
  background:
    radial-gradient(circle at 14% 26%, rgba(255, 135, 0, 0.06), transparent 25%),
    linear-gradient(180deg, #030407 0%, #111727 36%, #202532 80%, #08090c 100%);
}

a {
  color: inherit;
  text-decoration: none;
}

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

.screen-reader-text {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(5, 7, 13, 0.95);
  border-bottom: 1px solid rgba(255, 255, 255, 0.04);
  backdrop-filter: blur(14px);
}

.site-header__inner {
  display: flex;
  align-items: center;
  gap: 24px;
  width: min(100% - 48px, 1240px);
  min-height: 74px;
  margin: 0 auto;
}

/* La nav no crece, el search sí */
.site-header__inner .primary-nav { flex-shrink: 0; }
.site-header__inner .site-header__extras { flex-shrink: 0; margin-left: auto; }
.site-header__inner .brand { flex-shrink: 0; }
.site-header__inner .nav-toggle { flex-shrink: 0; }

/* Header extras: teléfono + CTA + logo RTVE */
.site-header__extras {
  display: flex;
  align-items: center;
  gap: 16px;
}
.site-header__phone {
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
.site-header__phone:hover { color: #F6A30B; }
.site-header__rtve-logo {
  color: #fff;
  text-decoration: none;
  font-size: 14px;
  display: flex;
  align-items: center;
  gap: 6px;
}
.elementor-element-rtve-home-hero {
  padding: 0 !important;
}
.site-header__rtve-logo img {
  height: 28px;
  width: auto;
}
.mobile-nav__rtve-link {
  display: flex;
  align-items: center;
  text-decoration: none;
  flex-shrink: 0;
}
.mobile-nav__rtve-link img {
  height: 20px;
  width: auto;
}
.site-header__inner .course-search {
  flex: 1 1 0;
  min-width: 0;
  max-width: 520px;
  margin-left: 0;
}

.brand {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
}

.brand__logo {
  display: block;
  width: 109px;
  height: 36px;
  object-fit: contain;
}

.primary-nav__list,
.footer-nav {
  display: flex;
  align-items: center;
  gap: 26px;
  padding: 0;
  margin: 0;
  list-style: none;
}

.primary-nav a {
  color: rgba(255, 255, 255, 0.86);
  font-size: 14px;
  font-weight: 700;
  transition: color 160ms ease;
}

.primary-nav a:hover,
.primary-nav a:focus-visible {
  color: #fff;
}

.course-search {
  position: relative;
}

.single-product .course-search {
  margin-top: 4px;
}

.course-search input[type="search"] {
  width: 100%;
  height: 40px;
  padding: 0 38px 0 16px;
  border: 2px solid rgba(255, 255, 255, 0.55);
  border-radius: 999px;
  outline: none;
  background: rgba(5, 6, 11, 0.85);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: -0.01em;
  transition: border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
}

.course-search input[type="search"]::placeholder {
  color: rgba(255, 255, 255, 0.9);
  opacity: 1;
  letter-spacing: -0.01em;
}

.course-search input[type="search"]:focus {
  border-color: var(--rtve-orange);
  background: rgba(8, 10, 16, 0.96);
  box-shadow: 0 0 0 4px rgba(255, 135, 0, 0.12);
}

@media (max-width: 1024px) {
  .course-search {
    display: none !important;
  }
}

.course-search__submit {
  position: absolute;
  top: 50%;
  right: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--rtve-orange);
  cursor: pointer;
  transform: translateY(-50%);
  transition: color 160ms ease;
}

.course-search__submit:hover {
  color: #fff;
}

.search-suggestions {
  position: absolute;
  top: calc(100% + 10px);
  left: 0;
  right: 0;
  display: none;
  max-height: 320px;
  overflow: auto;
  padding: 8px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 16px;
  background: rgba(8, 10, 16, 0.98);
  box-shadow: 0 24px 54px rgba(0, 0, 0, 0.48);
}

.search-suggestions.is-open {
  display: block;
}

.search-suggestions__item,
.search-suggestions__state {
  display: block;
  padding: 13px 14px;
  border-radius: 10px;
  color: #fff;
  font-size: 14px;
}

.search-suggestions__item:hover,
.search-suggestions__item:focus-visible,
.search-suggestions__item.is-active {
  background: rgba(255, 135, 0, 0.15);
}


.site-header__cta,
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 30px;
  border: 1px solid transparent;
  border-radius: 5px;
  font-size: 14px;
  font-weight: 800;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  transition: transform 160ms ease, filter 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.site-header__cta,
.button--primary {
  background: linear-gradient(270deg, #F6A30B 5.55%, #ED6E00 50%);
  color: #fff;
  border: none;
}

.site-header__cta:hover,
.button--primary:hover {
  filter: brightness(1.08);
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(237, 110, 0, 0.32);
}

.button--ghost {
  min-width: 142px;
  border-color: rgba(255, 255, 255, 0.8);
  background: rgba(0, 0, 0, 0.22);
  color: #fff;
}

.button--ghost:hover {
  border-color: var(--rtve-orange);
  background: rgba(255, 135, 0, 0.12);
  transform: translateY(-1px);
}

.hero {
  position: relative;
  min-height: 500px;
  overflow: hidden;
}

.hero::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 120px;
  background: linear-gradient(180deg, transparent, #121827 86%);
}

.hero-slider__track,
.hero-slide {
  position: absolute;
  inset: 0;
}

.hero-slide {
  z-index: 0;
  opacity: 0;
  visibility: hidden;
  background:
    linear-gradient(90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.74) 33%, rgba(0, 0, 0, 0.18) 64%, rgba(0, 0, 0, 0.36) 100%),
    var(--hero-image, linear-gradient(135deg, #0e1118 0%, #202838 42%, #0d0f15 100%));
  background-position: center;
  background-size: cover;
  transition: opacity 720ms ease, visibility 720ms ease;
}

.hero-slide.is-active {
  z-index: 1;
  opacity: 1;
  visibility: visible;
}

.hero-slide__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hero-slide__video--youtube {
  top: 50%;
  left: 50%;
  width: 100vw;
  height: 56.25vw;
  min-width: 177.78vh;
  min-height: 100%;
  border: 0;
  pointer-events: none;
  transform: translate(-50%, -50%);
}

.hero-slide::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(0, 0, 0, 0.92), rgba(0, 0, 0, 0.56) 42%, rgba(0, 0, 0, 0.24)),
    linear-gradient(180deg, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.34));
}

.hero__inner {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  width: min(100% - 48px, 1240px);
  min-height: 500px;
  margin: 0 auto;
  padding: 92px 0 92px;
}

.hero__content {
  max-width: 600px;
}

.hero h1 {
  max-width: 610px;
  margin: 0;
  font-family: var(--rtve-display);
  font-size: 38px;
  line-height: 1.23;
  letter-spacing: 0;
}

.hero p {
  max-width: 600px;
  margin: 27px 0 0;
  color: rgba(255, 255, 255, 0.86);
  font-family: var(--rtve-secondary);
  font-size: 17px;
  line-height: 1.9;
}

.hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  margin-top: 70px;
}

.hero__actions .button {
  min-width: 180px;
}

.hero__pager {
  position: absolute;
  z-index: 4;
  left: 50%;
  bottom: 22px;
  display: inline-flex;
  align-items: center;
  gap: 13px;
  color: #fff;
  font-size: 14px;
  font-weight: 800;
  transform: translateX(-50%);
}

.hero__pager span {
  width: auto;
  height: auto;
  border: 0;
}

.hero__arrow {
  position: relative;
  width: 22px;
  height: 22px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  opacity: 0.82;
  transition: opacity 160ms ease, transform 160ms ease;
}

.hero__arrow::before {
  content: "";
  position: absolute;
  top: 7px;
  width: 8px;
  height: 8px;
  border-top: 1px solid #fff;
  border-left: 1px solid #fff;
}

.hero__arrow--prev::before {
  left: 8px;
  transform: rotate(-45deg);
}

.hero__arrow--next::before {
  right: 8px;
  transform: rotate(135deg);
}

.hero__arrow:hover {
  opacity: 1;
  transform: translateY(-1px);
}

.hero__media-controls {
  position: absolute;
  right: max(24px, calc((100vw - 1240px) / 2));
  bottom: 28px;
  z-index: 4;
  display: flex;
  gap: 9px;
}

.hero__media-controls button {
  position: relative;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.55);
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.42);
  color: #fff;
  font-size: 0;
  cursor: pointer;
  transition: background 160ms ease, border-color 160ms ease, transform 160ms ease;
}

/* Pause icon — two bars */
[data-hero-toggle-play]::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 3px;
  height: 11px;
  transform: translate(-5px, -50%);
  background: #fff;
  border-radius: 1px;
  box-shadow: 7px 0 0 #fff;
}

/* Play icon — triangle (when paused) */
.hero-slider.is-paused [data-hero-toggle-play]::before {
  width: 0;
  height: 0;
  background: none;
  border-radius: 0;
  box-shadow: none;
  border-style: solid;
  border-width: 6px 0 6px 10px;
  border-color: transparent transparent transparent #fff;
  transform: translate(-4px, -50%);
}

/* Sound icon — note symbol ON */
[data-hero-toggle-sound]::before {
  content: "♪";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 14px;
  line-height: 1;
}

/* Muted — strike-through line */
[data-hero-toggle-sound].is-muted::before {
  content: "♪";
  text-decoration: line-through;
  opacity: 0.55;
}

.hero__media-controls button:hover {
  border-color: var(--rtve-orange);
  background: rgba(255, 135, 0, 0.16);
  transform: translateY(-1px);
}

.hero-slider:not(.has-video) .hero__media-controls {
  display: none;
}

.catalog-shell {
  position: relative;
  z-index: 2;
  padding: 0 0 88px;
  background:
    radial-gradient(circle at 22% 18%, rgba(90, 156, 126, 0.12), transparent 24%),
    radial-gradient(circle at 78% 12%, rgba(245, 27, 99, 0.1), transparent 22%),
    linear-gradient(180deg, #111827 0%, #202532 65%, #181d29 100%);
}

.catalog-shell::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.22;
  background-image:
    radial-gradient(rgba(255, 255, 255, 0.16) 1px, transparent 1px);
  background-size: 18px 18px;
}

.catalog-shell--plain {
  min-height: 40vh;
  padding-top: 48px;
}

.duration-nav,
.course-section {
  position: relative;
  z-index: 1;
  width: min(100% - 48px, 1240px);
  margin: 0 auto;
}

.duration-nav {
  display: grid;
  grid-template-columns: repeat(3, minmax(160px, 1fr));
  gap: 34px;
  margin-bottom: 48px;
}

.duration-nav__item {
  display: grid;
  place-items: center;
  min-height: 70px;
  border-radius: 8px;
  color: #fff;
  font-size: 24px;
  font-weight: 800;
  box-shadow: 0 18px 36px rgba(0, 0, 0, 0.28);
  transition: transform 180ms ease, box-shadow 180ms ease, filter 180ms ease, border 180ms ease;
  cursor: pointer;
  border: none !important;
}

.duration-nav__item--1 {
  background: linear-gradient(160deg, rgba(30, 53, 61, 0.92), var(--rtve-green));
}

.duration-nav__item--2 {
  background: linear-gradient(160deg, rgba(28, 23, 45, 0.96), var(--rtve-pink));
}

.duration-nav__item--3 {
  background: linear-gradient(160deg, rgba(31, 43, 57, 0.96), var(--rtve-blue));
}

.duration-nav__item:hover,
.duration-nav__item:focus-visible {
  filter: saturate(1.14);
  transform: translateY(-3px);
  box-shadow: 0 24px 42px rgba(0, 0, 0, 0.34);
  border: 2px solid rgba(255, 255, 255, 0.5) !important;
}

.duration-nav__item.is-active {
  border: none !important;
}

.course-section {
  margin-top: 56px;
  scroll-margin-top: 96px;
}

.section-heading {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 38px;
}

.section-heading h1,
.section-heading h2 {
  position: relative;
  flex: 1;
  min-width: 0;
  margin: 0;
  padding-left: 20px;
  font-family: var(--rtve-display);
  font-size: 28px;
  line-height: 1.2;
  font-weight: 700;
}

.section-heading h1::before,
.section-heading h2::before {
  content: "";
  position: absolute;
  left: 0;
  top: 3px;
  bottom: 3px;
  width: 4px;
  border-radius: 99px;
  background: var(--rtve-orange);
}

.section-heading a {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  gap: 6px;
  color: rgba(255, 255, 255, 0.78);
  font-size: 14px;
  font-weight: 800;
  white-space: nowrap;
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color 160ms ease, transform 160ms ease;
}

.section-heading a::after {
  content: "";
  width: 7px;
  height: 7px;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
  transform: rotate(45deg);
}

.section-heading a:hover {
  color: #fff;
  transform: translateX(2px);
}

/* Variante: enlace pegado al título (añadir esta clase al section-heading para activarlo) */
.section-heading--inline-link {
  justify-content: flex-start;
}
.section-heading--inline-link h1,
.section-heading--inline-link h2 {
  flex: 0 0 auto;
}

.course-rail {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(310px, 342px);
  gap: 18px;
  overflow-x: auto;
  overflow-y: visible;
  padding: 0 2px 20px;
  margin: 0 -2px;
  scrollbar-color: rgba(255, 255, 255, 0.28) transparent;
}

.course-rail--wrap {
  grid-auto-flow: row;
  grid-template-columns: repeat(auto-fill, minmax(310px, 1fr));
  overflow: visible;
}

.course-card {
  min-width: 0;
  border-radius: 8px;
}

.course-card__link {
  position: relative;
  display: block;
  min-height: 206px;
  overflow: hidden;
  border-radius: 8px;
  background: #111;
  box-shadow: 0 18px 34px rgba(0, 0, 0, 0.35);
  isolation: isolate;
  transition: transform 180ms ease, box-shadow 180ms ease;
}

.course-card__link::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.72);
  z-index: 0;
}

/* ── Overlay de color por duración ───────────────────────────────────────── */
.course-card__link::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  opacity: 0;
  transition: opacity 180ms ease;
}

/* 25 horas — verde desde esquina inferior derecha */
.course-card--25h .course-card__link::after {
  background: radial-gradient(ellipse at 85% 95%, rgba(121, 180, 147, 0.85) 0%, rgba(121, 180, 147, 0.3) 40%, black 95%);
  opacity: 1;
}
.course-card--25h .course-card__badge { background: #79b493; }

/* 75 horas — rosa desde esquina inferior derecha */
.course-card--75h .course-card__link::after {
  background: radial-gradient(ellipse at 85% 95%, rgba(235, 31, 88, 0.85) 0%, rgba(235, 31, 88, 0.6) 40%, black 85%);
  opacity: 1;
}
.course-card--75h .course-card__badge { background: #eb1f58; }

/* 100 horas — azul claro desde esquina inferior derecha */
.course-card--100h .course-card__link::after {
  background: radial-gradient(ellipse at 85% 95%, rgb(144 199 209 / 95%) 0%, rgb(52 102 111 / 40%) 35%);
  opacity: 1;
  z-index: 1;
}
.course-card--100h .course-card__badge { background: #6aadb8; }

/* Compatibilidad con slugs antiguos */
.course-card--50h .course-card__link::after {
  background: radial-gradient(ellipse at 85% 95%, rgba(235, 31, 88, 0.85) 0%, rgba(235, 31, 88, 0.3) 40%, transparent 65%);
  opacity: 1;
}
.course-card--50h  .course-card__badge { background: #eb1f58; }
.course-card--100h .course-card__link::after {
  background: radial-gradient(ellipse at 85% 95%, rgb(144 199 209 / 95%) 0%, rgb(52 102 111 / 40%) 35%);
  opacity: 1;
  z-index: 1;
}
.course-card--100h .course-card__badge { background: #6aadb8; }

.course-card__link:hover,
.course-card__link:focus-visible {
  transform: translateY(-4px);
  box-shadow: 0 26px 42px rgba(0, 0, 0, 0.42);
}

.course-card__link:hover .course-card__image {
  transform: scale(1.055);
}

.course-card__image {
  display: block;
  position: absolute;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  object-position: center;
  background-size: cover;
  background-position: center;
  z-index: 0;
  transition: transform 220ms ease;
}

.course-card__image--placeholder {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background:
    linear-gradient(130deg, rgba(255, 135, 0, 0.14), transparent 32%),
    linear-gradient(160deg, #242b37, #0f131d);
}

.course-card__badge {
  position: absolute;
  top: 14px;
  left: 14px;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  min-height: 21px;
  padding: 0 10px;
  border-radius: 2px;
  background: #eb1f58;
  color: #fff;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}


.course-card__play {
  position: absolute;
  right: 16px;
  top: 50%;
  z-index: 3;
  width: 28px;
  height: 28px;
  transform: translateY(-50%);
  transition: transform 160ms ease, opacity 160ms ease;
  opacity: 0.82;
}

/* Flecha simple → usando dos bordes rotados */
.course-card__play::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 11px;
  height: 11px;
  border-top: 2.5px solid #fff;
  border-right: 2.5px solid #fff;
  transform: translate(-65%, -50%) rotate(45deg);
}

.course-card__link:hover .course-card__play {
  opacity: 1;
  transform: translateY(-50%) translateX(3px);
}

.course-card__content {
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: 17px;
  z-index: 3;
}

.course-card__kicker {
  margin: 0 0 5px;
  color: rgba(255, 255, 255, 0.82);
  font-size: 11px;
  font-weight: 800;
  line-height: 1.2;
  text-transform: uppercase;
}

.course-card__title {
  display: -webkit-box;
  margin: 0;
  overflow: hidden;
  color: #fff;
  font-family: var(--rtve-display);
  font-size: 18px;
  line-height: 1.25;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.course-card__meta {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
}

.course-card__duration { display: none; } /* la duración ya va en el badge arriba */

.course-card__modality {
  padding: 2px 8px;
  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: 3px;
  color: rgba(255, 255, 255, 0.82);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.course-card__price {
  border-top: none !important;
  text-decoration: none !important;
  display: flex;
  align-items: center;
  gap: 8px;
  color: #fff;
  font-size: 24px;
  font-weight: 700;
  line-height: 1.1;
  padding-top: 8px;
  border-top: 1px solid rgba(255,255,255,.15);
  margin-top: 4px;
}

.course-card__price del {
  text-decoration: line-through;
  color: rgba(255, 255, 255, 0.45);
  font-size: 12px;
  font-weight: 400;
}

.course-card__price del,
.course-card__price del * {
  color: #979797 !important;
}

.course-card__price ins {
  text-decoration: none !important;
}

.rtve-empty {
  max-width: 720px;
  margin: 0;
  color: var(--rtve-muted);
}

.site-footer {
  background: #030303;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.site-footer__inner {
  position: relative;
  display: grid;
  grid-template-columns: 240px 1fr auto;
  align-items: end;
  gap: 40px;
  width: min(100% - 48px, 1240px);
  min-height: 188px;
  margin: 0 auto;
  padding: 48px 0 52px;
}

.site-footer__brand {
  display: grid;
  gap: 30px;
}

.social-nav {
  display: flex;
  align-items: center;
  gap: 20px;
}

.social-nav a {
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255, 255, 255, 0.85);
  transition: color 160ms ease, transform 160ms ease;
}

.social-nav a:hover {
  color: #fff;
  transform: translateY(-2px);
}

.site-footer__legal {
  display: flex;
  flex-wrap: wrap;
  justify-content: end;
  gap: 14px;
  color: rgba(255, 255, 255, 0.72);
  font-size: 13px;
}

.footer-nav {
  gap: 0;
}

.footer-nav li {
  display: inline-flex;
  align-items: center;
}

.footer-nav li + li::before {
  content: "";
  width: 1px;
  height: 13px;
  margin: 0 13px;
  background: rgba(255, 255, 255, 0.6);
}

.footer-nav a:hover {
  color: #fff;
}

.to-top {
  position: relative;
  width: 34px;
  height: 34px;
  margin-left: auto !important;
}

.to-top::before {
  content: "";
  position: absolute;
  left: 11px;
  top: 14px;
  width: 11px;
  height: 11px;
  border-top: 2px solid #fff;
  border-left: 2px solid #fff;
  transform: rotate(45deg);
}

.to-top:hover::before {
  border-color: var(--rtve-orange);
}

/* ── Hamburger button ─────────────────────────────────────────────────────── */
.nav-toggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: 38px;
  height: 38px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  z-index: 60;
}

.nav-toggle__bar {
  display: block;
  width: 22px;
  height: 2px;
  background: #fff;
  border-radius: 2px;
  transition: transform 220ms ease, opacity 160ms ease, width 160ms ease;
  transform-origin: center;
}

.nav-toggle[aria-expanded="true"] .nav-toggle__bar:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}

.nav-toggle[aria-expanded="true"] .nav-toggle__bar:nth-child(2) {
  opacity: 0;
  transform: scaleX(0);
}

.nav-toggle[aria-expanded="true"] .nav-toggle__bar:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}

/* ── Mobile nav panel ─────────────────────────────────────────────────────── */
.mobile-nav {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 55;
  width: 100% !important;
  max-width: 100% !important;
  display: flex;
  flex-direction: column;
  background: rgba(12, 15, 22, 0.98);
  backdrop-filter: blur(20px);
  border-left: 1px solid rgba(255, 255, 255, 0.07);
  transform: translateX(100%);
  transition: transform 280ms cubic-bezier(0.4, 0, 0.2, 1);
  overflow-y: auto;
  overflow-x: hidden;
}

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

.mobile-nav__search {
  padding: 16px;
  border-bottom: 1px solid rgba(255,255,255,0.1);
  margin-bottom: 8px;
}
.mobile-nav__search-wrap {
  position: relative;
  display: flex;
  align-items: center;
}
.mobile-nav__search-input {
  width: 100%;
  height: 40px;
  padding: 0 44px 0 16px;
  border: 2px solid rgba(255, 255, 255, 0.55);
  border-radius: 999px;
  outline: none;
  background: rgba(5, 6, 11, 0.5);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: -0.01em;
  transition: border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
}
.mobile-nav__search-input::placeholder {
  color: rgba(255, 255, 255, 0.9);
  opacity: 1;
  letter-spacing: -0.01em;
}
.mobile-nav__search-input:focus {
  border-color: var(--rtve-orange);
  background: rgba(8, 10, 16, 0.96);
  box-shadow: 0 0 0 4px rgba(255, 135, 0, 0.12);
}
.mobile-nav__search-btn {
  position: absolute;
  right: 12px;
  background: none;
  border: none;
  cursor: pointer;
  color: rgba(255,255,255,0.7);
  display: flex;
  align-items: center;
  padding: 0;
}
.mobile-nav__search-btn:hover {
  color: #F6A30B;
}

.mobile-nav__inner {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 96px 0 48px;
  min-height: 100%;
}

.mobile-nav__list {
  transition: opacity 0.2s ease;
  display: flex;
  flex-direction: column;
  padding: 0;
  margin: 0;
  list-style: none;
}

.mobile-nav__list li a {
  display: block;
  padding: 15px 28px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  color: rgba(255, 255, 255, 0.9);
  font-size: 16px;
  font-weight: 700;
  transition: color 140ms ease, background 140ms ease;
}

.mobile-nav__list li a:hover,
.mobile-nav__list li a:focus-visible {
  color: #fff;
  background: rgba(255, 135, 0, 0.08);
}

.mobile-nav__list li:first-child a {
  border-top: 1px solid rgba(255, 255, 255, 0.05);
}

.mobile-nav__footer {
  margin-top: auto;
  padding: 28px 28px 0;
}

.mobile-nav__footer .button {
  width: 100%;
}

.mobile-nav.is-open:has(.search-suggestions.is-open) .mobile-nav__list,
.mobile-nav.is-open:has(.search-suggestions.is-open) .mobile-nav__footer,
.mobile-nav.is-searching .mobile-nav__list,
.mobile-nav.is-searching .mobile-nav__footer {
  opacity: 0.15;
  pointer-events: none;
}

.mobile-nav__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 28px;
}
.mobile-nav__close {
  display: flex;
  align-items: center;
  background: none;
  border: none;
  color: #fff;
  cursor: pointer;
  padding: 0;
}
.mobile-nav__close:hover {
  color: #F6A30B;
}


.mobile-nav__overlay {
  position: fixed;
  inset: 0;
  z-index: 54;
  background: rgba(0, 0, 0, 0.62);
  opacity: 0;
  pointer-events: none;
  transition: opacity 280ms ease;
}

.mobile-nav__overlay.is-visible {
  opacity: 1;
  pointer-events: auto;
}

@media (max-width: 1060px) {
  .site-header__inner {
    grid-template-columns: auto 1fr auto auto;
    gap: 18px;
    padding: 14px 0;
    justify-content: space-between;
  }

  .nav-toggle {
    display: flex;
    order: 4;
  }

  .primary-nav {
    display: none !important;
  }

  .course-search {
    display: none !important;
  }

  .site-header__extras {
    order: 3;
    gap: 12px;
  }
  .site-header__rtve-logo {
    display: none;
  }

.duration-nav {
    gap: 18px;
  }

  .site-footer__inner {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .site-footer__legal {
    justify-content: flex-start;
  }
}

@media (max-width: 760px) {
  .site-header__inner,
  .hero__inner,
  .duration-nav,
  .course-section,
  .site-footer__inner {
    width: min(100% - 32px, 1240px);
  }

  .site-header__inner {
    grid-template-columns: 1fr auto auto;
  }

  .course-search {
    grid-column: 1 / -1;
    order: 3;
  }

  .site-header__cta {
    min-height: 38px;
    padding: 0 18px;
    font-size: 12px;
  }

  .hero,
  .hero__inner {
    min-height: 520px;
  }

  .hero__inner {
    align-items: flex-end;
    padding-bottom: 92px;
  }

  .hero h1 {
    font-size: 32px;
  }

  .hero p {
    margin-top: 18px;
    font-size: 15px;
    line-height: 1.7;
  }

  .hero__actions {
    margin-top: 34px;
  }

  .duration-nav {
    grid-template-columns: 1fr;
    margin-top: -14px;
  }

  .duration-nav__item {
    min-height: 60px;
    font-size: 20px;
  }

  .section-heading {
    align-items: center;
    gap: 14px;
    margin-bottom: 24px;
  }

  .section-heading h1,
  .section-heading h2 {
    font-size: 22px;
  }

  .section-heading a {
    font-size: 12px;
  }

  .course-rail {
    grid-auto-columns: minmax(265px, 84vw);
  }

  .site-footer__inner {
    min-height: 0;
    padding: 40px 0;
  }

  .site-footer__legal {
    display: grid;
  }

  .footer-nav {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }

  .footer-nav li + li::before {
    display: none;
  }
}

/* Course carousel widget — iguala ancho con .catalog-shell de /tienda/ */
.elementor-widget-rtve_course_carousel .elementor-widget-container {
  width: min(100% - 48px, 1240px);
  max-width: 1240px;
  margin: 0 auto;
}

/* catalog-shell applied as Elementor section CSS class */
.elementor-section.catalog-shell,
.e-container.catalog-shell,
.e-con.catalog-shell {
  position: relative;
  z-index: 2;
  padding-top: 46px;
  padding-bottom: 88px;
  background:
    radial-gradient(circle at 22% 18%, rgba(90, 156, 126, 0.12), transparent 24%),
    radial-gradient(circle at 78% 12%, rgba(245, 27, 99, 0.1), transparent 22%),
    linear-gradient(180deg, #111827 0%, #202532 65%, #181d29 100%);
}

.elementor-section.catalog-shell::before,
.e-container.catalog-shell::before,
.e-con.catalog-shell::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.22;
  background-image: radial-gradient(rgba(255, 255, 255, 0.16) 1px, transparent 1px);
  background-size: 18px 18px;
}

/* Grab cursor for draggable carousels */
.course-rail:not(.course-rail--wrap) {
  cursor: grab;
}

.course-rail:not(.course-rail--wrap):active {
  cursor: grabbing;
}

/* ── Carousel fade edges ──────────────────────────────────────────────────── */
/*
  Estados gestionados por JS (initCarouselFade):
    por defecto        → degradado derecho (hay más contenido)
    .is-scrolled       → degradado izquierdo + derecho
    .is-at-end         → solo degradado izquierdo
    .is-at-start + .is-at-end  → sin máscara (todo visible)
*/
.course-rail:not(.course-rail--wrap) {
  -webkit-mask-image: linear-gradient(
    to right,
    black 0%,
    black calc(100% - 96px),
    transparent 100%
  );
  mask-image: linear-gradient(
    to right,
    black 0%,
    black calc(100% - 96px),
    transparent 100%
  );
  transition: mask-image 240ms ease, -webkit-mask-image 240ms ease;
}

.course-rail:not(.course-rail--wrap).is-scrolled {
  -webkit-mask-image: linear-gradient(
    to right,
    transparent 0%,
    black 72px,
    black calc(100% - 96px),
    transparent 100%
  );
  mask-image: linear-gradient(
    to right,
    transparent 0%,
    black 72px,
    black calc(100% - 96px),
    transparent 100%
  );
}

.course-rail:not(.course-rail--wrap).is-at-end {
  -webkit-mask-image: linear-gradient(
    to right,
    transparent 0%,
    black 72px,
    black 100%
  );
  mask-image: linear-gradient(
    to right,
    transparent 0%,
    black 72px,
    black 100%
  );
}

/* Nada que ocultar: todo el contenido es visible */
.course-rail:not(.course-rail--wrap).is-at-start.is-at-end {
  -webkit-mask-image: none;
  mask-image: none;
}

/* ═══════════════════════════════════════════════════════════════════════════
   WooCommerce — dark-theme overrides
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Page wrappers ─────────────────────────────────────────────────────────── */
.woocommerce,
.woocommerce-page {
  background: transparent;
  color: var(--rtve-text);
}

.woocommerce-page .site-main,
.woocommerce-page .entry-content {
  background: transparent;
}

/* ── Breadcrumb ─────────────────────────────────────────────────────────── */
.woocommerce .woocommerce-breadcrumb {
  color: rgba(255, 255, 255, 0.55);
  font-size: 13px;
}

.woocommerce .woocommerce-breadcrumb a {
  color: rgba(255, 255, 255, 0.55);
}

.woocommerce .woocommerce-breadcrumb a:hover {
  color: var(--rtve-orange);
}

/* ── Notices ────────────────────────────────────────────────────────────── */
.woocommerce-info,
.woocommerce-message,
.woocommerce-error {
  border-top-color: var(--rtve-orange) !important;
  background: var(--rtve-panel) !important;
  color: var(--rtve-text) !important;
}

.woocommerce-info a,
.woocommerce-message a,
.woocommerce-error a {
  color: var(--rtve-orange);
}

/* ── Archive / shop grid ─────────────────────────────────────────────────── */
.woocommerce ul.products {
  margin: 0 !important;
}

.woocommerce ul.products li.product {
  background: transparent !important;
}

.woocommerce ul.products li.product a {
  color: var(--rtve-text);
}

.woocommerce ul.products li.product .price {
  color: var(--rtve-orange);
}

.woocommerce ul.products li.product del {
  color: rgba(255, 255, 255, 0.42);
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
  color: #fff;
  font-family: var(--rtve-display);
  font-size: 17px;
}

.woocommerce .woocommerce-ordering select {
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 6px;
  background: var(--rtve-panel);
  color: #fff;
  padding: 8px 12px;
}

/* ── Single product page ─────────────────────────────────────────────────── */
.wc-page-wrapper {
  width: min(100% - 48px, 1240px);
  margin: 0 auto;
  padding: 64px 0 88px;
}

.single-product .site-main {
  padding: 0;
  background:
    radial-gradient(circle at 22% 18%, rgba(90, 156, 126, 0.09), transparent 24%),
    radial-gradient(circle at 78% 12%, rgba(245, 27, 99, 0.07), transparent 22%),
    linear-gradient(180deg, #111827 0%, #202532 65%, #181d29 100%);
}

.single-product div.product {
  color: var(--rtve-text);
}

.single-product div.product {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  grid-template-rows: auto;
  gap: 56px;
  align-items: start;
}

.single-product div.product .woocommerce-product-gallery {
  grid-column: 1;
}

.single-product div.product .entry-summary {
  grid-column: 2;
}

.single-product div.product .woocommerce-product-gallery::before,
.single-product div.product .woocommerce-product-gallery::after {
  display: none;
}

.single-product div.product .woocommerce-product-gallery__image img {
  border-radius: 12px;
  box-shadow: 0 28px 56px rgba(0, 0, 0, 0.42);
}

.single-product .entry-summary {
  padding: 0;
}

.single-product .entry-summary h1.product_title {
  margin: 0 0 18px;
  color: #fff;
  font-family: var(--rtve-display);
  font-size: 32px;
  line-height: 1.2;
}

.single-product .entry-summary .woocommerce-product-details__short-description {
  color: rgba(255, 255, 255, 0.8);
  font-size: 16px;
  line-height: 1.8;
  margin-bottom: 24px;
}

.single-product .entry-summary p.price,
.single-product .entry-summary span.price {
  color: var(--rtve-orange);
  font-size: 28px;
  font-weight: 800;
}

.single-product .entry-summary p.price del,
.single-product .entry-summary span.price del {
  color: rgba(255, 255, 255, 0.42);
  font-size: 18px;
}

.single-product .entry-summary .cart {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px;
  margin-top: 32px;
}

.single-product .entry-summary .qty {
  width: 64px;
  height: 48px;
  padding: 0 12px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 6px;
  background: var(--rtve-panel);
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  text-align: center;
}

.single-product .entry-summary .single_add_to_cart_button {
  flex: 1;
  min-height: 52px;
  padding: 0 36px;
  border: 0;
  border-radius: 6px;
  background: linear-gradient(270deg, #F6A30B 5.55%, #ED6E00 50%);
  color: #fff;
  font-size: 15px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  cursor: pointer;
  transition: filter 160ms ease, transform 160ms ease, box-shadow 160ms ease;
}

.single-product .entry-summary .single_add_to_cart_button:hover {
  filter: brightness(1.08);
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(237, 110, 0, 0.32);
}

.single-product .woocommerce-tabs {
  margin: 56px 0 0;
}

.single-product .woocommerce-tabs ul.tabs {
  border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
  padding: 0 !important;
  margin: 0 0 32px !important;
  list-style: none !important;
  display: flex;
  gap: 4px;
}

.single-product .woocommerce-tabs ul.tabs li {
  border: 0 !important;
  background: transparent !important;
  border-radius: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.single-product .woocommerce-tabs ul.tabs li::before,
.single-product .woocommerce-tabs ul.tabs li::after {
  display: none !important;
}

.single-product .woocommerce-tabs ul.tabs li a {
  display: block;
  padding: 10px 20px;
  border-bottom: 2px solid transparent;
  color: rgba(255, 255, 255, 0.62);
  font-size: 14px;
  font-weight: 700;
  transition: color 140ms ease, border-color 140ms ease;
}

.single-product .woocommerce-tabs ul.tabs li.active a {
  border-bottom-color: var(--rtve-orange);
  color: #fff;
}

.single-product .woocommerce-tabs ul.tabs li a:hover {
  color: #fff;
}

.single-product .woocommerce-tabs .panel {
  color: rgba(255, 255, 255, 0.82);
  font-size: 15px;
  line-height: 1.8;
}

.single-product .woocommerce-tabs .panel h2 {
  color: #fff;
  font-family: var(--rtve-display);
  font-size: 22px;
  margin-bottom: 16px;
}

/* Related products */
.single-product .related.products,
.single-product .upsells.products {
  margin: 56px 0 0;
}

.single-product .related > h2,
.single-product .upsells > h2 {
  padding-left: 20px;
  margin-bottom: 28px;
  font-family: var(--rtve-display);
  font-size: 24px;
  color: #fff;
  border-left: 4px solid var(--rtve-orange);
}

/* ── Cart & Checkout ────────────────────────────────────────────────────── */
.woocommerce table.shop_table {
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: 10px;
  overflow: hidden;
  background: var(--rtve-panel) !important;
  color: var(--rtve-text) !important;
}

.woocommerce table.shop_table thead th {
  border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
  background: rgba(0, 0, 0, 0.24) !important;
  color: rgba(255, 255, 255, 0.7) !important;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.woocommerce table.shop_table td {
  border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
  color: var(--rtve-text) !important;
  background: transparent !important;
}

.woocommerce table.shop_table .cart_item a {
  color: rgba(255, 255, 255, 0.9);
  font-weight: 600;
}

.woocommerce table.shop_table .cart_item a:hover {
  color: var(--rtve-orange);
}

.woocommerce .cart-subtotal th,
.woocommerce .cart-subtotal td,
.woocommerce .order-total th,
.woocommerce .order-total td {
  color: #fff !important;
}

.woocommerce .order-total .amount {
  color: var(--rtve-orange) !important;
  font-size: 20px !important;
  font-weight: 800 !important;
}

.woocommerce:not(.single-product) #coupon_code,
.woocommerce:not(.single-product) .input-text,
.woocommerce:not(.single-product) input[type="text"],
.woocommerce:not(.single-product) input[type="email"],
.woocommerce:not(.single-product) input[type="tel"],
.woocommerce:not(.single-product) input[type="password"],
.woocommerce:not(.single-product) input[type="number"],
.woocommerce:not(.single-product) textarea,
.woocommerce:not(.single-product) select {
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  border-radius: 6px !important;
  background: var(--rtve-panel) !important;
  color: #fff !important;
  padding: 12px 16px !important;
  font-size: 14px;
  transition: border-color 160ms ease, box-shadow 160ms ease;
}

/* Excepción: página de contacto (Elementor + CF7) — inputs claros */
.page-id-107 input[type="text"],
.page-id-107 input[type="email"],
.page-id-107 input[type="tel"],
.page-id-107 input[type="number"],
.page-id-107 textarea,
.page-id-107 select {
  background: #f2f2f2 !important;
  color: #474747 !important;
  border: 1px solid #ddd !important;
  padding: 10px 14px !important;
}

/* Excepción: formulario de contacto de producto —
   padding compacto para no inflar los inputs */
#prd-contacto .wpcf7-form input[type="text"],
#prd-contacto .wpcf7-form input[type="email"],
#prd-contacto .wpcf7-form input[type="tel"],
#prd-contacto .wpcf7-form textarea {
  padding: 4px 10px !important;
  font-size: 13px !important;
}

#prd-contacto .wpcf7-form input[type="text"],
#prd-contacto .wpcf7-form input[type="email"],
#prd-contacto .wpcf7-form input[type="tel"] {
  height: 32px !important;
  line-height: 32px !important;
}

#prd-contacto .wpcf7-form textarea {
  height: 70px !important;
  line-height: 1.4 !important;
  resize: vertical !important;
}

.woocommerce #coupon_code:focus,
.woocommerce .input-text:focus,
.woocommerce input[type="text"]:focus,
.woocommerce input[type="email"]:focus,
.woocommerce input[type="tel"]:focus,
.woocommerce input[type="password"]:focus,
.woocommerce input[type="number"]:focus,
.woocommerce textarea:focus,
.woocommerce select:focus {
  border-color: var(--rtve-orange) !important;
  box-shadow: 0 0 0 3px rgba(255, 135, 0, 0.14) !important;
  outline: none !important;
}

.woocommerce label {
  color: rgba(255, 255, 255, 0.75) !important;
  font-size: 13px;
  font-weight: 600;
}

.woocommerce .woocommerce-checkout #payment {
  border-radius: 10px;
  background: var(--rtve-panel) !important;
}

.woocommerce .woocommerce-checkout #payment ul.payment_methods {
  border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.woocommerce .woocommerce-checkout #payment ul.payment_methods li label {
  color: #fff !important;
  font-size: 14px;
  font-weight: 600;
}

.woocommerce .woocommerce-checkout #payment div.payment_box {
  background: rgba(0, 0, 0, 0.24) !important;
  color: rgba(255, 255, 255, 0.7) !important;
}

.woocommerce .woocommerce-checkout #payment div.payment_box::before {
  border-bottom-color: rgba(0, 0, 0, 0.24) !important;
}

/* Buttons */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 0 28px;
  border: 0 !important;
  border-radius: 6px !important;
  background: linear-gradient(270deg, #F6A30B 5.55%, #ED6E00 50%) !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  cursor: pointer;
  transition: filter 160ms ease, transform 160ms ease, box-shadow 160ms ease;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover {
  filter: brightness(1.08) !important;
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(237, 110, 0, 0.28);
}

.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
  background: linear-gradient(270deg, #F6A30B 5.55%, #ED6E00 50%) !important;
}

/* ── My Account ─────────────────────────────────────────────────────────── */
.woocommerce-account .site-main {
  padding: 0;
}

.woocommerce-account .woocommerce {
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 48px;
  align-items: start;
}

.woocommerce-account .woocommerce-MyAccount-navigation {
  position: sticky;
  top: 96px;
}

.woocommerce-account .woocommerce-MyAccount-content {
  color: rgba(255, 255, 255, 0.85);
  font-size: 15px;
  line-height: 1.7;
}

.woocommerce-account .woocommerce-MyAccount-content h2,
.woocommerce-account .woocommerce-MyAccount-content h3 {
  color: #fff;
  font-family: var(--rtve-display);
}

.woocommerce-MyAccount-navigation ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.woocommerce-MyAccount-navigation li a {
  display: block;
  padding: 11px 18px;
  border-radius: 7px;
  color: rgba(255, 255, 255, 0.8);
  font-size: 14px;
  font-weight: 600;
  transition: background 140ms ease, color 140ms ease;
}

.woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-MyAccount-navigation li a:hover {
  background: rgba(255, 135, 0, 0.12);
  color: #fff;
}

@media (max-width: 760px) {
  .single-product div.product {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .single-product div.product .woocommerce-product-gallery,
  .single-product div.product .entry-summary {
    grid-column: 1;
  }

  .wc-page-wrapper {
    width: min(100% - 32px, 1240px);
  }

  .woocommerce-account .woocommerce {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 480px) {
  .site-header__cta {
    display: none;
  }

  .site-header__inner {
    grid-template-columns: 1fr auto;
  }
}

@media (max-width: 430px) {
  .site-header__inner {
    width: min(100% - 24px, 1240px);
  }


  .hero h1 {
    font-size: 28px;
  }

  .hero__actions .button {
    width: 100%;
  }
}

/* ═══════════════════════════════════════════════════════════════════════════
   TAXONOMY HERO — Archivos de duración (/duracion/25h/ etc.)
   ═══════════════════════════════════════════════════════════════════════════ */

.taxonomy-hero {
  position: relative;
  overflow: hidden;
  padding: 112px 0 64px; /* top compensates for fixed header */
  background: linear-gradient(160deg, #111827 0%, #181d29 100%);
}

/* Dot-grid texture */
.taxonomy-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  opacity: 0.16;
  background-image: radial-gradient(rgba(255, 255, 255, 0.18) 1px, transparent 1px);
  background-size: 18px 18px;
}

/* Color scrim — populated per-duration below */
.taxonomy-hero__scrim {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}

/* Duration colour tints */
.taxonomy-hero[data-duration="25h"]  .taxonomy-hero__scrim {
  background: radial-gradient(ellipse at 80% 40%, rgba(111, 172, 136, 0.30) 0%, transparent 58%);
}
.taxonomy-hero[data-duration="75h"]  .taxonomy-hero__scrim {
  background: radial-gradient(ellipse at 80% 40%, rgba(242, 29, 107, 0.25) 0%, transparent 58%);
}
.taxonomy-hero[data-duration="100h"] .taxonomy-hero__scrim {
  background: radial-gradient(ellipse at 80% 40%, rgba(127, 179, 190, 0.28) 0%, transparent 58%);
}

.taxonomy-hero__inner {
  position: relative;
  z-index: 1;
  width: min(100% - 48px, 1240px);
  margin: 0 auto;
}

.taxonomy-hero__breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 24px;
  color: rgba(255, 255, 255, 0.45);
  font-size: 12px;
}

.taxonomy-hero__breadcrumb a {
  color: rgba(255, 255, 255, 0.45);
  text-decoration: none;
  transition: color 140ms ease;
}

.taxonomy-hero__breadcrumb a:hover {
  color: rgba(255, 255, 255, 0.9);
}

.taxonomy-hero__kicker {
  margin: 0 0 10px;
  color: var(--rtve-orange);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.taxonomy-hero__title {
  margin: 0 0 16px;
  color: #fff;
  font-family: var(--rtve-display);
  font-size: clamp(32px, 5vw, 52px);
  font-weight: 900;
  line-height: 1.08;
}

/* Subtle glow tint on the title matching the duration */
.taxonomy-hero[data-duration="25h"]  .taxonomy-hero__title { text-shadow: 0 0 80px rgba(111, 172, 136, 0.45); }
.taxonomy-hero[data-duration="75h"]  .taxonomy-hero__title { text-shadow: 0 0 80px rgba(242, 29, 107, 0.40); }
.taxonomy-hero[data-duration="100h"] .taxonomy-hero__title { text-shadow: 0 0 80px rgba(127, 179, 190, 0.42); }

.taxonomy-hero__desc {
  margin: 0 0 20px;
  max-width: 520px;
  color: rgba(255, 255, 255, 0.7);
  font-size: 16px;
  line-height: 1.65;
}

.taxonomy-hero__count {
  margin: 0;
  color: rgba(255, 255, 255, 0.45);
  font-size: 13px;
}

.taxonomy-hero__count strong {
  color: #fff;
  font-weight: 800;
  margin-right: 4px;
}

/* ── Accent bar at bottom of hero ──────────────────────────────────────── */
.taxonomy-hero::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 2px;
}

.taxonomy-hero[data-duration="25h"]::after  { background: linear-gradient(90deg, #6FAC88, transparent 60%); }
.taxonomy-hero[data-duration="50h"]::after  { background: linear-gradient(90deg, #eb1f58, transparent 60%); }
.taxonomy-hero[data-duration="75h"]::after  { background: linear-gradient(90deg, #F21D6B, transparent 60%); }
.taxonomy-hero[data-duration="100h"]::after { background: linear-gradient(90deg, #7FB3BE, transparent 60%); }
.taxonomy-hero[data-duration="all"]::after  { background: linear-gradient(90deg, #ff8700, transparent 60%); }

/* ── Pagination (inside .catalog-shell) ─────────────────────────────────── */
.catalog-shell .navigation.pagination {
  margin-top: 48px;
}

.catalog-shell .nav-links {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
}

.catalog-shell .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 14px;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.07);
  color: rgba(255, 255, 255, 0.68);
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  transition: background 140ms ease, color 140ms ease;
}

.catalog-shell .page-numbers:hover {
  background: rgba(255, 255, 255, 0.14);
  color: #fff;
}

.catalog-shell .page-numbers.current {
  background: linear-gradient(270deg, #F6A30B 5.55%, #ED6E00 50%);
  color: #fff;
  pointer-events: none;
}

.catalog-shell .page-numbers.dots {
  background: none;
  color: rgba(255, 255, 255, 0.28);
  pointer-events: none;
}

/* Taxonomy hero responsive */
@media (max-width: 760px) {
  .taxonomy-hero {
    padding: 96px 0 48px;
  }

  .taxonomy-hero__title {
    font-size: clamp(26px, 7vw, 36px);
  }
}

/* ═══════════════════════════════════════════════════════════════════════════
   CATÁLOGO — Hero estático
   ═══════════════════════════════════════════════════════════════════════════ */

.catalog-hero {
  position: relative;
  min-height: 400px;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  background:
    var(--catalog-hero-bg, none) center / cover no-repeat,
    linear-gradient(160deg, #111827 0%, #1e2535 60%, #181d29 100%);
}

/* Dot-grid texture — same as catalog-shell */
.catalog-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.18;
  background-image: radial-gradient(rgba(255, 255, 255, 0.18) 1px, transparent 1px);
  background-size: 18px 18px;
}

/* Dark gradient scrim over image */
.catalog-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg,  rgba(0, 0, 0, 0.65) 0%, rgba(0, 0, 0, 0.18) 60%, transparent 100%),
    linear-gradient(180deg, rgba(0, 0, 0, 0.10) 0%, rgba(0, 0, 0, 0.55) 100%);
}

.catalog-hero__inner {
  position: relative;
  z-index: 1;
  width: min(100% - 48px, 1240px);
  margin: 0 auto;
  padding: 96px 0 64px;
}

.catalog-hero__kicker {
  margin: 0 0 14px;
  color: var(--rtve-orange);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.catalog-hero__title {
  margin: 0 0 18px;
  color: #fff;
  font-family: var(--rtve-display);
  font-size: clamp(34px, 5.5vw, 62px);
  font-weight: 900;
  line-height: 1.08;
}

.catalog-hero__subtitle {
  margin: 0 0 36px;
  max-width: 560px;
  color: rgba(255, 255, 255, 0.76);
  font-size: 17px;
  line-height: 1.65;
}

/* Stats row */
.catalog-hero__stats {
  display: flex;
  flex-wrap: wrap;
  gap: 28px 40px;
  margin: 0 0 36px;
  padding: 0;
  list-style: none;
}

.catalog-hero__stat strong {
  display: block;
  color: var(--rtve-orange);
  font-family: var(--rtve-display);
  font-size: 36px;
  font-weight: 900;
  line-height: 1;
  margin-bottom: 4px;
}

.catalog-hero__stat span {
  color: rgba(255, 255, 255, 0.55);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.catalog-hero__actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

/* ═══════════════════════════════════════════════════════════════════════════
   CATÁLOGO — Filter nav (modo JS)
   ═══════════════════════════════════════════════════════════════════════════ */

/* The filter nav re-uses .duration-nav styles; we just override the active state */
.duration-nav__item--all {
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.72);
  border-color: rgba(255, 255, 255, 0.18);
  cursor: pointer;
  font: inherit;
}

.duration-nav__item--all:hover {
  background: rgba(255, 255, 255, 0.14);
  color: #fff;
}

/* Active filter tab — common */
[data-catalog-filter-nav] .duration-nav__item.is-active {
  box-shadow: 0 0 0 2px currentColor inset;
  opacity: 1;
}

[data-catalog-filter-nav] .duration-nav__item--all.is-active {
  background: rgba(255, 255, 255, 0.18);
  color: #fff;
  border-color: rgba(255, 255, 255, 0.50);
  box-shadow: none;
}

/* ═══════════════════════════════════════════════════════════════════════════
   CATÁLOGO — Section filter animation
   ═══════════════════════════════════════════════════════════════════════════ */

.catalog-section--hidden {
  display: none !important;
}

@keyframes catalogFadeInUp {
  from {
    opacity: 0;
    transform: translateY(14px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.course-section.is-appearing {
  animation: catalogFadeInUp 320ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

/* ═══════════════════════════════════════════════════════════════════════════
   CATÁLOGO — Responsive
   ═══════════════════════════════════════════════════════════════════════════ */

@media (max-width: 760px) {
  .catalog-hero {
    min-height: 320px;
  }

  .catalog-hero__inner {
    padding: 72px 0 48px;
  }

  .catalog-hero__stats {
    gap: 20px 28px;
  }

  .catalog-hero__stat strong {
    font-size: 28px;
  }
}

@media (max-width: 480px) {
  .catalog-hero__subtitle {
    font-size: 15px;
  }

  .catalog-hero__actions .button {
    width: 100%;
  }
}

/* ═══════════════════════════════════════════════════════════════════════════
   PRODUCT PAGE — single-product.php
   CSS variables --course-hero-bg and --duration-accent are injected via
   wp_head in inc-course-template.php
   ═══════════════════════════════════════════════════════════════════════════ */

.product-page {
  background: var(--rtve-black);
  color: var(--rtve-text);
}

/* ── Inner boxed container ───────────────────────────────────────────────── */
.course-inner {
  max-width: 960px;
  margin: 0 auto;
  padding: 56px 24px;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* ── Hero ─────────────────────────────────────────────────────────────────  */
.course-hero-section {
  position: relative;
  min-height: 600px;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
}

/* Featured image layer (set via --course-hero-bg CSS variable) */
.course-hero-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: var(--course-hero-bg, none);
  background-size: cover;
  background-position: center top;
  z-index: 0;
}

/* Gradient overlay */
.course-hero-section::after {
  content: '';
  position: absolute;
  inset: 0;
  background:
    linear-gradient(to right,  rgba(5,5,5,0.92) 0%, rgba(5,5,5,0.60) 55%, rgba(5,5,5,0.20) 100%),
    linear-gradient(to top,    rgba(5,5,5,0.96) 0%, rgba(5,5,5,0.45) 40%, transparent 80%);
  z-index: 1;
}

/* Push all Elementor children above the overlays */
.course-hero-section > .elementor-container,
.course-hero-section > .e-con,
.course-hero-section > .course-inner {
  position: relative;
  z-index: 2;
  width: 100%;
}

.course-hero-section .course-inner {
  padding-top: 120px;
  padding-bottom: 64px;
}

.course-hero__badge {
  display: inline-block;
  margin-bottom: 14px;
  font-size: 11px;
  letter-spacing: 0.08em;
  font-weight: 700;
  padding: 4px 12px;
  border-radius: 3px;
  background: var(--duration-accent, var(--rtve-orange));
  color: #fff;
  text-transform: uppercase;
}

.course-hero__title {
  font-size: clamp(26px, 4vw, 52px);
  font-weight: 700;
  line-height: 1.15;
  color: #fff;
  margin: 0 0 12px;
  font-family: var(--rtve-display);
  max-width: 720px;
}

.course-hero__kicker {
  font-size: 16px;
  color: var(--rtve-muted);
  margin: 0 0 28px;
  letter-spacing: 0.02em;
  max-width: 560px;
}

/* ── Buy box ───────────────────────────────────────────────────────────── */
.rtve-buy-box {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
}

.rtve-buy-box--centered {
  justify-content: center;
}

.rtve-buy-box__title {
  width: 100%;
  font-size: 22px;
  font-weight: 700;
  margin: 0 0 4px;
  font-family: var(--rtve-display);
  color: #fff;
}

.rtve-buy-box__price {
  font-size: 26px;
  font-weight: 700;
  color: #fff;
  line-height: 1;
}

.rtve-buy-box__price .woocommerce-Price-amount {
  font-size: 28px;
  font-weight: 700;
  color: #fff;
}

.rtve-buy-box__btn {
  white-space: nowrap;
  background: var(--duration-accent, var(--rtve-orange)) !important;
  border-color: var(--duration-accent, var(--rtve-orange)) !important;
  color: #fff !important;
  font-size: 14px;
  padding: 14px 28px;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  border-radius: 4px;
  transition: opacity 0.18s ease, transform 0.18s ease;
}

.rtve-buy-box__btn:hover {
  opacity: 0.88;
  transform: translateY(-2px);
  color: #fff !important;
}

/* ── Content blocks ─────────────────────────────────────────────────────── */
.course-block {
  background: var(--rtve-black);
}

.course-block--grey {
  background: var(--rtve-panel);
}

.course-block--dark {
  background: var(--rtve-ink);
}

.course-block--accent {
  background: var(--duration-accent, var(--rtve-orange));
}

/* Section headings */
.course-block .elementor-heading-title,
.course-block h2,
.course-block h3 {
  font-size: clamp(20px, 2.4vw, 30px);
  font-weight: 700;
  color: #fff;
  margin: 0 0 16px;
  font-family: var(--rtve-display);
}

/* Body text */
.course-block .elementor-widget-text-editor p,
.course-block p {
  font-size: 16px;
  line-height: 1.75;
  color: var(--rtve-muted);
  max-width: 720px;
}

.course-block--accent .elementor-heading-title,
.course-block--accent h2,
.course-block--accent p,
.course-block--accent .elementor-widget-text-editor p {
  color: rgba(255, 255, 255, 0.95);
}

/* ── Icon list ──────────────────────────────────────────────────────────── */
.course-block .elementor-icon-list-items {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 12px 28px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.course-block .elementor-icon-list-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 15px;
  line-height: 1.5;
  color: var(--rtve-muted);
}

.course-block--accent .elementor-icon-list-item {
  color: rgba(255, 255, 255, 0.92);
}

.course-block .elementor-icon-list-icon {
  color: var(--duration-accent, var(--rtve-orange));
  flex-shrink: 0;
  margin-top: 2px;
}

.course-block--accent .elementor-icon-list-icon {
  color: rgba(255, 255, 255, 0.80);
}

/* ── Accordion ──────────────────────────────────────────────────────────── */
.course-block .elementor-accordion {
  border: none;
}

.course-block .elementor-accordion-item {
  border: 1px solid var(--rtve-border);
  border-radius: 6px;
  margin-bottom: 8px;
  overflow: hidden;
}

.course-block .elementor-tab-title {
  background: rgba(255, 255, 255, 0.04);
  padding: 16px 20px;
  cursor: pointer;
  font-size: 15px;
  font-weight: 600;
  color: #fff;
  border: none;
  transition: background 0.18s;
  list-style: none;
}

.course-block .elementor-tab-title:hover,
.course-block .elementor-tab-title.elementor-active {
  background: rgba(255, 255, 255, 0.09);
}

.course-block .elementor-tab-content {
  padding: 16px 20px;
  font-size: 15px;
  line-height: 1.75;
  color: var(--rtve-muted);
  border-top: 1px solid var(--rtve-border);
}

/* ── Software pills ─────────────────────────────────────────────────────── */
.course-software {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.course-software__pill {
  display: inline-block;
  padding: 6px 18px;
  border: 1px solid var(--rtve-border);
  border-radius: 20px;
  font-size: 14px;
  font-weight: 500;
  color: var(--rtve-muted);
  background: rgba(255, 255, 255, 0.05);
  transition: background 0.18s, color 0.18s, border-color 0.18s;
  cursor: default;
}

.course-software__pill:hover {
  background: rgba(255, 255, 255, 0.11);
  color: #fff;
  border-color: rgba(255, 255, 255, 0.40);
}

/* ── CTA Final section ──────────────────────────────────────────────────── */
.course-cta-section {
  background: var(--rtve-black);
  border-top: 1px solid var(--rtve-border);
}

.course-cta-section .course-inner {
  align-items: center;
  text-align: center;
}

.course-cta-section .elementor-heading-title,
.course-cta-section h2 {
  font-size: clamp(26px, 3.5vw, 44px);
  font-weight: 700;
  color: #fff;
  font-family: var(--rtve-display);
}

.course-cta-section p {
  font-size: 17px;
  color: var(--rtve-muted);
  max-width: 560px;
}

/* ── Product page — Responsive ──────────────────────────────────────────── */
@media (max-width: 760px) {
  .course-hero-section {
    min-height: 460px;
  }

  .course-hero-section .course-inner {
    padding-top: 80px;
    padding-bottom: 48px;
  }

  .course-inner {
    padding: 40px 20px;
  }

  .rtve-buy-box {
    flex-direction: column;
    align-items: flex-start;
  }

  .course-block .elementor-icon-list-items {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 480px) {
  .course-hero-section {
    min-height: 360px;
  }

  .rtve-buy-box__btn {
    width: 100%;
    text-align: center;
    display: block;
  }
}

/* ═══════════════════════════════════════════════════════════════════════════
   PRODUCT PAGE — PREMIUM REDESIGN
   Inspirado en estructura Nuclio: hero fullscreen, benefit cards, career grid,
   methodology pillars, testimonials, institutional cert block.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Hero premium ─────────────────────────────────────────────────────────  */
.course-hero--premium {
  min-height: 85vh;
  align-items: flex-end;
}

/* Más dramático en premium: overlay más denso abajo */
.course-hero--premium::after {
  background:
    linear-gradient(to right, rgba(5,5,5,0.96) 0%, rgba(5,5,5,0.65) 55%, rgba(5,5,5,0.15) 100%),
    linear-gradient(to top,   rgba(5,5,5,0.98) 0%, rgba(5,5,5,0.65) 30%, rgba(5,5,5,0.05) 70%);
}

.course-hero--premium .course-inner {
  padding-top: 0;
  padding-bottom: 0;
}

.course-hero--premium .course-hero__title {
  font-size: clamp(30px, 4.5vw, 60px);
  max-width: 780px;
  line-height: 1.08;
  letter-spacing: -0.02em;
}

/* Subtítulo editorial en itálica */
.course-hero__editorial {
  font-size: 17px;
  color: rgba(255, 255, 255, 0.62);
  max-width: 520px;
  margin: 0 0 28px;
  line-height: 1.6;
  font-style: italic;
}

/* ── Hero premium — inner container con max-width reducido ─────────────────  */
.course-hero__inner {
  max-width: 860px;
  padding-top: 100px;
  padding-bottom: 72px;
  gap: 0;
}

/* ── Breadcrumb ─────────────────────────────────────────────────────────────  */
.course-breadcrumb {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0 6px;
  margin: 0 0 16px;
  font-size: 13px;
  line-height: 1.4;
  color: rgba(255, 255, 255, 0.55);
}

.course-breadcrumb__link {
  color: rgba(255, 255, 255, 0.55);
  text-decoration: none;
  transition: color 150ms;
}

.course-breadcrumb__link:hover {
  color: rgba(255, 255, 255, 0.90);
  text-decoration: underline;
}

.course-breadcrumb__sep {
  color: rgba(255, 255, 255, 0.25);
  font-size: 11px;
}

.course-breadcrumb__current {
  color: rgba(255, 255, 255, 0.80);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  max-width: 260px;
}

/* ── Badges de duración y subvención ───────────────────────────────────────  */
.course-badges {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 12px;
}

.course-badge {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 3px;
  font-family: var(--rtve-display);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #fff;
  line-height: 1.4;
}

/* Píldora duración — usa --duration-accent inyectado en wp_head */
.course-badge--accent {
  background: var(--duration-accent, var(--rtve-orange));
}

/* Píldora "SUBVENCIONADO" — naranja fijo */
.course-badge--sub {
  background: var(--rtve-orange);
}

/* ── Categoría (Heading editable en Elementor) ──────────────────────────────  */
.course-hero__category,
.course-hero__category.elementor-heading-title {
  font-family: var(--rtve-display);
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: rgba(255, 255, 255, 0.55) !important;
  margin: 0 0 14px !important;
  line-height: 1.4;
}

/* ── Descripción corta ──────────────────────────────────────────────────────  */
.course-hero__short-desc {
  font-family: var(--rtve-secondary, sans-serif);
  font-size: 16px;
  line-height: 1.8;
  color: rgba(255, 255, 255, 0.85);
  max-width: 620px;
  margin: 0 0 28px;
}

.course-hero__short-desc p {
  margin: 0 0 10px;
}

.course-hero__short-desc p:last-child {
  margin-bottom: 0;
}

/* ── Botón CTA (widget Elementor Button con clase course-hero__cta) ─────────  */
.course-hero__cta .elementor-button,
.course-hero__cta.elementor-button-wrapper .elementor-button {
  background: var(--rtve-orange) !important;
  color: #fff !important;
  font-family: var(--rtve-display) !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  padding: 14px 32px !important;
  border-radius: 4px !important;
  border: none !important;
  transition: background 200ms, transform 150ms !important;
}

.course-hero__cta .elementor-button:hover {
  background: var(--rtve-orange-deep) !important;
  transform: translateY(-1px);
}

.course-hero__cta .elementor-button:focus-visible {
  outline: 3px solid rgba(255, 255, 255, 0.7);
  outline-offset: 3px;
}

/* ── Highlights strip ─────────────────────────────────────────────────────  */
.course-highlights {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  list-style: none;
  padding: 20px 0 48px;
  margin: 20px 0 0;
  border-top: 1px solid rgba(255, 255, 255, 0.13);
}

.course-highlights__item {
  position: relative;
  padding: 0 22px 0 0;
  margin-right: 8px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.65);
  line-height: 1;
}

/* Primer item = duración, siempre con color acento */
.course-highlights__item:first-child {
  color: var(--duration-accent, var(--rtve-orange));
}

/* Separador · */
.course-highlights__item::after {
  content: '·';
  position: absolute;
  right: 6px;
  top: 0;
  color: rgba(255, 255, 255, 0.25);
}

.course-highlights__item:last-child::after {
  display: none;
}

/* ── Benefit cards (2×3) ──────────────────────────────────────────────────  */
.course-benefits {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

.course-benefits__card {
  padding: 24px 20px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 8px;
  transition: background 0.18s, border-color 0.18s, transform 0.18s;
}

.course-benefits__card:hover {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.14);
  transform: translateY(-2px);
}

.course-benefits__icon {
  display: block;
  font-size: 22px;
  color: var(--duration-accent, var(--rtve-orange));
  margin-bottom: 12px;
}

.course-benefits__title {
  font-size: 15px;
  font-weight: 700;
  color: #fff;
  margin: 0 0 8px;
  line-height: 1.3;
}

.course-benefits__desc {
  font-size: 13px;
  line-height: 1.65;
  color: rgba(255, 255, 255, 0.50);
  margin: 0;
}

/* ── Software pills (premium) ─────────────────────────────────────────────  */
.course-software-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.course-software-pills__item {
  padding: 8px 20px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 24px;
  font-size: 14px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.75);
  background: rgba(255, 255, 255, 0.04);
  cursor: default;
  transition: all 0.18s ease;
}

.course-software-pills__item:hover {
  background: rgba(255, 255, 255, 0.10);
  color: #fff;
  border-color: var(--duration-accent, var(--rtve-orange));
}

/* ── Career outcomes grid ─────────────────────────────────────────────────  */
.course-careers {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 10px;
}

.course-careers__item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 6px;
  transition: background 0.18s, border-color 0.18s;
}

.course-careers__item:hover {
  background: rgba(255, 255, 255, 0.07);
  border-color: rgba(121, 180, 147, 0.35);
}

/* Arrow chevron */
.course-careers__arrow {
  flex-shrink: 0;
  width: 6px;
  height: 6px;
  border-top: 2px solid var(--duration-accent, var(--rtve-orange));
  border-right: 2px solid var(--duration-accent, var(--rtve-orange));
  transform: rotate(45deg);
  opacity: 0.8;
}

.course-careers__label {
  font-size: 14px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.82);
  line-height: 1.3;
}

/* ── Methodology pillars (4 col) ──────────────────────────────────────────  */
.course-method-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

.course-method-grid__item {
  padding: 28px 20px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 8px;
  text-align: center;
}

.course-method-grid__icon {
  display: block;
  font-size: 28px;
  color: var(--duration-accent, var(--rtve-orange));
  margin-bottom: 14px;
}

.course-method-grid__title {
  font-size: 15px;
  font-weight: 700;
  color: #fff;
  margin: 0 0 8px;
}

.course-method-grid__desc {
  font-size: 13px;
  line-height: 1.65;
  color: rgba(255, 255, 255, 0.50);
  margin: 0;
}

/* ── Certification block ──────────────────────────────────────────────────  */
.course-cert {
  display: flex;
  align-items: flex-start;
  gap: 28px;
  padding: 32px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-left: 4px solid var(--duration-accent, var(--rtve-orange));
  border-radius: 8px;
  max-width: 720px;
}

.course-cert__badge {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  background: var(--duration-accent, var(--rtve-orange));
  border-radius: 8px;
}

.course-cert__rtve {
  font-size: 12px;
  font-weight: 900;
  color: #fff;
  letter-spacing: 0.06em;
  text-align: center;
  display: block;
}

.course-cert__body {
  flex: 1;
}

.course-cert__title {
  font-size: 18px;
  font-weight: 700;
  color: #fff;
  margin: 0 0 8px;
  font-family: var(--rtve-display);
}

.course-cert__desc {
  font-size: 14px;
  line-height: 1.7;
  color: rgba(255, 255, 255, 0.60);
  margin: 0 0 16px;
}

.course-cert__seals {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.course-cert__seal {
  padding: 4px 12px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 3px;
  font-size: 11px;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.65);
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

/* ── Testimonial cards ────────────────────────────────────────────────────  */
.course-testimonials {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}

.course-testimonials__card {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 28px 24px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 8px;
}

.course-testimonials__text {
  font-size: 14px;
  line-height: 1.75;
  color: rgba(255, 255, 255, 0.75);
  font-style: italic;
  margin: 0;
  flex: 1;
}

.course-testimonials__footer {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding-top: 16px;
  border-top: 1px solid rgba(255, 255, 255, 0.09);
}

.course-testimonials__name {
  font-size: 14px;
  font-weight: 700;
  color: #fff;
}

.course-testimonials__role {
  font-size: 12px;
  color: var(--duration-accent, var(--rtve-orange));
  letter-spacing: 0.04em;
}

/* ── CTA Final — imagen parcial de fondo ──────────────────────────────────  */
.course-cta-section {
  position: relative;
  overflow: hidden;
  border-top: 1px solid var(--rtve-border);
}

/* Imagen del producto como fondo difuso */
.course-cta-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: var(--course-hero-bg, none);
  background-size: cover;
  background-position: center;
  opacity: 0.10;
  z-index: 0;
  filter: blur(4px) scale(1.05);
}

.course-cta-section .course-inner {
  position: relative;
  z-index: 1;
  align-items: center;
  padding-top: 80px;
  padding-bottom: 80px;
  text-align: center;
}

.course-cta-section .elementor-heading-title {
  font-size: clamp(28px, 3.5vw, 46px);
  font-weight: 700;
  color: #fff;
  font-family: var(--rtve-display);
  letter-spacing: -0.02em;
}

.course-cta-section .elementor-widget-text-editor p {
  font-size: 17px;
  color: rgba(255, 255, 255, 0.60);
  max-width: 500px;
  margin: 0 auto;
}

/* ── Premium responsive ───────────────────────────────────────────────────  */
@media (max-width: 960px) {
  .course-benefits {
    grid-template-columns: repeat(2, 1fr);
  }

  .course-method-grid {
    grid-template-columns: repeat(2, 1fr);
  }

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

@media (max-width: 600px) {
  .course-hero--premium {
    min-height: 100svh;
  }

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

  .course-method-grid {
    grid-template-columns: repeat(2, 1fr);
  }

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

  .course-cert {
    flex-direction: column;
    gap: 16px;
    padding: 24px;
  }
}

@media (max-width: 480px) {
  .course-method-grid {
    grid-template-columns: 1fr;
  }

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

  .course-highlights {
    flex-direction: column;
    gap: 8px;
  }

  .course-highlights__item::after {
    display: none;
  }
}

/* ═══════════════════════════════════════════════════════════════════════════
   PRODUCT PAGE — ALINEACIÓN CON SISTEMA VISUAL DE LA HOME
   Correcciones para que la página de producto herede el mismo lenguaje visual:
   tipografía, overlays, botones, anchos, decoraciones de heading y espaciados.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Inner container: mismo ancho que el hero de la home ─────────────────  */
.course-inner {
  width: min(100% - 96px, 1100px);
  max-width: none;
  margin-left: auto;
  margin-right: auto;
  padding-left: 0;
  padding-right: 0;
  padding-top: 80px;
  padding-bottom: 80px;
}

/* ── Hero: mismo overlay que .hero-slide::after ───────────────────────────  */
.course-hero-section::after {
  background:
    linear-gradient(90deg, rgba(0, 0, 0, 0.92), rgba(0, 0, 0, 0.56) 42%, rgba(0, 0, 0, 0.24)),
    linear-gradient(180deg, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.34));
}

/* Premium hero: mismo ancho interior que .hero__inner */
.course-hero--premium .course-inner {
  width: min(100% - 48px, 1240px);
  padding-top: 0;
  padding-left: 0;
  padding-right: 0;
  padding-bottom: 0;
}

/* Alineación vertical: contenido centrado con aire de landing premium */
.course-hero--premium {
  align-items: center;
  padding-top: 140px;
  padding-bottom: 100px;
}

/* ── Hero tipografía: hereda .hero h1 y .hero p ──────────────────────────  */
.course-hero__title {
  font-family: var(--rtve-display);
  font-size: clamp(28px, 3.2vw, 44px);
  line-height: 1.23;
  letter-spacing: 0;
  max-width: 640px;
}

.course-hero__editorial {
  font-family: var(--rtve-secondary);
  font-size: 17px;
  line-height: 1.9;
  font-style: normal;
  color: rgba(255, 255, 255, 0.86);
  max-width: 600px;
  margin: 18px 0 0;
}

/* ── Buy box: hereda .button base styles, anula overrides anteriores ──────  */
.rtve-buy-box {
  flex-wrap: wrap;
  gap: 18px;
  margin-top: 52px;
  align-items: center;
}

/* Reutiliza exactamente el mismo sistema de botón que la home.
   El selector con doble clase gana sobre .rtve-buy-box__btn solo. */
.rtve-buy-box .rtve-buy-box__btn,
a.rtve-buy-box__btn {
  background: linear-gradient(270deg,
    color-mix(in srgb, var(--duration-accent, #F6A30B) 70%, #F6A30B) 5%,
    var(--duration-accent, #ED6E00) 55%
  ) !important;
  border-color: transparent !important;
  border-radius: 5px;
  font-family: var(--rtve-display);
  font-weight: 800;
  font-size: 14px;
  letter-spacing: 0.04em;
  padding: 0 30px;
  min-height: 42px;
  color: #fff !important;
  transition: transform 160ms ease, filter 160ms ease, box-shadow 160ms ease;
}

.rtve-buy-box .rtve-buy-box__btn:hover,
a.rtve-buy-box__btn:hover {
  filter: brightness(1.08);
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.28);
}

/* Precio: misma jerarquía visual que en la home */
.rtve-buy-box__price {
  font-family: var(--rtve-display);
  font-size: 22px;
  font-weight: 700;
  color: #fff;
}

.rtve-buy-box__price .woocommerce-Price-amount {
  font-size: 26px;
}

/* ── Secciones: barra de acento como .section-heading h2::before ──────────  */
.course-block .elementor-heading-title,
.course-block h2,
.course-block h3 {
  font-family: var(--rtve-display);
  font-size: 28px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0;
  color: #fff;
  position: relative;
  padding-left: 20px;
  margin-bottom: 40px;
}

/* Barra vertical naranja igual que en la home */
.course-block .elementor-heading-title::before,
.course-block h2::before,
.course-block h3::before {
  content: "";
  position: absolute;
  left: 0;
  top: 3px;
  bottom: 3px;
  width: 4px;
  border-radius: 99px;
  background: var(--duration-accent, var(--rtve-orange));
}

/* CTA y testimonios: heading centrado sin barra */
.course-cta-section .elementor-heading-title,
.course-cta-section h2,
.course-testimonials ~ * h2 {
  padding-left: 0;
  text-align: center;
}

.course-cta-section .elementor-heading-title::before,
.course-cta-section h2::before {
  display: none;
}

/* ── Cards de beneficios: mismo sistema que .course-card ─────────────────  */
.course-benefits__card {
  border-radius: 8px;
  background: var(--rtve-panel-soft);
  border: 1px solid rgba(255, 255, 255, 0.07);
}

.course-benefits__card:hover {
  transform: translateY(-4px);
  box-shadow: 0 26px 42px rgba(0, 0, 0, 0.42);
  border-color: rgba(255, 255, 255, 0.12);
}

/* Careers: alineado con course-card */
.course-careers__item {
  border-radius: 8px;
  background: var(--rtve-panel);
}

.course-careers__item:hover {
  background: var(--rtve-panel-soft);
  border-color: rgba(255, 255, 255, 0.12);
  transform: translateY(-2px);
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.32);
}

/* ── Acordeón: integración visual con el sistema de la home ──────────────  */
.course-block .elementor-accordion-item {
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: var(--rtve-panel);
  margin-bottom: 6px;
}

.course-block .elementor-tab-title.elementor-active {
  background: var(--rtve-panel-soft);
  border-left: 3px solid var(--duration-accent, var(--rtve-orange));
}

/* ── Highlights: mismo peso tipográfico que la home ─────────────────────  */
.course-highlights__item {
  font-family: var(--rtve-secondary);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.06em;
}

/* ── Highlights: padding/bottom del bloque hero ─────────────────────────  */
.course-highlights {
  padding-bottom: 0;
}

/* ── Body text en secciones: font-family heredado de la home ────────────  */
.course-block .elementor-widget-text-editor p,
.course-block p {
  font-family: var(--rtve-secondary);
  font-size: 16px;
  line-height: 1.9;
  color: rgba(255, 255, 255, 0.80);
  max-width: 660px;
}

/* ── Responsive: alinear con breakpoints de la home ─────────────────────  */
@media (max-width: 960px) {
  .course-inner {
    width: min(100% - 72px, 1100px);
    padding-top: 64px;
    padding-bottom: 64px;
  }

  .course-hero--premium {
    padding-top: 100px;
    padding-bottom: 72px;
  }
}

@media (max-width: 600px) {
  .course-inner {
    width: min(100% - 48px, 1100px);
    padding-top: 56px;
    padding-bottom: 56px;
  }

  .course-hero--premium {
    padding-top: 96px;
    padding-bottom: 64px;
  }

  .course-hero__title {
    font-size: clamp(24px, 7vw, 36px);
    max-width: 100%;
  }

  .rtve-buy-box {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    margin-top: 32px;
  }

  .rtve-buy-box .rtve-buy-box__btn,
  a.rtve-buy-box__btn {
    width: 100%;
    display: flex;
  }

  .course-block .elementor-heading-title,
  .course-block h2 {
    font-size: 22px;
    margin-bottom: 28px;
  }
}

/* ═══════════════════════════════════════════════════════════════════════════
   PRODUCT PAGE — WC reset · WCAG focus · jerarquía de precio
   Sin tokens nuevos. Reutiliza 100% el sistema de la home.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── 1. Neutralizar colores por defecto de WooCommerce ───────────────────
   WC puede inyectar color de enlace (#7f54b3 WC morado / #0073aa WP azul)
   aunque se haya desencolado el stylesheet, ya que algunos plugins lo
   re-enqueuean. Scope .product-page evita afectar cart/checkout.        */
.product-page a:not(.rtve-buy-box__btn):not([class*="button"]) {
  color: inherit;
  text-decoration: none;
}

/* Elementor: asegura que .elementor-heading-title no hereda color WC */
.product-page .elementor-widget-heading .elementor-heading-title {
  color: #fff;
}

/* ── 2. Precio: hereda blanco y tipografía del design system ─────────── */
.product-page .woocommerce-Price-amount,
.product-page ins .woocommerce-Price-amount {
  color: #fff;
  font-family: var(--rtve-display);
}

.product-page del {
  color: rgba(255, 255, 255, 0.40);
  opacity: 1;
}

.product-page del .woocommerce-Price-amount {
  color: inherit;
}

.product-page ins {
  text-decoration: none;
}

/* ── 3. Accordeón: tipografía de la home en títulos de tab ─────────── */
.product-page .elementor-tab-title {
  font-family: var(--rtve-display);
}

/* ── 4. WCAG 2.4.3 — focus-visible usando --rtve-orange de la home ──── */
.product-page a:focus-visible,
.product-page button:focus-visible,
.product-page [role="button"]:focus-visible,
.product-page .elementor-tab-title:focus-visible {
  outline: 2px solid var(--rtve-orange);
  outline-offset: 3px;
  border-radius: 3px;
}

/* ── 5. Mobile (≤480px): respira en tarjetas pequeñas ──────────────── */
@media (max-width: 480px) {
  .course-inner {
    width: min(100% - 32px, 1100px);
    padding-top: 48px;
    padding-bottom: 48px;
  }

  .course-benefits {
    gap: 12px;
  }

  .course-method-grid {
    gap: 12px;
  }

  .course-testimonials__card {
    padding: 24px 20px;
  }
}

/* ═══════════════════════════════════════════════════════════════════════════
   PRODUCT PAGE — Stats · Instructors · Sticky CTA
   Nuevos componentes del template v2. Sin tokens nuevos.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Stats (4-col icons: duración, modalidad, nivel, certificado) ──────── */
.course-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2px;
}

.course-stats__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 32px 20px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
  text-align: center;
  transition: background 0.18s;
}

.course-stats__item:hover {
  background: rgba(255, 255, 255, 0.06);
}

.course-stats__icon {
  font-size: 26px;
  color: var(--duration-accent, var(--rtve-orange));
  margin-bottom: 14px;
  display: block;
}

.course-stats__value {
  display: block;
  font-family: var(--rtve-display);
  font-size: 17px;
  font-weight: 700;
  color: #fff;
  line-height: 1.25;
  margin-bottom: 5px;
}

.course-stats__label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.42);
}

/* Stats: sin padding extra del course-inner en esta sección */
.course-block .course-stats {
  margin-top: -8px;
}

/* ── Instructors grid ─────────────────────────────────────────────────────  */
.course-instructors {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 16px;
}

.course-instructors__card {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 20px;
  background: var(--rtve-panel);
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 8px;
  transition: background 0.18s, transform 0.18s, box-shadow 0.18s;
}

.course-instructors__card:hover {
  background: var(--rtve-panel-soft);
  transform: translateY(-2px);
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.32);
}

.course-instructors__avatar {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: var(--duration-accent, var(--rtve-orange));
  font-family: var(--rtve-display);
  font-size: 18px;
  font-weight: 700;
  color: #fff;
}

.course-instructors__body {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.course-instructors__name {
  font-family: var(--rtve-display);
  font-size: 15px;
  font-weight: 700;
  color: #fff;
  line-height: 1.25;
}

.course-instructors__role {
  font-size: 13px;
  line-height: 1.4;
  color: rgba(255, 255, 255, 0.52);
}

/* ── Sticky CTA — mobile only (floating card, not full-width) ──────────────  */
.sticky-cta {
  position: fixed;
  bottom: calc(16px + env(safe-area-inset-bottom, 0px));
  left: 50%;
  /* translate X centra; translate Y 120% saca la tarjeta fuera de pantalla */
  transform: translateX(-50%) translateY(120%);
  z-index: 90;
  width: calc(100% - 32px);
  max-width: 540px;
  background: #1a1a1a;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 14px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.55), 0 2px 8px rgba(0, 0, 0, 0.35);
  transition: transform 300ms cubic-bezier(0.34, 1.28, 0.64, 1),
              opacity 300ms ease;
  opacity: 0;
}

.sticky-cta[aria-hidden="false"] {
  transform: translateX(-50%) translateY(0);
  opacity: 1;
}

.sticky-cta__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 16px;
}

.sticky-cta__title {
  font-family: var(--rtve-display);
  font-size: 13px;
  font-weight: 700;
  color: #fff;
  margin: 0;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  flex: 1;
  min-width: 0;
}

.sticky-cta__btn {
  flex-shrink: 0;
  white-space: nowrap;
  font-size: 13px;
  padding: 10px 18px;
}

/* Desktop y tablet: sticky CTA oculta */
@media (min-width: 769px) {
  .sticky-cta {
    display: none;
  }
}

/* Stats responsive ──────────────────────────────────────────────────────── */
@media (max-width: 760px) {
  .course-stats {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 480px) {
  .course-stats {
    gap: 1px;
  }

  .course-stats__item {
    padding: 24px 16px;
  }
}

/* prd-* namespace eliminado — reemplazado por plantilla ShopEngine + Elementor */

/* ==========================================================================
   SUBMENÚS — wp_nav_menu() genera .sub-menu y .menu-item-has-children
   No se toca ninguna clase existente del menú principal.
   ========================================================================== */

/* ── Flecha indicadora en items con hijos ─────────────────────────────────── */
.primary-nav__list .menu-item-has-children > a::after {
  content: "";
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 5px;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 4px solid currentColor;
  vertical-align: middle;
  transition: transform 180ms ease;
}

.primary-nav__list .menu-item-has-children:hover > a::after {
  transform: rotate(180deg);
}

/* ── Submenú desktop — dropdown ───────────────────────────────────────────── */
.primary-nav__list .menu-item-has-children {
  position: relative;
}

/* Puente invisible entre el item y el submenú: evita que el gap cierre el dropdown */
.primary-nav__list .menu-item-has-children::after {
  content: '';
  position: absolute;
  bottom: -8px;
  left: 0;
  right: 0;
  height: 8px;
}

.primary-nav__list .sub-menu {
  position: absolute;
  top: 100%;
  left: 0;
  right: auto;
  margin-top: 0;
  width: max-content;
  min-width: unset;
  max-width: unset;
  list-style: none;
  margin: 0;
  padding: 8px 0 0 0;
  background: var(--rtve-ink);
  border-top: 2px solid var(--rtve-orange);
  border-radius: 0 0 5px 5px;
  box-shadow: 0 10px 28px rgba(0, 0, 0, .38);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-6px);
  transition: opacity 160ms ease, transform 160ms ease, visibility 0s 160ms;
  z-index: 200;
  pointer-events: none;
}

.primary-nav__list .menu-item-has-children:hover > .sub-menu,
.primary-nav__list .menu-item-has-children:focus-within > .sub-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  transition: opacity 160ms ease, transform 160ms ease;
  pointer-events: auto;
}

.primary-nav__list .sub-menu a {
  display: block;
  padding: 9px 24px 9px 16px;
  text-align: left;
  color: rgba(255, 255, 255, .80);
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
  transition: color 120ms ease, background 120ms ease;
}

.primary-nav__list .sub-menu a:hover {
  color: #fff;
  background: rgba(255, 255, 255, .06);
}

/* ── Submenú de tercer nivel ──────────────────────────────────────────────── */
.primary-nav__list .sub-menu .sub-menu {
  top: 0;
  left: 100%;
  border-top: none;
  border-left: 2px solid var(--rtve-orange);
  border-radius: 0 5px 5px 0;
}

/* ── Submenú móvil — accordion en .mobile-nav__list ──────────────────────── */

/* Flecha en menú móvil */
.mobile-nav__list .menu-item-has-children > a {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.mobile-nav__list .menu-item-has-children > a::after {
  content: "";
  display: inline-block;
  width: 0; height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 5px solid currentColor;
  flex-shrink: 0;
  margin-left: 10px;
  transition: transform 220ms ease;
}

.mobile-nav__list .menu-item-has-children.is-submenu-open > a::after,
.mobile-nav__list .menu-item-has-children.is-open > a::after {
  transform: rotate(180deg);
}

/* Submenú móvil oculto por defecto */
.mobile-nav__list .sub-menu {
  display: none;
  list-style: none;
  margin: 0;
  padding: 4px 0 4px 16px;
  border-left: 2px solid #F6A30B;
}

.mobile-nav__list .menu-item-has-children.is-submenu-open > .sub-menu,
.mobile-nav__list .menu-item-has-children.is-open > .sub-menu {
  display: block;
}

.mobile-nav__list .sub-menu a {
  display: block;
  padding: 10px 0;
  color: rgba(255, 255, 255, .70);
  font-size: 15px;
  font-weight: 600;
  border-bottom: 1px solid rgba(255, 255, 255, .08);
}

.mobile-nav__list .sub-menu a:hover { color: #fff; }

/* ==========================================================================
   WOOCOMMERCE — CHECKOUT, CARRITO Y MI CUENTA
   ========================================================================== */

.woo-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 60px 24px;
  color: #333;
  background: #fff;
  min-height: 60vh;
}

.woocommerce-checkout h3,
.woocommerce-cart h2,
.woocommerce-account h2 {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 22px;
  margin-bottom: 24px;
  color: #1a1a2e;
}

.woocommerce-checkout input,
.woocommerce-checkout select,
.woocommerce-checkout textarea,
.woocommerce-cart input,
.woocommerce-cart select {
  background: #f2f2f2 !important;
  border: 1px solid #ddd !important;
  border-radius: 5px !important;
  padding: 8px 12px !important;
  font-family: 'Roboto', sans-serif !important;
  color: #333 !important;
  width: 100% !important;
}

.woocommerce-checkout #place_order,
.woocommerce-cart .checkout-button {
  background: linear-gradient(270deg, #F6A30B 5.55%, #ED6E00 50%) !important;
  color: #fff !important;
  font-family: 'Roboto', sans-serif !important;
  font-weight: 700 !important;
  border: none !important;
  border-radius: 8px !important;
  padding: 14px 32px !important;
  font-size: 16px !important;
  cursor: pointer !important;
  width: 100% !important;
}

.woocommerce-checkout .woocommerce-billing-fields,
.woocommerce-checkout .woocommerce-shipping-fields {
  margin-bottom: 32px;
}

.woocommerce table.shop_table {
  width: 100%;
  border-collapse: collapse;
  font-family: 'Roboto', sans-serif;
}

.woocommerce table.shop_table th,
.woocommerce table.shop_table td {
  padding: 12px 16px;
  border-bottom: 1px solid #eee;
  color: #333;
}

/* ==========================================================================
   WOOCOMMERCE — SECCIÓN COMPRA (variaciones)
   ========================================================================== */

.prd-buy {
  padding: 64px 0;
  background: #0d0d1a;
}

.prd-buy__title {
  color: #fff;
  font-size: 28px;
  font-weight: 700;
  font-family: 'Roboto', sans-serif;
  margin-bottom: 32px;
}

.prd-buy__form {
  max-width: 600px;
}

.prd-buy__form .variations select {
  background: rgba(255,255,255,.08);
  color: #fff;
  border: 1px solid rgba(255,255,255,.3);
  border-radius: 8px;
  padding: 10px 16px;
  font-family: 'Roboto', sans-serif;
  font-size: 14px;
  width: 100%;
  margin-bottom: 16px;
}

.prd-buy__form .variations label {
  color: #ccc;
  font-family: 'Roboto', sans-serif;
  font-size: 14px;
}

.prd-buy__form .single_add_to_cart_button {
  background: linear-gradient(270deg, #F6A30B 5.55%, #ED6E00 50%);
  color: #fff;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  border: none;
  border-radius: 8px;
  padding: 14px 32px;
  cursor: pointer;
  font-size: 16px;
  width: 100%;
}

/* ==========================================================================
   WOOCOMMERCE — VARIACIONES EN HERO
   ========================================================================== */

.prd-variations-form select,
.prd-variations-form .variations select {
  background: rgba(255,255,255,.08);
  color: #fff;
  border: 1px solid rgba(255,255,255,.3);
  border-radius: 8px;
  padding: 10px 16px;
  font-family: 'Roboto', sans-serif;
  font-size: 14px;
  width: 100%;
  margin-bottom: 16px;
}

.prd-variations-form .single_add_to_cart_button {
  background: linear-gradient(270deg, #F6A30B 5.55%, #ED6E00 50%);
  color: #fff;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  border: none;
  border-radius: 8px;
  padding: 14px 32px;
  cursor: pointer;
  font-size: 16px;
  width: 100%;
}

.prd-variations-form .variations td,
.prd-variations-form .variations th {
  color: #fff;
  font-family: 'Roboto', sans-serif;
  padding: 4px 0;
}

/* ==========================================================================
   SECCIÓN RELACIONADOS
   ========================================================================== */

.prd-related {
  padding: 64px 0;
}

.prd-related .section-heading {
  margin-bottom: 32px;
}

/* ==========================================================================
   SECCIÓN CONTACTO + CONTACT FORM 7
   ========================================================================== */

.elementor-107 .elementor-element.elementor-element-0c92427 {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

.prd-contact {
  padding: 80px 0;
  background: #1a1a2e;
}

/* .prd-contact__inner no existe en Elementor — el grid va en el propio contenedor */
.prd-contact__inner {
  display: grid;
  grid-template-columns: 40% 60%;
  gap: 60px;
  align-items: start;
}

/* Layout 2 columnas para la estructura que genera Elementor */
.prd-contact.e-con,
.prd-contact > .e-con-inner {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  gap: 60px !important;
  align-items: flex-start !important;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
  padding-right: 20px;
}

.prd-contact__left.e-con {
  flex: 0 0 40% !important;
  max-width: 40% !important;
  width: 40% !important;
}

.prd-contact__right.e-con {
  flex: 0 0 60% !important;
  max-width: 60% !important;
  width: 60% !important;
}

.prd-contact__left h2,
.prd-contact__left .elementor-widget-text-editor h2 {
  color: #fff;
  font-size: 28px;
  font-weight: 700;
  font-family: var(--rtve-display);
  margin-bottom: 16px;
}

.prd-contact__left p,
.prd-contact__left .elementor-widget-text-editor p {
  color: #ccc;
  font-size: 15px;
  line-height: 1.6;
}

@media (max-width: 768px) {
  .prd-contact.e-con,
  .prd-contact > .e-con-inner {
    flex-direction: column !important;
  }
  .prd-contact__left.e-con,
  .prd-contact__right.e-con {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
  }
}

.prd-contact .wpcf7 {
  padding: 14px 20px !important;
  background: #ffffff !important;
  border-radius: 13px !important;
  box-shadow: 0px 4px 40px 0px rgba(0,0,0,0.69) !important;
}

.prd-contact label,
.prd-contact .wpcf7 label,
.prd-contact .woocommerce label {
  color: #474747 !important;
  font-size: 13px !important;
  padding: 4px 6px !important;
  font-family: 'Roboto', sans-serif !important;
  display: block !important;
}

.prd-contact .wpcf7 input:not([type="submit"]):not([type="checkbox"]),
.prd-contact .woocommerce input:not([type="submit"]):not([type="checkbox"]),
.prd-contact .wpcf7 textarea,
.prd-contact .woocommerce textarea {
  background-color: #f8f8f8 !important;
  color: #1a1a1a !important;
  border-radius: 5px !important;
  padding: 4px 10px !important;
  border: none !important;
  font-family: 'Roboto', sans-serif !important;
  font-size: 13px !important;
  width: 100% !important;
  height: 32px !important;
  line-height: 1 !important;
}

.prd-contact .wpcf7 input:focus,
.prd-contact .wpcf7 textarea:focus {
  border: 1px solid #F6A30B !important;
  outline: none !important;
}

.prd-contact .wpcf7 textarea {
  min-height: 70px !important;
  height: auto !important;
}

.prd-contact .wpcf7 .lopd-box {
  height: 40px !important;
  font-size: 11px !important;
  color: #474747 !important;
  padding: 0 8px 8px 0 !important;
  overflow: auto !important;
  border-bottom: 1px solid #707070 !important;
  scrollbar-width: thin;
  scrollbar-color: #000 #c9c9c9;
}

.prd-contact .wpcf7 .lopd-box p,
.prd-contact .wpcf7 .lopd-box a { color: #474747 !important; }

.wpcf7 .lopd-box strong,
.prd-contact .wpcf7 strong {
  color: #000000 !important;
}

.prd-contact .wpcf7 .wpcf7-list-item label,
.prd-contact .wpcf7 .wpcf7-acceptance label {
  color: #474747 !important;
  font-size: 12px !important;
}

.prd-contact .wpcf7 input[type="submit"] {
  background: linear-gradient(270deg, #F6A30B 5.55%, #ED6E00 50%) !important;
  color: #fff !important;
  font-family: 'Roboto', sans-serif !important;
  font-weight: 700 !important;
  border: none !important;
  border-radius: 8px !important;
  padding: 10px 24px !important;
  width: 100% !important;
  font-size: 14px !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  cursor: pointer !important;
}

.prd-contact .wpcf7 input[type="submit"]:disabled {
  opacity: 0.5 !important;
  cursor: not-allowed !important;
}


/* ==============================================
   WOOCOMMERCE - CORRECCIÓN COLORES TEMA OSCURO
   El tema usa textos blancos globalmente.
   Estas páginas tienen fondo blanco, hay que
   forzar textos oscuros dentro de .woo-container
   ============================================== */

.woocommerce-page .woo-container {
    background: #fff;
    color: #333 !important;
}

.woocommerce-page .woo-container *:not(.site-header):not(.site-footer):not(.brand):not(.primary-nav):not(.social-nav) {
    color: #333;
}

/* El buscador del header no debe heredar los estilos de inputs de WooCommerce */
.woocommerce-checkout .course-search input[type="search"],
.woocommerce-cart .course-search input[type="search"] {
    background: rgba(5, 6, 11, 0.85) !important;
    border: 2px solid rgba(255, 255, 255, 0.55) !important;
    border-radius: 999px !important;
    padding: 0 38px 0 16px !important;
    color: #fff !important;
    width: 100% !important;
}

.woocommerce-checkout .woocommerce-message { display: none !important; }

.woocommerce-checkout .mobile-nav__search-input,
.woocommerce-cart .mobile-nav__search-input {
    background: rgba(5, 6, 11, 0.85) !important;
    border: 2px solid rgba(255, 255, 255, 0.55) !important;
    border-radius: 999px !important;
    padding: 0 44px 0 16px !important;
    color: #fff !important;
    width: 100% !important;
}

.woocommerce-checkout .mobile-nav__search-input::placeholder,
.woocommerce-cart .mobile-nav__search-input::placeholder {
    color: rgba(255, 255, 255, 0.9) !important;
    opacity: 1 !important;
}

.woocommerce-page .woo-container h2,
.woocommerce-page .woo-container h3,
.woocommerce-page .woo-container h4,
.woocommerce-page .woo-container th {
    color: #1a1a2e !important;
    font-family: 'Roboto', sans-serif;
}

.woocommerce-page .woo-container label,
.woocommerce-page .woo-container .required_field,
.woocommerce-page .woo-container .optional {
    color: #333 !important;
}

.woocommerce-page .woo-container .woocommerce-info,
.woocommerce-page .woo-container .shopengine-woocommerce-info {
    color: #333 !important;
    background: #f7f6f7 !important;
    border-top-color: #ED6E00 !important;
}

.woocommerce-page .woo-container .woocommerce-info a,
.woocommerce-page .woo-container .shopengine-woocommerce-info a {
    color: #ED6E00 !important;
}

.woocommerce-page .woo-container input[type="text"],
.woocommerce-page .woo-container input[type="email"],
.woocommerce-page .woo-container input[type="tel"],
.woocommerce-page .woo-container input[type="number"],
.woocommerce-page .woo-container input[type="password"],
.woocommerce-page .woo-container select,
.woocommerce-page .woo-container textarea {
    background: #f5f5f5 !important;
    color: #333 !important;
    border: 1px solid #ddd !important;
    border-radius: 5px !important;
    padding: 8px 12px !important;
    font-family: 'Roboto', sans-serif !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* Select2 (dropdown país/provincia) */
.woocommerce-page .woo-container .select2-container .select2-selection--single {
    background: #f5f5f5 !important;
    border: 1px solid #ddd !important;
    border-radius: 5px !important;
    padding: 4px 12px !important;
}

.woocommerce-page .woo-container .select2-container .select2-selection__rendered {
    color: #333 !important;
}

.woocommerce-page .woo-container .select2-container .select2-selection__arrow {
    top: 5px !important;
}

/* Tablas */
.woocommerce-page .woo-container table.shop_table,
.woocommerce-page .woo-container table.woocommerce-checkout-review-order-table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
}

.woocommerce-page .woo-container table th,
.woocommerce-page .woo-container table td {
    color: #333 !important;
    border-bottom: 1px solid #eee;
    padding: 12px 16px;
}

.woocommerce-page .woo-container .woocommerce-Price-amount {
    color: #333 !important;
}

/* Botones */
.woocommerce-page .woo-container .button,
.woocommerce-page .woo-container button[type="submit"],
.woocommerce-page .woo-container #place_order,
.woocommerce-page .woo-container .checkout-button {
    background: linear-gradient(270deg, #F6A30B 5.55%, #ED6E00 50%) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 14px 32px !important;
    font-family: 'Roboto', sans-serif !important;
    font-weight: 700 !important;
    font-size: 16px !important;
    cursor: pointer !important;
    text-decoration: none !important;
    display: inline-block !important;
}

.woocommerce-page .woo-container .checkout-button {
    display: block !important;
    text-align: center !important;
    margin-top: 16px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* Links */
.woocommerce-page .woo-container a {
    color: #1a1a2e;
}

.woocommerce-page .woo-container a:hover {
    color: #ED6E00;
}

/* Política privacidad y textos pequeños */
.woocommerce-page .woo-container .woocommerce-privacy-policy-text,
.woocommerce-page .woo-container .woocommerce-privacy-policy-text p,
.woocommerce-page .woo-container .woocommerce-privacy-policy-text a {
    color: #666 !important;
    font-size: 13px;
}

/* Separar columnas checkout */
.woocommerce-page .woo-container .col2-set {
    display: flex;
    gap: 40px;
    flex-wrap: wrap;
}

.woocommerce-page .woo-container .col2-set .col-1,
.woocommerce-page .woo-container .col2-set .col-2 {
    flex: 1;
    min-width: 280px;
}

/* =============================================
   SHOPENGINE OVERRIDE - fondo oscuro en tablas
   ShopEngine sobreescribe el fondo de las tablas
   WooCommerce con su tema oscuro propio
   ============================================= */

.woocommerce-page .woo-container .shop_table,
.woocommerce-page .woo-container .shop_table thead,
.woocommerce-page .woo-container .shop_table tbody,
.woocommerce-page .woo-container .shop_table tfoot,
.woocommerce-page .woo-container .shop_table tr,
.woocommerce-page .woo-container .shop_table td,
.woocommerce-page .woo-container .shop_table th,
.woocommerce-page .woo-container table.cart,
.woocommerce-page .woo-container .woocommerce-checkout-review-order-table,
.woocommerce-page .woo-container .woocommerce-checkout-review-order-table tr,
.woocommerce-page .woo-container .woocommerce-checkout-review-order-table td,
.woocommerce-page .woo-container .woocommerce-checkout-review-order-table th,
.woocommerce-page .woo-container .cart_totals,
.woocommerce-page .woo-container .cart_totals table,
.woocommerce-page .woo-container .cart_totals tr,
.woocommerce-page .woo-container .cart_totals td,
.woocommerce-page .woo-container .cart_totals th {
    background-color: #fff !important;
    background: #fff !important;
    color: #333 !important;
    border-color: #eee !important;
}

.woocommerce-page .woo-container .shop_table thead th,
.woocommerce-page .woo-container .woocommerce-checkout-review-order-table thead th {
    background-color: #f5f5f5 !important;
    color: #1a1a2e !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    font-size: 13px !important;
}

.woocommerce-page .woo-container #payment,
.woocommerce-page .woo-container #payment .wc_payment_methods,
.woocommerce-page .woo-container #payment .form-row.place-order {
    background: #f9f9f9 !important;
    border: 1px solid #eee !important;
    border-radius: 8px !important;
    color: #333 !important;
}

.woocommerce-page .woo-container .woocommerce-privacy-policy-text,
.woocommerce-page .woo-container .woocommerce-privacy-policy-text p {
    color: #666 !important;
}

/* Input de cantidad en carrito */
.woocommerce-page .woo-container .quantity input.qty {
    background: #fff !important;
    color: #333 !important;
    border: 1px solid #ddd !important;
    border-radius: 5px !important;
    padding: 8px !important;
    width: auto !important;
    min-width: 60px !important;
    text-align: center !important;
}

/* Input código cupón */
.woocommerce-page .woo-container input#coupon_code {
    background: #f5f5f5 !important;
    color: #333 !important;
    border: 1px solid #ddd !important;
}

/* Precio tachado y precio en tabla */
.woocommerce-page .woo-container .woocommerce-Price-amount,
.woocommerce-page .woo-container .product-price,
.woocommerce-page .woo-container .product-subtotal,
.woocommerce-page .woo-container .product-name a {
    color: #333 !important;
}

/* Botón eliminar del carrito */
.woocommerce-page .woo-container a.remove {
    color: #ED6E00 !important;
}

/* =============================================
   WOOCOMMERCE - LAYOUT FIXES v2
   ============================================= */

/* Checkout: dos columnas para Nombre/Apellidos */
.woocommerce-page .woo-container .woocommerce-billing-fields__field-wrapper,
.woocommerce-page .woo-container .woocommerce-shipping-fields__field-wrapper {
    overflow: hidden;
}

.woocommerce-page .woo-container .form-row-first {
    float: left !important;
    width: 48% !important;
    margin-right: 4% !important;
    clear: left !important;
}

.woocommerce-page .woo-container .form-row-last {
    float: right !important;
    width: 48% !important;
    margin-right: 0 !important;
    clear: none !important;
}

.woocommerce-page .woo-container .form-row-wide {
    clear: both !important;
    width: 100% !important;
    float: none !important;
}

.woocommerce-page .woo-container .form-row {
    margin-bottom: 16px !important;
}

.woocommerce-page .woo-container .form-row label {
    display: block !important;
    margin-bottom: 6px !important;
    font-size: 14px !important;
}

/* Carrito: cupón + botón en fila SIN tocar la tabla */
.woocommerce-page .woo-container .coupon {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    vertical-align: middle !important;
}

.woocommerce-page .woo-container .coupon input#coupon_code {
    width: 200px !important;
    margin: 0 !important;
    display: inline-block !important;
}

.woocommerce-page .woo-container .coupon .button {
    width: auto !important;
    display: inline-block !important;
    padding: 10px 20px !important;
    margin: 0 !important;
}

/* Botón actualizar carrito separado del cupón */
.woocommerce-page .woo-container button[name="update_cart"] {
    float: right !important;
    width: auto !important;
    padding: 10px 20px !important;
    margin: 0 !important;
}

/* =============================================
   WOOCOMMERCE - RESPONSIVE v2
   ============================================= */

@media (max-width: 768px) {

    /* Contenedor: padding ajustado */
    .woocommerce-page .woo-container {
        padding: 24px 16px !important;
    }

    /* Checkout: campos en una columna */
    .woocommerce-page .woo-container .form-row-first,
    .woocommerce-page .woo-container .form-row-last {
        float: none !important;
        width: 100% !important;
        margin-right: 0 !important;
        clear: both !important;
    }

    .woocommerce-page .woo-container .col2-set {
        flex-direction: column !important;
        gap: 0 !important;
    }

    .woocommerce-page .woo-container .col2-set .col-1,
    .woocommerce-page .woo-container .col2-set .col-2 {
        min-width: 100% !important;
        width: 100% !important;
    }

    /* Carrito: tabla — diseño compacto por filas */
    .woocommerce-page .woo-container table.shop_table {
        display: block !important;
        width: 100% !important;
    }

    .woocommerce-page .woo-container table.shop_table thead {
        display: none !important;
    }

    .woocommerce-page .woo-container table.shop_table tbody,
    .woocommerce-page .woo-container table.shop_table tfoot {
        display: block !important;
        width: 100% !important;
    }

    /* Cada producto como bloque */
    .woocommerce-page .woo-container table.shop_table tr {
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: center !important;
        border-bottom: 1px solid #eee !important;
        padding: 12px 0 !important;
        gap: 8px !important;
    }

    /* Celdas: ancho automático */
    .woocommerce-page .woo-container table.shop_table td {
        display: block !important;
        padding: 4px 8px !important;
        border: none !important;
        font-size: 14px !important;
    }

    /* Quitar ::before con data-title (evita duplicar labels) */
    .woocommerce-page .woo-container table.shop_table td::before {
        display: none !important;
    }

    /* Columna eliminar: pequeña, arriba a la izquierda */
    .woocommerce-page .woo-container td.product-remove {
        width: auto !important;
        padding: 0 !important;
    }

    /* Thumbnail: ocultar en móvil */
    .woocommerce-page .woo-container td.product-thumbnail {
        display: none !important;
    }

    /* Nombre del producto: ocupa el ancho restante */
    .woocommerce-page .woo-container td.product-name {
        flex: 1 !important;
        min-width: 0 !important;
        font-weight: 600 !important;
    }

    /* Precio, cantidad, subtotal: fila completa */
    .woocommerce-page .woo-container td.product-price,
    .woocommerce-page .woo-container td.product-quantity,
    .woocommerce-page .woo-container td.product-subtotal {
        width: 100% !important;
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        padding: 4px 8px !important;
        color: #333 !important;
    }

    .woocommerce-page .woo-container td.product-price::before,
    .woocommerce-page .woo-container td.product-quantity::before,
    .woocommerce-page .woo-container td.product-subtotal::before {
        content: attr(data-title) !important;
        display: block !important;
        font-weight: 700 !important;
        color: #1a1a2e !important;
        font-size: 13px !important;
    }

    /* Fila de totales: también display flex */
    .woocommerce-page .woo-container table.shop_table tfoot tr {
        display: flex !important;
        justify-content: space-between !important;
        padding: 8px 0 !important;
        border-bottom: 1px solid #eee !important;
    }

    .woocommerce-page .woo-container table.shop_table tfoot td,
    .woocommerce-page .woo-container table.shop_table tfoot th {
        padding: 4px 8px !important;
    }

    /* Acciones del carrito: apiladas */
    .woocommerce-page .woo-container td.actions {
        display: block !important;
        width: 100% !important;
        padding: 16px 8px !important;
    }

    .woocommerce-page .woo-container .coupon {
        display: flex !important;
        flex-direction: row !important;
        gap: 8px !important;
        margin-bottom: 12px !important;
        flex-wrap: nowrap !important;
    }

    .woocommerce-page .woo-container .coupon input#coupon_code {
        flex: 1 !important;
        width: auto !important;
        min-width: 0 !important;
        margin: 0 !important;
    }

    .woocommerce-page .woo-container .coupon .button {
        flex-shrink: 0 !important;
        width: auto !important;
        padding: 10px 16px !important;
        font-size: 13px !important;
        white-space: nowrap !important;
    }

    .woocommerce-page .woo-container button[name="update_cart"] {
        display: block !important;
        float: none !important;
        width: 100% !important;
        margin-top: 8px !important;
        font-size: 13px !important;
        white-space: nowrap !important;
    }

    /* Checkout y carrito: botones full width */
    .woocommerce-page .woo-container #place_order,
    .woocommerce-page .woo-container .checkout-button {
        width: 100% !important;
        box-sizing: border-box !important;
        font-size: 15px !important;
    }

    /* Select2 full width */
    .woocommerce-page .woo-container .select2-container {
        width: 100% !important;
    }

    /* Cantidad: input compacto */
    .woocommerce-page .woo-container .quantity input.qty {
        width: 60px !important;
        min-width: 60px !important;
        padding: 6px !important;
    }

    /* Checkout: resumen pedido */
    .woocommerce-page .woo-container #order_review {
        width: 100% !important;
    }

    /* Menos espacio entre secciones */
    .woocommerce-page .woo-container .woocommerce-billing-fields,
    .woocommerce-page .woo-container .woocommerce-shipping-fields,
    .woocommerce-page .woo-container .woocommerce-additional-fields {
        margin-bottom: 24px !important;
    }
}

@media (max-width: 480px) {

    .woocommerce-page .woo-container {
        padding: 16px 12px !important;
    }

    .woocommerce-page .woo-container h2,
    .woocommerce-page .woo-container h3 {
        font-size: 17px !important;
        margin-bottom: 16px !important;
    }

    .woocommerce-page .woo-container .coupon .button {
        padding: 10px 12px !important;
        font-size: 12px !important;
    }
}

/* =============================================
   CHECKOUT - LAYOUT DESKTOP MEJORADO
   ============================================= */

@media (min-width: 769px) {

    /* Layout principal: formulario 55% + resumen 40% */
    .woocommerce-page .woo-container .woocommerce-checkout {
        display: grid !important;
        grid-template-columns: 1fr 420px !important;
        grid-template-rows: auto auto !important;
        gap: 40px !important;
        align-items: start !important;
    }

    /* Detalles del cliente ocupa columna izquierda */
    .woocommerce-page .woo-container #customer_details {
        grid-column: 1 !important;
        grid-row: 1 !important;
    }

    /* Título "Tu pedido" en columna derecha arriba */
    .woocommerce-page .woo-container #order_review_heading {
        grid-column: 2 !important;
        grid-row: 1 !important;
        margin-top: 0 !important;
    }

    /* Resumen del pedido en columna derecha */
    .woocommerce-page .woo-container #order_review {
        grid-column: 2 !important;
        grid-row: 1 !important;
        position: sticky !important;
        top: 100px !important;
    }

    /* Las dos columnas de facturación + info adicional
       se apilan verticalmente en la columna izquierda */
    .woocommerce-page .woo-container .col2-set {
        display: block !important;
        width: 100% !important;
    }

    .woocommerce-page .woo-container .col2-set .col-1,
    .woocommerce-page .woo-container .col2-set .col-2 {
        width: 100% !important;
        float: none !important;
        min-width: unset !important;
    }

    /* Facturación ocupa todo el ancho de su columna */
    .woocommerce-page .woo-container .woocommerce-billing-fields__field-wrapper {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 16px !important;
    }

    /* Campos de ancho completo dentro del grid */
    .woocommerce-page .woo-container .form-row-wide {
        grid-column: 1 / -1 !important;
        float: none !important;
        width: 100% !important;
    }

    /* Nombre y apellidos en dos columnas */
    .woocommerce-page .woo-container .form-row-first,
    .woocommerce-page .woo-container .form-row-last {
        float: none !important;
        width: 100% !important;
        margin: 0 !important;
    }

    /* Info adicional (notas) más compacta */
    .woocommerce-page .woo-container .woocommerce-additional-fields h3 {
        margin-top: 24px !important;
    }

    .woocommerce-page .woo-container #order_comments {
        min-height: 80px !important;
        resize: vertical !important;
    }

    /* Resumen pegajoso con borde */
    .woocommerce-page .woo-container #order_review {
        background: #f9f9f9 !important;
        border: 1px solid #eee !important;
        border-radius: 8px !important;
        padding: 24px !important;
    }

    .woocommerce-page .woo-container #order_review_heading {
        display: none !important;
    }

    .woocommerce-page .woo-container #order_review::before {
        content: "Tu pedido" !important;
        display: block !important;
        font-family: 'Roboto', sans-serif !important;
        font-weight: 700 !important;
        font-size: 20px !important;
        color: #1a1a2e !important;
        margin-bottom: 20px !important;
    }
}

/* =============================================
   CONTACT FORM 7 - DOS COLUMNAS
   ============================================= */

.cf7-row {
    display: flex;
    gap: 16px;
    margin-bottom: 0;
}

.cf7-col-half {
    flex: 1;
    min-width: 0;
}

.cf7-col-half .wpcf7-form-control-wrap,
.cf7-col-half input,
.cf7-col-half select {
    width: 100% !important;
}

@media (max-width: 600px) {
    .cf7-row {
        flex-direction: column;
        gap: 0;
    }
}

/* =============================================
   CONTACT FORM 7 - FORMULARIO PRODUCTO
   Bootstrap-compatible compact form
   ============================================= */

/* Reset Bootstrap grid básico para el formulario */
#prd-contacto .row {
    display: flex !important;
    flex-wrap: wrap !important;
    margin-right: -8px !important;
    margin-left: -8px !important;
}

#prd-contacto .col-12,
#prd-contacto .col-7,
#prd-contacto .col-5,
#prd-contacto .col-6 {
    padding-right: 8px !important;
    padding-left: 8px !important;
    box-sizing: border-box !important;
}

#prd-contacto .col-12 { width: 100% !important; }
#prd-contacto .col-7  { width: 58.333% !important; }
#prd-contacto .col-5  { width: 41.666% !important; }
#prd-contacto .col-6  { width: 50% !important; }

#prd-contacto .gy-2 > * { margin-top: 8px !important; }
#prd-contacto .gx-3 { gap: 0 !important; }

/* Labels compactos */
#prd-contacto label {
    display: block !important;
    padding: 4px 6px !important;
    color: #474747 !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: normal !important;
    margin-bottom: 0 !important;
}

/* Inputs: form-control style compacto */
#prd-contacto input[type="text"],
#prd-contacto input[type="email"],
#prd-contacto input[type="tel"] {
    background-color: #f8f8f8 !important;
    color: #1a1a1a !important;
    border-radius: 5px !important;
    padding: 5px 15px !important;
    height: auto !important;
    line-height: 1.5 !important;
    font-size: 13px !important;
    width: 100% !important;
    border: 1px solid transparent !important;
    box-sizing: border-box !important;
}

#prd-contacto textarea {
    background-color: #f8f8f8 !important;
    color: #1a1a1a !important;
    border-radius: 5px !important;
    padding: 5px 15px !important;
    height: 80px !important;
    font-size: 13px !important;
    width: 100% !important;
    border: 1px solid transparent !important;
    box-sizing: border-box !important;
    resize: vertical !important;
    line-height: 1.5 !important;
}

#prd-contacto input[type="text"]:focus,
#prd-contacto input[type="email"]:focus,
#prd-contacto input[type="tel"]:focus,
#prd-contacto textarea:focus {
    border-color: #F6A30B !important;
    outline: none !important;
    background-color: #f2f2f2 !important;
}

/* LOPD box */
#prd-contacto .lopd-box {
    height: 45px !important;
    padding: 0 8px 8px 0 !important;
    overflow: auto !important;
    border-bottom: 1px solid #707070 !important;
    font-size: 11px !important;
    color: #474747 !important;
    scrollbar-width: thin !important;
    scrollbar-color: #000 #c9c9c9 !important;
}

#prd-contacto .lopd-box p,
#prd-contacto .lopd-box a {
    color: #474747 !important;
    font-size: 11px !important;
    margin: 0 !important;
}

/* Checkboxes */
#prd-contacto .form-check {
    display: flex !important;
    align-items: flex-start !important;
    gap: 8px !important;
    margin-bottom: 4px !important;
}

#prd-contacto .form-check input[type="checkbox"] {
    width: 14px !important;
    height: 14px !important;
    margin-top: 2px !important;
    flex-shrink: 0 !important;
    padding: 0 !important;
    border: 1px solid #aaa !important;
}

#prd-contacto .form-check label {
    font-size: 12px !important;
    padding: 0 !important;
    line-height: 1.4 !important;
    color: #474747 !important;
}

/* Botón ENVIAR */
#prd-contacto .btn-enviar {
    background: linear-gradient(270deg, #F6A30B 5.55%, #ED6E00 50%) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 10px 24px !important;
    width: 100% !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    cursor: pointer !important;
    height: auto !important;
}

/* Responsive: una columna en móvil */
@media (max-width: 600px) {
    #prd-contacto .col-7,
    #prd-contacto .col-5,
    #prd-contacto .col-6 {
        width: 100% !important;
    }
}

/* =============================================
   CONTACT FORM 7 - FORMULARIO CONTACTO
   Estilos para #prd-contacto en todas las páginas
   ============================================= */

.page .wpcf7,
.page-template-default .wpcf7 {
    padding: 18px 24px !important;
    background: #fff !important;
    border-radius: 13px !important;
    box-shadow: 0px 4px 40px 0px rgba(0,0,0,0.69) !important;
    width: 100% !important;
}

#prd-contacto .wpcf7 {
    padding: 18px 24px;
    background: #fff;
    border-radius: 13px;
    box-shadow: 0px 4px 40px 0px rgba(0,0,0,0.69);
    width: 100%;
}
#prd-contacto .wpcf7 label {
    display: block;
    padding: 2px 0;
    color: #474747;
    font-size: 13px;
    font-weight: 400;
    line-height: normal;
    margin-bottom: 0;
}
#prd-contacto .wpcf7 p {
    margin: 0 0 6px 0 !important;
    line-height: normal !important;
}
#prd-contacto .row {
    display: flex !important;
    flex-wrap: wrap !important;
    margin: 0 -6px !important;
}
#prd-contacto .row > * {
    padding: 0 6px !important;
    margin-top: 6px !important;
    box-sizing: border-box !important;
}
#prd-contacto .col-12 { width: 100% !important; }
#prd-contacto .col-7  { width: 58.333% !important; }
#prd-contacto .col-5  { width: 41.666% !important; }
#prd-contacto .col-6  { width: 50% !important; }
#prd-contacto .wpcf7 input:not([type="submit"]):not([type="checkbox"]) {
    background: #f8f8f8 !important;
    color: #1a1a1a !important;
    border: none !important;
    border-radius: 5px !important;
    padding: 5px 12px !important;
    height: 32px !important;
    line-height: 32px !important;
    font-size: 13px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    font-family: 'Roboto', sans-serif !important;
    display: block !important;
}
#prd-contacto .wpcf7 textarea {
    background: #f8f8f8 !important;
    color: #1a1a1a !important;
    border: none !important;
    border-radius: 5px !important;
    padding: 5px 12px !important;
    height: 75px !important;
    line-height: 1.4 !important;
    font-size: 13px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    resize: vertical !important;
    font-family: 'Roboto', sans-serif !important;
    display: block !important;
}
#prd-contacto .wpcf7 input:focus,
#prd-contacto .wpcf7 textarea:focus {
    border: 1px solid #F6A30B !important;
    outline: none !important;
}
#prd-contacto .lopd-box {
    height: 45px !important;
    font-size: 11px !important;
    color: #474747 !important;
    padding: 0 8px 8px 0 !important;
    overflow: auto !important;
    border-bottom: 1px solid #707070 !important;
    line-height: 1.4 !important;
}
#prd-contacto .lopd-box p,
#prd-contacto .lopd-box a {
    color: #474747 !important;
    font-size: 11px !important;
    margin: 0 !important;
    line-height: 1.4 !important;
}
#prd-contacto .col-12.my-3 {
    margin-top: 8px !important;
    margin-bottom: 4px !important;
}
#prd-contacto .wpcf7-list-item {
    margin: 0 !important;
    display: block !important;
}
#prd-contacto .wpcf7-list-item label {
    display: flex !important;
    align-items: flex-start !important;
    gap: 6px !important;
    font-size: 12px !important;
    padding: 0 !important;
    line-height: 1.4 !important;
    color: #474747 !important;
}
#prd-contacto .wpcf7-list-item input[type="checkbox"] {
    width: 14px !important;
    height: 14px !important;
    flex-shrink: 0 !important;
    margin-top: 2px !important;
    display: inline-block !important;
}
#prd-contacto input[type="submit"],
#prd-contacto .btn-enviar {
    background: linear-gradient(270deg, #F6A30B 5.55%, #ED6E00 50%) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 10px 24px !important;
    width: 100% !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    cursor: pointer !important;
    height: auto !important;
    line-height: normal !important;
    display: block !important;
    margin-top: 8px !important;
}
#prd-contacto .wpcf7-not-valid-tip {
    font-size: 12px !important;
    padding-top: 3px !important;
}
/* Color texto en página de producto */
.prd-page,
.prd-page p,
.prd-page .prd-contact__left p {
    color: #fff;
}
.prd-page .prd-contact {
    color: #ccc;
}

/* Estilos globales CF7 — aplican a cualquier formulario en cualquier página */
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"] {
    background: #f8f8f8 !important;
    color: #1a1a1a !important;
    border: none !important;
    border-radius: 5px !important;
    padding: 5px 12px !important;
    height: 34px !important;
    font-size: 13px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.wpcf7 input:not([type="submit"]):not([type="checkbox"]),
.wpcf7 textarea {
    background-color: #f8f8f8 !important;
    color: #1a1a1a !important;
}

.wpcf7 textarea {
    background: #f8f8f8 !important;
    color: #1a1a1a !important;
    border: none !important;
    border-radius: 5px !important;
    padding: 5px 12px !important;
    height: 80px !important;
    font-size: 13px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    resize: vertical !important;
}

.wpcf7 label {
    color: #474747 !important;
    font-size: 13px !important;
    display: block !important;
    margin-bottom: 2px !important;
}

.page .wpcf7 p,
.page .wpcf7 span,
.page .wpcf7 a,
.page-template-default .wpcf7 p,
.page-template-default .wpcf7 span,
.page-template-default .wpcf7 a {
    color: #474747 !important;
    font-size: 13px !important;
}

.wpcf7 input[type="submit"] {
    background: linear-gradient(270deg, #F6A30B 5.55%, #ED6E00 50%) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 10px 24px !important;
    width: 100% !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    height: auto !important;
}

.woocommerce-additional-fields {
  display: none !important;
}

#rtve-factura-toggle {
  position: relative;
  z-index: 1;
  clear: both;
  width: 100%;
  margin-top: 16px;
}

#necesita_factura_field {
  display: flex !important;
  align-items: center !important;
  clear: both !important;
}

#necesita_factura_field .woocommerce-input-wrapper {
  width: 100% !important;
  float: none !important;
}

#necesita_factura_field label.checkbox {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  float: none !important;
  width: 100% !important;
}

#necesita_factura_field label.checkbox input[type="checkbox"] {
  position: static !important;
  float: none !important;
  margin: 0 !important;
  flex-shrink: 0 !important;
  width: 18px !important;
  height: 18px !important;
}

@media (max-width: 768px) {
  #necesita_factura_field label.checkbox {
    font-size: 14px;
  }
}

/* ── Halo de luz cursor ──────────────────────────────────────────────────── */
.course-card__glow {
  position: absolute;
  width: 200px;
  height: 200px;
  border-radius: 50%;
  pointer-events: none;
  transform: translate(-50%, -50%);
  opacity: 0;
  transition: opacity 0.3s ease;
  z-index: 1;
  mix-blend-mode: screen;
}
.course-card--25h .course-card__glow {
  background: radial-gradient(circle, rgba(121,180,147,0.6) 0%, transparent 70%);
}
.course-card--75h .course-card__glow {
  background: radial-gradient(circle, rgba(235,31,88,0.6) 0%, transparent 70%);
}
.course-card--100h .course-card__glow {
  background: radial-gradient(circle, rgba(159,212,220,0.6) 0%, transparent 70%);
}
.course-card:hover .course-card__glow {
  opacity: 1;
}

/* ── Flechas de navegación del carrusel ─────────────────────────────────── */
.course-section {
  position: relative;
}
.course-rail-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  background: rgba(255,255,255,0.1);
  border: 1px solid rgba(255,255,255,0.2);
  color: #fff;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  backdrop-filter: blur(4px);
  transition: background 0.2s ease;
  display: none;
}
.course-rail-nav:hover {
  background: rgba(255,255,255,0.2);
}
.course-rail-nav--prev {
  left: -20px;
}
.course-rail-nav--next {
  right: -20px;
}
.course-rail-nav svg {
  width: 18px;
  height: 18px;
}

@media (max-width: 768px) {
  .course-rail-nav {
    display: none !important;
  }
}

/* ── font-weight global en botones ──────────────────────────────────────── */
.prd-hero__btn,
.prd-hero__btn--reservar,
.prd-hero__btn--folleto,
.button,
.btn,
.woocommerce-Button,
#place_order,
.wpcf7 input[type="submit"],
.checkout-button,
input[type="submit"] {
  font-weight: 700 !important;
}

.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output {
  color: #000000 !important;
  border-color: #000000 !important;
}

.wpcf7 input:not([type="submit"]):not([type="checkbox"]),
.wpcf7 textarea {
  background-color: #f8f8f8 !important;
  color: #1a1a1a !important;
}