/* Unificar estilos de landing en el theme usando solo variables --ra- */

/* Breadcrumbs */
.path-contenidos-para-aprender .breadcrumb {
  max-width: 1200px;
  margin: 0 auto 1.5rem;
  padding: 0 1.5rem;
}
.path-contenidos-para-aprender .breadcrumb ol {
  display: flex;
  list-style: none;
  padding: 0;
  margin: 0;
  font-size: 0.875rem;
}
.path-contenidos-para-aprender .breadcrumb li {
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0;
}
.path-contenidos-para-aprender .breadcrumb li:not(:last-child)::after {
  content: '›';
  margin: 0 0.5rem;
  color: var(--ra-color-grey);
}
.path-contenidos-para-aprender .breadcrumb a {
  color: var(--ra-color-cobalt);
  text-decoration: none;
}
.path-contenidos-para-aprender .breadcrumb a:hover {
  text-decoration: underline;
}

/* Ajustes de layout específico para la página */
.page-node-type-page.path-contenidos-para-aprender #main-wrapper,
.path-contenidos-para-aprender #main-wrapper {
  padding-top: 0 !important;
}

.page-node-type-page.path-contenidos-para-aprender #main,
.path-contenidos-para-aprender #main {
  padding-left: 0 !important;
  padding-right: 0 !important;
  max-width: 100% !important;
}

.page-node-type-page.path-contenidos-para-aprender .container,
.path-contenidos-para-aprender .container {
  padding-left: 0 !important;
  padding-right: 0 !important;
  max-width: 100% !important;
}

/* Intro */
.contenidos-intro {
  background: var(--ra-color-corn-silk);
  padding: 2.5rem 0;
}
.contenidos-intro__container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 1.5rem;
  display: grid;
  gap: 3rem;
  align-items: center;
}
@media (min-width: 992px) {
  .contenidos-intro__container {
    grid-template-columns: 1fr 380px;
  }
}
.contenidos-intro__title {
  color: var(--ra-color-black) !important;
  font-size: 1.75rem !important;
  font-weight: 700 !important;
  margin: 0 0 1rem 0 !important;
  line-height: 1.3 !important;
  display: block !important;
}
.contenidos-intro__text {
  color: var(--ra-color-matterhorn);
  font-size: 1rem;
  line-height: 1.6;
  margin: 0;
}
.contenidos-intro__ctas {
  display: flex;
  gap: 1rem;
  margin-top: 1.5rem;
  flex-wrap: wrap;
}
.contenidos-intro__cta {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  text-decoration: none;
  font-weight: 600;
  padding: 0.875rem 1.5rem;
  border-radius: 999px;
  border: 2px solid transparent;
  font-size: 0.9375rem;
  transition: all 0.2s ease;
}
.contenidos-intro__cta--primary {
  background: var(--ra-color-cobalt);
  color: var(--ra-text-light);
}
.contenidos-intro__cta--primary:hover,
.contenidos-intro__cta--primary:focus-visible {
  background: var(--ra-color-havelock-blue);
  transform: translateY(-1px);
  box-shadow: var(--ra-shadow-md);
  color: var(--ra-color-white);
}
.contenidos-intro__cta--secondary {
  color: var(--ra-color-cobalt);
  border-color: var(--ra-color-cobalt);
  background: transparent;
}
.contenidos-intro__cta--secondary:hover,
.contenidos-intro__cta--secondary:focus-visible {
  background: var(--ra-color-cobalt);
  color: var(--ra-text-light);
}
.contenidos-intro__cta-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  height: auto;
  font-size: 1rem;
  margin-left: 0.25rem;
}
.contenidos-intro__image {
  display: flex;
  align-items: center;
  justify-content: center;
}
.contenidos-intro__image img {
  max-width: 100%;
  height: auto;
  border-radius: 0;
  box-shadow: none;
}

/* Position the breadcrumb inside the intro block on contenidos landing */
.path-contenidos-para-aprender .cl-section.cl-intro {
  position: relative;
}

