.cms-page-block{
  padding:20px 0px 20px 0px
}
.hero-section{
  display:flex;
}

.hero-section .card-body{
  width:100%;
}

.hero-section .cms-media-cover-layer{
  display:flex;
  align-items:center;
  justify-content:center;
}
.hero-titles{
    border: none;
    background-color: transparent;
    color: #FFF;
}

.hero-titles h2{
  font-size:3rem;
}

.circuitos-mas-elegidos{
    border: none;
    background-color: transparent;
}

.section-titles{
  text-align:center;
}

.section-titles h2{
  font-size:2rem;
  color:#2859ac !important
}
.section-titles{
  color:#000 !important
}

.informacion-complementaria-row{
  display:flex;
  padding:3px 5px;
  border-bottom:dotted 1px #ccc;
}

.informacion-complementaria-label{
  font-weight:bold;
  margin-right:10px
}

.cms-overlay-link-card-title{
  font-size: clamp(1.75rem, 1vw, 3.25rem) !important;
}

/* ==========================================================================
   SITIO - HOJA DE ESTILOS PERSONALIZADA
   Editar desde: Admin > CMS > Estilos CSS
   --------------------------------------------------------------------------
   Regla sugerida:
   1) Mantener todo dividido por secciones.
   2) Comentar siempre que bloque se esta tocando.
   3) Evitar estilos sin contexto.
   ========================================================================== */

/* --------------------------------------------------------------------------
   01) VARIABLES GLOBALES
   --------------------------------------------------------------------------
   Definir aca colores, tipografias, sombras y radios base.
-------------------------------------------------------------------------- */
/*
:root {
  --site-color-primary: #0d6efd;
  --site-color-secondary: #6c757d;
  --site-color-text: #1f2937;
  --site-color-bg: #123123;
  --site-radius-base: 0.5rem;
  --site-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
}
*/

/* --------------------------------------------------------------------------
   02) RESET / BASE
   --------------------------------------------------------------------------
   Ajustes generales de html/body, links, imagenes y tipografia.
-------------------------------------------------------------------------- */
/*
html, body {
  margin: 0;
  padding: 0;
}

body {
  color: var(--site-color-text);
  background: var(--site-color-bg);
}

a {
  text-decoration: none;
}
*/

/* --------------------------------------------------------------------------
   03) ESTRUCTURA GLOBAL
   --------------------------------------------------------------------------
   Contenedores principales, anchos maximos y espaciados globales.
-------------------------------------------------------------------------- */
/*
.site-container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 1rem;
}
*/

/* --------------------------------------------------------------------------
   04) HEADER Y NAVEGACION PRINCIPAL
   --------------------------------------------------------------------------
   Logo, navbar, submenus, estados hover/active.
-------------------------------------------------------------------------- */
/*
.site-header {
  border-bottom: 1px solid #e5e7eb;
}

.site-navbar .nav-link {
  color: var(--site-color-text);
}
*/

/* --------------------------------------------------------------------------
   05) MENUS SECUNDARIOS / VERTICALES
   --------------------------------------------------------------------------
   Sidebar, menu lateral, menu de footer o variantes auxiliares.
-------------------------------------------------------------------------- */
/*
.site-menu-vertical a {
  display: block;
  padding: 0.5rem 0.75rem;
}
*/

/* --------------------------------------------------------------------------
   06) HERO, BANNERS Y ENCABEZADOS DE SECCION
   --------------------------------------------------------------------------
   Titulares de portada, bloques destacados y cabeceras de categoria.
-------------------------------------------------------------------------- */
/*
.site-hero {
  padding: 3rem 0;
}
*/

/* --------------------------------------------------------------------------
   07) BLOQUES DE CONTENIDO (ROW / COLUMNS / FREE TEXT)
   --------------------------------------------------------------------------
   Espaciado entre bloques del constructor visual y estilos base de texto.
-------------------------------------------------------------------------- */

/*
.site-block {
  margin-bottom: 1.5rem;
}
*/

