:root {
  --color-ink: #171717;
  --color-muted: #5e6472;
  --color-line: #d7dce5;
  --color-bg: #f5f7fb;
  --color-panel: #ffffff;
  --color-app-brand: #f39b09;
  --color-app-brand-dark: #d38400;
  --color-blue: #78a9f8;
  --color-blue-dark: #2c7be5;
  --color-ects: #1285c7;
  --color-trad: #d37a43;
  --color-trad-dark: #b65f2a;
  --color-teal: #28a9bc;
  --color-green: #56b347;
  --color-app-footer: #243661;
  --shadow-soft: 0 18px 45px rgba(24, 36, 60, 0.08);
  --radius: 18px;
  --container-max-xl: 1280px;
  --container-max-lg: 1180px;
  --container-max-md: 960px;
  --container-max-sm: 720px;
  --container-gutter-desktop: 32px;
  --container-gutter-tablet: 24px;
  --container-gutter-mobile: 16px;
  --container-max: var(--container-max-xl);
  --container-gutter: var(--container-gutter-desktop);
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: "Montserrat", sans-serif;
  background: var(--color-bg);
  color: var(--color-ink);
}

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

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

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: visible;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.container {
  width: min(var(--container-max), calc(100% - var(--container-gutter)));
  margin: 0 auto;
}

.app-shell__container {
  width: min(var(--container-max), calc(100% - var(--container-gutter)));
  margin: 0 auto;
}

@media (max-width: 1439px) {
  :root {
    --container-max: var(--container-max-lg);
  }
}

@media (max-width: 1199px) {
  :root {
    --container-max: var(--container-max-md);
    --container-gutter: var(--container-gutter-tablet);
  }
}

@media (max-width: 991px) {
  :root {
    --container-max: var(--container-max-sm);
    --container-gutter: var(--container-gutter-tablet);
  }
}

@media (max-width: 767px) {
  :root {
    --container-max: 100%;
    --container-gutter: var(--container-gutter-mobile);
  }
}

.app-topbar__inner,
.app-navbar__inner,
.app-footer__bottom,
.section-head,
.course-card__bottom,
.cart-row,
.cart-row__actions,
.coupon-box__row,
.hero-actions,
.hero-grid,
.checkout-layout,
.app-topbar__left,
.app-topbar__right,
.app-topbar__item,
.app-topbar__account,
.app-brand,
.app-brand--secondary,
.app-nav-links,
.app-cart-link,
.app-cart-link__icon,
.app-nav-group__link {
  display: flex;
  align-items: center;
}

.app-topbar__inner,
.app-navbar__inner,
.section-head,
.app-footer__bottom,
.hero-grid,
.checkout-layout {
  justify-content: space-between;
}

.app-header-shell {
  position: relative;
  z-index: 40;
}

.app-topbar {
  background: #000;
  color: #fff;
  font-family: "Montserrat", sans-serif;
  font-size: 14px;
  line-height: 1.4;
}

.app-topbar__inner {
  min-height: 54px;
}

.app-topbar__left,
.app-topbar__right {
  gap: 28px;
}

.app-topbar__item,
.app-topbar__account {
  gap: 8px;
  font-size: 14px;
  color: #fff;
}

.app-topbar__account a:hover,
.app-topbar__item:hover {
  color: #f4bf00;
}

.app-topbar__icon {
  display: inline-flex;
  width: 14px;
  height: 14px;
  color: #f4bf00;
  flex-shrink: 0;
}

.app-topbar__icon svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.app-topbar__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 22px;
  border-radius: 15px;
  background: #f4a000;
  color: #fff;
  font-weight: 700;
  font-size: 15px;
  line-height: 1;
  transition: background 0.2s ease, transform 0.2s ease;
}

.app-topbar__cta:hover {
  background: #e19100;
  transform: translateY(-1px);
}

.app-navbar {
  background: #fff;
  border-bottom: 1px solid var(--color-line);
  font-family: "Montserrat", sans-serif;
  font-size: 16px;
  line-height: 1.35;
  position: relative;
}

.app-navbar.is-sticky {
  position: sticky;
  top: 0;
  z-index: 50;
  box-shadow: 0 10px 34px rgba(17, 24, 39, 0.12);
  animation: app-sticky-in 0.24s ease;
}

@keyframes app-sticky-in {
  from {
    opacity: 0;
    transform: translateY(-18px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.app-navbar__inner {
  display: grid;
  grid-template-columns: minmax(180px, 250px) minmax(420px, 1fr) minmax(170px, 250px);
  align-items: center;
  gap: 22px;
  padding: 24px 0;
}

.app-navbar__brand-column,
.app-navbar__menu-column,
.app-navbar__logos-column {
  min-width: 0;
}

.app-brand {
  gap: 16px;
  flex-shrink: 0;
}

.app-brand--secondary {
  gap: 18px;
  justify-content: flex-end;
}

.header-logo {
  display: block;
  width: auto;
  height: auto;
}

.header-logo--campus {
  width: 218px;
}

.header-logo--anpe {
  width: 70px;
}

.header-logo--ucjc {
  width: 192px;
}

.header-logo--ministerio {
  width: 96px;
  opacity: 0.78;
}

.app-nav-links {
  gap: 18px;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
}

.app-nav-group {
  position: relative;
  display: grid;
  gap: 4px;
  align-content: start;
  min-width: 0;
}

.app-nav-group__link {
  gap: 0;
  align-items: flex-start;
  flex-direction: column;
}

.app-nav-group__title {
  display: block;
  font-size: 15px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: -0.02em;
}

.app-nav-group__subtitle {
  display: block;
  margin-top: 2px;
  color: var(--color-muted);
  font-size: 13px;
  font-weight: 500;
  text-transform: none;
}

.app-nav-group a p,
.app-nav-group span p,
.app-nav-submenu a p,
.course-sidebar__menu h3 p,
.course-sidebar__menu a p,
.app-footer__grid h3 p,
.app-footer__grid a p {
  margin: 0;
}

.app-nav-group--has-children {
  padding-right: 18px;
}

.app-nav-group__toggle {
  position: absolute;
  top: 0;
  right: 0;
  border: 0;
  background: transparent;
  padding: 0;
  width: 14px;
  height: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  cursor: pointer;
  color: var(--color-ink);
}

.app-nav-group__toggle span {
  font-size: 22px;
  line-height: 1;
}

.app-nav-submenu {
  position: absolute;
  top: calc(100% + 16px);
  left: 0;
  min-width: 270px;
  background: #fff;
  border-radius: 0;
  box-shadow: 0 20px 50px rgba(15, 23, 42, 0.16);
  border: 1px solid rgba(23, 23, 23, 0.08);
  border-bottom: 5px solid #f4a000;
  padding: 28px 24px 22px;
  display: none;
  z-index: 60;
}

.app-nav-group--has-children:hover .app-nav-submenu,
.app-nav-group--has-children:focus-within .app-nav-submenu,
.app-nav-group--has-children.is-open .app-nav-submenu {
  display: grid;
  gap: 14px;
}

.app-nav-submenu a {
  text-transform: none;
  font-weight: 500;
  font-size: 15px;
  line-height: 1.45;
}

.app-nav-submenu a:hover {
  color: #f4a000;
}

.app-cart-link {
  gap: 8px;
  align-self: flex-start;
  color: var(--color-muted);
  font-size: 14px;
  padding-top: 2px;
}

.app-cart-link__icon {
  width: 18px;
  height: 18px;
  color: #111;
}

.app-cart-link__icon svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.app-cart-link__text {
  color: var(--color-muted);
}

.app-cart-link__count {
  color: #111;
  font-size: 16px;
}

.app-nav-toggle,
.app-nav-drawer-head {
  display: none;
}

.app-nav-toggle {
  width: 48px;
  height: 48px;
  border: 1px solid var(--color-line);
  background: #fff;
  border-radius: 14px;
  align-items: center;
  justify-content: center;
  gap: 5px;
  flex-direction: column;
  padding: 0;
}

.app-nav-toggle span {
  width: 18px;
  height: 2px;
  background: var(--color-ink);
  border-radius: 99px;
}

.app-nav-toggle--close {
  border: 0;
  width: auto;
  height: auto;
  border-radius: 0;
}

.app-nav-toggle--close span:first-child {
  transform: rotate(45deg) translate(4px, 4px);
}

.app-nav-toggle--close span:last-child {
  transform: rotate(-45deg) translate(3px, -4px);
}

.app-nav-overlay {
  position: fixed;
  inset: 0;
  background: rgba(8, 15, 29, 0.44);
  z-index: 39;
}

.app-header-shell {
  position: relative;
  z-index: 50;
  font-family: "Rubik", "Montserrat", sans-serif;
}

.app-header-shell .full-width-header.header-style1.home1-modifiy {
  width: 100%;
  z-index: 999;
}

.app-header-shell .rs-header {
  display: block;
}

.app-header-shell .dark-parimary-bg {
  background: #000;
}

.app-header-shell .app-header-row {
  display: grid;
  grid-template-columns: 7fr 5fr;
  gap: 20px;
  align-items: center;
}

.app-header-shell .menu-area .app-header-row {
  grid-template-columns: max-content minmax(0, 1fr) minmax(150px, 190px);
  gap: clamp(8px, 0.9vw, 14px);
}

.app-header-shell .topbar-area {
  color: #fff;
}

.app-header-shell .topbar-contact,
.app-header-shell .topbar-right,
.app-header-shell .nav-menu,
.app-header-shell .sub-menu {
  margin: 0;
  padding: 0;
  list-style: none;
}

.app-header-shell .topbar-contact,
.app-header-shell .topbar-right {
  display: flex;
  align-items: center;
  gap: 26px;
  min-height: 54px;
}

.app-header-shell .topbar-right {
  justify-content: flex-end;
}

.app-header-shell .topbar-contact li,
.app-header-shell .topbar-right li,
.app-header-shell .login-register {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: #fff;
}

.app-header-shell .topbar-contact a,
.app-header-shell .topbar-right a {
  color: inherit;
}

.app-header-shell .topbar-contact a:hover,
.app-header-shell .topbar-right a:hover {
  color: #f39304;
}

.app-header-shell .app-header-icon {
  width: 14px;
  height: 14px;
  color: #f4a000;
  display: inline-flex;
  flex-shrink: 0;
}

.app-header-shell .app-header-icon svg,
.app-header-shell .app-header-cart-icon svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.app-header-shell .btn-part .apply-btn {
  background: #f4a000;
  color: #fff;
  font-size: 15px;
  line-height: 48px;
  height: 48px;
  padding: 0 22px;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
}

.app-header-shell .btn-part .apply-btn:hover {
  background: #e19100;
  color: #fff;
}

.app-header-shell .menu-area {
  background: #fff !important;
  border-bottom: 1px solid var(--color-line);
  transition: all 0.3s ease;
}

.app-header-shell .menu-area.sticky {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
  animation: app-sticky-in 0.5s ease-out both;
}

.app-header-shell .logo-cat-wrap,
.app-header-shell #entidades-colaboradoras {
  min-height: 120px;
  display: flex;
  align-items: center;
}

.app-header-shell .logo-part a {
  display: flex;
  align-items: center;
  gap: 18px;
}

.app-header-shell .header-logo--campus {
  width: 166px;
}

.app-header-shell .header-logo--anpe {
  width: 66px;
}

.app-header-shell .header-logo--ucjc {
  width: auto;
  max-width: 168px;
  max-height: 36px;
  object-fit: contain;
}

.app-header-shell .header-logo--ministerio {
  width: auto;
  max-width: 158px;
  max-height: 36px;
  object-fit: contain;
  opacity: 0.82;
}

.app-header-shell #entidades-colaboradoras {
  justify-content: flex-end;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.app-header-shell #entidades-colaboradoras a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
}

.app-header-shell .rs-menu-area {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.app-header-shell .main-menu {
  width: 100%;
}

.app-header-shell .nav-menu {
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  gap: clamp(18px, 1.7vw, 26px);
  min-width: 0;
}

.app-header-shell .nav-menu > li {
  display: flex;
  margin-right: 0;
  padding: 0;
  position: relative;
  min-width: 0;
}

.app-header-shell .nav-menu > li:not(.cart-inner) {
  flex: 0 1 auto;
}

.app-header-shell .nav-menu > li.cart-inner {
  flex: 0 0 auto;
}

.app-header-shell .nav-menu > li:last-child {
  margin-right: 0 !important;
}

.app-header-shell .nav-menu > li > a {
  transition: all 0.3s ease;
  font-size: clamp(13px, 0.95vw, 15px);
  font-weight: 500;
  text-transform: uppercase;
  height: 120px;
  line-height: 120px;
  padding-right: 22px;
  margin-right: 0;
  color: #333 !important;
  position: relative;
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 4px;
  min-width: 0;
  max-width: clamp(150px, 16vw, 300px);
  text-align: left;
  white-space: normal;
}

.app-header-shell .nav-menu > li > a:hover,
.app-header-shell .nav-menu > li.current-menu-item > a {
  color: #0c8b51 !important;
}

.app-header-shell .nav-menu > li.menu-item-has-children > a::before {
  content: "+";
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%);
  transition: all 0.3s ease;
}

.app-header-shell .nav-menu > li.menu-item-has-children:hover > a::before {
  content: "-";
}

.app-header-shell .nav-menu > li > a .span-title {
  display: block;
  font-size: clamp(13px, 0.95vw, 15px);
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -0.01em;
  white-space: normal;
  text-wrap: auto;
}

.app-header-shell .app-header-subtitle {
  display: block;
  color: #5f6675;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.3;
  text-transform: none;
  white-space: normal;
  text-wrap: auto;
}

.app-header-shell .sub-menu {
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 270px;
  background: #fff;
  padding: 28px 24px 22px;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
  border-bottom: 5px solid #f4a000;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-10px) scaleY(0);
  transform-origin: 0 0 0;
  transition: all 0.3s ease-in-out;
  z-index: 120;
}

.app-header-shell .nav-menu > li:hover > .sub-menu,
.app-header-shell .nav-menu > li.is-open > .sub-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scaleY(1);
}

.app-header-shell .sub-menu li {
  margin: 0;
  border: 0;
}

.app-header-shell .sub-menu li a {
  display: block;
  color: #111 !important;
  font-size: 15px;
  font-weight: 400 !important;
  line-height: 1.45;
  padding: 8px 0 !important;
  text-transform: none;
}

.app-header-shell .sub-menu li a:hover,
.app-header-shell .sub-menu li.active > a {
  color: #f39304 !important;
}

.app-header-shell .cart-inner {
  position: relative;
  padding-right: 0;
}

.app-header-shell .cart-icon {
  position: relative;
  height: 120px;
  line-height: 120px;
  color: #394459;
  display: inline-flex;
  align-items: center;
}

.app-header-shell .cart-icon--mobile {
  display: none;
}

.app-header-shell .app-header-cart-icon {
  width: 19px;
  height: 19px;
  color: #111;
  display: inline-flex;
}

.app-header-shell .cart-count {
  position: absolute;
  min-width: 18px;
  min-height: 18px;
  line-height: 18px;
  font-size: 11px;
  border-radius: 50%;
  background: #f2f2f2;
  color: #505050;
  top: 35px;
  right: -12px;
  text-align: center;
}

.app-header-shell .mobile-menu {
  display: none;
}

.app-header-shell .rs-menu-toggle {
  color: #f39304;
  text-align: right;
  background: transparent;
  border: 0;
  padding: 0;
}

.app-header-shell .app-header-toggle-lines {
  display: inline-flex;
  flex-direction: column;
  gap: 4px;
}

.app-header-shell .app-header-toggle-lines span {
  width: 24px;
  height: 2px;
  border-radius: 999px;
  background: #f39304;
  display: block;
}

.app-header-shell .rs-menu-parent {
  display: none;
  border: 0;
  padding: 0;
  font: inherit;
}

.app-header-shell .text-right {
  text-align: right;
}

.app-header-shell .text-justify {
  text-align: justify;
}

.app-header-shell .d-none {
  display: none !important;
}

@media (min-width: 1200px) {
  .app-header-shell .d-xl-block {
    display: block !important;
  }

  .app-header-shell #entidades-colaboradoras.d-xl-block {
    display: flex !important;
  }
}