.path-contenidos-para-aprender .contenidos-intro__breadcrumb {
  position: absolute;
  top: 1rem;
  left: 1.25rem;
  z-index: 30;
  width: auto;
  max-width: 640px;
}

/* Background for breadcrumb inside the intro on contenidos-para-aprender */
.path-contenidos-para-aprender .contenidos-intro__breadcrumb .breadcrumb {
  background: var(--ra-color-corn-silk) !important;
  padding: 0.5rem 0.875rem;
  border-radius: 0.375rem;
}

@media (max-width: 767px) {
  .path-contenidos-para-aprender .contenidos-intro__breadcrumb {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    margin-bottom: 0.75rem;
    padding: 0 1rem;
  }
}

/* Colecciones - Estilos actualizados */
.contenidos-colecciones { padding:4rem 1.5rem; background:var(--ra-bg-primary); }
.contenidos-colecciones__container { max-width:1200px; margin:0 auto; }
.contenidos-colecciones__header { display:flex; justify-content:center; align-items:flex-start; margin-bottom:3rem; gap:2rem; position:relative; }
.contenidos-colecciones__header-text { flex:1; text-align:center; max-width:800px; margin:0 auto; }
.contenidos-colecciones__title { color:var(--ra-color-cobalt); font-size:2.625rem; font-weight:700; margin:0 0 1rem; text-align:center; line-height:1.2; }
.contenidos-colecciones__subtitle { font-size:1rem; color:var(--ra-color-matterhorn); text-align:center; line-height:1.6; max-width:700px; margin:0 auto; }
.contenidos-colecciones__nav { display:flex; gap:1rem; flex-shrink:0; position:absolute; right:0; bottom:-3rem; }
.contenidos-colecciones__nav-btn { width:48px; height:48px; border-radius:50%; background-color:var(--ra-color-cobalt); color:var(--ra-color-white); border:none; font-size:1.5rem; cursor:pointer; transition:all 0.3s ease; display:flex; align-items:center; justify-content:center; }
.contenidos-colecciones__nav-btn:hover, .contenidos-colecciones__nav-btn:focus { background-color:var(--ra-color-blue-dark); box-shadow:var(--ra-shadow-md); }
.contenidos-colecciones__grid { display:grid; gap:1.5rem; margin-bottom:2rem; }
@media (min-width: 768px) { .contenidos-colecciones__grid { grid-template-columns:1fr 1fr; gap:2rem; } }
.contenidos-colecciones__left { display:flex; }
.contenidos-colecciones__right { display:flex; flex-direction:column; gap:1.5rem; }
.coleccion-card { background:var(--ra-color-white); border-radius:0.75rem; overflow:hidden; box-shadow:var(--ra-shadow-sm); transition:all 0.3s ease; display:flex; flex-direction:column; height:100%; }
.coleccion-card:hover { box-shadow:var(--ra-shadow-lg); transform:translateY(-4px); }
.coleccion-card--large { flex-direction:column; }
.coleccion-card--small { flex-direction:row; }
.coleccion-card__image { overflow:hidden; background-color:var(--ra-color-solitude); }
.coleccion-card--large .coleccion-card__image { width:100%; aspect-ratio:16/9; }
.coleccion-card--small .coleccion-card__image { width:220px; flex-shrink:0; aspect-ratio:4/3; }
.coleccion-card__image img { width:100%; height:100%; object-fit:cover; transition:transform 0.3s ease; }
.coleccion-card__image a:hover img { transform:scale(1.05); }
.coleccion-card__content { padding:1.25rem 1.5rem 1.5rem; flex:1; display:flex; flex-direction:column; gap:0.875rem; }
.coleccion-card--small .coleccion-card__content { padding:1rem 1.25rem; gap:0.625rem; }
.coleccion-card__meta { display:flex; flex-wrap:wrap; gap:0.5rem; align-items:center; margin-bottom:0.5rem; order:-1; }
.coleccion-card--small .coleccion-card__meta { gap:0.375rem; margin-bottom:0.375rem; }
.coleccion-card__chip { display:inline-block; padding:0.375rem 0.875rem; border-radius:1.25rem; font-size:0.8125rem; font-weight:600; line-height:1; white-space:nowrap; }
.coleccion-card--small .coleccion-card__chip { padding:0.25rem 0.625rem; font-size:0.75rem; }
.coleccion-card__chip:first-child { background-color:var(--ra-color-solitude); color:var(--ra-color-cobalt); }
.coleccion-card__chip:nth-child(2) { background-color:var(--ra-color-white); color:#7B5E00 !important; border:2px solid #D48E00; }
.coleccion-card__chip:nth-child(n+3) { background-color:var(--ra-color-solitude); color:var(--ra-color-cobalt); }
.coleccion-card__date { display:inline-block; padding:0.375rem 0.875rem; border-radius:1.25rem; font-size:0.8125rem; font-weight:600; line-height:1; white-space:nowrap; background-color:var(--ra-color-solitude); color:var(--ra-color-cobalt); }
.coleccion-card--small .coleccion-card__date { padding:0.25rem 0.625rem; font-size:0.75rem; }
.coleccion-card__title { font-size:1.125rem; font-weight:700; margin:0; line-height:1.4; color:var(--ra-color-matterhorn); }
.coleccion-card--small .coleccion-card__title { font-size:1rem; line-height:1.3; }
.coleccion-card__title a { color:inherit; text-decoration:none; transition:color 0.3s ease; }
.coleccion-card__title a:hover { color:var(--ra-color-cobalt); }
.coleccion-card__description { font-size:0.9375rem; color:var(--ra-color-matterhorn); line-height:1.6; margin:0; flex:1; }
.coleccion-card--small .coleccion-card__description { font-size:0.875rem; line-height:1.5; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.coleccion-card__link { display:inline-flex; align-items:center; gap:0.5rem; color:var(--ra-color-cobalt); text-decoration:underline; font-size:0.9375rem; font-weight:600; margin-top:0.5rem; transition:all 0.3s ease; }
.coleccion-card--small .coleccion-card__link { font-size:0.875rem; margin-top:0.25rem; }
.coleccion-card__link:hover { color:var(--ra-color-blue-dark); gap:0.625rem; }
.coleccion-card__link svg { width:1rem; height:1rem; flex-shrink:0; transition:transform 0.3s ease; }
.coleccion-card--small .coleccion-card__link svg { width:0.875rem; height:0.875rem; }
.coleccion-card__link:hover svg { transform:translateX(3px); }
.contenidos-colecciones__cta { text-align:center; margin-top:3rem; }
.contenidos-colecciones__btn { display:inline-block; padding:0.875rem 2.5rem; background-color:var(--ra-color-white); color:var(--ra-color-cobalt); border:2px solid var(--ra-color-cobalt); border-radius:2rem; text-decoration:none; font-weight:600; font-size:1rem; transition:all 0.3s ease; box-shadow:var(--ra-shadow-sm); }
.contenidos-colecciones__btn:hover { background-color:var(--ra-color-cobalt); color:var(--ra-color-white); border-color:var(--ra-color-cobalt); box-shadow:var(--ra-shadow-md); transform:translateY(-2px); }

/* Recursos - Estilos actualizados */
.contenidos-recursos { padding:4rem 1.5rem; background: #fAfAfA; }
.contenidos-recursos__container { max-width:1200px; margin:0 auto; }
.contenidos-recursos__header { display:flex; justify-content:center; align-items:flex-start; margin-bottom:3rem; gap:2rem; position:relative; }
.contenidos-recursos__header-text { flex:1; text-align:center; max-width:800px; margin:0 auto; }
.contenidos-recursos__title { color:var(--ra-color-cobalt); font-size:2.625rem; font-weight:700; margin:0 0 1rem; text-align:center; line-height:1.2; }
.contenidos-recursos__subtitle { font-size:1rem; color:var(--ra-color-matterhorn); text-align:center; line-height:1.6; max-width:700px; margin:0 auto; }
.contenidos-recursos__nav { display:flex; gap:1rem; flex-shrink:0; position:absolute; right:0; top:0; }
.contenidos-recursos__nav-btn { width:48px; height:48px; border-radius:50%; background-color:var(--ra-color-cobalt); color:var(--ra-color-white); border:none; font-size:1.5rem; cursor:pointer; transition:all 0.3s ease; display:flex; align-items:center; justify-content:center; }
.contenidos-recursos__nav-btn:hover, .contenidos-recursos__nav-btn:focus { background-color:var(--ra-color-blue-dark); box-shadow:var(--ra-shadow-md); }
.contenidos-recursos__grid { display:grid; gap:1.5rem; margin-bottom:2rem; }
@media (min-width: 768px) { .contenidos-recursos__grid { grid-template-columns:repeat(3, 1fr); gap:2rem; } }
.recurso-card { background:var(--ra-color-white); border-radius:0.75rem; overflow:hidden; box-shadow:var(--ra-shadow-sm); transition:all 0.3s ease; display:flex; flex-direction:column; height:100%; }
.recurso-card:hover { box-shadow:var(--ra-shadow-lg); transform:translateY(-4px); }
.recurso-card__image { width:100%; aspect-ratio:16/9; overflow:hidden; background-color:var(--ra-color-solitude); position:relative; }
.recurso-card__image a { display:block; width:100%; height:100%; min-height:200px; }
.recurso-card__image img { width:100%; height:100%; object-fit:cover; transition:transform 0.3s ease; }
.recurso-card__image a:hover img { transform:scale(1.05); }
.recurso-card__content { padding:1.25rem 1.5rem 1.5rem; flex:1; display:flex; flex-direction:column; gap:0.75rem; }
.recurso-card__type { display:block; font-size:0.875rem; color:#333333 !important; font-weight:600; text-transform:capitalize; order:-2; }
.recurso-card__title { font-size:1.125rem; font-weight:700; margin:0; line-height:1.4; color:var(--ra-color-matterhorn); order:-1; }
.recurso-card__title a { color:inherit; text-decoration:none; transition:color 0.3s ease; }
.recurso-card__title a:hover { color:var(--ra-color-cobalt); }
.recurso-card__chips { display:flex; flex-wrap:wrap; gap:0.5rem; margin-bottom:0.5rem; }
.recurso-card__chip { display:inline-block; padding:0.375rem 0.875rem; border-radius:1.25rem; font-size:0.8125rem; font-weight:600; line-height:1; white-space:nowrap; background-color:var(--ra-color-solitude); color:var(--ra-color-cobalt); }
.recurso-card__link { display:inline-flex; align-items:center; gap:0.5rem; color:var(--ra-color-cobalt); text-decoration:underline; font-size:0.9375rem; font-weight:600; margin-top:0.5rem; transition:all 0.3s ease; }
.recurso-card__link:hover { color:var(--ra-color-blue-dark); gap:0.625rem; }
.recurso-card__link svg { width:1rem; height:1rem; flex-shrink:0; transition:transform 0.3s ease; }
.recurso-card__link:hover svg { transform:translateX(3px); }
.contenidos-recursos__cta { text-align:center; margin-top:3rem; }
.contenidos-recursos__btn { display:inline-block; padding:0.875rem 2.5rem; background-color:var(--ra-color-white); color:var(--ra-color-cobalt); border:2px solid var(--ra-color-cobalt); border-radius:2rem; text-decoration:none; font-weight:600; font-size:1rem; transition:all 0.3s ease; box-shadow:var(--ra-shadow-sm); }
.contenidos-recursos__btn:hover { background-color:var(--ra-color-cobalt); color:var(--ra-color-white); border-color:var(--ra-color-cobalt); box-shadow:var(--ra-shadow-md); transform:translateY(-2px); }
