/*
 * ============================================================
 *  THEME NAME:    YerbaCSS v1
 *  THEME URI:     https://vertegrande.com
 *  DESCRIPTION:   Framework Base Bootstrap + FontAwesome.  🌿 El framework que se toma de a sorbos — y no falla
 *  VERSION:       1.0
 *  AUTHOR:        Vertegrande© 
 *  AUTHOR URI:    https://vertegrande.com
 * ============================================================
 *
 *  ARQUITECTURA DE ARCHIVOS
 *  ─────────────────────────────────────────────────────────
 *  style.css          → Este archivo. Punto de entrada principal.
 *  general.css        → Helpers, padding helpers, blockquotes, 404.
 *  fontawesome/all.css → Iconos FontAwesome (copia local).
 *  swiper/swiper.css  → Slider Swiper (copia local).
 *
 *  DEPENDENCIAS CDN  (encoladas en functions.php)
 *  ─────────────────────────────────────────────────────────
 *  Bootstrap 5.3.3      → https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/
 *  FontAwesome 6.5.2    → https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/
 *  Google Fonts Plus Jakarta Sans → https://fonts.googleapis.com
 *  Swiper 11            → https://cdn.jsdelivr.net/npm/swiper@11/
 *
 * ============================================================
 */

/* ── Importaciones locales ───────────────────────────── */
@import "general.css";
/* @import "elsus-home.css";  ← movido a css/elsus-home.css y encolado desde
   functions.php. Con @import la capa de cliente se aplicaba ANTES que el
   resto de style.css (así funciona la cascada de @import), justo al revés
   de lo que necesita para poder sobreescribir sin !important. Además dejaba
   código de un cliente adentro del framework. */
   @import "css/elsus-slider.css";
   @import "css/elsus-home.css";
@import "fontawesome/all.css";




/* ── Fuente principal ────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&display=swap');

.navbar-brand img,
.site-logo {
    width: 140px !important;
    max-width: none !important;
    height: auto !important;
}
/* ============================================================
   1. BASE GLOBAL
   ============================================================ */

html {
  scroll-behavior: smooth; /* Scroll suave nativo */
}

body {
  background: #fff;
  color: #333;
  font-size: 0.875rem;          /* ~14px base legible */
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 300;
  overflow-x: hidden;           /* Evita scroll horizontal en móvil */
}


/* ============================================================
   2. RESET COMPLEMENTARIO  (suma al reset de Bootstrap)
   ============================================================ */

* { margin: 0; padding: 0; }

/* Links */
a            { color: #666; text-decoration: none; }
a:hover      { color: #333; text-decoration: underline; }
a:focus,
a:active     { outline: 0; }
a img        { border: 0; }

/* Imágenes */
img { border: 0; }

/* Listas: sin viñetas por defecto */
ul li { list-style: none; }

/* Blockquote / Quotes */
blockquote, q { -webkit-hyphens: none; hyphens: none; quotes: none; }


/* ============================================================
   3. ALINEACIONES WORDPRESS
   Clases .alignleft / .alignright / .aligncenter generadas
   por el editor de bloques de WP.
   ============================================================ */

.alignleft   { display: inline; float: left; }
.alignright  { display: inline; float: right; }
.aligncenter { display: block; margin-right: auto; margin-left: auto; }

blockquote.alignleft,  .wp-caption.alignleft,  img.alignleft  { margin: 0.4em 1.6em 1.6em 0; }
blockquote.alignright, .wp-caption.alignright, img.alignright { margin: 0.4em 0 1.6em 1.6em; }
blockquote.aligncenter,.wp-caption.aligncenter,img.aligncenter { clear: both; margin-top: 0.4em; margin-bottom: 1.6em; }

.wp-caption.alignleft,
.wp-caption.alignright,
.wp-caption.aligncenter { margin-bottom: 1.2em; }


/* ============================================================
   4. BARRA SUPERIOR  (#tophead)
   Banda gris claro con datos de contacto + iconos RRSS.
   ============================================================ */

#tophead {
  overflow: hidden;
  background: #f0f0f0;
  padding: 7px 0;
  min-height: 50px;  font-family: "Roboto Condensed", sans-serif;
  text-transform: uppercase;
  font-size: 13px;

}

/* -- Contacto rápido (lado derecho) -- */
#head_contacto           { float: right; margin-top: 0; }
#head_contacto > ul      { margin: 0; padding: 0; }
#head_contacto a         { display: inline-block; }

/* Ícono FontAwesome delante de cada ítem */
#head_contacto li::before {
  color: #2D6A4F;
  content: "";
  display: inline-block;
  font-family: "Font Awesome 6 Free";
  font-size: 13px;
  font-weight: 900;
  margin-right: 10px;
  text-align: center;
}
#head_contacto li.quick-email::before   { content: "\f0e0"; font-weight: 400; }
#head_contacto li.quick-call::before    { content: "\f095"; }
#head_contacto li.quick-address::before { content: "\f0ac"; }