@media (max-width: 991px) {
  .app-header-shell .topbar-contact,
  .app-header-shell .topbar-right {
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
    min-height: auto;
    padding: 10px 0;
  }

  .app-header-shell .app-header-row,
  .app-header-shell .menu-area .app-header-row {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .app-header-shell .logo-cat-wrap,
  .app-header-shell #entidades-colaboradoras {
    min-height: 84px;
  }

  .app-header-shell .logo-part a {
    justify-content: flex-start;
  }

  .app-header-shell #entidades-colaboradoras {
    display: none !important;
  }

  .app-header-shell .mobile-menu {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    min-height: 84px;
  }

  .app-header-shell .rs-menu-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    line-height: 1;
    border-radius: 14px;
    background: #fff8ec;
    border: 1px solid rgba(243, 147, 4, 0.18);
  }

  .app-header-shell .rs-menu {
    display: none;
    background: #fff;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
  }

  .app-header-shell .rs-menu.is-open {
    display: block;
  }

  .app-header-shell .nav-menu {
    display: block;
  }

  .app-header-shell .nav-menu > li {
    display: block !important;
    margin-right: 0 !important;
    border-bottom: 1px solid #ececec;
  }

  .app-header-shell .nav-menu > li > a {
    height: auto;
    line-height: 1.35;
    min-height: 70px;
    padding: 14px 52px 14px 0;
    margin-right: 0;
  }

  .app-header-shell .nav-menu > li.menu-item-has-children > a::before {
    display: none;
  }

  .app-header-shell .rs-menu-parent {
    display: flex;
    position: absolute;
    right: 0;
    top: 0;
    width: 45px;
    height: 70px;
    align-items: center;
    justify-content: center;
    background: #ddd;
    cursor: pointer;
    z-index: 2;
    font-weight: 700;
    line-height: 1;
  }

  .app-header-shell .rs-menu-parent:focus-visible,
  .app-header-shell .rs-menu-toggle:focus-visible,
  .app-header-shell .cart-icon--mobile:focus-visible,
  .app-header-shell .nav-menu a:focus-visible {
    outline: 2px solid #0f4c81;
    outline-offset: 3px;
  }

  .app-header-shell .sub-menu {
    position: static;
    min-width: 0;
    background: #fff;
    padding: 10px 0 12px;
    box-shadow: none;
    border-bottom: 0;
    border-left: 2px solid rgba(243, 147, 4, 0.28);
    margin-left: 12px;
    opacity: 1;
    visibility: visible;
    transform: none;
    display: none;
  }

  .app-header-shell .nav-menu > li.is-open > .sub-menu {
    display: block;
  }

  .app-header-shell .sub-menu li a {
    padding: 10px 14px !important;
  }

  .app-header-shell .cart-inner {
    display: none !important;
  }

  .app-header-shell .cart-icon--mobile {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 14px;
    background: #f7f8fb;
    border: 1px solid rgba(27, 46, 78, 0.1);
    line-height: 1;
  }

  .app-header-shell .cart-icon--mobile .app-header-cart-icon {
    width: 20px;
    height: 20px;
  }

  .app-header-shell .cart-icon--mobile .cart-count {
    top: -6px;
    right: -6px;
    left: auto;
    background: #f4a000;
    color: #fff;
    min-width: 20px;
    min-height: 20px;
    line-height: 20px;
    font-weight: 700;
  }

  .app-header-shell .nav-menu > li > a .span-title {
    font-size: 16px;
  }

  .app-header-shell .app-header-subtitle {
    font-size: 14px;
    line-height: 1.35;
  }

  .app-header-shell .sub-menu li a {
    font-size: 14px;
    line-height: 1.45;
    padding: 11px 14px !important;
  }

  .app-header-shell .rs-menu-parent {
    background: #eef1f6;
    color: #213251;
  }

  .app-header-shell .topbar-area .app-header-col {
    text-align: center !important;
  }

  .app-header-shell .topbar-right .btn-part {
    width: 100%;
    display: flex;
    justify-content: center;
  }
}

.site-main {
  min-height: 60vh;
}

.store-main {
  padding: 36px 0 64px;
}

.store-shell {
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr);
  gap: 28px;
  align-items: stretch;
}

.store-shell--full-width {
  display: block;
}

.store-sidebar {
  align-self: stretch;
}

.store-sidebar__inner {
  display: grid;
  gap: 22px;
  min-height: 100%;
  align-content: start;
}

.store-content {
  min-width: 0;
}

.store-content--full-width {
  width: 100%;
}

.store-content > section:first-child {
  padding-top: 0;
}

.store-content .container {
  width: 100%;
  margin: 0;
}

.cms-page-content {
  margin-top: 20px;
}

.cms-page-container--full-width {
  width: 100%;
}

.legacy-page {
  padding: 1.5rem 0;
}

.legacy-page__content {
  overflow-wrap: anywhere;
}

.legacy-page__content img,
.legacy-page__content iframe,
.legacy-page__content video {
  max-width: 100%;
}

.legacy-page__content picture {
  display: block;
}

.admin-topbar__actions {
  display: flex;
  align-items: center;
  gap: 12px;
}

.admin-user-chip {
  display: grid;
  gap: 2px;
  padding: 10px 14px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.75);
  border: 1px solid rgba(28, 52, 84, 0.12);
}

.admin-user-chip strong {
  font-size: 0.95rem;
}

.admin-user-chip span {
  font-size: 0.8rem;
  color: var(--color-muted);
}

.admin-tabs {
  display: flex;
  gap: 10px;
  margin: 0 0 18px;
}

.admin-tab {
  padding: 10px 16px;
  border-radius: 999px;
  border: 1px solid rgba(28, 52, 84, 0.14);
  background: #fff;
  font-weight: 700;
}

.admin-tab.is-active {
  background: #0c89bb;
  color: #fff;
  border-color: #0c89bb;
}

.admin-visibility {
  margin-top: 1rem;
  padding: 1rem;
  border: 1px solid #d8e0ee;
  border-radius: 14px;
  background: #f8fbff;
}

.admin-visibility legend {
  padding: 0 .35rem;
  font-weight: 700;
  color: #163b6b;
}

.admin-visibility select[multiple] {
  min-height: 220px;
}

.admin-page-featured-preview {
  margin: 1rem 0 1.25rem;
}

.admin-page-featured-preview img {
  display: block;
  max-width: 320px;
  width: 100%;
  height: auto;
  border-radius: 16px;
  border: 1px solid rgba(28, 52, 84, 0.12);
  box-shadow: 0 18px 32px rgba(14, 30, 55, 0.08);
}

.admin-wysiwyg {
  display: grid;
  gap: 12px;
}

.admin-wysiwyg + .admin-wysiwyg {
  margin-top: 10px;
}

.admin-wysiwyg__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}

.admin-wysiwyg__tabs {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.admin-wysiwyg__tab {
  border: 1px solid var(--color-line);
  background: #fff;
  color: var(--color-muted);
  border-radius: 999px;
  padding: 10px 16px;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}

.admin-wysiwyg__tab.is-active {
  border-color: var(--color-blue-dark);
  color: #fff;
  background: var(--color-blue-dark);
}

.admin-wysiwyg .ql-toolbar.ql-snow {
  border: 1px solid var(--color-line);
  border-radius: 14px 14px 0 0;
  background: #fff;
}

.admin-wysiwyg .ql-container.ql-snow {
  border: 1px solid var(--color-line);
  border-top: 0;
  border-radius: 0 0 14px 14px;
  background: #fff;
  min-height: 420px;
}

.admin-wysiwyg .ql-editor {
  min-height: 420px;
  font-family: "Montserrat", sans-serif;
  font-size: 16px;
  line-height: 1.7;
}

.admin-wysiwyg .ql-editor img {
  max-width: 100%;
  height: auto;
}

.admin-wysiwyg__code {
  min-height: 420px !important;
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  white-space: pre-wrap;
}

.admin-wysiwyg .is-hidden {
  display: none !important;
}

.admin-body--auth {
  min-height: 100vh;
  display: grid;
  place-items: center;
  background:
    radial-gradient(circle at top left, rgba(12, 137, 187, 0.18), transparent 26%),
    linear-gradient(180deg, #f6f8fc 0%, #eef2f8 100%);
}

.admin-auth-card {
  width: min(100%, 460px);
  padding: 24px;
}

.admin-auth-card__inner {
  background: #fff;
  border-radius: 26px;
  padding: 36px 32px;
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.12);
  border: 1px solid rgba(28, 52, 84, 0.08);
}

.hero,
.page-hero,
.wizard {
  padding: 48px 0;
}

.hero {
  background:
    radial-gradient(circle at top right, rgba(243, 155, 9, 0.16), transparent 30%),
    linear-gradient(180deg, #fff 0%, #f6f8fc 100%);
}

.hero-grid {
  gap: 40px;
}

.hero-grid > * {
  flex: 1;
}

.eyebrow {
  color: var(--color-app-brand);
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

h1,
h2,
h3,
p {
  margin-top: 0;
}

h1 {
  font-size: clamp(2rem, 4vw, 3.6rem);
  line-height: 1.05;
}

h2 {
  font-size: clamp(1.5rem, 2vw, 2.2rem);
}

.lead {
  color: var(--color-muted);
  max-width: 62ch;
  font-size: 1.05rem;
  line-height: 1.7;
}

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 18px;
  border-radius: 12px;
  border: 0;
  font-weight: 700;
  cursor: pointer;
}

.button--gold {
  background: var(--color-app-brand);
  color: #fff;
}

.button--blue {
  background: var(--color-blue);
  color: #fff;
}

.button--green {
  background: var(--color-green);
  color: #fff;
}

.button--ghost {
  background: #fff;
  border: 1px solid var(--color-line);
}

.button--danger {
  background: #d93c47;
  color: #fff;
}

.button:focus-visible,
.icon-button:focus-visible,
.choice-pill:focus-visible,
.course-tabs a:focus-visible,
.coupon-box input:focus-visible,
.auth-form input:focus-visible,
.auth-form select:focus-visible,
.checkout-terms input:focus-visible,
.auth-check input:focus-visible,
.site-main a:focus-visible {
  outline: 2px solid #0f4c81;
  outline-offset: 3px;
}

.back-to-top {
  position: fixed;
  right: max(18px, env(safe-area-inset-right));
  bottom: max(18px, env(safe-area-inset-bottom));
  width: 56px;
  height: 56px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #0f4c81;
  color: #fff;
  box-shadow: 0 18px 38px rgba(15, 76, 129, 0.28);
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease, background-color 0.2s ease;
  z-index: 45;
}

.back-to-top:hover {
  background: #0b3c66;
}

.back-to-top.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.back-to-top svg {
  width: 24px;
  height: 24px;
  fill: currentColor;
}

.back-to-top:focus-visible {
  outline: 2px solid #0f4c81;
  outline-offset: 4px;
  box-shadow: 0 0 0 6px rgba(255, 255, 255, 0.92), 0 18px 38px rgba(15, 76, 129, 0.28);
}

@media (prefers-reduced-motion: reduce) {
  .back-to-top {
    transition: none;
  }
}

.icon-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  border: 1px solid rgba(27, 46, 78, 0.12);
  background: #fff;
  color: #23314f;
  cursor: pointer;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease, color 0.18s ease, background 0.18s ease;
}

.icon-button:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(16, 24, 40, 0.12);
}

.icon-button svg {
  width: 18px;
  height: 18px;
  fill: currentColor;
}

.icon-button--danger {
  color: #a93412;
  border-color: rgba(169, 52, 18, 0.18);
  background: #fff7f4;
}

.icon-button--danger:hover {
  color: #912400;
  border-color: rgba(169, 52, 18, 0.32);
  background: #ffefe9;
}

.promo-strip {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-bottom: 18px;
}

.promo-strip span,
.promo-boxes span {
  background: #fff;
  border: 1px solid #dce6f5;
  border-radius: 12px;
  padding: 14px;
  text-align: center;
  font-weight: 700;
}

.hero-panel,
.wizard-shell,
.checkout-card {
  background: var(--color-panel);
  border-radius: var(--radius);
  box-shadow: var(--shadow-soft);
  padding: 24px;
}

.section {
  padding: 1rem 0 4rem;
}

.section-head {
  margin-bottom: 24px;
}

.section-head a {
  color: var(--color-blue-dark);
  font-weight: 700;
}

.promo-top-banner {
  padding: 0 0 16px;
  text-align: center;
}

.promo-banner {
  margin: 0 auto;
  text-align: center;
}

.promo-banner--mobile {
  display: none;
}

.promo-banner a {
  display: inline-block;
  max-width: 100%;
}

.promo-banner img {
  display: block;
  height: auto;
  max-width: 100%;
}

@media (max-width: 575.98px) {
  .promo-banner--desktop {
    display: none;
  }

  .promo-banner--mobile {
    display: block;
  }
}

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

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

.course-grid--category {
  gap: 18px;
}

.course-grid--category .course-card {
  padding: 24px 26px;
  border-left-width: 5px;
}

.opposition-hero h1 {
  max-width: 920px;
}

.opposition-hero p {
  max-width: 760px;
}

.opposition-forecast-map-shortcode {
  margin: 0 auto 26px;
  position: relative;
  width: min(var(--container-max), calc(100% - var(--container-gutter)));
  z-index: 3;
}

.opposition-forecast-map__intro {
  margin-bottom: 20px;
  max-width: 820px;
}

.opposition-forecast-map__intro h2 {
  font-size: clamp(1.9rem, 3.5vw, 3.05rem);
  letter-spacing: -0.045em;
  line-height: 1.02;
  margin: 0 0 12px;
}

.opposition-forecast-map__intro p {
  color: var(--color-muted);
  font-size: clamp(1rem, 1.4vw, 1.13rem);
  line-height: 1.45;
  margin: 0;
}