/* --------------------------------------------------------------------------
   08) TARJETAS (POSTS / PAGINAS / CATEGORIAS)
   --------------------------------------------------------------------------
   Cards, imagenes destacadas, titulos, extractos y links.
-------------------------------------------------------------------------- */
/*
.site-card {
  border: 4px solid #e5e7eb;
  border-radius: var(--site-radius-base);
  box-shadow: var(--site-shadow-sm);
}
*/

/* --------------------------------------------------------------------------
   09) LISTADOS Y TABLAS
   --------------------------------------------------------------------------
   Listados de posts, listados de categorias y tablas personalizadas.
-------------------------------------------------------------------------- */
/*
.site-list-item {
  padding: 0.75rem 0;
  border-bottom: 1px solid #eef2f7;
}
*/

/* --------------------------------------------------------------------------
   10) FORMULARIOS Y BUSCADORES
   --------------------------------------------------------------------------
   Inputs, selects, textareas, buscadores y estados focus/error.
-------------------------------------------------------------------------- */
/*
.site-form-control {
  border-radius: 0.375rem;
}
*/

/* --------------------------------------------------------------------------
   11) BOTONES Y ACCIONES
   --------------------------------------------------------------------------
   Botones primarios/secundarios y variantes de llamada a la accion.
-------------------------------------------------------------------------- */
/*
.site-btn-primary {
  background: var(--site-color-primary);
  color: #ffffff;
}
*/

/* --------------------------------------------------------------------------
   12) SLIDERS, GALERIAS Y MEDIA
   --------------------------------------------------------------------------
   Carousel/slider, galeria popup, imagenes, videos e iframes.
-------------------------------------------------------------------------- */
/*
.site-gallery img {
  border-radius: var(--site-radius-base);
}
*/

/* --------------------------------------------------------------------------
   13) MAPAS, SHORTCODES E IFRAME EMBEBIDO
   --------------------------------------------------------------------------
   Contenedores de mapa/iframe para evitar desbordes en mobile.
-------------------------------------------------------------------------- */
/*
.site-embed-wrapper {
  width: 100%;
  overflow: hidden;
}
*/

/* --------------------------------------------------------------------------
   14) WIDGETS Y BLOQUES AUXILIARES
   --------------------------------------------------------------------------
   Bloques de ayuda, avisos, badges, chips y elementos pequenos.
-------------------------------------------------------------------------- */
/*
.site-badge {
  border-radius: 999px;
}
*/

/* --------------------------------------------------------------------------
   15) FOOTER
   --------------------------------------------------------------------------
   Pie de pagina, columnas, links y copyright.
-------------------------------------------------------------------------- */
/*
.site-footer {
  background: #111827;
  color: #f9fafb;
}
*/

/* --------------------------------------------------------------------------
   16) ESTADOS / UTILIDADES
   --------------------------------------------------------------------------
   Clases auxiliares globales, visibilidad y estados de componentes.
-------------------------------------------------------------------------- */
/*
.is-hidden {
  display: none !important;
}

.is-disabled {
  pointer-events: none;
  opacity: 0.6;
}
*/

/* --------------------------------------------------------------------------
   17) ACCESIBILIDAD
   --------------------------------------------------------------------------
   Focus visible, contrastes y mejoras para navegacion por teclado.
-------------------------------------------------------------------------- */
/*
:focus-visible {
  outline: 2px solid #1d4ed8;
  outline-offset: 2px;
}
*/

/* --------------------------------------------------------------------------
   18) RESPONSIVE - TABLET (<= 991px)
   -------------------------------------------------------------------------- */
/*
@media (max-width: 991.98px) {
  .site-container {
    padding: 0 0.75rem;
  }
}
*/

/* --------------------------------------------------------------------------
   19) RESPONSIVE - MOBILE (<= 767px)
   -------------------------------------------------------------------------- */
/*
@media (max-width: 767.98px) {
  .site-hero {
    padding: 2rem 0;
  }
}
*/

/* --------------------------------------------------------------------------
   20) RESPONSIVE - MOBILE SMALL (<= 575px)
   -------------------------------------------------------------------------- */
/*
@media (max-width: 575.98px) {
  .site-card {
    border-radius: 0.4rem;
  }
}
*/
\