#head_contacto li {
  clear: inherit;
  float: left;
  font-size: 13px;
  line-height: 1.75;
  list-style: none;
  text-align: left;
  padding: 5px 10px;
  color: #ababab;
  letter-spacing: 0.7px;
}

/* -- Redes sociales (lado izquierdo) -- */
#tophead .header-social-wrapper { float: left;    padding: 7px 0;
  }

.head           { clear: both; overflow: hidden; }
.head ul        { margin: 0; padding: 0;
 }
#tophead ol,
#tophead ul     { padding: 0; }
 


/* ============================================================
   5. NAVBAR / HEADER PRINCIPAL
   ============================================================ */

.bg-dark  { background: #1B4332 !important; }      /* Navbar oscuro */
.bg-light { --bs-bg-opacity: 1; background-color: #fff !important; } /* Navbar claro */

.header .header-logo { margin: 10px 0; }

/* Botón CTA del navbar */
.header .btn-secondary {
  display: inline-block;
  font-size: 14px;
  margin: 10px 0;
  padding: 12px 30px;
  color: #ffffff;
  background: #7aba32;
  border-color: #7aba32;
  text-align: center;
  font-weight: 700;
  position: relative;
  z-index: 1;
  border-radius: 4px;
}
.header .btn-secondary:hover {
  display: inline-block;
  font-size: 14px;
  margin: 10px 0;
  padding: 12px 30px;
  color: #ffffff;
  background: #4d7e67;
  border-color: #4d7e67;
  text-align: center;
  font-weight: 700;
  position: relative;
  z-index: 1;
  border-radius: 4px;
}
.navbar-nav .nav-link.active, .navbar-nav .nav-link.show {
  color: #1c4834;
}
/* Links del menú */
.nav-link {
  color: #1c4834;
  display: block;
  font-size: 14px;
  padding: 23px 15px;
  position: relative;
  z-index: 99;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 700;
  text-transform: uppercase;
}

/* Dropdown personalizado (sobre Bootstrap CSS vars) */
.dropdown-menu {
  --bs-dropdown-min-width: 10rem;
  --bs-dropdown-border-color: rgba(221,221,221,0.18);
  font-size: 13px;
  border: 1px solid rgba(221,221,221,0.18);
}
.dropdown-divider {
  height: 0;
  margin: 0.5rem 0;
  border-top: 1px solid #f5f5f5;
  opacity: 1;
}

/* Móvil: separador visual entre links del menú */
@media screen and (max-width: 768px) {
  .nav-link { border-bottom: 1px solid #e1e1e1; padding: 9px 15px; }
}


/* ============================================================
   6. BREADCRUMB
   ============================================================ */

.breadcrumb {
  list-style: none;
  overflow: hidden;
  background: #f7f7f7;
  font-family: 'Plus Jakarta Sans';
  font-size: 11px;
  padding: 8px;
  color: #000;
  --bs-breadcrumb-margin-bottom: 1px;
}
.breadcrumb a         { font-weight: 600; color: #000; font-size: 11px; }
.breadcrumb .back     { margin-left: 5px; margin-right: 5px; }


/* ============================================================
   7. CABECERA DE CATEGORÍAS / ARCHIVO
   ============================================================ */

.titulo_categorias {
  background: #f8f6f6;
  padding: 33px 0;
  height: 100%;
  margin-bottom: 30px;
  color: #333;
  line-height: normal;
  font-size: 15px;
  font-family: 'Plus Jakarta Sans';
  font-weight: 300;
}
.titulo_categorias strong { color: #333; font-weight: 600; }


/* ============================================================
   8. PAGINADO
   ============================================================ */

.pagination .page-link { color: #333; }
.pagination > li > a:focus,
.pagination > li > a:hover,
.pagination > li > span:focus,
.pagination > li > span:hover {
  z-index: 3;
  color: #222;
  font-weight: 500;
  background-color: #f1f1f1;
  border-color: #ddd;
}


/* ============================================================
   9. HEADINGS H1–H6
   ============================================================ */

h1, h2, h3, h4, h5, h6 {
  font-family: 'Plus Jakarta Sans', sans-serif;
  line-height: normal;
}


/* ============================================================
   10. CONTENIDO — Títulos y bloques destacados
   ============================================================ */

.page-title {
  margin-bottom: 15px;
  font-weight: normal;
  font-size: 160%;
}

/* Metadatos de post */
.infopost {
  font-size: 0.688em;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: #737373;
  font-weight: 400;
  clear: both;
}

/* Título de nota individual (single) */
.entry-title {
  color: #000;
  line-height: 30px;
  font-size: 27px;
  font-family: 'Plus Jakarta Sans';
  font-weight: 700;
}
.entry-title a:hover { text-decoration: none; }

/* Bajada / subtítulo editorial */
.bajada {
  color: #000;
  text-align: left;
  font-weight: 200;
  line-height: 26px;
  font-size: 20px;
  font-family: 'Plus Jakarta Sans', sans-serif;
}

/* Título de sección con acento amarillo */
.block-title {
  padding-bottom: 1rem;
  border-bottom: 4px solid #f0f0f0;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 22px;
  text-transform: uppercase;
  font-weight: 700;
  color: #000;
  letter-spacing: 0.4px;
}
.block-title span {
  border-bottom: 4px solid #52B788;
  display: inline-block;
  margin: 0 0 -30px;
  padding-bottom: 16px;
}


/* ============================================================
   11. ENTRY-CONTENT  (cuerpo del artículo)
   ============================================================ */

.entry-content {
  margin-top: 15px;
  font-size: 1rem;
  line-height: 1.5rem;
  font-family: 'Plus Jakarta Sans', sans-serif;
  margin-bottom: 10px;
  color: #333;
}

.entry-content img    { max-width: 100%; height: auto; word-wrap: break-word; }
.entry-content strong { font-weight: 500; color: #000; }

/* Links con subrayado punteado animado */
.entry-content a {
  word-break: break-all;
  font-weight: 400;
  position: relative;
  text-decoration: none;
}
.entry-content a::after {
  content: '';
  display: block;
  width: 100%;
  height: 1px;
  background: linear-gradient(to right, transparent 50%, #9e9e9e 50%);
  background-size: 4px 1px;
  background-repeat: repeat-x;
  position: absolute;
  bottom: 0;
  left: 0;
}
.entry-content a:hover { text-decoration: none; }

/* Listas dentro del cuerpo */
.entry-content ul li,
.entry-content ul ol  { list-style-type: square; }
.entry-content ul li::before { color: #000; font-weight: 300; font-size: 1rem; line-height: 1.5rem; position: relative; top: 0; }
.entry-content ol {
  display: block;
  list-style-type: decimal;
  margin-block-start: 1em;
  margin-block-end: 1em;
  padding-inline-start: 40px;
}

.entry-content > :last-child,
.entry-summary  > :last-child { margin-bottom: 0; }

/* Word-wrap en todos los bloques de texto */
.entry-content, .entry-summary, .page-content { -webkit-hyphens: auto; hyphens: auto; word-wrap: break-word; }

.entry-summary a,
.page-content a { border-bottom: 1px solid #333; }

.entry-content a:focus,
.entry-summary a:hover, .entry-summary a:focus,
.page-content a:hover,  .page-content a:focus,
.comment-content a:hover, .comment-content a:focus { border-bottom: 0; }

.entry-content a img, .entry-summary a img,
.page-content a img, .comment-content a img { display: block; word-break: break-all; }


/* ============================================================
   12. ARTÍCULOS — Listado de archivo / categoría
   ============================================================ */

.post { margin-bottom: 50px; }

/* Título en listado */
.article h2,
.article h2 a {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 500;
  color: #000;
  font-size: 18px;
  line-height: 20px;
  margin-top: 2px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.article-body { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }

/* Layout imagen + texto */
.article.row-article .article-img { width: 30%; float: left; margin-right: 30px; margin-bottom: 0; }

@media only screen and (max-width: 767px) {
  .article.row-article .article-img  { width: 30%; float: left; margin-right: 15px; margin-bottom: 15px; }
  .article.row-article .article-body { width: 65%; float: left; }
  .article-body p                    { display: none; }
  .article h2, .article h2 a         { font-size: 16px; line-height: 18px; }
}
@media only screen and (max-width: 480px) {
  .article.row-article .article-img  { width: 100%; float: left; margin-right: 0; margin-bottom: 15px; }
  .article-body p                    { display: none; }
  .article h2, .article h2 a         { font-size: 15px; line-height: 17px; }
}


/* ============================================================
   13. NOTAS — CARD GRID  (.notas-grid)
   ============================================================ */

.badge {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 9px;
  line-height: normal;
  font-weight: 700;
  letter-spacing: 0.2px;
  text-transform: uppercase;
}

/* Card */
.notas-grid .card {
  word-wrap: break-word;
  background-color: transparent;
  border: 0;
  border-bottom: 1px solid rgba(0,0,0,.1);
  border-radius: 0;
  display: flex;
  flex-direction: column;
  min-width: 0;
  position: relative;
}
.notas-grid .card-title {
  color: #000;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 500;
  font-size: 19px;
  line-height: 1.2;
  margin-bottom: 0.5rem;
  margin-top: 0;
}
.notas-grid .card-meta {
  color: #111;
  display: inline-flex;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 10.5px;
  font-weight: 400;
  letter-spacing: 0.2px;
  text-transform: uppercase;
}
.notas-grid .card-meta a          { font-weight: 800; }
.notas-grid .card-header          { background-color: #fff; border-bottom: 0; margin-bottom: 0; }
.notas-grid .card-header time     { display: inline-block; margin-bottom: 0.5rem; color: #666; }
.notas-grid .card a:not(.btn)     { color: inherit; text-decoration: none; }
.notas-grid .card-img             { border-radius: 0 !important; }
.notas-grid .card-img,
.notas-grid .card-img-top         { width: 100%; }
.notas-grid .card-body            { flex: 1 1 auto; padding: 0.5rem; }

/* Variantes genéricas de card */
.card-text                        { margin-top: 10px; }
.sin-borde                        { border: none; margin-bottom: 15px; }
.card-header                      { clear: left; font-family: 'Plus Jakarta Sans'; background: transparent; color: #40916C; padding-bottom: 0; }


/* ============================================================
   14. SIDEBAR — Widgets
   ============================================================ */

.wp-block-heading {
  margin: 0 0 1.25rem;
  color: #1c4834;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.2;
}

h2.wp-block-heading {
  font-size: clamp(1.5rem, 2.5vw, 2.25rem);
}

h3.wp-block-heading {
  font-size: clamp(1.25rem, 2vw, 1.6rem);
}

h4.wp-block-heading {
  font-size: 1.15rem;
  font-weight: 500;
}

/* Título con imagen de fondo decorativa */
.widget-title {
  position: relative;
  margin: 0 0 20px 0;
  background: url(images/title_mod_line.png) bottom left no-repeat;
  padding: 0 0 10px 0;
  font-size: 0.9em !important;
  color: #1c4834;
  text-transform: uppercase;
}
.widget-title h4,
.wp-block-heading h4,
.wp-block-heading h3,
.wp-block-heading h2,
.wp-block-heading h1 {
  display: inline-block;
  font-family: 'Plus Jakarta Sans';
  font-weight: 700;
  font-size: 1.1em !important;
  text-transform: uppercase;
  padding: 0 5px 0 0;
  margin-bottom: 0;
}

/* Contenedor del widget */
.widget {
  border-left-width: 0;
  border-right-width: 0;
  border-top-width: 0;
  padding-bottom: 20px;
  margin-bottom: 1px;
  font-family: 'Plus Jakarta Sans';
  font-size: 13px;
  color: #666;
}
.widget ul                 { margin: 0; padding: 0; list-style: none; }
.widget ul li a            { color: #000; }
.widget ul li {
  margin: 0;
  padding: 0;
  padding-bottom: 15px;
  margin-bottom: 15px !important;
  font-family: 'Plus Jakarta Sans';
  font-size: 14px;
  color: #666;
  list-style: none;
  position: relative;
  border-bottom: 1px solid #e7e7e7;
}

/* Calendario */
.widget_calendar           { clear: both; }
#wp-calendar               { width: 100%; }
#wp-calendar caption       { text-align: right; color: #333; font-size: 12px; margin: 2px 0; }
#wp-calendar thead         { font-size: 10px; }
#wp-calendar thead th      { padding-bottom: 10px; }
#wp-calendar tbody         { color: #aaa; }
#wp-calendar tbody td      { background: #f5f5f5; border: 1px solid #fff; text-align: center; padding: 8px; }
#wp-calendar tbody td:hover{ background: #fff; }
#wp-calendar tbody .pad    { background: none; }
#wp-calendar #prev         { text-align: left; display: none; }
#wp-calendar #next         { text-align: right; }
.wp-calendar-nav           { display: none; }

/* Texto del widget */
.textwidget p              { margin-bottom: 10px; }
.textwidget a              { text-decoration: underline; }
.widget_tag_cloud a        { text-transform: lowercase; }


/* ============================================================
   15. REDES SOCIALES — Compartir en artículo
   ============================================================ */

.article-social              { margin-top: 20px; }
.article-social .social-shares {
  font-size: 12px;
  line-height: 33px;
  color: #9e9e9e;
}
 
   
   /* Botón de favorito (bookmark) */
   .social-fav                  { float: right !important; margin-right: 0 !important; font-size: 20px; }
   .social-fav a                { display: block; width: 40px; height: 40px; line-height: 40px; text-align: center;  border-radius: 50%;  text-decoration: none; }
   .social-fav i                { display: block; }
   
   /* Íconos en línea */
   .mini-social                 { padding: 0; margin: 0; overflow: auto; }
   .mini-social li {
     list-style: none;
     float: left;
     margin-right: 10px;
     height: 40px;
     overflow: hidden;
     background-color: #1c483538;
     border-radius: 4px;
     text-align: center;
     line-height: 40px;
   }
   .mini-social a {
     width: 40px;
     height: 40px;
     display: inline-block;
     font-size: 20px;
     margin-bottom: 10px;
     color: #7aba32;
   }


/* ============================================================
   16. SINGLE — Metas, adjuntos, imagen destacada
   ============================================================ */

.metas small,
.metas small a             { font-size: 12px; color: #000; }
.metas small strong        { font-weight: 600; }

.post-thumbnail            { border: 0; display: block; margin-bottom: 2.4em; }
.post-thumbnail img        { display: block; margin: 0 auto; }
a.post-thumbnail:hover,
a.post-thumbnail:focus     { opacity: 0.85; }

.entry-attachment          { margin-bottom: 1.6em; }
.type-attachment .entry-title { -webkit-hyphens: auto; hyphens: auto; word-wrap: break-word; }

.adjunto strong            { font-weight: 600; }
.adjunto .entry-meta a     { font-weight: 600; color: #111; }
.adjunto .bg-light         { --bs-bg-opacity: 1; background-color: #f1f1f1 !important; }


/* ============================================================
   17. PÁGINAS ESTÁTICAS
   ============================================================ */

.head-page-titulo          { font-size: 34px; line-height: 37px; font-weight: 600; text-transform: none; color: #fff; }
.head-page-text            { color: #fff; }
.subtitulos                { font-size: 25px; line-height: 29px; font-weight: 500; text-transform: uppercase; }
.bajada-page               { color: #000; text-align: left; font-weight: 200; line-height: 26px; font-size: 19px; font-family: 'Plus Jakarta Sans', sans-serif; font-style: italic; }
.bajada-page-solucion {
  color: #b4b1b1;
  text-align: left;
  font-weight: 200;
  line-height: 26px;
  font-size: 17px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-style: italic;
}
/* ============================================================
   18. ARCHIVOS
   ============================================================ */

.archivo .list-group          { border-radius: 0; }
.archivo .list-group-item     { border: 0; border-bottom: 1px solid #dee2e6; }
.tiempo-archivo               { font-weight: 600; }


/* ============================================================
   19. CONTENIDO EMBEBIDO  (YouTube, Twitter, Facebook)
   ============================================================ */

.wp-block-embed__wrapper {
  background-color: #f6f6f6;
  border-radius: 7px;
  padding-top: 25px;
  padding-bottom: 25px;
  border: 1px solid transparent;
  text-align: center;
}

/* iframes responsivos */
.wp-block-embed-twitter iframe,
.wp-block-embed-twitter object,
.wp-block-embed-twitter embed,
.wp-block-embed-youtube iframe,
.wp-block-embed-youtube object,
.wp-block-embed-youtube embed {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  text-align: center;
  border-radius: 7px;
}

.wp-block-embed__wrapper .twitter-tweet-rendered { text-align: center; margin: 0 auto; }
.entry-content .wp-block-embed-twitter           { max-width: 100%; border-radius: 7px; text-align: center; margin: 0 auto; }
.entry-content .wp-block-embed-facebook          { max-width: 100% !important; border-radius: 7px; position: relative; margin: 0 auto; }


/* ============================================================
   20. CAPTIONS E IMÁGENES DE GUTENBERG
   ============================================================ */

figcaption { font-size: 11px; line-height: normal; font-family: 'tahoma', sans-serif; color: #9f9f9f; text-align: center; }

.wp-caption { background: none; border: none; border-radius: 4px; padding-top: 5px; margin: 4px 10px; font-size: 12px; font-family: 'Plus Jakarta Sans', sans-serif; color: #9f9f9f; text-align: center; }

.wp-block-image figcaption strong,
.wp-block-image strong { background: none; border: none; border-radius: 4px; padding-top: 5px; margin: 4px 10px; font-size: 11px; color: #9f9f9f; text-align: center; }

.wp-block-image img   { max-width: 100%; height: auto; }
.card-img-top img     { width: 100%; max-width: 100%; height: auto; }


/* ============================================================
   21. AUTOR
   ============================================================ */

.w-100px { width: 100px !important; }
.w-150px { width: 150px !important; }
.w-200px { width: 200px !important; }
.h-100px { height: 100px !important; }
.h-150px { height: 150px !important; }
.h-200px { height: 200px !important; }

/* Animación hover en tarjeta de autor */
.hcf-author-1 .hcf-author-img,
.hcf-author-1 .hcf-author-meta { transition: transform 450ms cubic-bezier(0.16, 0.32, 0.21, 0.93); }
.hcf-author-1:hover .hcf-author-img  { transform: translateX(12px); }
.hcf-author-1:hover .hcf-author-meta { transform: translateX(-8px); }


/* ============================================================
   22. SIN RESULTADOS
   ============================================================ */

.sin_resultados                { background-color: #e1e1e1; padding: 40px; }
.sin_resultados .entry-title   { text-align: center; }
.sin_resultados p              { align-content: center; font-size: 14px; text-align: center; padding-left: 30px; padding-right: 30px; }


/* ============================================================
   23. UTILIDADES DE VISIBILIDAD
   ============================================================ */

.mobile_only  { display: none !important; }

@media screen and (max-width: 768px) {
  .mobile_only  { display: inline-block !important; }
  .desktop_only { display: none !important; }
}

.bg-f1                    { background-color: #f1f1f1; }
.bg-f1 .list-group-item   { background-color: transparent; }


/* ============================================================
   24. FOOTER
   ============================================================ */

.footer-39201 {
  padding: 7rem 0;
  color: #9d9d9d; }
  .footer-39201 h3 {
    font-size: 16px;
    font-weight: 600;
    color: #1c4834;
    margin-bottom: 20px;
}
  .footer-39201 .nav-links li {
    display: block;
    margin-bottom: 10px; }
    .footer-39201 .nav-links li a {
      color: #9d9d9d; }
      .footer-39201 .nav-links li a:hover {
        color: #614ad3; }
  .footer-39201 .social li {
    display: inline-block; }
    .footer-39201 .social li a {
      display: inline-block;
      padding: 10px;
      color: #9d9d9d; }
      .footer-39201 .social li a:hover {
        color: #614ad3; }




.footer { background: #f0f0f0; position: relative; }

.footer .main-nav ul  { margin: 0 auto; max-width: 1114px; width: 90%; padding: 32px 0; line-height: 1.3; }
.footer .main-nav ul li { display: inline-block; margin-right: 20px; font-size: 13px; }
.footer .main-nav a   { color: #222; text-transform: uppercase; font-weight: 600; letter-spacing: 1px; transition: color 0.25s; }
.footer .main-nav a:hover { color: #A1A1A1; }
.footer .main-nav a span  { font-family: Georgia, serif; font-style: italic; font-weight: 200; }

/* Footer móvil pequeño */
@media only screen and (max-width: 568px) {
  .footer .main-nav ul        { padding: 5px 0; }
  .footer .main-nav ul li     { border-bottom: 1px solid #e1e1e1; width: 100%; font-size: 13px; font-weight: 300; line-height: 17px; text-align: center; padding-top: 17px; padding-bottom: 17px; }
  .footer .main-nav           { border-bottom: none; }
}


/* ============================================================
   25. CRÉDITOS / COPYRIGHT
   ============================================================ */

.footer-copyright-wrapper { font-size: 12px; line-height: normal; }
.credits small            { font-size: 5px; }
.credits a                { font-weight: 600; }
/* =========================================
   BARRA LATERAL — MINIMAL / BOOTSTRAP 5
   ========================================= */

   .el-barra-relacionadas {
    position: relative;
    padding-left: 1.5rem;
    border-left: 1px solid #e9ecef;
}

/* Título */

.el-barra-titulo {
    margin: 0 0 1.25rem;
    padding: 0;
    font-size: .75rem;
    line-height: 1.2;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #6c757d;
}

/* Lista */

.el-barra-lista {
    margin: 0;
    padding: 0;
}

/* Items */

.el-barra-item {
    position: relative;
    margin: 0;
}

/* Links */

.el-barra-item a {
    display: block;
    padding: .5rem 0;
    color: #495057;
    font-size: .95rem;
    line-height: 1.4;
    font-weight: 400;
    text-decoration: none;
    transition:
        color .2s ease,
        padding-left .2s ease;
}

/* Hover */

.el-barra-item a:hover {
    color: #111;
    padding-left: .35rem;
}

/* Elemento padre */

.el-barra-item--padre {
    margin-bottom: .5rem;
}

.el-barra-item--padre a {
    font-weight: 500;
    color: #212529;
}

/* Separación sutil después del padre */

.el-barra-item--padre + .el-barra-item {
    margin-top: .5rem;
}

/* Activo */

.el-barra-item.is-active a {
    color: #111;
    font-weight: 600;
    padding-left: .75rem;
}

/* Indicador activo */

.el-barra-item.is-active::before {
    content: "";
    position: absolute;
    left: -.05rem;
    top: 50%;
    width: 3px;
    height: 1.25rem;
    transform: translateY(-50%);
    border-radius: 2px;
    background: currentColor;
}

/* =========================================
   RESPONSIVE
   ========================================= */

@media (max-width: 767.98px) {

    .el-barra-relacionadas {
        margin-top: 2rem;
        padding: 1.5rem 0 0;
        border-top: 1px solid #e9ecef;
        border-left: 0;
    }

    .el-barra-titulo {
        margin-bottom: .75rem;
    }

    .el-barra-item a {
        padding: .6rem 0;
    }

}