.opposition-forecast-map__layout {
  align-items: stretch;
  background:
    radial-gradient(circle at 18% 18%, rgba(120, 169, 248, 0.18), transparent 32%),
    linear-gradient(135deg, #ffffff 0%, #f3f7fc 100%);
  border: 1px solid #d9e3ef;
  border-radius: 30px;
  box-shadow: 0 22px 48px rgba(24, 36, 60, 0.08);
  display: grid;
  gap: 22px;
  grid-template-columns: 1fr;
  overflow: visible;
  padding: clamp(18px, 2.2vw, 28px);
}

.opposition-forecast-map__canvas {
  aspect-ratio: 900.4 / 670.2;
  background: #e8f2ff;
  border: 1px solid rgba(44, 123, 229, 0.13);
  border-radius: 24px;
  overflow: visible;
  position: relative;
  z-index: 4;
}

.opposition-forecast-map__svg {
  height: 100%;
  inset: 0;
  pointer-events: none;
  position: absolute;
  width: 100%;
  z-index: 0;
}

.opposition-forecast-map__spot {
  left: var(--map-x);
  position: absolute;
  top: var(--map-y);
  transform: translate(-50%, -50%);
  z-index: 2;
}

.opposition-forecast-map__spot:hover,
.opposition-forecast-map__spot:focus-within,
.opposition-forecast-map__spot.is-active {
  z-index: 30;
}

.opposition-forecast-map__marker {
  align-items: center;
  background: var(--color-app-brand);
  border: 4px solid #fff;
  border-radius: 999px;
  box-shadow: 0 10px 22px rgba(211, 132, 0, 0.28), 0 0 0 0 rgba(243, 155, 9, 0.28);
  display: flex;
  height: 24px;
  justify-content: center;
  position: relative;
  transition: transform 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
  width: 24px;
}

.opposition-forecast-map__marker::after {
  background: rgba(243, 155, 9, 0.18);
  border-radius: inherit;
  content: "";
  inset: -10px;
  position: absolute;
}

.opposition-forecast-map__marker:hover,
.opposition-forecast-map__marker:focus-visible {
  background: #123d6d;
  box-shadow: 0 14px 28px rgba(18, 61, 109, 0.28), 0 0 0 10px rgba(44, 123, 229, 0.13);
  outline: none;
  transform: scale(1.12);
}

.opposition-forecast-map__card {
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid #dce5f2;
  border-radius: 18px;
  box-shadow: 0 16px 34px rgba(24, 36, 60, 0.08);
  color: #1c2230;
  display: grid;
  gap: 12px;
  padding: 16px;
}

.opposition-forecast-map__card--floating {
  left: 50%;
  min-width: 310px;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  top: calc(100% + 10px);
  transform: translate(-50%, 8px);
  transition: opacity 0.18s ease, transform 0.18s ease;
  z-index: 40;
}

.opposition-forecast-map__card--floating::before {
  content: "";
  height: 14px;
  left: 0;
  position: absolute;
  right: 0;
  top: -14px;
}

.opposition-forecast-map__spot--upper .opposition-forecast-map__card--floating {
  bottom: calc(100% + 10px);
  top: auto;
  transform: translate(-50%, -8px);
}

.opposition-forecast-map__spot--upper .opposition-forecast-map__card--floating::before {
  bottom: -14px;
  top: auto;
}

.opposition-forecast-map__spot--left .opposition-forecast-map__card--floating {
  left: 0;
  transform: translate(-12%, 8px);
}

.opposition-forecast-map__spot--right .opposition-forecast-map__card--floating {
  left: 100%;
  transform: translate(-88%, 8px);
}

.opposition-forecast-map__spot--upper.opposition-forecast-map__spot--left .opposition-forecast-map__card--floating {
  transform: translate(-12%, -8px);
}

.opposition-forecast-map__spot--upper.opposition-forecast-map__spot--right .opposition-forecast-map__card--floating {
  transform: translate(-88%, -8px);
}

.opposition-forecast-map__spot:hover .opposition-forecast-map__card--floating,
.opposition-forecast-map__spot:focus-within .opposition-forecast-map__card--floating,
.opposition-forecast-map__spot.is-active .opposition-forecast-map__card--floating {
  opacity: 1;
  pointer-events: auto;
  transform: translate(-50%, 0);
}

.opposition-forecast-map__spot--left:hover .opposition-forecast-map__card--floating,
.opposition-forecast-map__spot--left:focus-within .opposition-forecast-map__card--floating,
.opposition-forecast-map__spot--left.is-active .opposition-forecast-map__card--floating {
  transform: translate(-12%, 0);
}

.opposition-forecast-map__spot--right:hover .opposition-forecast-map__card--floating,
.opposition-forecast-map__spot--right:focus-within .opposition-forecast-map__card--floating,
.opposition-forecast-map__spot--right.is-active .opposition-forecast-map__card--floating {
  transform: translate(-88%, 0);
}

.opposition-forecast-map__card-head {
  display: block;
}

.opposition-forecast-map__card-head h4 {
  color: #12233f;
  font-size: 1.12rem;
  line-height: 1.15;
  margin: 0;
}

.opposition-forecast-map__stats {
  display: grid;
  gap: 10px;
  grid-template-columns: 1fr;
  margin: 0;
}

.opposition-forecast-map__stats div {
  background: #f3f7fc;
  border: 1px solid #e1e9f4;
  border-radius: 14px;
  padding: 10px;
}

.opposition-forecast-map__stats dt {
  color: #667085;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  margin-bottom: 4px;
  text-transform: uppercase;
}

.opposition-forecast-map__stats dd {
  color: #2b1545;
  font-size: 1.18rem;
  font-weight: 800;
  line-height: 1.12;
  margin: 0;
  overflow-wrap: anywhere;
}

.opposition-forecast-map__stats dd span {
  color: var(--color-app-brand-dark);
  display: block;
  font-size: 0.72rem;
  letter-spacing: 0.04em;
  margin-top: 5px;
  text-transform: uppercase;
}

.opposition-forecast-map__courses-link {
  background: #123d6d;
  border-radius: 999px;
  color: #fff;
  display: block;
  font-size: 0.9rem;
  font-weight: 850;
  padding: 11px 14px;
  text-align: center;
  width: 100%;
}

.opposition-map-selector {
  margin: 0 auto;
  max-width: 940px;
}

.opposition-map-selector h2 {
  color: #344563;
  font-size: clamp(1.55rem, 2.6vw, 2rem);
  font-weight: 500;
  line-height: 1.2;
  margin: 0 0 18px;
}

.opposition-map-selector .panel-group {
  display: grid;
  gap: 16px;
}

.opposition-map-selector .panel {
  background: #fff;
  border: 1px solid #d4dbe6;
  border-radius: 4px;
  overflow: hidden;
}

.opposition-map-selector .panel-heading {
  background: rgba(20, 35, 58, 0.035);
  border: 0;
  border-bottom: 1px solid rgba(20, 35, 58, 0.11);
  color: inherit;
  cursor: pointer;
  display: block;
  font: inherit;
  padding: 12px 20px;
  text-align: left;
  width: 100%;
}

.opposition-map-selector .panel-heading:hover,
.opposition-map-selector .panel-heading:focus-visible {
  background: #f1f5fb;
}

.opposition-map-selector .panel-heading:focus-visible {
  outline: 3px solid rgba(73, 126, 190, 0.3);
  outline-offset: -3px;
}

.opposition-map-selector .link-comunidad {
  align-items: center;
  color: #555;
  display: flex;
  text-shadow: 1px 1px 1px #fff;
  width: 100%;
}

.opposition-map-selector .imgComunidad {
  background-image: url("/assets/img/guia-oposiciones/comunidades_iconos.png");
  display: inline-block;
  flex: 0 0 99px;
  height: 53px;
  margin: 0 auto;
  width: 99px;
}

.opposition-map-selector .titleComunidad {
  color: #3f4652;
  flex: 1;
  font-size: 1.12rem;
  font-weight: 700;
  text-align: center;
}

.opposition-map-selector .panel-collapse {
  display: none;
}

.opposition-map-selector .panel-collapse.in {
  display: block;
}

.opposition-map-selector .panel-body {
  padding: 18px 24px 22px;
}

.opposition-map-selector h4 {
  color: #333;
  font-size: 1.05rem;
  margin: 0 0 10px;
}

.opposition-map-selector .list-group {
  display: grid;
  gap: 0;
  margin: 0 0 16px;
  padding: 0;
}

.opposition-map-selector .list-group-item {
  background: #fff;
  border: 1px solid #ddd;
  color: #333;
  display: block;
  list-style: none;
  margin: 0 0 -1px;
  padding: 10px 15px;
  text-decoration: none;
}

.opposition-map-selector .list-group-item strong {
  font-weight: 800;
}

.opposition-map-selector .forecast-note {
  color: #e1541b;
  display: block;
  font-size: 0.9rem;
  margin-top: 4px;
  text-align: center;
}

.opposition-map-selector .lista-enlaces {
  margin-bottom: 0;
}

.opposition-map-selector .lista-enlaces .list-group-item {
  font-weight: 800;
}

.opposition-map-selector .text-center {
  text-align: center;
}

.opposition-map-selector .list-group-item-warning {
  background: #fff8e7;
  border-color: #f3d88a;
  color: #7c5600;
}

.opposition-map-selector .list-group-item-info {
  background: #eef7ff;
  border-color: #bdddf7;
  color: #1b588b;
}

.opposition-map-selector .list-group-item-success {
  background: #edf8ef;
  border-color: #bfe2c5;
  color: #266735;
}

.community-news__more {
  align-items: center;
  background: #fff;
  border: 1px solid #cdd8e9;
  border-radius: 999px;
  color: #123d6d;
  display: inline-flex;
  font-weight: 800;
  justify-content: center;
  padding: 12px 16px;
  text-align: center;
}

.community-guide-hero {
  background: #fff;
  border: 1px solid #dbe2ea;
  box-shadow: 0 10px 24px rgba(24, 36, 60, 0.06);
  margin: 0 auto;
  max-width: var(--container-max);
  overflow: hidden;
}

.community-guide-hero__image {
  background-image:
    linear-gradient(90deg, rgba(255, 255, 255, 0.36), rgba(255, 255, 255, 0.02) 52%, rgba(255, 255, 255, 0.25)),
    var(--community-guide-bg);
  background-position: left top;
  background-repeat: no-repeat;
  background-size: cover;
  min-height: 345px;
  position: relative;
}

.community-guide-hero__title {
  left: 34px;
  position: absolute;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.55);
  top: 26px;
}

.community-guide-hero__title p {
  color: #2c6599;
  font-size: clamp(1.4rem, 2vw, 1.9rem);
  font-weight: 800;
  line-height: 1.05;
  margin: 0 0 4px;
}

.community-guide-hero__title h1 {
  color: #4a4d55;
  font-size: clamp(1.7rem, 3vw, 2.65rem);
  line-height: 1.02;
  margin: 0;
  max-width: 760px;
}

.community-guide-convocation {
  background: #fff;
  padding: 28px 28px 22px;
}

.community-guide-convocation h2 {
  color: #333;
  font-size: clamp(1.55rem, 2.7vw, 2.25rem);
  font-weight: 400;
  line-height: 1.1;
  margin: 0 0 16px;
}

.community-guide-convocation h2 span {
  color: #4f77ae;
}

.community-guide-convocation__grid {
  align-items: stretch;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(230px, 0.9fr);
}

.community-guide-convocation__grid article {
  min-height: 96px;
  padding: 4px 26px 8px;
  text-align: center;
}

.community-guide-convocation__grid article + article {
  border-left: 1px solid #bcc2ca;
}

.community-guide-convocation__grid span {
  color: #111;
  display: block;
  font-size: 0.92rem;
  font-weight: 800;
  margin-bottom: 2px;
}

.community-guide-convocation__grid strong {
  color: #61166e;
  display: block;
  font-size: clamp(2.75rem, 5vw, 4.15rem);
  font-weight: 400;
  letter-spacing: 0.01em;
  line-height: 0.98;
}

.community-guide-convocation__grid em {
  color: #e8641b;
  display: block;
  font-size: 1rem;
  font-style: normal;
  margin-top: 10px;
}

.community-guide-convocation__calls {
  display: flex;
  flex-direction: column;
  gap: 8px;
  justify-content: center;
}

.community-guide-convocation__calls span {
  color: #5b140d;
  font-size: 1.25rem;
  font-weight: 500;
  margin-bottom: 6px;
}

.community-guide-convocation__calls a {
  color: #111;
  font-size: 1rem;
  text-decoration: none;
}

.community-guide-convocation__calls a:hover {
  color: #2c6599;
}

.community-guide-tabs {
  background: #0f2946;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
}

.community-guide-tabs a {
  background: #f7f9fc;
  border-top: 1px solid #d8e0ea;
  color: #475569;
  min-height: 70px;
  padding: 13px 14px 10px;
  text-align: center;
  text-decoration: none;
  transition: background-color 0.18s ease, color 0.18s ease;
}

.community-guide-tabs a strong {
  color: #113b67;
  display: block;
  font-size: clamp(1.2rem, 2vw, 1.65rem);
  font-weight: 800;
  letter-spacing: 0.02em;
  line-height: 1.05;
}

.community-guide-tabs a span {
  display: block;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 1.2;
  margin-top: 7px;
  opacity: 0.74;
  text-transform: uppercase;
}

.community-guide-tabs a:hover {
  background: #edf4ff;
}

.community-guide-tabs a.is-active {
  background: #113b67;
  color: #fff;
}

.community-guide-tabs a.is-active strong {
  color: #fff;
}

.community-guide-tabs a.is-active span {
  opacity: 0.86;
}

.community-guide-layout {
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(420px, 1.15fr);
  gap: 24px;
  align-items: start;
}

.community-guide-panel,
.community-news {
  background: #fff;
  border: 1px solid var(--color-line);
  border-radius: 22px;
  padding: 28px;
}

.community-news--full {
  padding: clamp(24px, 4vw, 40px);
}

.community-guide-cta {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 22px;
}

.community-news__grid {
  display: grid;
  gap: 18px;
  grid-template-columns: 1fr;
}

.community-news-card {
  align-items: start;
  border: 1px solid #cfd6df;
  border-radius: 0;
  display: grid;
  grid-template-columns: 230px minmax(0, 1fr);
  gap: 24px;
  overflow: hidden;
  padding: 18px 22px;
  transition: border-color 0.18s ease, transform 0.18s ease;
}

.community-news-card:hover {
  border-color: #b9cbe4;
  transform: translateY(-2px);
}

.community-news-card img {
  aspect-ratio: 16 / 9;
  border-radius: 0;
  height: auto;
  object-fit: cover;
  width: 100%;
}

.community-news-card time {
  color: #565f6c;
  display: block;
  font-size: 0.9rem;
  font-weight: 700;
  margin: 10px 0 0;
  text-align: center;
}

.community-news-card h3 {
  font-size: clamp(1.1rem, 1.8vw, 1.45rem);
  line-height: 1.25;
  margin: 0 0 10px;
}

.community-news-card h3 a {
  color: #123d6d;
}

.community-news-card p {
  color: #555f6f;
  font-size: 1rem;
  line-height: 1.6;
  margin: 0;
}

.community-news__more {
  margin-top: 18px;
}

.community-guide-panel--imported {
  color: #303743;
  font-size: 1rem;
  line-height: 1.65;
}

.community-guide-panel--imported #wrapOposicionesComunidadGuia > h2 {
  border-bottom: 1px solid #c9d4e2;
  color: #2d537f;
  font-size: clamp(1.7rem, 2.8vw, 2.35rem);
  font-weight: 500;
  line-height: 1.15;
  margin: 0 0 22px;
  padding-bottom: 10px;
}

.community-guide-panel--imported #wrapOposicionesComunidadGuia > h3 {
  color: #20242b;
  font-size: clamp(1.05rem, 1.5vw, 1.25rem);
  line-height: 1.35;
  margin: 0 0 18px;
  text-transform: uppercase;
}

.community-guide-panel--imported p,
.community-guide-panel--imported li {
  color: #444c58;
}

.community-guide-panel--imported ul {
  margin: 0 0 18px 1.25rem;
}

.community-guide-panel--imported table {
  border-collapse: collapse;
  margin: 20px 0;
  width: 100%;
}

.community-guide-panel--imported th,
.community-guide-panel--imported td {
  border: 1px solid #ccd5e1;
  padding: 10px 12px;
  vertical-align: top;
}

.community-guide-panel--imported th {
  background: #edf4fb;
  color: #113b67;
  font-weight: 800;
}

.community-guide-panel--imported .panel-group {
  display: grid;
  gap: 12px;
  margin-top: 24px;
}

.community-guide-panel--imported .panel {
  border: 1px solid #cfd9e6;
  background: #fff;
}

.community-guide-panel--imported .panel-heading {
  background: #f3f7fb;
  border-bottom: 1px solid #cfd9e6;
}

.community-guide-panel--imported .panel-title {
  font-size: 1rem;
  margin: 0;
}

.community-guide-panel--imported .panel-title a {
  color: #113b67;
  display: block;
  font-weight: 800;
  padding: 16px 18px;
  text-decoration: none;
}

.community-guide-panel--imported .panel-title span {
  color: #5d6877;
  font-size: 0.9rem;
  font-weight: 700;
}

.community-guide-panel--imported .panel-collapse.collapse {
  display: none;
}

.community-guide-panel--imported .panel-collapse.collapse.in {
  display: block;
}

.community-guide-panel--imported .panel-body {
  padding: 18px;
}

.community-guide-panel--imported [id="headTable"] {
  display: grid;
  gap: 8px;
  margin: 22px 0 18px;
}

.community-guide-panel--imported [id="headTable"] > .row {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  margin: 0;
}

.community-guide-panel--imported [id="headTable"] > .row > [class*="col-"] {
  align-items: center;
  background: #efefef;
  color: #222;
  display: flex;
  min-height: 46px;
  padding: 12px 16px;
}

.community-guide-panel--imported [id="headTable"] > .row > .head {
  background: #d9d9d9;
  font-weight: 800;
  justify-content: center;
  text-align: center;
}

.community-guide-panel--imported [id="headTable"] .col-md-12,
.community-guide-panel--imported [id="headTable"] .col-sm-12,
.community-guide-panel--imported [id="headTable"] .col-xs-12 {
  grid-column: span 12;
}

.community-guide-panel--imported [id="headTable"] .col-md-9,
.community-guide-panel--imported [id="headTable"] .col-sm-9,
.community-guide-panel--imported [id="headTable"] .col-xs-9 {
  grid-column: span 9;
}

.community-guide-panel--imported [id="headTable"] .col-md-8,
.community-guide-panel--imported [id="headTable"] .col-sm-8,
.community-guide-panel--imported [id="headTable"] .col-xs-8 {
  grid-column: span 8;
}

.community-guide-panel--imported [id="headTable"] .col-md-6,
.community-guide-panel--imported [id="headTable"] .col-sm-6,
.community-guide-panel--imported [id="headTable"] .col-xs-6 {
  grid-column: span 6;
}

.community-guide-panel--imported [id="headTable"] .col-md-4,
.community-guide-panel--imported [id="headTable"] .col-sm-4,
.community-guide-panel--imported [id="headTable"] .col-xs-4 {
  grid-column: span 4;
}

.community-guide-panel--imported [id="headTable"] .col-md-3,
.community-guide-panel--imported [id="headTable"] .col-sm-3,
.community-guide-panel--imported [id="headTable"] .col-xs-3 {
  grid-column: span 3;
}

.community-guide-panel--imported [id="headTable"] .col-md-2,
.community-guide-panel--imported [id="headTable"] .col-sm-2,
.community-guide-panel--imported [id="headTable"] .col-xs-2 {
  grid-column: span 2;
}

.community-guide-panel--imported [id="headTable"] .text-center {
  justify-content: center;
  text-align: center;
}

.community-guide-panel--imported [id="headTable"] .right {
  justify-content: flex-start;
  text-align: left;
}

@media (max-width: 991px) {
  .opposition-forecast-map__card--floating {
    display: none;
  }

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

  .community-guide-layout {
    gap: 18px;
  }
}

@media (max-width: 767px) {
  .opposition-forecast-map-shortcode {
    margin-bottom: 18px;
  }

  .opposition-forecast-map__layout {
    border-radius: 22px;
    padding: 14px;
  }

  .opposition-forecast-map__canvas {
    border-radius: 18px;
  }

  .opposition-forecast-map__marker {
    height: 22px;
    width: 22px;
  }

  .opposition-map-selector .panel-group {
    gap: 14px;
  }

  .opposition-map-selector .panel-heading,
  .opposition-map-selector .panel-body,
  .community-guide-panel,
  .community-news {
    padding: 18px;
  }

  .community-guide-tabs {
    grid-template-columns: 1fr;
  }

  .community-news__grid {
    grid-template-columns: 1fr;
  }

  .community-guide-hero__image {
    min-height: 240px;
  }

  .community-guide-hero__title {
    left: 20px;
    max-width: calc(100% - 40px);
    top: 20px;
  }

  .community-guide-convocation {
    padding: 22px 18px 18px;
  }

  .community-guide-convocation__grid {
    grid-template-columns: 1fr;
  }

  .community-guide-convocation__grid article {
    border-left: 0 !important;
    border-top: 1px solid #d9dee4;
    padding: 16px 10px;
  }

  .community-guide-tabs a {
    min-height: 62px;
  }

  .community-guide-panel--imported [id="headTable"] {
    gap: 6px;
  }

  .community-guide-panel--imported [id="headTable"] > .row {
    gap: 6px;
  }

  .community-guide-panel--imported [id="headTable"] > .row > [class*="col-"] {
    padding: 10px;
  }

  .community-news-card {
    grid-template-columns: 1fr;
    padding: 14px;
  }
}

.course-grid--stacked .course-card__summary {
  grid-template-columns: 228px minmax(180px, 1.1fr) repeat(3, minmax(80px, auto));
  gap: 22px;
  align-items: center;
}

.course-grid--stacked .course-thumb {
  width: 228px;
  height: 136px;
  border-radius: 16px;
  background: linear-gradient(180deg, #f8fbff 0%, #eef3fb 100%);
}

.course-grid--stacked .course-thumb img {
  object-fit: contain;
  object-position: center;
  padding: 10px;
}

.course-grid--stacked .course-card__bottom {
  gap: 22px;
}

.course-grid--stacked .course-buy {
  min-width: min(100%, 520px);
  max-width: none;
  margin-left: auto;
}

.course-card {
  background: #fff;
  border-left: 4px solid var(--color-ects);
  border-radius: 14px;
  padding: 22px;
  box-shadow: var(--shadow-soft);
}

.course-card--ects {
  border-left-color: var(--color-ects);
}

.course-card--tradicional {
  border-left-color: var(--color-trad);
}

.course-card__header {
  display: grid;
  gap: 10px;
  align-items: start;
}

.course-badge {
  font-size: 0.76rem;
  font-weight: 500;
  color: var(--color-ects);
  text-transform: uppercase;
  grid-column: 1 / -1;
  letter-spacing: 0.04em;
}

.course-card--tradicional .course-badge {
  color: var(--color-trad);
}

.course-title {
  font-size: 1.42rem;
  line-height: 1.22;
  font-weight: 500;
  color: #141414;
}

.course-card__summary {
  display: grid;
  grid-template-columns: 170px repeat(4, minmax(0, 1fr));
  gap: 20px;
  align-items: center;
  margin: 20px 0 16px;
}

.course-thumb {
  width: 170px;
  height: 112px;
  border-radius: 14px;
  overflow: hidden;
  background: #f4f7fb;
  box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.06);
  display: block;
}

.course-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.course-metric {
  display: grid;
  gap: 4px;
  color: var(--color-muted);
  justify-items: center;
  text-align: center;
}

.course-metric__inline {
  display: inline-flex;
  align-items: flex-end;
  gap: 8px;
  min-height: 52px;
}

.course-metric strong {
  font-size: 1.2rem;
  color: #1f2937;
}

.course-metric span {
  font-size: 0.92rem;
  color: #373737;
}

.course-metric__label {
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 0.74rem;
  color: var(--color-muted);
}

.course-metric--stages {
  justify-items: start;
  text-align: left;
}

.course-metric--stages strong {
  text-transform: uppercase;
  color: #2b2b2b;
  font-weight: 500;
}

.course-metric--hours strong {
  font-size: 1.95rem;
  color: #7c1f08;
  font-weight: 700;
}

.course-metric--hours span {
  color: #373737;
  align-self: flex-end;
  line-height: 1;
  padding-bottom: 0.25rem;
}

.course-metric--credits strong {
  font-size: 1.95rem;
  color: #1f71be;
  font-weight: 700;
}

.course-metric--credits span {
  color: #373737;
  line-height: 1.1;
  align-self: flex-end;
  text-align: left;
  padding-bottom: 0.22rem;
}

.course-metric--days strong {
  font-size: 1.95rem;
  color: #f3a000;
  font-weight: 700;
}

.course-metric--days span {
  color: #373737;
  align-self: flex-end;
  line-height: 1;
  padding-bottom: 0.25rem;
}

.course-card__bottom {
  display: flex;
  gap: 18px;
  justify-content: space-between;
  align-items: center;
}

.course-buy {
  display: flex;
  gap: 12px;
  flex: 1;
  align-items: stretch;
}

.course-buy select,
.detail-buy select,
.wizard-filters select,
.form-grid input,
.coupon-box input {
  width: 100%;
  min-height: 48px;
  border-radius: 12px;
  border: 1px solid var(--color-line);
  padding: 0 14px;
  font: inherit;
}

.select-shell select {
  appearance: none;
  background: transparent;
  border: 0;
  min-height: 56px;
  padding: 0 44px 0 16px;
  position: relative;
  z-index: 1;
  width: 100%;
  font: inherit;
}

.select-shell {
  position: relative;
  flex: 1;
  min-width: 0;
  max-height: 57px;
  border: 1px solid #c6d5eb;
  border-radius: 14px;
  background: linear-gradient(180deg, #ffffff 0%, #f5f9ff 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.select-shell--filter {
  width: 100%;
  max-width: 460px;
  background: #fff;
  border-color: #cfd7e4;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.06);
  overflow: hidden;
  min-height: 44px;
}

.select-shell--filter::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 44px;
  background: #d8d8d8;
  border-left: 1px solid #c8ced8;
  border-radius: 0 14px 14px 0;
  pointer-events: none;
}

.select-shell--filter::after {
  right: 16px;
  z-index: 2;
}

.select-shell--filter select {
  display: block;
  height: 44px;
  min-height: 44px;
  line-height: 44px;
  padding: 0 52px 0 16px;
  font-size: 0.95rem;
  vertical-align: middle;
}

.select-shell::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 16px;
  width: 10px;
  height: 10px;
  border-right: 2px solid #51627b;
  border-bottom: 2px solid #51627b;
  transform: translateY(-65%) rotate(45deg);
  pointer-events: none;
}

.course-card--ects .select-shell {
  border-color: rgba(18, 133, 199, 0.35);
}

.course-card--tradicional .select-shell {
  border-color: rgba(211, 122, 67, 0.38);
  background: linear-gradient(180deg, #fffdfb 0%, #fff5ee 100%);
}

.course-card--tradicional .select-shell::after {
  border-right-color: var(--color-trad-dark);
  border-bottom-color: var(--color-trad-dark);
}

.course-price {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  min-width: 92px;
}

.course-price__base {
  color: #8e95a1;
  font-size: 0.95rem;
  text-decoration: line-through;
}

.course-price__current {
  color: #111;
  font-size: 1.9rem;
  font-weight: 500;
  line-height: 1;
}

.course-price__note {
  color: #57a33c;
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.1;
}

.course-cart-button {
  min-width: 74px;
  padding: 0;
  transition: background 0.2s ease, opacity 0.2s ease, transform 0.2s ease;
}

.course-cart-button svg {
  width: 24px;
  height: 24px;
  stroke: #6d7787;
  stroke-width: 1.7;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.course-cart-button--disabled,
.course-cart-button:disabled {
  background: #d6dfef;
  cursor: not-allowed;
  opacity: 1;
}

.course-cart-button--disabled svg,
.course-cart-button:disabled svg {
  stroke: #97a4b8;
}

.course-cart-button--ready:not(:disabled) {
  background: #78a9f8;
}

.course-cart-button--ready:not(:disabled) svg {
  stroke: #fff;
}

.course-cart-button--in-cart,
.course-cart-button--in-cart:disabled,
.button--green.course-cart-button {
  background: var(--color-green);
}

.course-cart-button--in-cart svg,
.button--green.course-cart-button svg {
  stroke: #fff;
}

.course-cart-button--loading {
  opacity: 0.72;
  pointer-events: none;
}

.has-cart-modal-open {
  overflow: hidden;
}

.cart-modal[hidden] {
  display: none;
}

.cart-modal {
  position: fixed;
  inset: 0;
  z-index: 1200;
}

.cart-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(19, 24, 39, 0.48);
}

.cart-modal__dialog {
  position: relative;
  width: min(700px, calc(100% - 32px));
  margin: 64px auto;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 28px 54px rgba(17, 24, 39, 0.24);
  padding: 22px 22px 18px;
}

.cart-modal__close {
  position: absolute;
  top: 16px;
  right: 18px;
  border: 0;
  background: transparent;
  font-size: 2rem;
  line-height: 1;
  color: #666;
  cursor: pointer;
}

.cart-modal__close:focus-visible,
.cart-modal__actions .button:focus-visible,
.cart-modal__item .icon-button:focus-visible {
  outline: 2px solid #0f4c81;
  outline-offset: 3px;
}

.cart-modal__dialog h2 {
  margin-bottom: 18px;
  font-size: 2rem;
  font-weight: 500;
}

.cart-modal__body {
  display: grid;
  gap: 18px;
}

.cart-modal__items {
  display: grid;
  gap: 12px;
}

.cart-modal__item {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: center;
  padding: 18px 20px;
  background: #fff;
  border-radius: 6px;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.12);
}

.cart-modal__remove-form {
  display: inline-flex;
  align-items: center;
}

.cart-modal__item-main {
  display: grid;
  gap: 8px;
}

.cart-modal__item-main strong {
  font-size: 1.1rem;
  line-height: 1.35;
}

.cart-modal__item-main span {
  color: var(--color-muted);
  font-size: 0.95rem;
}

.cart-modal__item-price {
  font-size: 1.9rem;
  font-weight: 500;
  white-space: nowrap;
}

.cart-modal__totals {
  display: grid;
  gap: 8px;
  justify-items: end;
  padding: 4px 2px 0;
}

.cart-modal__totals p {
  margin: 0;
  display: inline-flex;
  gap: 12px;
  align-items: baseline;
}

.cart-modal__totals span {
  color: #555;
}

.cart-modal__totals strong {
  font-size: 1.15rem;
}

.cart-modal__total-final strong {
  color: var(--color-green);
  font-size: 2rem;
}

.cart-modal__actions {
  margin-top: 24px;
  padding-top: 18px;
  border-top: 1px solid #e5e7eb;
  display: flex;
  justify-content: flex-end;
  gap: 12px;
}

.page-hero {
  background: linear-gradient(180deg, #f0f5ff 0%, #f7f9fc 100%);
  border-bottom: 1px solid var(--color-line);
}

.page-hero--cms-full-width {
  background: #fff;
  border-bottom: 0;
}

.page-hero--soft {
  background: linear-gradient(180deg, #fff 0%, #f4f6fa 100%);
}

.page-hero--course {
  background: #fff;
  padding: 24px 0 0;
  border-radius: 0 0 var(--radius) var(--radius);
  overflow: hidden;
}

.community-course-intro {
  padding: 26px 0 18px;
  background: linear-gradient(180deg, #f5f8fd 0%, #f7f9fc 100%);
}

.community-course-intro .mainContentColumn > header.row {
  display: block;
  margin: 0;
  padding: 28px 30px;
  background: #fff;
  border: 1px solid #dbe3ef;
  border-radius: 22px;
  box-shadow: 0 14px 32px rgba(22, 44, 76, 0.07);
}

.community-course-intro h1 {
  margin: 0 0 16px;
  color: #24466f;
  font-size: clamp(1.65rem, 2.4vw, 2.35rem);
  line-height: 1.14;
  letter-spacing: -0.02em;
}

.community-course-intro #cuerpoSeccionInterna {
  color: #303947;
  font-size: 1rem;
  line-height: 1.62;
}

.community-course-intro #cuerpoSeccionInterna > h2 {
  margin: 0 0 22px;
  color: #4d5a69;
  font-size: clamp(1.15rem, 1.45vw, 1.45rem);
  font-weight: 700;
  line-height: 1.32;
}

.community-course-intro .category_description > .row {
  display: grid;
  grid-template-columns: minmax(180px, 0.36fr) minmax(0, 0.64fr);
  gap: 24px;
  align-items: start;
  margin: 0 0 18px;
}

.community-course-intro .col-sm-4,
.community-course-intro .col-sm-8 {
  width: auto;
  max-width: none;
  padding: 0;
}

.community-course-intro .text-center {
  text-align: center;
}

.community-course-intro img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 2px auto 0;
  border-radius: 4px;
}

.community-course-intro p {
  margin: 0 0 14px;
}

.community-course-intro p:last-child {
  margin-bottom: 0;
}

.community-course-intro .wrapDescuentoCategoria,
.community-course-intro #wrapDescuentoCategoria {
  margin: 14px 0;
  border: 1px solid #d6e0ec;
  border-radius: 14px;
  overflow: hidden;
  background: #f7fafc;
}

.community-course-intro .wrapDescuentoCategoria > a,
.community-course-intro #wrapDescuentoCategoria > a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 13px 18px;
  color: #123e6d;
  background: linear-gradient(180deg, #ffffff 0%, #eef4fb 100%);
  font-weight: 800;
  text-decoration: none;
}

.community-course-intro .wrapDescuentoCategoria > a::after,
.community-course-intro #wrapDescuentoCategoria > a::after {
  content: "+";
  color: #ef9d09;
  font-size: 1.35rem;
  line-height: 1;
}

.community-course-intro .wrapDescuentoCategoria > a[aria-expanded="true"]::after,
.community-course-intro #wrapDescuentoCategoria > a[aria-expanded="true"]::after {
  content: "−";
}

.community-course-intro .collapse {
  display: none;
  padding: 16px 18px 18px;
  border-top: 1px solid #dbe3ef;
  background: #fff;
}

.community-course-intro .collapse.show {
  display: block;
}

.community-course-intro .collapse ul {
  margin: 0;
  padding-left: 1.1rem;
}

.community-course-intro .collapse li {
  margin-bottom: 8px;
}

.community-course-intro .collapse li:last-child {
  margin-bottom: 0;
}

.community-course-intro .collapse span {
  color: #24466f;
  font-weight: 800;
}

.community-course-intro a {
  color: #2f65a7;
  font-weight: 700;
}

.course-stage-intro .mainContentColumn > .stage-course-header {
  padding: 28px 30px;
  background: #fff;
  border: 1px solid #dbe3ef;
  border-radius: 22px;
  box-shadow: 0 14px 32px rgba(22, 44, 76, 0.07);
}

.course-stage-intro .introduction {
  color: #303947;
  font-size: 1rem;
  line-height: 1.62;
}

.course-stage-intro .introduction h1 {
  color: #24466f;
}

.course-stage-intro .introduction h2 {
  margin: 18px 0 12px;
  color: #1f2a37;
  font-size: clamp(1.25rem, 1.8vw, 1.75rem);
  line-height: 1.22;
}

.course-stage-intro .introduction a.readmore {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 4px 0 16px;
  padding: 9px 14px;
  color: #123e6d;
  background: #eff6ff;
  border: 1px solid #cfe0f6;
  border-radius: 999px;
  font-size: 0.92rem;
  text-decoration: none;
}

.course-stage-intro .introduction a.readmore::after {
  content: "+";
  color: #ef9d09;
  font-size: 1.1rem;
  line-height: 1;
}

.course-stage-intro .introduction a.readmore[aria-expanded="true"]::after {
  content: "−";
}

.course-stage-intro .introduction .well {
  margin: 14px 0 18px;
  padding: 16px 18px;
  background: #f8fafc;
  border: 1px solid #dbe3ef;
  border-radius: 16px;
}

.course-stage-intro .ventajas-accordion {
  display: grid;
  gap: 14px;
  margin-top: 22px;
}

.course-stage-intro .accordion-item {
  overflow: hidden;
  background: #fff;
  border: 1px solid #dbe3ef;
  border-radius: 16px;
}

.course-stage-intro .accordion-header {
  width: 100%;
  padding: 14px 18px;
  color: #123e6d;
  background: linear-gradient(180deg, #ffffff 0%, #f1f6fc 100%);
  border: 0;
  font: inherit;
  font-weight: 800;
  text-align: left;
  cursor: default;
}

.course-stage-intro .accordion-panel {
  max-height: none !important;
  padding: 16px 18px 18px;
  color: #303947;
  background: #fff;
  border-top: 1px solid #dbe3ef;
}

.course-stage-intro .accordion-panel .img-block {
  margin: 12px 0 0;
}

.wizard {
  background: linear-gradient(180deg, #f3f3f3 0%, #edf2f9 100%);
}

.wizard-shell h1 {
  font-size: 2rem;
  margin-bottom: 24px;
}

.wizard-filters {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 16px;
  margin-bottom: 22px;
}

.wizard-steps,
.listing-filters {
  display: grid;
  gap: 18px;
}

.wizard-steps {
  margin-bottom: 30px;
}

.wizard-step {
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid #d8dfe8;
  border-radius: 22px;
  padding: 24px;
  transition: opacity 0.2s ease, transform 0.2s ease;
}

.wizard-step.is-disabled {
  opacity: 0.48;
  pointer-events: none;
}

.wizard-step__head {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  margin-bottom: 16px;
}

.wizard-step__head h2 {
  font-size: 1.2rem;
  margin-bottom: 8px;
}

.wizard-step__head p {
  color: var(--color-muted);
  margin: 0;
}

.wizard-step__number {
  width: 38px;
  height: 38px;
  border-radius: 999px;
  background: #0f3b6d;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  flex-shrink: 0;
}

.wizard-step__body--split,
.listing-filters {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.listing-filters__intro {
  display: grid;
  gap: 8px;
}

.listing-filters__eyebrow {
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #5f7ca7;
}

.listing-filters__intro h2 {
  margin: 0;
  font-size: 1.2rem;
  line-height: 1.15;
}

.listing-filters__intro p {
  margin: 0;
  color: var(--color-muted);
}

.choice-row {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.choice-row--compact {
  gap: 10px;
}

.choice-pill {
  min-height: 48px;
  padding: 0 16px;
  border-radius: 999px;
  border: 1px solid #0f3b6d;
  background: #fff;
  color: #0f3b6d;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.choice-pill--light {
  border-color: #c7d2df;
}

.choice-pill.is-active {
  background: #0f3b6d;
  color: #fff;
  border-color: #0f3b6d;
}

.listing-filters--category {
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  gap: 18px 22px;
  padding: 26px;
  margin-bottom: 24px;
  border: 1px solid #d9e2ef;
  border-radius: 24px;
  background:
    radial-gradient(circle at top right, rgba(111, 164, 232, 0.18), transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(244, 247, 252, 0.96) 100%);
  box-shadow: 0 20px 45px rgba(15, 23, 42, 0.08);
  align-items: end;
}

.listing-filters__intro--category,
.listing-filters--category .student-type-field {
  grid-column: 1 / -1;
}

.listing-filters--catalogue .field:last-of-type {
  grid-column: 1 / -1;
}

.listing-filters__intro--catalogue .prose,
.listing-filters__intro--catalogue .prose p {
  margin: 0;
}

.listing-filters--catalogue .field--catalogue-stages {
  grid-column: 1 / -1;
}

.listing-filters--category .field {
  gap: 10px;
}

.listing-filters--category .field label {
  font-size: 1rem;
}

.listing-filters--category .select-shell--filter {
  max-width: none;
}

.choice-row--category-promos {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.choice-row--category-promos .choice-pill {
  min-height: 46px;
  padding-inline: 18px;
}

.community-course-requirement {
  margin: 4px 0 24px;
  padding: 22px 26px;
  color: #263241;
  background: #eef2f6;
  border: 1px solid #9eb0c2;
  text-align: center;
}

.community-course-requirement[hidden] {
  display: none;
}

.community-course-requirement p {
  margin: 0;
  font-size: 1rem;
  line-height: 1.55;
}

.community-course-requirement__intro {
  max-width: 760px;
  margin: 0 auto 14px !important;
  text-align: left;
}

.community-course-requirement__text h3 {
  max-width: 760px;
  margin: 0 auto;
  color: #2f3540;
  font-size: clamp(1.25rem, 2vw, 1.5rem);
  font-weight: 500;
  line-height: 1.28;
}

.community-course-requirement__text span {
  font-weight: 800;
  text-transform: uppercase;
}

@media (min-width: 992px) {
  .choice-row--catalogue-stages {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, max-content));
    gap: 10px 14px;
    justify-content: start;
    align-items: start;
  }

  .choice-row--catalogue-stages .choice-pill {
    width: 100%;
    justify-content: center;
  }
}

.section-head--stacked {
  align-items: flex-start;
  flex-direction: column;
  gap: 8px;
}

.section-head__note {
  color: var(--color-muted);
  margin: 0;
}

.course-blocked {
  width: 100%;
}

.wizard-results-head {
  margin-bottom: 18px;
}

.field {
  display: grid;
  gap: 8px;
}

.field label {
  font-size: 0.92rem;
  font-weight: 700;
}

.promo-boxes {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

.course-detail {
  display: grid;
  grid-template-columns: 320px 1fr;
  gap: 32px;
  align-items: center;
}

.course-page {
  display: grid;
  gap: 0;
}

.course-sidebar__menu {
  background: #fff;
  padding: 10px 0;
}

.course-sidebar__menu h3 {
  margin: 0;
  padding: 14px 12px;
  border-top: 1px solid #9eb6d4;
  border-bottom: 1px solid #9eb6d4;
  font-size: 0.96rem;
  font-weight: 500;
  text-transform: uppercase;
  line-height: 1.45;
}

.course-sidebar__menu a {
  display: block;
  padding: 11px 12px;
  font-size: 0.95rem;
}

.course-sidebar__banners {
  display: grid;
  gap: 12px;
}

.course-sidebar__banner {
  display: block;
  background: #fff;
}

.course-sidebar__banner img {
  width: 100%;
  height: auto;
  display: block;
}

.course-page__intro {
  display: grid;
  gap: 10px;
}

.course-page__eyebrow {
  font-size: clamp(1.25rem, 2vw, 2rem);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #444;
  margin: 0;
}

.course-page__title {
  font-size: clamp(2rem, 4.6vw, 3.4rem);
  line-height: 1.02;
  font-weight: 700;
  text-transform: uppercase;
  margin: 0;
}

.course-page__stages {
  font-size: 1.15rem;
  font-style: italic;
  color: #3a3a3a;
  margin: 0;
}

.course-page__rating {
  display: grid;
  gap: 6px;
  color: var(--color-muted);
  font-size: 0.95rem;
}

.course-page__stars {
  display: flex;
  gap: 4px;
  font-size: 2rem;
  line-height: 1;
}

.course-page__stars span {
  color: #cfd4dc;
}

.course-page__stars .is-filled {
  color: #f5a101;
}

.course-page__hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 392px);
  gap: 0;
  align-items: stretch;
}

.course-media-card,
.course-enrollment-card {
  background: #f4f1f4;
}

.course-media-card {
  overflow: hidden;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  align-content: stretch;
  background: transparent;
  padding: 0;
}

.course-media-card__image {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: auto;
  object-fit: contain;
  object-position: center;
  padding: 0;
  box-sizing: border-box;
}

.course-media-card__metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  align-content: center;
  padding: 12px 20px;
  margin-top: 0;
  position: relative;
}

.course-page-metric {
  background: #fff;
  border: 2px solid #111;
  border-radius: 14px;
  min-height: 64px;
  display: inline-flex;
  align-items: flex-end;
  justify-content: center;
  gap: 8px;
  padding: 12px 16px 10px;
}

.course-page-metric strong {
  font-size: 2rem;
  line-height: 1;
}

.course-page-metric span {
  font-size: 1rem;
  line-height: 1;
  padding-bottom: 0.18rem;
}

.course-page-metric--hours strong {
  color: #151515;
}

.course-page-metric--credits strong {
  color: #151515;
}

.course-page-metric--days strong {
  color: #151515;
}

.course-enrollment-card {
  padding: 18px;
  display: grid;
  gap: 14px;
  align-content: start;
}

.course-enrollment-card h2 {
  font-size: 2.1rem;
  margin: 0;
}

.student-type-field--course {
  gap: 8px;
}

.choice-row--course-promos {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  align-items: stretch;
}

.choice-row--course-promos .choice-pill {
  width: 100%;
  min-height: 56px;
  justify-content: center;
  text-align: center;
  padding: 0 10px;
  font-size: 0.92rem;
  line-height: 1.1;
  white-space: normal;
}

.course-price-card {
  background: #e9e9e9;
  padding: 12px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.course-price-card span {
  font-size: 1rem;
  font-weight: 700;
  text-transform: uppercase;
}

.course-price-card strong {
  font-size: 2.1rem;
  color: #57a33c;
}

.course-price-card__values {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
}

.course-price-card__base {
  color: #8c8c8c;
  font-size: 1rem;
  text-decoration: line-through;
}

.course-price-card__current {
  line-height: 1;
}

.course-price-card__note {
  color: #57a33c;
  font-size: 0.8rem;
  font-weight: 700;
  line-height: 1.1;
}

.course-buy--detail .course-blocked,
.course-buy--detail .select-shell {
  flex: 1;
}

.course-buy--detail {
  align-items: stretch;
}

.course-buy--detail .course-cart-button {
  min-width: 84px;
}

.course-enrollment-card .field {
  gap: 6px;
}

.course-enrollment-card .field label {
  font-size: 0.9rem;
}

@media (max-width: 1199px) {
  .choice-row--course-promos {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .choice-row--course-promos .choice-pill:last-child:nth-child(odd) {
    grid-column: 1 / -1;
    justify-self: center;
    width: min(100%, 280px);
  }
}

.course-tabs {
  background: #000;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
}

.course-tabs a {
  color: #fff;
  text-align: center;
  font-weight: 700;
  padding: 14px 16px;
  text-transform: capitalize;
}

.course-tabs a:hover {
  background: rgba(255, 255, 255, 0.12);
}

.course-image {
  border-radius: 18px;
  box-shadow: var(--shadow-soft);
}

.detail-metrics {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  color: var(--color-muted);
  margin: 18px 0;
}

.detail-buy {
  display: flex;
  gap: 12px;
}

.prose {
  background: #fff;
  padding: 28px;
  border-radius: var(--radius);
  box-shadow: var(--shadow-soft);
}

.container.prose {
  max-width: var(--container-max-md);
}

.page-hero .prose:not(.cms-page-content) {
  max-width: 76ch;
}

.prose ul {
  padding-left: 20px;
  line-height: 1.7;
}

.page-hero--course + .section .prose h2[id] {
  scroll-margin-top: 148px;
}

.checkout-layout {
  align-items: flex-start;
  gap: 24px;
}

@media (min-width: 1440px) {
  .course-grid--stacked .course-card__summary {
    grid-template-columns: 252px minmax(220px, 1.1fr) repeat(3, minmax(88px, auto));
    gap: 24px;
  }

  .course-grid--stacked .course-thumb {
    width: 252px;
    height: 150px;
  }

  .app-navbar__inner {
    grid-template-columns: minmax(220px, 280px) minmax(520px, 1fr) minmax(210px, 280px);
    gap: 28px;
  }

  .app-nav-links {
    gap: 24px;
  }

  .store-shell {
    grid-template-columns: 300px minmax(0, 1fr);
    gap: 32px;
  }

  .course-detail {
    grid-template-columns: 340px minmax(0, 1fr);
    gap: 36px;
  }

  .course-page__hero {
    grid-template-columns: minmax(0, 1fr) minmax(390px, 430px);
    gap: 0;
  }
}

.checkout-layout > * {
  flex: 1;
}

.cart-row {
  justify-content: space-between;
  gap: 20px;
  padding: 18px 0;
  border-bottom: 1px solid var(--color-line);
}

.cart-row__actions {
  gap: 16px;
}

.totals {
  display: grid;
  gap: 10px;
  margin: 22px 0;
}

.coupon-box {
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid var(--color-line);
}

.coupon-box__row {
  gap: 12px;
}

.auth-grid,
.tabs-grid,
.app-footer__grid {
  display: grid;
  gap: 24px;
}

.auth-grid,
.tabs-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.tabs-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.form-grid {
  display: grid;
  gap: 12px;
}

.checkout-hero {
  max-width: 760px;
}

.checkout-hero__eyebrow {
  display: inline-flex;
  margin-bottom: 12px;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(44, 123, 229, 0.12);
  color: var(--color-blue-dark);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.checkout-hero h1 {
  margin-bottom: 14px;
}

.checkout-hero p {
  max-width: 62ch;
  color: var(--color-muted);
  line-height: 1.7;
}

.checkout-shell,
.auth-shell,
.cart-shell {
  display: grid;
  gap: 24px;
}

.auth-context {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.auth-context__card {
  padding: 18px 20px;
  border-radius: 18px;
  border: 1px solid rgba(27, 46, 78, 0.08);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(243, 248, 255, 0.96));
}

.auth-context__card strong {
  display: block;
  margin-bottom: 8px;
  color: #13233d;
}

.auth-context__card p {
  margin: 0;
  color: var(--color-muted);
  line-height: 1.65;
}

.checkout-card {
  position: relative;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 251, 255, 0.96));
  border: 1px solid rgba(27, 46, 78, 0.08);
  border-radius: 24px;
  box-shadow: 0 22px 55px rgba(17, 32, 61, 0.08);
  padding: 28px;
}

.checkout-card__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 22px;
}

.checkout-card__head h2 {
  margin: 0;
  font-size: clamp(1.45rem, 2vw, 2rem);
}

.checkout-card__eyebrow {
  display: inline-flex;
  margin-bottom: 8px;
  color: var(--color-blue-dark);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.checkout-items {
  display: grid;
  gap: 14px;
}

.checkout-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  padding: 18px 20px;
  border: 1px solid rgba(27, 46, 78, 0.08);
  border-radius: 18px;
  background: #fff;
}

.checkout-item__main {
  display: grid;
  gap: 8px;
}

.checkout-item__main strong {
  font-size: 1.02rem;
  line-height: 1.55;
}

.checkout-item__main p {
  margin: 0;
  color: var(--color-muted);
  font-size: 0.96rem;
}

.checkout-item__price {
  font-size: 1.22rem;
  font-weight: 800;
  color: #13233d;
  white-space: nowrap;
}

.checkout-item--cart {
  grid-template-columns: minmax(0, 1fr) auto;
}

.checkout-item--cart .cart-row__actions {
  justify-content: flex-end;
  align-items: center;
}

.coupon-box--checkout {
  margin-top: 26px;
  padding: 24px;
  border-top: 0;
  border-radius: 20px;
  background: linear-gradient(135deg, rgba(40, 169, 188, 0.12), rgba(120, 169, 248, 0.12));
}

.coupon-box__lead {
  display: grid;
  gap: 8px;
  margin-bottom: 16px;
}

.coupon-box__lead strong {
  font-size: 1.1rem;
}

.coupon-box__lead span,
.coupon-box__active {
  color: var(--color-muted);
}

.coupon-box__active strong {
  color: #12203a;
}

.coupon-box__feedback {
  min-height: 1.2em;
  margin: 10px 0 0;
  color: var(--color-muted);
  font-size: 0.92rem;
}

.coupon-box__feedback strong {
  color: #12203a;
}

.coupon-box__feedback--error {
  color: #a63d2b;
}

.coupon-box--compact {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}

.coupon-box--filters,
.coupon-box--wizard,
.coupon-box--detail {
  display: grid;
  gap: 10px;
  padding: 16px 18px;
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(40, 169, 188, 0.08), rgba(120, 169, 248, 0.08));
}

.coupon-box--filters .coupon-box__lead,
.coupon-box--wizard .coupon-box__lead,
.coupon-box--detail .coupon-box__lead {
  margin-bottom: 0;
}

.coupon-box--filters input,
.coupon-box--wizard input,
.coupon-box--detail input {
  min-width: 0;
}

.checkout-summary {
  position: static;
  top: auto;
}

.checkout-summary__student {
  display: grid;
  gap: 16px;
  margin-bottom: 24px;
}

.checkout-chip {
  display: grid;
  gap: 6px;
  padding: 16px 18px;
  border-radius: 18px;
  background: #f3f8ff;
  border: 1px solid rgba(44, 123, 229, 0.14);
}

.checkout-chip__label {
  color: var(--color-muted);
  font-size: 0.84rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.checkout-meta {
  display: grid;
  gap: 10px;
}

.checkout-meta p,
.checkout-totals p {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  margin: 0;
}

.checkout-meta span,
.checkout-totals span {
  color: var(--color-muted);
}

.checkout-meta strong,
.checkout-totals strong {
  font-weight: 800;
  color: #12203a;
  text-align: right;
}

.checkout-totals {
  display: grid;
  gap: 12px;
  margin: 0 0 24px;
  padding: 20px 0;
  border-top: 1px solid rgba(27, 46, 78, 0.08);
  border-bottom: 1px solid rgba(27, 46, 78, 0.08);
}

.checkout-totals--summary {
  margin-top: 24px;
}

.checkout-totals__final {
  padding-top: 14px;
  margin-top: 4px !important;
  border-top: 1px dashed rgba(27, 46, 78, 0.14);
}

.checkout-totals__final span {
  color: #12203a;
  font-weight: 700;
}

.checkout-totals__final strong {
  font-size: 1.55rem;
  color: var(--color-green);
}

.checkout-payment-form {
  display: grid;
  gap: 18px;
}

.checkout-payment-methods {
  display: grid;
  gap: 14px;
  margin: 0;
  padding: 0;
  border: 0;
}

.checkout-payment-methods legend {
  margin-bottom: 4px;
  font-size: 1.05rem;
  font-weight: 800;
}

.checkout-payment-option {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 14px;
  align-items: start;
  padding: 16px 18px;
  border-radius: 18px;
  background: #fff;
  border: 1px solid rgba(27, 46, 78, 0.1);
}

.checkout-payment-option input {
  margin-top: 5px;
  accent-color: var(--color-blue-dark);
}

.checkout-payment-option span {
  display: grid;
  gap: 6px;
}

.checkout-payment-option strong {
  font-size: 1rem;
}

.checkout-payment-option small {
  color: var(--color-muted);
  line-height: 1.5;
}

.checkout-terms,
.auth-check {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  color: var(--color-muted);
}

.checkout-submit {
  min-height: 56px;
  font-size: 1rem;
  width: 100%;
}

.auth-card {
  height: 100%;
}

.auth-form {
  display: grid;
  gap: 16px;
}

.auth-form label {
  display: grid;
  gap: 8px;
}

.auth-form label > span {
  font-size: 0.92rem;
  font-weight: 700;
  color: #223252;
}

.auth-form input,
.auth-form select {
  width: 100%;
  min-height: 50px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(27, 46, 78, 0.12);
  background: #fff;
  font: inherit;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.auth-form input:focus,
.auth-form select:focus,
.coupon-box input:focus {
  outline: none;
  border-color: rgba(44, 123, 229, 0.6);
  box-shadow: 0 0 0 4px rgba(44, 123, 229, 0.12);
  background: #fff;
}

.auth-form--register .auth-form__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 16px;
}

.auth-form__full {
  grid-column: 1 / -1;
}

.auth-form button {
  width: 100%;
  min-height: 54px;
}

.checkout-empty {
  display: grid;
  gap: 10px;
  padding: 18px 20px;
  border-radius: 18px;
  background: #fff;
  border: 1px dashed rgba(27, 46, 78, 0.18);
}

.checkout-empty p {
  margin: 0;
  color: var(--color-muted);
}

.auth-check input,
.checkout-terms input {
  margin-top: 3px;
}

.auth-check a {
  color: var(--color-blue-dark);
  font-weight: 700;
}

.checkout-card .admin-notice {
  margin-bottom: 18px;
}

.app-footer {
  position: relative;
  background: var(--color-app-footer);
  color: #fff;
  overflow: hidden;
  font-family: "Montserrat", sans-serif;
  font-size: 16px;
  line-height: 1.5;
}

.app-footer__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(18, 28, 54, 0.82), rgba(18, 28, 54, 0.95));
  opacity: 0.38;
}

.app-footer__grid,
.app-footer__bottom {
  position: relative;
}

.app-footer__grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  padding: 64px 0 32px;
}

.app-footer__grid h3 {
  margin-bottom: 18px;
  font-size: 16px;
}

.app-footer__grid a,
.app-footer__grid p {
  display: block;
  color: rgba(255, 255, 255, 0.84);
  margin-bottom: 12px;
  line-height: 1.6;
  font-size: 15px;
}

.app-footer__bottom {
  padding: 20px 0 32px;
  border-top: 1px solid rgba(255, 255, 255, 0.14);
}

.app-footer__bottom img {
  width: 170px;
}

.admin-body {
  font-family: "Fira Sans", "Montserrat", sans-serif;
  background:
    radial-gradient(circle at top left, rgba(34, 197, 94, 0.14), transparent 22%),
    radial-gradient(circle at top right, rgba(71, 120, 255, 0.18), transparent 26%),
    linear-gradient(180deg, #dfe7f2 0%, #eaf0f8 100%);
}

.admin-skip-link {
  position: absolute;
  left: 18px;
  top: -48px;
  z-index: 200;
  padding: 12px 16px;
  border-radius: 14px;
  background: #0f172a;
  color: #f8fafc;
  font-weight: 700;
  transition: top 0.18s ease;
}

.admin-skip-link:focus {
  top: 18px;
}

.admin-shell {
  display: grid;
  grid-template-columns: 312px 1fr;
  min-height: 100vh;
}

.admin-sidebar {
  position: sticky;
  top: 0;
  align-self: start;
  min-height: 100vh;
  background:
    radial-gradient(circle at top right, rgba(34, 197, 94, 0.18), transparent 18%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.05), transparent 24%),
    linear-gradient(180deg, #0f172a 0%, #020617 100%);
  color: #fff;
  padding: 28px 18px 24px;
  border-right: 1px solid rgba(255, 255, 255, 0.08);
}

.admin-brand {
  display: grid;
  gap: 6px;
  padding: 0 6px 22px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.admin-brand strong {
  font-family: "Fira Code", monospace;
  font-size: 1.2rem;
  letter-spacing: -0.03em;
}

.admin-brand span {
  color: rgba(255, 255, 255, 0.62);
  font-size: 0.88rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.admin-nav {
  display: grid;
  gap: 18px;
  margin-top: 22px;
  max-height: calc(100vh - 120px);
  overflow-y: auto;
  padding-right: 4px;
}

.admin-nav__section {
  display: grid;
  gap: 8px;
}

.admin-nav__label {
  padding: 0 12px;
  color: rgba(255, 255, 255, 0.46);
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

.admin-nav a {
  display: block;
  padding: 13px 14px;
  border-radius: 14px;
  color: rgba(255, 255, 255, 0.8);
  border: 1px solid transparent;
  cursor: pointer;
  transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
}

.admin-nav a.is-active,
.admin-nav a:hover {
  background: linear-gradient(135deg, rgba(34, 197, 94, 0.2), rgba(66, 153, 225, 0.15));
  border-color: rgba(86, 192, 255, 0.22);
  color: #fff;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.04);
}

.admin-nav a:focus-visible {
  outline: none;
  border-color: rgba(255, 255, 255, 0.45);
  box-shadow: 0 0 0 4px rgba(34, 197, 94, 0.18);
}

.admin-main {
  padding: 22px 28px 30px;
}

.admin-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 24px;
  padding: 18px 22px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 24px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(248, 251, 255, 0.9));
  box-shadow: 0 18px 36px rgba(15, 23, 42, 0.08);
  backdrop-filter: blur(14px);
}

.admin-topbar h1 {
  margin: 0;
  font-family: "Fira Code", monospace;
  font-size: clamp(1.55rem, 2vw, 2rem);
  line-height: 1.05;
  letter-spacing: -0.04em;
}

.admin-topbar p {
  color: var(--color-muted);
  margin: 8px 0 0;
  max-width: 60ch;
}

.admin-content {
  display: grid;
  gap: 24px;
}

.admin-grid {
  display: grid;
  gap: 24px;
}

.admin-grid--stats {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.admin-grid--two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.admin-stats-grid {
  display: grid;
  gap: 18px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.admin-card {
  display: grid;
  align-content: start;
  gap: 18px;
  background: #fff;
  border-radius: 24px;
  box-shadow: 0 16px 40px rgba(17, 24, 39, 0.07);
  border: 1px solid rgba(208, 218, 232, 0.86);
  padding: 24px;
  overflow-x: auto;
}

.admin-card--subtle {
  border: 1px solid rgba(120, 169, 248, 0.16);
  box-shadow: none;
  background: linear-gradient(180deg, #fbfcff 0%, #f4f8ff 100%);
}

.admin-card__eyebrow {
  display: block;
  color: #4f5f7a;
  margin-bottom: 10px;
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

.admin-card__value {
  font-family: "Fira Code", monospace;
  font-size: clamp(1.9rem, 2.3vw, 2.4rem);
  letter-spacing: -0.05em;
}

.admin-card__caption {
  color: #64748b;
  margin-top: 8px;
  line-height: 1.6;
}

.admin-panel {
  display: grid;
  gap: 24px;
}

.admin-panel__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.admin-panel__header h2,
.admin-card h3 {
  margin: 0;
  font-size: 1.12rem;
  line-height: 1.2;
  letter-spacing: -0.03em;
}

.admin-panel__header p,
.admin-card > p {
  margin: 8px 0 0;
  color: #64748b;
}

.admin-stat-card {
  display: grid;
  gap: 8px;
  padding: 20px 22px;
  border-radius: 22px;
  border: 1px solid rgba(184, 198, 219, 0.6);
  background:
    radial-gradient(circle at top right, rgba(70, 160, 255, 0.11), transparent 34%),
    linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.06);
}

.admin-stat-card strong {
  font-family: "Fira Code", monospace;
  font-size: clamp(1.75rem, 2vw, 2.25rem);
  letter-spacing: -0.05em;
  color: #0f172a;
}

.admin-stat-card span {
  color: #64748b;
  font-weight: 600;
}

.admin-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(215, 220, 229, 0.8);
}

.admin-section-head h2,
.admin-card h2 {
  margin: 0;
  font-size: 1.18rem;
  line-height: 1.15;
  letter-spacing: -0.03em;
}

.admin-table {
  width: 100%;
  min-width: 720px;
  border-collapse: collapse;
}

.admin-table-wrap {
  width: 100%;
  overflow-x: auto;
  overflow-y: visible;
  padding-bottom: 4px;
}

.admin-table th,
.admin-table td {
  padding: 15px 14px;
  border-bottom: 1px solid rgba(215, 220, 229, 0.86);
  text-align: left;
  vertical-align: top;
}

.admin-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  color: #5d6a80;
  background: #f7f9fc;
  font-size: 0.79rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.admin-table tbody tr:hover {
  background: #f9fbff;
}

.admin-table tbody tr:focus-within {
  background: #eef5ff;
}

.admin-table a:not(.button) {
  color: #0f4c81;
  font-weight: 600;
}

.admin-list {
  display: grid;
  gap: 14px;
}

.admin-list__item {
  display: grid;
  gap: 6px;
  padding: 0 0 14px;
  border-bottom: 1px solid rgba(215, 220, 229, 0.9);
}

.admin-bullets {
  margin: 0;
  padding-left: 20px;
  line-height: 1.8;
  color: #334155;
}

.admin-kv {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.admin-kv div {
  display: grid;
  gap: 8px;
  padding: 14px 16px;
  border: 1px solid rgba(215, 220, 229, 0.9);
  border-radius: 16px;
  background: linear-gradient(180deg, #ffffff 0%, #fbfcff 100%);
}

.admin-kv label {
  display: grid;
  gap: 8px;
  padding: 0;
  border: 0;
}

.admin-kv span {
  color: #64748b;
  font-size: 0.82rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.admin-form,
.admin-form label {
  display: grid;
  gap: 10px;
}

.admin-form {
  gap: 18px;
}

.admin-form > .button,
.admin-form > button,
.admin-form > .admin-actions {
  margin-top: 6px;
}

.admin-form--stacked > .admin-card {
  margin: 0;
}

.admin-form-stack {
  display: grid;
  gap: 14px;
}

.admin-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.admin-grid__full,
.admin-form-grid__full {
  grid-column: 1 / -1;
}

.admin-inline-card {
  border: 1px solid rgba(120, 169, 248, 0.18);
  border-radius: 18px;
  background: linear-gradient(180deg, #fafcff 0%, #f3f8ff 100%);
  padding: 18px;
}

.admin-form input,
.admin-form textarea,
.admin-form select {
  width: 100%;
  min-height: 50px;
  border-radius: 14px;
  border: 1px solid rgba(188, 198, 214, 0.95);
  background: #fff;
  padding: 12px 14px;
  font: inherit;
  color: #0f172a;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.admin-form input:focus,
.admin-form textarea:focus,
.admin-form select:focus {
  outline: none;
  border-color: rgba(44, 123, 229, 0.58);
  box-shadow: 0 0 0 4px rgba(44, 123, 229, 0.12);
  background: #fff;
}

.admin-form textarea {
  min-height: 132px;
}

.admin-form select[multiple] {
  min-height: 240px;
  padding: 10px;
}

.admin-checkbox {
  display: flex !important;
  align-items: center;
  gap: 10px;
}

.admin-checkbox input {
  width: auto;
  min-height: auto;
}

.admin-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.admin-actions > .button,
.admin-actions > button,
.admin-actions form {
  margin: 0;
}

.admin-table-link {
  color: #0f4c81;
  font-weight: 700;
  text-decoration: none;
}

.admin-table-link:hover {
  color: #0b3559;
  text-decoration: underline;
}

.admin-table-link--code {
  display: inline-block;
  font-family: "Fira Code", monospace;
  font-size: 0.95rem;
  letter-spacing: -0.02em;
  line-height: 1.45;
}

.admin-table-actions {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 12px;
  min-width: 128px;
}

.admin-table-actions > .button,
.admin-table-actions > button,
.admin-table-actions form,
.admin-table-actions form .button {
  width: 100%;
  margin: 0;
}

.admin-table-actions .button {
  justify-content: center;
}

.admin-body .button {
  transition: background 0.18s ease, color 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.admin-body .button:focus-visible,
.admin-body .icon-button:focus-visible,
.admin-body a:focus-visible,
.admin-body input:focus-visible,
.admin-body textarea:focus-visible,
.admin-body select:focus-visible {
  outline: 2px solid #0f4c81;
  outline-offset: 3px;
  box-shadow: 0 0 0 4px rgba(34, 197, 94, 0.18);
}

.admin-body .button--green {
  background: #22c55e;
  color: #052e16;
}

.admin-body .button--green:hover {
  background: #16a34a;
  color: #f0fdf4;
}

.admin-body .button--blue {
  background: #0f172a;
  color: #f8fafc;
}

.admin-body .button--blue:hover {
  background: #1e293b;
}

.admin-body .button--ghost {
  background: rgba(255, 255, 255, 0.86);
  border: 1px solid rgba(148, 163, 184, 0.44);
  color: #0f172a;
}

.admin-body .button--ghost:hover {
  border-color: rgba(34, 197, 94, 0.34);
  background: #fff;
}

.admin-actions form {
  margin: 0;
}

.admin-notice,
.admin-muted {
  color: var(--color-muted);
}

.admin-table-meta {
  margin-top: 6px;
  color: var(--color-muted);
  font-size: 0.88rem;
  line-height: 1.5;
}

.admin-badge-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.admin-badge {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 0.82rem;
  font-weight: 700;
  background: #e5e7eb;
  color: #374151;
}

.admin-badge--success {
  background: #dcfce7;
  color: #166534;
}

.admin-badge--warning {
  background: #fef3c7;
  color: #92400e;
}

.admin-badge--danger {
  background: #fee2e2;
  color: #991b1b;
}

.admin-badge--info {
  background: #dbeafe;
  color: #1d4ed8;
}

.admin-badge--muted {
  background: #e5e7eb;
  color: #4b5563;
}

.admin-event-list {
  display: grid;
  gap: 12px;
}

.admin-event-item {
  border: 1px solid var(--color-line);
  border-radius: 14px;
  background: #fff;
  padding: 14px 16px;
}

.admin-event-item__head {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}

.small-note {
  color: var(--color-muted);
  font-size: 0.95rem;
  margin-top: 12px;
}

.admin-notice {
  margin: 0 0 16px;
  padding: 14px 16px;
  border-radius: 16px;
  border: 1px solid rgba(56, 189, 248, 0.18);
  background: linear-gradient(180deg, #f8fbff 0%, #f1f7ff 100%);
  color: #163a63;
  font-weight: 600;
}

.admin-notice--error {
  color: #a63d2b;
  background: #fff2f0;
  border-color: rgba(166, 61, 43, 0.18);
}

.admin-user-chip {
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(15, 23, 42, 0.08);
}

.admin-user-chip strong {
  font-family: "Fira Code", monospace;
}

@media (prefers-reduced-motion: reduce) {
  .admin-nav a,
  .admin-topbar,
  .admin-body .button,
  .admin-skip-link {
    transition: none;
  }
}

@media (max-width: 1100px) {
  .admin-shell {
    grid-template-columns: 1fr;
  }

  .admin-sidebar {
    position: static;
    min-height: auto;
  }

  .admin-nav {
    max-height: none;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
  }

  .admin-nav__section {
    padding: 14px;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.05);
  }

  .admin-main {
    padding: 18px;
  }

  .admin-topbar {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (max-width: 720px) {
  .community-course-intro {
    padding: 16px 0 10px;
  }

  .community-course-intro .mainContentColumn > header.row {
    padding: 20px;
    border-radius: 18px;
  }

  .community-course-intro .category_description > .row {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .community-course-intro img {
    max-width: 260px;
  }

  .course-stage-intro .mainContentColumn > .stage-course-header {
    padding: 20px;
    border-radius: 18px;
  }

  .admin-nav {
    grid-template-columns: 1fr;
  }

  .admin-sidebar {
    padding: 18px 14px;
  }

  .admin-main {
    padding: 14px;
  }

  .admin-topbar {
    padding: 16px;
    border-radius: 20px;
  }

  .admin-card {
    padding: 18px;
    border-radius: 20px;
  }

  .admin-actions,
  .admin-actions-row,
  .admin-topbar__actions {
    width: 100%;
  }

  .admin-topbar__actions {
    display: grid;
    gap: 10px;
  }

  .admin-topbar__actions .button {
    width: 100%;
    justify-content: center;
  }
}

.select2-container {
  width: 100% !important;
}

.select2-container--default .select2-selection--single {
  min-height: 48px;
  border: 1px solid rgba(15, 23, 42, 0.14);
  border-radius: 14px;
  display: flex;
  align-items: center;
  padding: 0 10px;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
  color: #111827;
  line-height: 1.4;
  padding-left: 2px;
  padding-right: 28px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 46px;
  right: 10px;
}

.select2-dropdown {
  border: 1px solid rgba(15, 23, 42, 0.14);
  border-radius: 14px;
  overflow: hidden;
}

.select2-search--dropdown .select2-search__field {
  border: 1px solid rgba(15, 23, 42, 0.14);
  border-radius: 10px;
  padding: 8px 10px;
}

.select2-results__option {
  padding: 10px 12px;
}

.select2-course-option__title {
  font-weight: 700;
  color: #0f172a;
}

.select2-course-option__meta {
  color: #64748b;
  font-size: 0.86rem;
  margin-top: 2px;
}

.select2-course-option__description {
  color: #475569;
  font-size: 0.9rem;
  margin-top: 4px;
}

.admin-table td:last-child,
.admin-table th:last-child {
  white-space: nowrap;
}

.admin-table__actions {
  white-space: nowrap;
}

@media (max-width: 1199px) {
  .app-topbar__inner,
  .hero-grid,
  .checkout-layout {
    flex-direction: column;
    align-items: stretch;
  }

  .app-brand,
  .app-brand--secondary {
    flex-wrap: wrap;
  }

  .course-grid,
  .app-footer__grid,
  .auth-context,
  .auth-grid,
  .tabs-grid,
  .promo-boxes,
  .listing-filters,
  .wizard-step__body--split,
  .wizard-filters,
  .admin-grid--stats,
  .admin-grid--two,
  .admin-stats-grid,
  .admin-kv,
  .admin-form-grid {
    grid-template-columns: 1fr;
  }

  .choice-row {
    flex-direction: column;
  }

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

  .course-page__hero {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .listing-filters--category {
    grid-template-columns: 1fr;
    padding: 22px;
  }

  .choice-row--course-promos {
    grid-template-columns: 1fr;
  }

  .choice-row--course-promos .choice-pill:last-child:nth-child(odd) {
    grid-column: auto;
    justify-self: stretch;
    width: 100%;
  }

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

  .course-media-card__metrics {
    grid-template-columns: 1fr;
    margin-top: 0;
    padding-top: 18px;
  }

  .course-grid--stacked .course-card__summary {
    grid-template-columns: 160px minmax(0, 1fr);
    gap: 18px;
  }

  .course-grid--stacked .course-metric--stages {
    grid-column: auto;
  }

  .admin-panel__header {
    flex-direction: column;
    align-items: stretch;
  }

  .course-card__summary {
    grid-template-columns: 140px repeat(2, minmax(0, 1fr));
  }

  .course-metric--stages {
    grid-column: span 2;
  }

  .checkout-summary {
    position: static;
    top: auto;
  }

  .admin-shell {
    grid-template-columns: 1fr;
  }

  .store-main {
    padding-top: 28px;
  }

  .app-nav-toggle {
    display: inline-flex;
  }

  .app-navbar__inner {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 18px;
  }

  .app-navbar__brand-column {
    grid-column: 1;
  }

  .app-navbar__menu-column {
    grid-column: 2;
    justify-self: end;
  }

  .app-navbar__logos-column {
    display: none;
  }

  .app-brand {
    justify-content: flex-start;
    flex-wrap: wrap;
  }

  .app-nav-links {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(380px, 90vw);
    background: #fff;
    z-index: 40;
    padding: 24px 22px 28px;
    display: grid;
    align-content: start;
    gap: 20px;
    transform: translateX(100%);
    transition: transform 0.24s ease;
    box-shadow: -14px 0 50px rgba(15, 23, 42, 0.18);
    overflow-y: auto;
  }

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

  .app-nav-drawer-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
  }

  .app-nav-group {
    padding: 0 0 14px;
    border-bottom: 1px solid rgba(23, 23, 23, 0.08);
  }

  .app-nav-group__title {
    font-size: 17px;
  }

  .app-nav-group__subtitle {
    font-size: 14px;
    max-width: 220px;
  }

  .app-nav-group--has-children {
    padding-right: 0;
  }

  .app-nav-group__toggle {
    top: 0;
    right: 0;
  }

  .app-nav-submenu {
    position: static;
    display: none;
    min-width: 0;
    box-shadow: none;
    border: 0;
    border-left: 2px solid rgba(243, 160, 0, 0.28);
    border-radius: 0;
    padding: 12px 0 0 14px;
    margin-top: 10px;
  }

  .app-nav-group--has-children:hover .app-nav-submenu,
  .app-nav-group--has-children:focus-within .app-nav-submenu {
    display: none;
  }

  .app-nav-group--has-children.is-open .app-nav-submenu {
    display: grid;
  }

  .app-cart-link {
    justify-content: flex-start;
    padding-top: 8px;
  }
}

@media (max-width: 767px) {
  .page-hero--course + .section .prose h2[id] {
    scroll-margin-top: 108px;
  }

  .app-navbar__inner {
    gap: 14px;
    padding: 16px 0;
  }

  .header-logo--campus {
    width: 152px;
  }

  .header-logo--anpe {
    width: 60px;
  }

  .app-topbar__left,
  .app-topbar__right {
    gap: 12px;
    flex-wrap: wrap;
    justify-content: center;
  }

  .app-topbar__item,
  .app-topbar__account {
    font-size: 13px;
  }

  .app-topbar__cta {
    min-height: 44px;
    padding: 0 18px;
    font-size: 14px;
  }

  .app-header-shell .logo-part a {
    gap: 12px;
  }

  .app-header-shell .mobile-menu {
    min-height: 72px;
    gap: 10px;
  }

  .app-header-shell .cart-icon--mobile,
  .app-header-shell .rs-menu-toggle {
    width: 44px;
    height: 44px;
    border-radius: 12px;
  }

  .app-header-shell .nav-menu > li > a {
    min-height: 64px;
    padding: 12px 48px 12px 0;
  }

  .app-header-shell .rs-menu-parent {
    width: 42px;
    height: 64px;
  }

  .course-buy,
  .detail-buy,
  .coupon-box__row,
  .course-card__bottom {
    flex-direction: column;
    align-items: stretch;
  }

  .checkout-card {
    padding: 22px;
    border-radius: 20px;
  }

  .checkout-card__head {
    grid-template-columns: 1fr;
  }

  .checkout-item,
  .checkout-item--cart {
    grid-template-columns: 1fr;
  }

  .checkout-item__price,
  .checkout-item--cart .cart-row__actions {
    justify-self: flex-start;
  }

  .auth-form--register .auth-form__grid {
    grid-template-columns: 1fr;
  }

  .course-card {
    padding: 18px;
  }

  .store-main {
    padding: 22px 0 48px;
  }

  .course-card__summary {
    grid-template-columns: 1fr 1fr;
    gap: 16px;
  }

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

  .course-grid--stacked .course-buy {
    max-width: none;
    margin-left: 0;
  }

  .course-thumb {
    width: 100%;
    height: 168px;
    grid-column: 1 / -1;
  }

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

  .course-tabs a {
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  }

  .course-metric,
  .course-metric--stages {
    justify-items: start;
    text-align: left;
  }

  .course-metric__inline {
    justify-content: flex-start;
  }

  .course-metric--stages {
    grid-column: 1 / -1;
  }

  .course-price {
    min-width: 0;
    font-size: 1.5rem;
  }

  .course-cart-button {
    width: 100%;
  }

  .course-price {
    font-size: 1.5rem;
  }

  .cart-modal__dialog {
    margin: 24px auto;
    padding: 18px 16px 16px;
  }

  .cart-modal__item,
  .cart-modal__actions {
    flex-direction: column;
    align-items: stretch;
  }

  .cart-modal__item-price,
  .cart-modal__totals {
    justify-items: start;
  }

  .cart-modal__totals p {
    flex-wrap: wrap;
  }
}


.flash-stack {
  display: grid;
  gap: 12px;
  margin-bottom: 20px;
}

.flash-stack--client:empty {
  display: none;
}

.flash-message {
  padding: 14px 16px;
  border-radius: 12px;
  font-weight: 500;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
}

.flash-message--warning {
  background: #fff6da;
  color: #7b5a00;
  border: 1px solid #f0d97c;
}

.flash-message--error {
  background: #fde9ec;
  color: #9c1c2f;
  border: 1px solid #f4b4c0;
}

.flash-message--info {
  background: #e9f2ff;
  color: #1b4c8c;
  border: 1px solid #b8d1f4;
}

.content-rating-shortcode {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem 1.4rem;
  align-items: center;
  justify-content: space-between;
  width: min(100%, 520px);
  margin: 0.9rem 0 1rem auto;
  padding: 0.9rem 1rem;
  border: 1px solid rgba(15, 23, 42, 0.09);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.82);
  box-shadow: none;
}

.content-rating-shortcode__summary {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem 0.8rem;
  align-items: baseline;
  justify-content: space-between;
  width: 100%;
}

.content-rating-shortcode__label,
.content-rating-shortcode__score,
.content-rating-shortcode__message {
  margin: 0;
}

.content-rating-shortcode__label {
  font-size: 0.95rem;
  font-weight: 900;
  color: #121826;
  letter-spacing: -0.01em;
}

.content-rating-shortcode__score,
.content-rating-shortcode__message {
  color: #5e6472;
  font-size: 1rem;
  font-weight: 800;
  letter-spacing: 0.01em;
}

.content-rating-shortcode__stars {
  --rating-star-size: 36px;
  --rating-star-gap: 0.4rem;
  position: relative;
  width: max-content;
  max-width: 100%;
  min-height: 42px;
}

.content-rating-shortcode__meter,
.content-rating-shortcode__hitarea {
  display: grid;
  grid-template-columns: repeat(5, var(--rating-star-size));
  gap: var(--rating-star-gap);
  align-items: center;
}

.content-rating-shortcode__meter {
  position: relative;
  pointer-events: none;
}

.content-rating-shortcode__star-visual {
  position: relative;
  width: var(--rating-star-size);
  height: var(--rating-star-size);
}

.content-rating-shortcode__star-icon {
  position: absolute;
  inset: 0;
  width: var(--rating-star-size);
  height: var(--rating-star-size);
  background: currentColor;
  clip-path: polygon(50% 2%, 61% 35%, 96% 35%, 68% 56%, 79% 91%, 50% 70%, 21% 91%, 32% 56%, 4% 35%, 39% 35%);
  filter: drop-shadow(0 4px 4px rgba(15, 23, 42, 0.14));
}

.content-rating-shortcode__star-icon--rail {
  color: #cfd4df;
}

.content-rating-shortcode__star-icon--fill {
  width: var(--star-fill, 0%);
  color: #f0a008;
  background: transparent;
  clip-path: none;
  filter: none;
  overflow: hidden;
  transition: width 220ms linear;
}

.content-rating-shortcode__star-icon--fill::before {
  content: "";
  position: absolute;
  inset: 0;
  width: var(--rating-star-size);
  height: var(--rating-star-size);
  background: currentColor;
  clip-path: polygon(50% 2%, 61% 35%, 96% 35%, 68% 56%, 79% 91%, 50% 70%, 21% 91%, 32% 56%, 4% 35%, 39% 35%);
  filter: none;
}

.content-rating-shortcode__hitarea {
  position: absolute;
  inset: -6px 0 -6px 0;
}

.content-rating-shortcode__star {
  display: block;
  width: calc(var(--rating-star-size) + 6px);
  height: calc(var(--rating-star-size) + 12px);
  margin: 0 -4px;
  border: 0;
  border-radius: 16px;
  background: transparent;
  cursor: pointer;
  transition: transform 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

.content-rating-shortcode__star:hover,
.content-rating-shortcode__star:focus-visible {
  background: rgba(243, 166, 9, 0.1);
  outline: none;
  transform: translateY(-2px);
}

.content-rating-shortcode__star:focus-visible {
  box-shadow: 0 0 0 3px rgba(243, 155, 9, 0.26);
}

.content-rating-shortcode.is-loading .content-rating-shortcode__star {
  pointer-events: none;
  opacity: 0.72;
}

@media (max-width: 767px) {
  .content-rating-shortcode {
    width: 100%;
    margin-right: 0;
    margin-left: 0;
    padding: 0.9rem;
  }

  .content-rating-shortcode__summary {
    display: grid;
  }

  .content-rating-shortcode__stars {
    --rating-star-size: 32px;
    --rating-star-gap: 0.35rem;
    justify-content: space-between;
  }
}
.admin-actions-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: center;
}

.admin-actions--spaced-top {
  margin-top: 1rem;
}

.admin-badge-row--spaced {
  margin-bottom: 14px;
}

.admin-section-head--compact {
  margin-bottom: 0.5rem;
}

.admin-table--spaced {
  margin-top: 1rem;
}

.admin-code-block {
  margin: 0;
  padding: 16px 18px;
  border-radius: 16px;
  background: #0f172a;
  color: #e2e8f0;
  font: 0.9rem/1.5 "Fira Code", monospace;
  overflow-x: auto;
}

.admin-code-field {
  display: grid;
  gap: 0.55rem;
}

.admin-code-field + .admin-code-field {
  margin-top: 1rem;
}

.admin-code-field__label {
  display: inline-flex;
  align-items: center;
  font-weight: 700;
  color: #0f172a;
}

.admin-code-field__help {
  margin: 0;
}

.admin-code-field__textarea {
  width: 100%;
  min-height: 12rem;
  padding: 1rem 1.05rem;
  border-radius: 18px;
  border: 1px solid rgba(148, 163, 184, 0.35);
  background: #0f172a;
  color: #e2e8f0;
  font-family: "Fira Code", monospace;
  font-size: 0.9rem;
  line-height: 1.55;
  resize: vertical;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.admin-code-field__textarea::placeholder {
  color: rgba(226, 232, 240, 0.55);
}

.admin-code-field__textarea:focus {
  outline: none;
  border-color: rgba(34, 197, 94, 0.7);
  box-shadow: 0 0 0 4px rgba(34, 197, 94, 0.12);
}

.free-courses-hero,
.free-course-detail-hero {
  position: relative;
  overflow: hidden;
  padding: clamp(2.5rem, 5vw, 5rem) 0;
}

.free-courses-hero__grid,
.free-course-detail-hero__grid,
.free-course-detail {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr);
  gap: clamp(1.5rem, 4vw, 3rem);
  align-items: center;
}

.free-courses-eyebrow,
.free-course-card__meta {
  display: inline-flex;
  color: #e09a00;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.free-courses-hero h1,
.free-course-detail-hero h1 {
  max-width: 860px;
  margin: 0.35rem 0 1rem;
  color: #121826;
  font-size: clamp(2.2rem, 5vw, 4.7rem);
  line-height: 0.95;
  letter-spacing: -0.055em;
}

.free-courses-hero p,
.free-course-detail-hero p {
  max-width: 720px;
  color: #4b5565;
  font-size: clamp(1.05rem, 2vw, 1.25rem);
}

.free-courses-hero__note,
.free-course-signup {
  padding: clamp(1.3rem, 3vw, 2rem);
  border: 1px solid rgba(18, 45, 82, 0.12);
  border-radius: 28px;
  background: rgba(255, 255, 255, 0.82);
  box-shadow: 0 22px 60px rgba(15, 31, 54, 0.1);
}

.free-courses-hero__note strong,
.free-courses-hero__note span {
  display: block;
}

.free-courses-hero__note strong {
  color: #12345a;
  font-size: 1.35rem;
}

.free-courses-hero__note span {
  margin-top: 0.5rem;
  color: #5e6472;
}

.free-courses-hero__media {
  aspect-ratio: 16 / 10;
  overflow: hidden;
  border: 10px solid #fff;
  border-radius: 34px;
  box-shadow: 0 24px 70px rgba(15, 31, 54, 0.14);
}

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

.free-course-status {
  background: #f4f7fb;
  padding: clamp(2rem, 4vw, 3rem) 0;
}

.free-course-status__panel {
  max-width: 980px;
  padding: clamp(1.6rem, 4vw, 2.5rem);
  border: 1px solid rgba(18, 45, 82, 0.1);
  border-radius: 28px;
  background: #fff;
  box-shadow: 0 18px 50px rgba(15, 31, 54, 0.08);
}

.free-course-status__panel h1 {
  margin-bottom: 0.75rem;
  font-size: clamp(2.4rem, 5.8vw, 4.6rem);
}

.free-course-status__panel p {
  margin-bottom: 1.1rem;
}

.free-course-status__next {
  max-width: 760px;
  margin: 1.25rem 0 1.5rem;
  padding: 1rem 1.1rem;
  border: 1px solid rgba(12, 57, 102, 0.12);
  border-radius: 18px;
  background: #f7f9fc;
  color: #253044;
}

.free-course-status__next strong {
  display: block;
  margin-bottom: 0.6rem;
  color: #12345a;
  font-size: 0.82rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.free-course-status__next ul {
  display: grid;
  gap: 0.45rem;
  margin: 0;
  padding-left: 1.15rem;
}

.free-course-status__next li {
  line-height: 1.45;
}

.free-courses-intro {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(1rem, 3vw, 1.5rem);
}

.free-courses-intro__panel {
  position: relative;
  display: grid;
  gap: 0.85rem;
  align-content: start;
  padding: clamp(1.4rem, 3vw, 2rem);
  border: 1px solid rgba(18, 45, 82, 0.12);
  border-radius: 28px;
  background: #fff;
  box-shadow: 0 18px 50px rgba(15, 31, 54, 0.07);
}

.free-courses-intro__icon {
  width: 3rem;
  height: 3rem;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: #fff5d6;
  color: #be7a00;
  font-weight: 950;
}

.free-courses-intro__panel h2,
.free-courses-list-title h2 {
  margin: 0;
  color: #122d52;
  font-size: clamp(1.45rem, 3vw, 2.3rem);
  line-height: 1.08;
  letter-spacing: -0.035em;
}

.free-courses-intro__panel p {
  margin: 0;
  color: #4b5565;
}

.free-courses-list-title {
  display: grid;
  gap: 0.35rem;
  margin-bottom: 0.5rem;
}

.free-course-list {
  display: grid;
  gap: 1rem;
}

.free-course-card {
  display: grid;
  grid-template-columns: minmax(220px, 330px) minmax(0, 1fr);
  gap: clamp(1rem, 3vw, 2rem);
  align-items: stretch;
  padding: clamp(1rem, 2vw, 1.35rem);
  border: 1px solid rgba(18, 45, 82, 0.12);
  border-radius: 28px;
  background: #fff;
  box-shadow: 0 18px 50px rgba(15, 31, 54, 0.08);
}

.free-course-card__media {
  min-height: 190px;
  overflow: hidden;
  border-radius: 22px;
  background: #edf4ff;
}

.free-course-card__media img,
.free-course-detail-hero__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.free-course-card__body {
  display: grid;
  gap: 0.65rem;
  align-content: center;
}

.free-course-card__body h2 {
  margin: 0;
  font-size: clamp(1.35rem, 3vw, 2.15rem);
  line-height: 1.05;
  letter-spacing: -0.035em;
}

.free-course-card__body h2 a {
  color: #122d52;
  text-decoration: none;
}

.free-course-card__body p {
  max-width: 72ch;
  margin: 0 0 0.85rem;
  color: #4b5565;
}

.free-course-card__content {
  max-width: 86ch;
  color: #4b5565;
}

.free-course-card__content a {
  color: #123f73;
  font-weight: 900;
}

.free-course-card__body .button,
.free-course-signup .button {
  width: fit-content;
}

.free-course-detail-hero__facts {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
}

.free-course-detail-hero__facts span {
  padding: 0.65rem 0.95rem;
  border-radius: 999px;
  background: #fff;
  color: #12345a;
  font-weight: 900;
  box-shadow: 0 12px 28px rgba(15, 31, 54, 0.08);
}

.free-course-detail-hero--compact {
  padding: clamp(1.8rem, 4vw, 3rem) 0 clamp(1rem, 2vw, 1.35rem);
}

.free-course-detail-hero--compact .free-course-detail-hero__copy {
  max-width: 980px;
}

.free-course-detail-hero--compact h1 {
  margin-bottom: 1.2rem;
  font-size: clamp(2rem, 4.4vw, 3.25rem);
  line-height: 1.08;
}

.free-course-detail-section {
  padding-top: 0;
}

.free-course-detail-hero__media {
  aspect-ratio: 16 / 10;
  overflow: hidden;
  border: 10px solid #fff;
  border-radius: 34px;
  box-shadow: 0 24px 70px rgba(15, 31, 54, 0.16);
}

.free-course-detail {
  grid-template-columns: 1fr;
  align-items: start;
  gap: clamp(1.25rem, 3vw, 2rem);
}

.free-course-detail__content {
  max-width: none;
}

.free-course-detail__original-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 38%);
  gap: clamp(1.2rem, 3vw, 2.1rem);
  align-items: start;
  padding: clamp(1.35rem, 3vw, 2rem);
  border: 1px solid rgba(18, 45, 82, 0.12);
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 18px 48px rgba(15, 31, 54, 0.07);
}

.free-course-detail__legacy {
  color: #333;
  font-size: 1rem;
  line-height: 1.75;
}

.free-course-detail__legacy p {
  margin: 0 0 1rem;
  text-align: justify;
}

.free-course-detail__legacy #subtitleCursoGratis {
  margin-bottom: 1.35rem;
  color: #fff;
  text-transform: uppercase;
  line-height: 1.02;
}

.free-course-detail__legacy #subtitleCursoGratis span,
.free-course-detail__legacy #subtitleCursoGratis strong {
  display: inline-block;
  padding: 0.45rem 1.3rem;
}

.free-course-detail__legacy #subtitleCursoGratis span {
  font-size: clamp(1.25rem, 2.4vw, 1.7rem);
  font-weight: 950;
}

.free-course-detail__legacy #subtitleCursoGratis strong {
  max-width: 520px;
  font-size: clamp(1.3rem, 2.8vw, 1.9rem) !important;
  letter-spacing: 0.02em;
}

.free-course-detail__legacy > h2 {
  width: min(100%, 300px);
  margin: 1rem auto 0;
  padding: 0.85rem 0 0.95rem;
  border-top: 1px solid rgba(139, 92, 34, 0.24);
  color: #8b5e22;
  font-size: 1rem;
  line-height: 1.15;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  background: transparent;
  box-shadow: none;
}

.free-course-detail__figure {
  margin: 0;
  min-height: 240px;
  display: grid;
  place-items: center;
  border-radius: 24px;
  background:
    radial-gradient(circle at 50% 40%, rgba(207, 224, 250, 0.52), transparent 46%),
    linear-gradient(180deg, #f8fbff 0%, #fff 100%);
}

.free-course-detail__figure img {
  width: min(100%, 320px);
  height: auto;
  max-height: 430px;
  object-fit: contain;
}

.free-course-detail__side {
  display: grid;
  gap: clamp(1rem, 2vw, 1.35rem);
  align-content: start;
}

.free-course-video {
  margin: 0 0 1rem 0;
  padding: 0.65rem;
  border: 1px solid rgba(18, 45, 82, 0.12);
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 14px 34px rgba(15, 31, 54, 0.08);
}

.free-course-video__frame {
  position: relative;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  border-radius: 16px;
  background: #0f1f36;
}

.free-course-video__frame iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.free-course-signup {
  position: static;
  top: auto;
  display: grid;
  gap: 0.7rem;
  padding: clamp(1rem, 2vw, 1.35rem);
  border: 1px solid rgba(18, 45, 82, 0.12);
  border-radius: 20px;
  background:
    radial-gradient(circle at 100% 0%, rgba(120, 169, 248, 0.12), transparent 34%),
    #fbfdff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.86);
}

.free-course-signup .button {
  width: 100%;
}

.free-course-signup h2 {
  margin: 0;
  color: #122d52;
  font-size: clamp(1.35rem, 2.2vw, 1.85rem);
}

.free-course-signup__status {
  padding: 0.85rem 1rem;
  border-radius: 16px;
  background: #fff7df;
  color: #6d4a00;
  font-weight: 800;
}

.free-course-signup__form {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.75rem;
  align-items: stretch;
  margin: 0.3rem 0 0;
}

.free-course-signup__form label {
  display: grid;
  gap: 0.35rem;
  color: #121826;
  font-weight: 800;
}

.free-course-signup__form input:not([type="checkbox"]) {
  width: 100%;
  min-height: 50px;
  padding: 0.85rem 0.95rem;
  border: 1px solid rgba(18, 45, 82, 0.18);
  border-radius: 14px;
  font: inherit;
}

.free-course-signup__trap {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.free-course-signup__consent {
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: 0.6rem;
  padding: 0.8rem;
  border: 1px solid rgba(18, 45, 82, 0.12);
  border-radius: 14px;
  background: #fff;
  color: #354158;
  font-size: 0.78rem;
  line-height: 1.34;
  font-weight: 650;
}

.free-course-signup__consent input {
  appearance: none;
  width: 1.05rem;
  height: 1.05rem;
  margin-top: 0.15rem;
  border: 2px solid rgba(18, 52, 90, 0.34);
  border-radius: 4px;
  background: #fff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

.free-course-signup__consent input:checked {
  border-color: #123f73;
  background:
    linear-gradient(135deg, transparent 0 42%, #fff 42% 58%, transparent 58%),
    linear-gradient(45deg, transparent 0 45%, #fff 45% 60%, transparent 60%),
    #123f73;
}

.free-course-signup__consent input:focus-visible {
  outline: 3px solid rgba(120, 169, 248, 0.5);
  outline-offset: 2px;
}

.free-course-signup__recovery {
  margin-top: 0.15rem;
  border-top: 1px solid rgba(18, 45, 82, 0.12);
  padding-top: 0.8rem;
}

.free-course-signup__recovery summary {
  cursor: pointer;
  color: #123f73;
  font-weight: 900;
  font-size: 0.92rem;
}

.free-course-signup__certificate-link {
  color: #123f73;
  font-weight: 800;
  font-size: 0.9rem;
}

.free-course-signup__form--recovery {
  grid-template-columns: 1fr;
  margin-top: 0.8rem;
}

.page-template--free-course-detail .store-shell {
  width: min(var(--container-max-xl), calc(100% - var(--container-gutter)));
  grid-template-columns: minmax(220px, 260px) minmax(0, 1fr);
  gap: 24px;
}

.page-template--free-course-detail .store-content {
  align-self: start;
}

@media (max-width: 900px) {
  .free-courses-hero__grid,
  .free-course-detail-hero__grid,
  .free-course-detail,
  .free-course-card,
  .free-courses-intro,
  .free-course-detail__original-card {
    grid-template-columns: 1fr;
  }

  .free-course-signup {
    position: static;
  }

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

@media (max-width: 991px) {
  .page-template--free-course-detail .store-shell {
    grid-template-columns: 1fr;
  }

  .page-template--free-course-detail .store-content {
    order: 1;
  }

  .page-template--free-course-detail .store-sidebar {
    order: 2;
  }
}

@media (max-width: 600px) {
  .free-course-detail__legacy p {
    text-align: left;
  }

  .free-course-detail__original-card {
    padding: 1rem;
  }
}
.free-course-certificate-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 1.5rem;
}

.free-course-certificate-form label {
    display: grid;
    gap: .4rem;
    font-weight: 800;
    color: #1f2a44;
}

.free-course-certificate-form input,
.free-course-certificate-form select {
    width: 100%;
    min-height: 48px;
    border: 1px solid #cbd5e1;
    border-radius: 14px;
    padding: .75rem .9rem;
    font: inherit;
    background: #fff;
}

.free-course-certificate-form .button {
    align-self: end;
}

@media (max-width: 720px) {
    .free-course-certificate-form {
        grid-template-columns: 1fr;
    }
}