/* Lo único que evoBase 0.2.0 no trae: enlace de saltar al contenido visible al enfocarlo, y la separación del pie. */
.evotheme-skip {
    position: absolute;
    inset-inline-start: var(--evo-space-2, .5rem);
    inset-block-start: var(--evo-space-2, .5rem);
    z-index: 1000;
    transform: translateY(-300%);
}

.evotheme-skip:focus {
    transform: none;
}

.evotheme-site {
    display: flex;
    flex-direction: column;
    min-block-size: 100vb;
}

.evotheme-site > main {
    flex: 1 0 auto;
}

/* Salida de los componentes de Joomla (clases de Bootstrap que esta plantilla no carga): botones con tamaño táctil y contraste. */
main .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--evo-space-2);
    min-block-size: 2.5rem;
    min-inline-size: 2.5rem;
    padding: var(--evo-space-2) var(--evo-space-4);
    border: 1px solid var(--evo-color-primary);
    border-radius: var(--evo-radius-md);
    color: var(--evo-color-primary);
    text-decoration: none;
}

main .btn:hover {
    text-decoration: underline;
}

/* Tipografía del estilo de plantilla: pilas del sistema (sin fuentes remotas). El bloque <style> del <head> sustituye
   --evo-font-body, --evo-font-heading y --evo-font-weight-heading cuando se eligen otros valores. */
.evotheme-site {
    font-family: var(--evo-font-body, var(--evo-font-family-sans));
}

.evotheme-site :where(h1, h2, h3, h4, h5, h6) {
    font-family: var(--evo-font-heading, var(--evo-font-family-sans));
    font-weight: var(--evo-font-weight-heading, 700);
}

/* Botón principal solo con contorno (estilo de plantilla «Contorno»). */
.evotheme-buttons--outline .evo-button:not(.evo-button--secondary, .evo-button--ghost, .evotheme-skip, :disabled, [aria-disabled="true"]) {
    background: transparent;
    color: var(--evo-color-primary);
}

/* Un iframe (mapa, vídeo, formulario externo) nunca es más ancho que su columna, aunque traiga un ancho fijo en el HTML. */
iframe {
    max-inline-size: 100%;
}

/* Rejilla: el icono de una celda toma el tamaño de la rejilla (`icon_px`) y, con la imagen a un lado, va junto al texto. */
.evo-grid__item .evo-grid__icon {
    --evo-icon-size: var(--evo-grid-icon, 2rem);
}

.evo-grid__item--img-left > .evo-grid__icon,
.evo-grid__item--img-right > .evo-grid__icon {
    flex: none;
}

.evo-grid__item--img-left > .evo-grid__body,
.evo-grid__item--img-right > .evo-grid__body {
    flex: 1 1 0;
    min-inline-size: 0;
}

/* Cabecera: marca a la izquierda; menú, conmutador de modo y botón de acción a la derecha. En pantallas estrechas el menú
   pasa a un panel lateral (evo-offcanvas), fuera de <header>. */
.evotheme-header {
    background: var(--evo-color-surface);
    border-block-end: 1px solid var(--evo-color-border);
}

.evotheme-header--sticky {
    position: sticky;
    inset-block-start: 0;
    z-index: 100;
}

/* La barra superior se va con el scroll y solo queda fija la barra de navegación: la cabecera sube lo que mide la barra superior
   (header-toolbar.js fija su altura; sin el script la barra superior queda fija con la cabecera). */
.evotheme-header--toolbar-scrolls {
    inset-block-start: calc(-1 * var(--evotheme-toolbar-h, 0px));
}

.evotheme-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--evo-space-3) var(--evo-space-5);
    padding-block: var(--evo-space-3);
}

.evotheme-brand {
    margin-inline-end: auto;
    font-weight: 700;
}

.evotheme-brand img {
    block-size: 2.5rem;
    inline-size: auto;
}

.evotheme-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--evo-space-3);
}

/* Horizontal: la barra del menú ocupa el hueco libre y se alinea según navbar_align. */
/* Con el menú de escritorio a la vista, la marca y las acciones no se parten ni cambian de fila; el menú cede el sitio.
   En el móvil la barra puede envolver como antes. */
@media (width >= 40em) {
    .evotheme-bp-s .evotheme-bar--horizontal { flex-wrap: nowrap; }
    .evotheme-bp-s .evotheme-bar--horizontal .evotheme-brand,
    .evotheme-bp-s .evotheme-bar--horizontal .evotheme-actions { flex: none; white-space: nowrap; flex-wrap: nowrap; }
}

@media (width >= 60em) {
    .evotheme-bp-m .evotheme-bar--horizontal { flex-wrap: nowrap; }
    .evotheme-bp-m .evotheme-bar--horizontal .evotheme-brand,
    .evotheme-bp-m .evotheme-bar--horizontal .evotheme-actions { flex: none; white-space: nowrap; flex-wrap: nowrap; }
}

@media (width >= 75em) {
    .evotheme-bp-l .evotheme-bar--horizontal { flex-wrap: nowrap; }
    .evotheme-bp-l .evotheme-bar--horizontal .evotheme-brand,
    .evotheme-bp-l .evotheme-bar--horizontal .evotheme-actions { flex: none; white-space: nowrap; flex-wrap: nowrap; }
}

.evotheme-bar--horizontal .evotheme-navbar {
    display: flex;
    min-inline-size: 0;
    flex: 1 1 auto;
    align-items: center;
    gap: var(--evo-space-3);
}

.evotheme-bar--horizontal .evotheme-brand {
    margin-inline-end: 0;
}

.evotheme-navbar--align-left {
    justify-content: flex-start;
}

.evotheme-navbar--align-center {
    justify-content: center;
}

.evotheme-navbar--align-right {
    justify-content: flex-end;
}

.evotheme-bar--horizontal .evotheme-actions {
    margin-inline-start: auto;
}

/* Centrado: tres partes (hueco «header», marca, acciones) que reparten a medias el sitio libre, así la marca queda en el
   centro; si las acciones no caben, empujan la marca sin partir los botones. El menú va centrado en la fila de abajo. */
.evotheme-bar--center {
    flex-wrap: nowrap;
}

.evotheme-bar--center .evotheme-brand {
    margin-inline-end: 0;
}

.evotheme-bar__start,
.evotheme-bar__end {
    display: flex;
    flex: 1 1 0;
    align-items: center;
    gap: var(--evo-space-3);
}

.evotheme-bar__start {
    min-inline-size: 0;
}

.evotheme-bar__end {
    justify-content: flex-end;
}

.evotheme-menu-open,
.evotheme-cta {
    white-space: nowrap;
}

/* Apilado y centrado: el menú va debajo, separado por una línea. */
.evotheme-bar__nav {
    display: flex;
    align-items: center;
    gap: var(--evo-space-3);
    padding-block: var(--evo-space-2);
    border-block-start: 1px solid var(--evo-color-border);
}

.evotheme-bar--stacked .evotheme-actions {
    margin-inline-start: 0;
}

.evotheme-header-extra,
.evotheme-mobile-header,
.evotheme-toolbar__left,
.evotheme-toolbar__right {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--evo-space-3);
    min-inline-size: 0;
}

.evotheme-mobile-header {
    margin-inline-start: auto;
}

.evotheme-bar .evotheme-mobile-header + .evotheme-actions {
    margin-inline-start: 0;
}

/* Barra superior: texto pequeño encima de la cabecera; solo en pantallas anchas. */
.evotheme-toolbar {
    border-block-end: 1px solid var(--evo-color-border);
    background: var(--evo-color-surface-muted);
    font-size: var(--evo-font-size-sm);
}

.evotheme-toolbar__inner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--evo-space-2) var(--evo-space-5);
    padding-block: var(--evo-space-1);
}

.evotheme-toolbar__right {
    margin-inline-start: auto;
}

.evotheme-header :where(.evotheme-header-extra, .evotheme-mobile-header, .evotheme-toolbar) :where(p) {
    margin: 0;
}

/* Botón del menú: con texto, icono y palabra; sin texto, un botón cuadrado de 2.5rem. */
.evotheme-menu-open {
    display: inline-flex;
    align-items: center;
    gap: var(--evo-space-2);
}

.evotheme-menu-open--icon {
    justify-content: center;
    min-inline-size: 2.5rem;
    padding-inline: 0;
}

/* Panel del menú móvil: cabecera con el botón de cerrar y los menús en columna. */
.evotheme-panel__head {
    display: flex;
    justify-content: flex-end;
    margin-block-end: var(--evo-space-3);
}

.evotheme-panel__close {
    min-inline-size: 2.5rem;
    padding-inline: 0;
}

.evotheme-panel__dialog {
    margin-block-start: var(--evo-space-5);
    padding-block-start: var(--evo-space-4);
    border-block-start: 1px solid var(--evo-color-border);
}

.evotheme-panel__mobile > * + *,
.evotheme-panel__dialog > * + * {
    margin-block-start: var(--evo-space-4);
}

/* Conmutador de modo en una esquina de la página (header_toggle_position distinto de «menu»). `viewport`: fijo en la
   ventana; `page`: en la esquina de la página, se va al hacer scroll (arriba, en la cabecera; abajo, dentro del pie). */
.evotheme-toggle-corner {
    position: fixed;
    /* Por encima de la cabecera fija (capa 100): si no, las esquinas de arriba quedaban tapadas. Por debajo del enlace de saltar (1000). */
    z-index: 110;
    padding: var(--evo-space-1);
    background: var(--evo-color-surface);
    border: 1px solid var(--evo-color-border);
    border-radius: var(--evo-radius-md);
}

.evotheme-toggle-corner--page {
    position: absolute;
}

/* Efecto del conmutador de modo de un solo botón (header_toggle_hover = sunrise_sunset): al pasar el ratón o enfocarlo con el teclado, el fondo
   se anima hacia el modo al que va a cambiar. Del claro al oscuro, una puesta de sol; del oscuro al claro, un amanecer. Los colores (de abajo
   arriba) y la duración los pone el estilo (--evotheme-fx-dawn, --evotheme-fx-dusk, --evotheme-fx-ms); sin ellos valen los de aquí. El icono se
   pinta en blanco con `difference` para que se lea sobre cualquier color del degradado. Con «reducir movimiento» no hay animación: se ve
   directamente el color final. */
.evotheme-toggle-fx {
    --evotheme-fx-dusk-bg: var(--evotheme-fx-dusk, linear-gradient(to top, #9ad1f5, #f97316, #1e2a5a));
    --evotheme-fx-dawn-bg: var(--evotheme-fx-dawn, linear-gradient(to top, #1e2a5a, #f59e0b, #bfe3f7));
}

.evotheme-toggle-fx .evo-theme-button__button {
    isolation: isolate;
    overflow: hidden;
}

.evotheme-toggle-fx .evo-theme-button__button:is(:hover, :focus-visible) {
    background-image: var(--evotheme-fx-dusk-bg);
    background-size: 100% 300%;
    background-position: 0 100%;
    border-color: transparent;
    animation: evotheme-fx var(--evotheme-fx-ms, 900ms) ease-out forwards;
}

:root[data-evo-theme="dark"] .evotheme-toggle-fx .evo-theme-button__button:is(:hover, :focus-visible) {
    background-image: var(--evotheme-fx-dawn-bg);
}

@media (prefers-color-scheme: dark) {
    :root:not([data-evo-theme="light"]):not([data-evo-theme="dark"]) .evotheme-toggle-fx .evo-theme-button__button:is(:hover, :focus-visible) {
        background-image: var(--evotheme-fx-dawn-bg);
    }
}

.evotheme-toggle-fx .evo-theme-button__button:is(:hover, :focus-visible) .evo-theme-button__icon {
    color: #fff;
    mix-blend-mode: difference;
}

@media (prefers-reduced-motion: reduce) {
    .evotheme-toggle-fx .evo-theme-button__button:is(:hover, :focus-visible) {
        animation: none;
        background-position: 0 0;
    }
}

@keyframes evotheme-fx {
    from {
        background-position: 0 100%;
    }

    to {
        background-position: 0 0;
    }
}

/* Con el botón único (un círculo con borde) la esquina no añade otra caja. */
.evotheme-toggle-corner--bare {
    padding: 0;
    background: none;
    border: 0;
    border-radius: 0;
}

.evotheme-footer {
    position: relative;
}

.evotheme-toggle-corner--top-start,
.evotheme-toggle-corner--top-end {
    inset-block-start: max(var(--evo-space-3), env(safe-area-inset-top));
}

.evotheme-toggle-corner--bottom-start,
.evotheme-toggle-corner--bottom-end {
    inset-block-end: max(var(--evo-space-3), env(safe-area-inset-bottom));
}

.evotheme-toggle-corner--top-start,
.evotheme-toggle-corner--bottom-start {
    inset-inline-start: max(var(--evo-space-3), env(safe-area-inset-left));
}

.evotheme-toggle-corner--top-end,
.evotheme-toggle-corner--bottom-end {
    inset-inline-end: max(var(--evo-space-3), env(safe-area-inset-right));
}

.evotheme-panel__toggle {
    margin-block-start: var(--evo-space-5);
}

.evotheme-offcanvas .evo-nav--inline,
.evotheme-modal .evo-nav--inline {
    flex-direction: column;
}

/* Ventana a pantalla completa (mobile_mode = modal): ocupa toda la pantalla, sin bordes. */
evo-dialog.evotheme-modal > :where(dialog) {
    inline-size: 100vw;
    max-inline-size: none;
    block-size: 100dvh;
    max-block-size: none;
    margin: 0;
    border: 0;
    border-radius: 0;
}

/* Punto de corte del menú móvil: la cabecera y el panel llevan evotheme-bp-s|m|l (mobile_breakpoint) y aquí se decide
   qué se ve a cada lado. Valores de header.json: S 640 px, M 960 px, L 1200 px. */
@media (width < 40em) {
    .evotheme-bp-s .evotheme-desktop-only {
        display: none;
    }
}

@media (width >= 40em) {
    .evotheme-bp-s .evotheme-mobile-only {
        display: none;
    }
}

@media (width < 60em) {
    .evotheme-bp-m .evotheme-desktop-only {
        display: none;
    }
}

@media (width >= 60em) {
    .evotheme-bp-m .evotheme-mobile-only {
        display: none;
    }
}

@media (width < 75em) {
    .evotheme-bp-l .evotheme-desktop-only {
        display: none;
    }
}

@media (width >= 75em) {
    .evotheme-bp-l .evotheme-mobile-only {
        display: none;
    }
}

.evotheme-sr-only {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

/* Altura de la cabecera para evo-section--under-header y evo-section--h-offset. Este valor aproximado evita el salto de
   diseño antes de que cargue js/header-height.js, que lo sustituye por la altura real (y la mantiene al girar el móvil o
   si el menú pasa a dos líneas). Sin ninguna de esas clases en la página, la variable no se usa. */
:root {
  --evo-header-h: calc(2.5rem + 2 * var(--evo-space-3, .75rem) + 1px);
}

/* Cabecera transparente: la primera sección pide ir bajo la cabecera (clase de <body> que pone layout/page.php). Como en
   YOOtheme (`tm-header-overlay`), la barra superior sigue en su sitio y con su fondo; solo la barra del menú sale del flujo y
   queda sobre la sección, justo debajo de la barra superior. La sección empieza tras la barra superior y reserva con su relleno
   el alto de la barra del menú (--evo-header-h, que mide js/header-height.js). Mientras dure deja de ser fija: con texto claro
   sobre una imagen, al desplazarse quedaría ilegible sobre el contenido. */
/* `header.evotheme-header` pesa más que `.evotheme-bp-l.evotheme-header--mobile-static` (navigation.css), que en el móvil la volvía
   estática: la barra del menú, en absolute, quedaba entonces bajo la pantalla (asklepia.es en el móvil). */
.evotheme-header-overlay header.evotheme-header {
  position: relative;
  inset-block-start: 0; /* sin el desplazamiento de «la barra superior se va con el scroll», que solo vale con la cabecera fija */
  z-index: 100;
  background: transparent;
  border-block-end-width: 0;
}

.evotheme-header-overlay .evotheme-header > :not(.evotheme-toolbar) {
  position: absolute;
  inset-inline: 0;
  inset-block-start: 100%;
}

.evotheme-header-overlay .evo-section--under-header {
  margin-block-start: 0;
}

/* Color del texto de la cabecera según header_text de la sección: blanco o casi negro de evoBase. Sin tono
   (header_text = default) la cabecera conserva sus colores. */
.evotheme-header-tone-light .evotheme-header {
  --evo-header-fg: var(--evo-color-neutral-0);
}

.evotheme-header-tone-dark .evotheme-header {
  --evo-header-fg: var(--evo-color-neutral-950);
}

.evotheme-header-tone-light .evotheme-header,
.evotheme-header-tone-dark .evotheme-header {
  color: var(--evo-header-fg);
  --evo-color-text: var(--evo-header-fg);
  --evo-color-link: var(--evo-header-fg);
}

.evotheme-header-tone-light .evotheme-header .evo-button--ghost,
.evotheme-header-tone-dark .evotheme-header .evo-button--ghost {
  color: var(--evo-header-fg);
  border-color: currentColor;
}

/* Logo para el modo oscuro: salen las dos imágenes y se enseña la del modo en curso (el elegido con el conmutador, o el
   del sistema si no hay elección). Sin logo oscuro no hay segunda imagen y esto no actúa. */
.evotheme-brand__img--dark {
    display: none;
}

:root[data-evo-theme="dark"] .evotheme-brand__img--light {
    display: none;
}

:root[data-evo-theme="dark"] .evotheme-brand__img--dark {
    display: inline;
}

@media (prefers-color-scheme: dark) {
    :root:not([data-evo-theme="light"]):not([data-evo-theme="dark"]) .evotheme-brand__img--light {
        display: none;
    }

    :root:not([data-evo-theme="light"]):not([data-evo-theme="dark"]) .evotheme-brand__img--dark {
        display: inline;
    }
}

/* Vista previa del Personalizador con el panel móvil abierto: la vista previa no ejecuta JavaScript, así que el <dialog open>
   no es modal (no sube a la capa superior ni pinta su telón). Se coloca a mano, pegado al borde, con su telón detrás. */
.evotheme-preview-open::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 90;
    background: var(--evo-color-backdrop);
}

.evotheme-preview-open > dialog[open] {
    position: fixed;
    z-index: 91;
    inset-block: 0;
    inset-inline-end: 0;
    inset-inline-start: auto;
    display: block;
}

.evotheme-modal.evotheme-preview-open > dialog[open] {
    inset: 0;
    margin: auto;
    block-size: fit-content;
    max-block-size: 90dvh;
}

/* Selector de idioma de la cabecera: códigos cortos (ES, EN) como botones pequeños; el idioma actual, sin enlace y marcado. */
.evotheme-lang__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--evo-space-1);
    margin: 0;
    padding: 0;
    list-style: none;
}

.evotheme-lang__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-inline-size: 2.25rem;
    min-block-size: 2.25rem;
    padding-inline: var(--evo-space-2);
    border: 1px solid var(--evo-color-border);
    border-radius: var(--evo-radius-md);
    color: inherit;
    font-size: var(--evo-font-size-sm);
    font-weight: 600;
    letter-spacing: 0.02em;
    text-decoration: none;
}

a.evotheme-lang__link:hover {
    background: var(--evo-color-surface-muted);
    text-decoration: underline;
}

.evotheme-lang__link--current {
    background: var(--evo-color-primary);
    border-color: var(--evo-color-primary);
    color: var(--evo-color-on-primary);
}

.evotheme-lang {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--evo-space-2);
}

.evotheme-lang__icon {
    inline-size: 1.125rem;
    block-size: 1.125rem;
    flex: none;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.75;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* Banderas (imágenes de mod_languages, 18×12): tamaño y forma. Las redondas y las cuadradas recortan los lados de la imagen. */
.evotheme-lang__flag {
    inline-size: 1.125rem;
    block-size: auto;
    aspect-ratio: 3 / 2;
    flex: none;
    object-fit: cover;
}

.evotheme-lang__flag--s {
    inline-size: 0.875rem;
}

.evotheme-lang__flag--l {
    inline-size: 1.625rem;
}

.evotheme-lang__flag--round {
    aspect-ratio: 1;
    border-radius: 50%;
}

.evotheme-lang__flag--square {
    aspect-ratio: 1;
    border-radius: var(--evo-radius-sm, 0.25rem);
}

.evotheme-lang__link:has(.evotheme-lang__flag) {
    gap: var(--evo-space-2);
}

/* «Como el módulo»: las banderas van solas, sin el recuadro de botón (como la lista de imágenes de mod_languages). */
.evotheme-lang--module .evotheme-lang__link:has(.evotheme-lang__flag),
.evotheme-lang--list .evotheme-lang__link:has(.evotheme-lang__flag) {
    min-inline-size: 0;
    min-block-size: 0;
    padding: 0;
    border: 0;
    background: none;
    border-radius: 0;
}

/* Estilos del selector: lista (por defecto, arriba), píldora y separador «|». */
.evotheme-lang--pill .evotheme-lang__link {
    border-radius: 999px;
}

.evotheme-lang--separator .evotheme-lang__list {
    gap: 0;
}

.evotheme-lang--separator .evotheme-lang__link {
    min-inline-size: 0;
    padding-inline: var(--evo-space-2);
    border-color: transparent;
    background: none;
    color: inherit;
    font-weight: 500;
}

.evotheme-lang--separator .evotheme-lang__link--current {
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 0.25em;
    background: none;
    color: inherit;
}

.evotheme-lang--separator .evotheme-lang__item + .evotheme-lang__item::before {
    content: "|";
    color: var(--evo-color-text-muted);
}

/* Variante desplegable de mod_languages (<details>, sin JavaScript). */
.evotheme-langmenu {
    position: relative;
}

.evotheme-langmenu__summary {
    cursor: pointer;
    list-style: none;
}

.evotheme-langmenu__summary::after {
    content: "";
    inline-size: 0.4em;
    block-size: 0.4em;
    margin-inline-start: var(--evo-space-2);
    border-inline-end: 2px solid currentColor;
    border-block-end: 2px solid currentColor;
    transform: translateY(-0.1em) rotate(45deg);
}

.evotheme-langmenu[open] > .evotheme-langmenu__summary::after {
    transform: translateY(0.1em) rotate(-135deg);
}

.evotheme-langmenu__summary::-webkit-details-marker {
    display: none;
}

.evotheme-langmenu__list {
    position: absolute;
    inset-block-start: calc(100% + var(--evo-space-1));
    inset-inline-end: 0;
    z-index: 20;
    flex-direction: column;
    align-items: stretch;
    min-inline-size: 100%;
    padding: var(--evo-space-1);
    background: var(--evo-color-surface);
    border: 1px solid var(--evo-color-border);
    border-radius: var(--evo-radius-md);
}

/* Dentro del menú móvil la lista del desplegable empuja el contenido en vez de flotar encima (tapaba el conmutador de modo). */
.evotheme-offcanvas .evotheme-langmenu__list,
.evotheme-modal .evotheme-langmenu__list {
    position: static;
    margin-block-start: var(--evo-space-1);
}

.evotheme-langmenu__list .evotheme-lang__link {
    justify-content: flex-start;
    white-space: nowrap;
    border-color: transparent;
}

.evotheme-panel__lang {
    margin-block-start: var(--evo-space-4);
}

/* Área de cliente de evoLicenses: toma el acento y el radio del tema (la extensión los lee de estas variables). */
.evolic {
    --evolic-accent: var(--evo-color-primary);
    --evolic-accent-text: var(--evo-color-on-primary);
    --evolic-radius: var(--evo-radius-md);
}

/* Ajustes que dan equivalencia a los del tema de YOOtheme (clases del <body> que pone ThemeExtras). */

/* Sitio en caja: la página queda en una columna centrada; fuera de ella, el color de fondo elegido o el de superficie. */
html:has(body.evotheme-boxed) {
    background: var(--evotheme-boxed-bg, var(--evo-color-surface-muted));
}

.evotheme-boxed {
    max-inline-size: var(--evotheme-boxed-width, 1200px);
    margin-inline: auto;
    background: var(--evo-color-surface);
    box-shadow: var(--evo-shadow-md);
}

/* El contenido no se estira: el pie sigue al contenido en vez de quedar pegado abajo. */
.evotheme-site > .evotheme-sidebar-layout {
    flex: 1 0 auto;
    align-content: start;
}

.evotheme-main-natural > main,
.evotheme-main-natural > .evotheme-sidebar-layout {
    flex: 0 0 auto;
}

/* Tipografías secundaria (botones, menús y títulos pequeños) y terciaria (etiquetas y metadatos). Solo cuando se eligen. */
.evotheme-font-secondary :where(.evo-button, .evo-navbar, .evo-menubar, .evotheme-header, h4, h5, h6) {
    font-family: var(--evotheme-font-secondary);
}

.evotheme-font-tertiary :where(.evo-text--meta, .evo-title--kicker, .evo-grid__meta, .evo-code, code, kbd, .evo-label) {
    font-family: var(--evotheme-font-tertiary);
}

/* Migas de pan globales, encima del contenido. */
.evotheme-breadcrumbs {
    padding-block: var(--evo-space-3) 0;
    font-size: var(--evo-font-size-sm);
}

/* Cabecera: diseños justificados, barra superior ancha, logo móvil o con máscara, búsqueda, redes y cabecera fija al subir. */
.evotheme-navbar--align-justify {
    flex: 1 1 auto;
}

.evotheme-navbar--align-justify .evo-menu__list {
    justify-content: space-between;
}

.evotheme-navbar--align-justify.evotheme-bar__nav {
    inline-size: 100%;
}

.evotheme-brand__img--mobile {
    display: none;
}

@media (max-width: 639.98px) {
    .evotheme-bp-s .evotheme-brand__img--desktop { display: none; }
    .evotheme-bp-s .evotheme-brand__img--mobile { display: inline; }
}

@media (max-width: 959.98px) {
    .evotheme-bp-m .evotheme-brand__img--desktop { display: none; }
    .evotheme-bp-m .evotheme-brand__img--mobile { display: inline; }
}

@media (max-width: 1199.98px) {
    .evotheme-bp-l .evotheme-brand__img--desktop { display: none; }
    .evotheme-bp-l .evotheme-brand__img--mobile { display: inline; }
}

.evotheme-brand__mask {
    display: inline-block;
    inline-size: var(--evotheme-logo-width, 10rem);
    block-size: var(--evotheme-logo-height, 2.5rem);
    vertical-align: middle;
    background: currentcolor;
    mask: var(--evotheme-logo-mask) left center / contain no-repeat;
    -webkit-mask: var(--evotheme-logo-mask) left center / contain no-repeat;
}

.evotheme-panel__logo {
    max-block-size: 2rem;
    margin-inline-end: auto;
}

.evotheme-search {
    display: inline-flex;
    align-items: center;
    gap: var(--evo-space-1);
}

.evotheme-search__form {
    display: inline-flex;
    align-items: center;
    gap: var(--evo-space-1);
}

.evotheme-search__input {
    inline-size: 11rem;
    min-block-size: 2.5rem;
    padding-inline: var(--evo-space-3);
    border: 1px solid var(--evo-color-border);
    border-radius: var(--evo-radius-md);
    background: var(--evo-color-surface);
    color: var(--evo-color-text);
    font: inherit;
}

.evotheme-search--toggle {
    position: relative;
}

.evotheme-search--toggle > summary {
    list-style: none;
    cursor: pointer;
}

.evotheme-search--toggle > summary::-webkit-details-marker {
    display: none;
}

.evotheme-search--toggle[open] .evotheme-search__form {
    position: absolute;
    inset-block-start: 100%;
    inset-inline-end: 0;
    z-index: 20;
    padding: var(--evo-space-2);
    border: 1px solid var(--evo-color-border);
    border-radius: var(--evo-radius-md);
    background: var(--evo-color-surface);
    box-shadow: var(--evo-shadow-md);
}

.evotheme-header-social {
    margin: 0;
    padding: 0;
    list-style: none;
}

.evotheme-panel__search,
.evotheme-panel__social {
    padding-block: var(--evo-space-3);
}

.evotheme-header--sticky-up {
    transition: transform var(--evo-motion-duration-base, .2s) ease;
}

.evotheme-header--sticky-up.evotheme-header--hidden {
    transform: translateY(-100%);
}

@media (prefers-reduced-motion: reduce) {
    .evotheme-header--sticky-up {
        transition: none;
    }
}

/* Menú de la barra: estilos de los ítems, flecha de los padres y panel único a todo el ancho. */
.evotheme-nav--pill .evo-menu__list--bar > .evo-menu__item > .evo-menu__link {
    border-radius: 999px;
}

.evotheme-nav--pill .evo-menu__list--bar > .evo-menu__item--active > .evo-menu__link,
.evotheme-nav--pill .evo-menu__list--bar > .evo-menu__item > .evo-menu__link:hover {
    background: var(--evo-color-surface-muted);
}

.evotheme-nav--underline .evo-menu__list--bar > .evo-menu__item > .evo-menu__link {
    border-block-end: 2px solid transparent;
    border-radius: 0;
}

.evotheme-nav--underline .evo-menu__list--bar > .evo-menu__item--active > .evo-menu__link,
.evotheme-nav--underline .evo-menu__list--bar > .evo-menu__item > .evo-menu__link:hover {
    border-block-end-color: var(--evo-color-primary);
}

.evotheme-nav--divided .evo-menu__list--bar > .evo-menu__item + .evo-menu__item {
    border-inline-start: 1px solid var(--evo-color-border);
}

/* Sin flecha, el botón del subnivel sigue en el DOM y con foco de teclado, pero sin ocupar sitio ni verse hasta que lo enfoca el teclado. */
.evotheme-nav--no-caret .evo-menu__toggle:not(:focus-visible) {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
}

.evotheme-nav--dropbar .evo-menu__list--bar > .evo-menu__item--parent {
    position: static;
}

.evotheme-nav--dropbar .evo-menu__list--bar > .evo-menu__item--parent > .evo-menu__drop {
    inset-inline: 0;
    min-inline-size: 0;
    padding: var(--evo-space-5);
}

/* Zonas de módulos: barra lateral junto al contenido y secciones «top» y «bottom». */
.evotheme-sidebar-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--evotheme-sidebar-gap, var(--evo-space-5));
    align-items: start;
}

.evotheme-sidebar-gap-sm { --evotheme-sidebar-gap: var(--evo-space-3); }
.evotheme-sidebar-gap-md { --evotheme-sidebar-gap: var(--evo-space-5); }
.evotheme-sidebar-gap-lg { --evotheme-sidebar-gap: var(--evo-space-7); }
.evotheme-sidebar-w-20 { --evotheme-sidebar-w: 20%; }
.evotheme-sidebar-w-25 { --evotheme-sidebar-w: 25%; }
.evotheme-sidebar-w-33 { --evotheme-sidebar-w: 33.333%; }

@media (min-width: 640px) {
    .evotheme-sidebar-layout.evotheme-sidebar-bp-s { grid-template-columns: minmax(0, 1fr) var(--evotheme-sidebar-w); }
    .evotheme-sidebar-layout.evotheme-sidebar-bp-s.evotheme-sidebar-layout--start { grid-template-columns: var(--evotheme-sidebar-w) minmax(0, 1fr); }
}

@media (min-width: 960px) {
    .evotheme-sidebar-layout.evotheme-sidebar-bp-m { grid-template-columns: minmax(0, 1fr) var(--evotheme-sidebar-w); }
    .evotheme-sidebar-layout.evotheme-sidebar-bp-m.evotheme-sidebar-layout--start { grid-template-columns: var(--evotheme-sidebar-w) minmax(0, 1fr); }
}

@media (min-width: 1200px) {
    .evotheme-sidebar-layout.evotheme-sidebar-bp-l { grid-template-columns: minmax(0, 1fr) var(--evotheme-sidebar-w); }
    .evotheme-sidebar-layout.evotheme-sidebar-bp-l.evotheme-sidebar-layout--start { grid-template-columns: var(--evotheme-sidebar-w) minmax(0, 1fr); }
}

/* A la izquierda solo desde el punto de corte: por debajo va tras el contenido, como en el DOM (orden de lectura y de foco). */
@media (min-width: 640px) {
    .evotheme-sidebar-layout--start.evotheme-sidebar-bp-s > .evotheme-sidebar-layout__aside { order: -1; }
}

@media (min-width: 960px) {
    .evotheme-sidebar-layout--start.evotheme-sidebar-bp-m > .evotheme-sidebar-layout__aside { order: -1; }
}

@media (min-width: 1200px) {
    .evotheme-sidebar-layout--start.evotheme-sidebar-bp-l > .evotheme-sidebar-layout__aside { order: -1; }
}

@media (min-width: 960px) {
    .evotheme-sidebar-bp-m.evotheme-sidebar-divider > .evotheme-sidebar-layout__aside { border-inline-start: 1px solid var(--evo-color-border); padding-inline-start: var(--evotheme-sidebar-gap); }
    .evotheme-sidebar-bp-m.evotheme-sidebar-divider.evotheme-sidebar-layout--start > .evotheme-sidebar-layout__aside { border-inline-start: 0; padding-inline-start: 0; border-inline-end: 1px solid var(--evo-color-border); padding-inline-end: var(--evotheme-sidebar-gap); }
}

@media (min-width: 640px) {
    .evotheme-sidebar-bp-s.evotheme-sidebar-divider > .evotheme-sidebar-layout__aside { border-inline-start: 1px solid var(--evo-color-border); padding-inline-start: var(--evotheme-sidebar-gap); }
    .evotheme-sidebar-bp-s.evotheme-sidebar-divider.evotheme-sidebar-layout--start > .evotheme-sidebar-layout__aside { border-inline-start: 0; padding-inline-start: 0; border-inline-end: 1px solid var(--evo-color-border); padding-inline-end: var(--evotheme-sidebar-gap); }
}

@media (min-width: 1200px) {
    .evotheme-sidebar-bp-l.evotheme-sidebar-divider > .evotheme-sidebar-layout__aside { border-inline-start: 1px solid var(--evo-color-border); padding-inline-start: var(--evotheme-sidebar-gap); }
    .evotheme-sidebar-bp-l.evotheme-sidebar-divider.evotheme-sidebar-layout--start > .evotheme-sidebar-layout__aside { border-inline-start: 0; padding-inline-start: 0; border-inline-end: 1px solid var(--evo-color-border); padding-inline-end: var(--evotheme-sidebar-gap); }
}

/* Barra superior centrada y diseños de la cabecera móvil. */
.evotheme-toolbar--center .evotheme-toolbar__inner {
    justify-content: center;
    gap: var(--evo-space-5);
}

.evotheme-bar {
    position: relative;
}

@media (max-width: 959.98px) {
    .evotheme-bp-m.evotheme-mobile-layout-right .evotheme-brand { order: 2; margin-inline-start: auto; }
    .evotheme-bp-m.evotheme-mobile-layout-right .evotheme-actions { order: 1; margin-inline-end: auto; }
    .evotheme-bp-m.evotheme-mobile-layout-center .evotheme-brand,
    .evotheme-bp-m.evotheme-mobile-layout-center_logo .evotheme-brand { position: absolute; inset-inline: 0; margin-inline: auto; inline-size: max-content; }
    .evotheme-bp-m.evotheme-mobile-layout-center_logo .evotheme-actions { order: -1; margin-inline-end: auto; }
    .evotheme-bp-m.evotheme-mobile-layout-center .evotheme-actions { margin-inline-start: auto; }
}

@media (max-width: 639.98px) {
    .evotheme-bp-s.evotheme-mobile-layout-right .evotheme-brand { order: 2; margin-inline-start: auto; }
    .evotheme-bp-s.evotheme-mobile-layout-right .evotheme-actions { order: 1; margin-inline-end: auto; }
    .evotheme-bp-s.evotheme-mobile-layout-center .evotheme-brand,
    .evotheme-bp-s.evotheme-mobile-layout-center_logo .evotheme-brand { position: absolute; inset-inline: 0; margin-inline: auto; inline-size: max-content; }
    .evotheme-bp-s.evotheme-mobile-layout-center_logo .evotheme-actions { order: -1; margin-inline-end: auto; }
    .evotheme-bp-s.evotheme-mobile-layout-center .evotheme-actions { margin-inline-start: auto; }
}

@media (max-width: 1199.98px) {
    .evotheme-bp-l.evotheme-mobile-layout-right .evotheme-brand { order: 2; margin-inline-start: auto; }
    .evotheme-bp-l.evotheme-mobile-layout-right .evotheme-actions { order: 1; margin-inline-end: auto; }
    .evotheme-bp-l.evotheme-mobile-layout-center .evotheme-brand,
    .evotheme-bp-l.evotheme-mobile-layout-center_logo .evotheme-brand { position: absolute; inset-inline: 0; margin-inline: auto; inline-size: max-content; }
    .evotheme-bp-l.evotheme-mobile-layout-center_logo .evotheme-actions { order: -1; margin-inline-end: auto; }
    .evotheme-bp-l.evotheme-mobile-layout-center .evotheme-actions { margin-inline-start: auto; }
}

/* Blog de Joomla en columnas y artículo (letra capital, datos, imagen). Las clases salen del <body> (ThemeExtras). */
.evotheme-blog-cols-2 .blog-items,
.evotheme-blog-cols-3 .blog-items,
.evotheme-blog-cols-4 .blog-items {
    display: grid;
    gap: var(--evotheme-blog-gap, var(--evo-space-5));
}

.evotheme-blog-gap-sm { --evotheme-blog-gap: var(--evo-space-3); }
.evotheme-blog-gap-lg { --evotheme-blog-gap: var(--evo-space-7); }

@media (min-width: 640px) {
    .evotheme-blog-cols-2 .blog-items { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .evotheme-blog-cols-3 .blog-items { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .evotheme-blog-cols-4 .blog-items { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 960px) {
    .evotheme-blog-cols-3 .blog-items { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .evotheme-blog-cols-4 .blog-items { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

.evotheme-blog-no-image .blog-items .item-image,
.evotheme-blog-no-image .blog-items .com-content-image {
    display: none;
}

.evotheme-post-no-meta .article-info,
.evotheme-post-no-meta .com-content-article__info {
    display: none;
}

.evotheme-post-dropcap .com-content-article__body > p:first-of-type::first-letter,
.evotheme-post-dropcap .item-page [itemprop="articleBody"] > p:first-of-type::first-letter {
    float: inline-start;
    margin-inline-end: var(--evo-space-2);
    font-size: 3.2em;
    line-height: .9;
    font-weight: 700;
}

/* Marco de los módulos de las posiciones sidebar, top y bottom. */
.evotheme-module + .evotheme-module {
    margin-block-start: var(--evo-space-5);
}

.evotheme-module__title {
    margin-block: 0 var(--evo-space-3);
}

.evotheme-modules-card .evotheme-module,
.evotheme-modules-muted .evotheme-module {
    padding: var(--evo-space-5);
    border-radius: var(--evo-radius-lg);
}

.evotheme-modules-card .evotheme-module {
    border: 1px solid var(--evo-color-border);
    background: var(--evo-color-surface);
    box-shadow: var(--evo-shadow-sm);
}

.evotheme-modules-muted .evotheme-module {
    background: var(--evo-color-surface-muted);
}

.evotheme-module-title-small .evotheme-module__title {
    font-size: var(--evo-font-size-base);
}

.evotheme-module-title-upper .evotheme-module__title {
    font-size: var(--evo-font-size-sm);
    letter-spacing: .08em;
    text-transform: uppercase;
}

.evotheme-module-title-line .evotheme-module__title {
    padding-block-end: var(--evo-space-2);
    border-block-end: 1px solid var(--evo-color-border);
}

.evotheme-modules-center .evotheme-module {
    text-align: center;
}

/* Ajustes de un solo módulo (clases de «Sufijo de clase del módulo»; la migración desde YOOtheme las pone a partir de los ajustes del módulo).
   Mandan sobre los de todos los módulos («Módulos: …» del estilo de la plantilla). */
.evotheme-module.evotheme-mod-card,
.evotheme-module.evotheme-mod-primary,
.evotheme-module.evotheme-mod-secondary {
    padding: var(--evo-space-5);
    border-radius: var(--evo-radius-lg);
}

.evotheme-module.evotheme-mod-card {
    border: 1px solid var(--evo-color-border);
    background: var(--evo-color-surface);
    box-shadow: var(--evo-shadow-sm);
}

.evotheme-module.evotheme-mod-primary {
    border-color: transparent;
    background: var(--evo-color-primary);
    color: var(--evo-color-on-primary);
}

.evotheme-module.evotheme-mod-secondary {
    border-color: transparent;
    background: var(--evo-color-text);
    color: var(--evo-color-surface);
}

.evotheme-module.evotheme-mod-hover {
    transition: box-shadow .2s ease;
}

.evotheme-module.evotheme-mod-hover:hover {
    box-shadow: var(--evo-shadow-md);
}

.evotheme-mod-title-h1 .evotheme-module__title { font-size: var(--evo-font-size-4xl); }
.evotheme-mod-title-h2 .evotheme-module__title { font-size: var(--evo-font-size-3xl); }
.evotheme-mod-title-h3 .evotheme-module__title { font-size: var(--evo-font-size-2xl); }
.evotheme-mod-title-h4 .evotheme-module__title { font-size: var(--evo-font-size-xl); }
.evotheme-mod-title-h5 .evotheme-module__title { font-size: var(--evo-font-size-base); }
.evotheme-mod-title-h6 .evotheme-module__title { font-size: var(--evo-font-size-sm); }
.evotheme-mod-title-display .evotheme-module__title { font-size: var(--evo-font-size-5xl); }

.evotheme-mod-title-line .evotheme-module__title {
    padding-block-end: var(--evo-space-2);
    border-block-end: 1px solid var(--evo-color-border);
}

@media (prefers-reduced-motion: reduce) {
    .evotheme-module.evotheme-mod-hover { transition: none; }
}

/* Diseño partido: mitad del menú, logo en el centro, mitad del menú y acciones. */
.evotheme-bar--split {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: var(--evo-space-4);
}

.evotheme-bar--split > .evotheme-navbar--half-a {
    justify-self: end;
}

.evotheme-bar--split > .evotheme-bar__end {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--evo-space-2) var(--evo-space-3);
    justify-content: flex-end;
    min-inline-size: 0;
}

.evotheme-bar--split .evotheme-navbar {
    min-inline-size: 0;
}

.evotheme-bar--split .evotheme-navbar--half-b {
    margin-inline-end: auto;
}

@media (min-width: 960px) {
    .evotheme-bp-m .evotheme-bar--split-single { grid-template-columns: auto 1fr; }
}

@media (min-width: 640px) {
    .evotheme-bp-s .evotheme-bar--split-single { grid-template-columns: auto 1fr; }
}

@media (min-width: 1200px) {
    .evotheme-bp-l .evotheme-bar--split-single { grid-template-columns: auto 1fr; }
}

@media (max-width: 959.98px) {
    .evotheme-bp-m .evotheme-bar--split { grid-template-columns: auto 1fr; }
    .evotheme-bp-m .evotheme-bar--split > .evotheme-bar__end { justify-content: flex-end; }
}

@media (max-width: 639.98px) {
    .evotheme-bp-s .evotheme-bar--split { grid-template-columns: auto 1fr; }
    .evotheme-bp-s .evotheme-bar--split > .evotheme-bar__end { justify-content: flex-end; }
}

@media (max-width: 1199.98px) {
    .evotheme-bp-l .evotheme-bar--split { grid-template-columns: auto 1fr; }
    .evotheme-bp-l .evotheme-bar--split > .evotheme-bar__end { justify-content: flex-end; }
}

/* Línea de las secciones de arriba y de abajo. */
.evotheme-zone--top.evotheme-zone-divider {
    border-block-end: var(--evo-border-width, 1px) solid var(--evo-color-border);
}

.evotheme-zone--bottom.evotheme-zone-divider {
    border-block-start: var(--evo-border-width, 1px) solid var(--evo-color-border);
}

/* Datos del artículo en una sola línea. */
.evotheme-post-meta-inline .article-info,
.evotheme-post-meta-inline .com-content-article__info {
    display: flex;
    flex-wrap: wrap;
    gap: var(--evo-space-1) var(--evo-space-4);
}

.evotheme-post-meta-inline .article-info dd,
.evotheme-post-meta-inline .com-content-article__info dd {
    margin: 0;
}

/* ---- Blog de Joomla: rejilla, mosaico, paginación y cada artículo. Las clases del <body> salen de ContentStyle (ajustes «Blog: …»). ---- */

/* Columnas desde un ancho elegido; por debajo, una sola. Sin elegir, manda el reparto escalonado de arriba. */
@media (max-width: 639.98px) {
    .evotheme-blog-bp-s .blog-items { grid-template-columns: minmax(0, 1fr); }
}

@media (min-width: 640px) {
    .evotheme-blog-bp-s.evotheme-blog-cols-2 .blog-items { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .evotheme-blog-bp-s.evotheme-blog-cols-3 .blog-items { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .evotheme-blog-bp-s.evotheme-blog-cols-4 .blog-items { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 959.98px) {
    .evotheme-blog-bp-m .blog-items { grid-template-columns: minmax(0, 1fr); }
}

@media (min-width: 960px) {
    .evotheme-blog-bp-m.evotheme-blog-cols-2 .blog-items { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .evotheme-blog-bp-m.evotheme-blog-cols-3 .blog-items { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .evotheme-blog-bp-m.evotheme-blog-cols-4 .blog-items { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 1199.98px) {
    .evotheme-blog-bp-l .blog-items { grid-template-columns: minmax(0, 1fr); }
}

@media (min-width: 1200px) {
    .evotheme-blog-bp-l.evotheme-blog-cols-2 .blog-items { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .evotheme-blog-bp-l.evotheme-blog-cols-3 .blog-items { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .evotheme-blog-bp-l.evotheme-blog-cols-4 .blog-items { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 1599.98px) {
    .evotheme-blog-bp-xl .blog-items { grid-template-columns: minmax(0, 1fr); }
}

@media (min-width: 1600px) {
    .evotheme-blog-bp-xl.evotheme-blog-cols-2 .blog-items { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .evotheme-blog-bp-xl.evotheme-blog-cols-3 .blog-items { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .evotheme-blog-bp-xl.evotheme-blog-cols-4 .blog-items { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* Separación entre filas. */
.evotheme-blog-rowgap-none { --evotheme-blog-row: 0; }
.evotheme-blog-rowgap-sm { --evotheme-blog-row: var(--evo-space-3); }
.evotheme-blog-rowgap-md { --evotheme-blog-row: var(--evo-space-5); }
.evotheme-blog-rowgap-lg { --evotheme-blog-row: var(--evo-space-7); }

[class*="evotheme-blog-rowgap-"] .blog-items {
    row-gap: var(--evotheme-blog-row);
}

/* Mosaico: columnas de CSS, sin huecos entre tarjetas de distinta altura. */
.evotheme-blog-masonry:is(.evotheme-blog-cols-2, .evotheme-blog-cols-3, .evotheme-blog-cols-4) .blog-items {
    display: block;
    column-count: 1;
    column-gap: var(--evotheme-blog-gap, var(--evo-space-5));
}

.evotheme-blog-masonry:is(.evotheme-blog-cols-2, .evotheme-blog-cols-3, .evotheme-blog-cols-4) .blog-item {
    break-inside: avoid;
    margin-block-end: var(--evotheme-blog-row, var(--evotheme-blog-gap, var(--evo-space-5)));
}

@media (min-width: 640px) {
    .evotheme-blog-masonry.evotheme-blog-cols-2 .blog-items,
    .evotheme-blog-masonry.evotheme-blog-cols-3 .blog-items,
    .evotheme-blog-masonry.evotheme-blog-cols-4 .blog-items { column-count: 2; }
}

@media (min-width: 960px) {
    .evotheme-blog-masonry.evotheme-blog-cols-3 .blog-items { column-count: 3; }
    .evotheme-blog-masonry.evotheme-blog-cols-4 .blog-items { column-count: 4; }
}

@media (max-width: 639.98px) {
    .evotheme-blog-masonry.evotheme-blog-bp-s:is(.evotheme-blog-cols-2, .evotheme-blog-cols-3, .evotheme-blog-cols-4) .blog-items { column-count: 1; }
}

@media (min-width: 640px) {
    .evotheme-blog-masonry.evotheme-blog-bp-s.evotheme-blog-cols-2 .blog-items { column-count: 2; }
    .evotheme-blog-masonry.evotheme-blog-bp-s.evotheme-blog-cols-3 .blog-items { column-count: 3; }
    .evotheme-blog-masonry.evotheme-blog-bp-s.evotheme-blog-cols-4 .blog-items { column-count: 4; }
}

@media (max-width: 959.98px) {
    .evotheme-blog-masonry.evotheme-blog-bp-m:is(.evotheme-blog-cols-2, .evotheme-blog-cols-3, .evotheme-blog-cols-4) .blog-items { column-count: 1; }
}

@media (min-width: 960px) {
    .evotheme-blog-masonry.evotheme-blog-bp-m.evotheme-blog-cols-2 .blog-items { column-count: 2; }
    .evotheme-blog-masonry.evotheme-blog-bp-m.evotheme-blog-cols-3 .blog-items { column-count: 3; }
    .evotheme-blog-masonry.evotheme-blog-bp-m.evotheme-blog-cols-4 .blog-items { column-count: 4; }
}

@media (max-width: 1199.98px) {
    .evotheme-blog-masonry.evotheme-blog-bp-l:is(.evotheme-blog-cols-2, .evotheme-blog-cols-3, .evotheme-blog-cols-4) .blog-items { column-count: 1; }
}

@media (min-width: 1200px) {
    .evotheme-blog-masonry.evotheme-blog-bp-l.evotheme-blog-cols-2 .blog-items { column-count: 2; }
    .evotheme-blog-masonry.evotheme-blog-bp-l.evotheme-blog-cols-3 .blog-items { column-count: 3; }
    .evotheme-blog-masonry.evotheme-blog-bp-l.evotheme-blog-cols-4 .blog-items { column-count: 4; }
}

@media (max-width: 1599.98px) {
    .evotheme-blog-masonry.evotheme-blog-bp-xl:is(.evotheme-blog-cols-2, .evotheme-blog-cols-3, .evotheme-blog-cols-4) .blog-items { column-count: 1; }
}

@media (min-width: 1600px) {
    .evotheme-blog-masonry.evotheme-blog-bp-xl.evotheme-blog-cols-2 .blog-items { column-count: 2; }
    .evotheme-blog-masonry.evotheme-blog-bp-xl.evotheme-blog-cols-3 .blog-items { column-count: 3; }
    .evotheme-blog-masonry.evotheme-blog-bp-xl.evotheme-blog-cols-4 .blog-items { column-count: 4; }
}

/* Paginación: sin los saltos a la primera y la última página, o solo anterior y siguiente. */
.evotheme-blog-no-ends :is(.com-content-category-blog__pagination, .com-content-featured__pagination) li.page-item:has([class*="icon-angle-double"]),
.evotheme-blog-nav-prevnext :is(.com-content-category-blog__pagination, .com-content-featured__pagination) li.page-item:has([class*="icon-angle-double"]),
.evotheme-blog-nav-prevnext :is(.com-content-category-blog__pagination, .com-content-featured__pagination) li.page-item:not(:has([class*="icon-angle"])) {
    display: none;
}

/* Imagen entre el título (con los datos) y el texto: el bloque del contenido se disuelve para poder ordenar sus hijos. */
.evotheme-blog-image-between .blog-item {
    display: flex;
    flex-direction: column;
}

.evotheme-blog-image-between .blog-item > .item-content {
    display: contents;
}

.evotheme-blog-image-between .blog-item > .item-image {
    order: 1;
}

.evotheme-blog-image-between .blog-item > .item-content > * {
    order: 2;
}

.evotheme-blog-image-between .blog-item > .item-content > :is(.page-header, .article-info, .tags) {
    order: 0;
}

/* Título y datos centrados; texto y botón centrados. */
.evotheme-blog-header-center .blog-items :is(.page-header, .article-info, .tags) {
    text-align: center;
}

.evotheme-blog-content-center .blog-items :is(.evotheme-blog-text, .readmore) {
    text-align: center;
}

/* Tamaño del título como el de un encabezado h1 a h4. */
.evotheme-blog-title-h1 .blog-items .item-content .page-header h2 { font-size: var(--evo-font-size-4xl); line-height: 1.15; }
.evotheme-blog-title-h2 .blog-items .item-content .page-header h2 { font-size: var(--evo-font-size-3xl); line-height: 1.2; }
.evotheme-blog-title-h3 .blog-items .item-content .page-header h2 { font-size: var(--evo-font-size-2xl); line-height: 1.25; }
.evotheme-blog-title-h4 .blog-items .item-content .page-header h2 { font-size: var(--evo-font-size-xl); line-height: 1.3; }

/* Botón «Seguir leyendo». */
.evotheme-blog-btn-default .blog-items .readmore .btn { border-color: var(--evo-color-border); background: transparent; color: inherit; }
.evotheme-blog-btn-primary .blog-items .readmore .btn { border-color: var(--evo-color-primary); background: var(--evo-color-primary); color: var(--evo-color-on-primary); }
.evotheme-blog-btn-secondary .blog-items .readmore .btn { border-color: currentcolor; background: transparent; color: var(--evo-color-primary); }
.evotheme-blog-btn-danger .blog-items .readmore .btn { border-color: var(--evo-color-danger); background: var(--evo-color-danger); color: var(--evo-color-on-primary); }
.evotheme-blog-btn-text .blog-items .readmore .btn { border-color: transparent; background: transparent; color: var(--evo-color-primary); text-decoration: underline; }

/* ---- Artículo de Joomla: imagen arriba, título centrado, ancho del texto y relleno de la zona principal (ajustes «Artículo: …»). ---- */
.evotheme-post-image-top .com-content-article {
    display: flex;
    flex-direction: column;
}

.evotheme-post-image-top .com-content-article > .item-image {
    order: -1;
}

.evotheme-post-header-center .com-content-article > .page-header,
.evotheme-post-header-center .com-content-article .article-info {
    text-align: center;
}

.evotheme-post-text-xsmall .com-content-article__body { max-inline-size: 46.875rem; margin-inline: auto; }
.evotheme-post-text-small .com-content-article__body { max-inline-size: 56.25rem; margin-inline: auto; }

/* Relleno vertical de la zona principal en el blog y en el artículo. */
.evotheme-main-pad-none { padding-block: 0; }
.evotheme-main-pad-xsmall { padding-block: 1.25rem; }
.evotheme-main-pad-small { padding-block: 2.5rem; }
.evotheme-main-pad-large { padding-block: 6rem; }
.evotheme-main-pad-xlarge { padding-block: 9rem; }

/* ---- Sitio: caja con margen arriba y abajo o pegada al inicio; flecha del selector de idioma. ---- */
.evotheme-boxed-mt { margin-block-start: var(--evo-space-6); }
.evotheme-boxed-mb { margin-block-end: var(--evo-space-6); }
.evotheme-boxed-start { margin-inline: 0 auto; }

.evotheme-lang-no-caret .evotheme-langmenu__summary::after {
    display: none;
}

/* ---- Secciones de arriba y de abajo: color del texto, sin relleno, y módulos en fila (ajustes «Sección de arriba/abajo: …»). ---- */
.evotheme-zone-tone-light { color: var(--evo-color-neutral-0); --evo-color-text: var(--evo-color-neutral-0); --evo-color-link: var(--evo-color-neutral-0); }
.evotheme-zone-tone-dark { color: var(--evo-color-neutral-800); --evo-color-text: var(--evo-color-neutral-800); --evo-color-link: var(--evo-color-neutral-800); }

.evotheme-zone.evotheme-zone-pt0 { --evo-sec-pt: 0px; }
.evotheme-zone.evotheme-zone-pb0 { --evo-sec-pb: 0px; }

.evotheme-zone--row {
    --evotheme-zone-cgap: var(--evo-space-5);
    --evotheme-zone-rgap: var(--evo-space-5);
}

.evotheme-zone-cgap-sm { --evotheme-zone-cgap: var(--evo-space-3); }
.evotheme-zone-cgap-lg { --evotheme-zone-cgap: var(--evo-space-7); }
.evotheme-zone-cgap-none { --evotheme-zone-cgap: 0; }
.evotheme-zone-rgap-sm { --evotheme-zone-rgap: var(--evo-space-3); }
.evotheme-zone-rgap-lg { --evotheme-zone-rgap: var(--evo-space-7); }
.evotheme-zone-rgap-none { --evotheme-zone-rgap: 0; }

.evotheme-zone--row > div > .evotheme-module + .evotheme-module {
    margin-block-start: var(--evotheme-zone-rgap);
}

@media (min-width: 640px) {
    .evotheme-zone--row.evotheme-zone-bp-s > div { display: flex; flex-wrap: wrap; align-items: flex-start; gap: var(--evotheme-zone-rgap) var(--evotheme-zone-cgap); }
    .evotheme-zone--row.evotheme-zone-bp-s > div > .evotheme-module { flex: 1 1 0; min-inline-size: 0; margin-block-start: 0; }
    .evotheme-zone--row.evotheme-zone-bp-s.evotheme-zone-valign-middle > div { align-items: center; }
    .evotheme-zone--row.evotheme-zone-bp-s.evotheme-zone-valign-bottom > div { align-items: flex-end; }
    .evotheme-zone--row.evotheme-zone-bp-s.evotheme-zone-match > div { align-items: stretch; }
    .evotheme-zone--row.evotheme-zone-bp-s.evotheme-zone-cell-divider > div > .evotheme-module + .evotheme-module { padding-inline-start: var(--evotheme-zone-cgap); border-inline-start: var(--evo-border-width, 1px) solid var(--evo-color-border); }
}

@media (min-width: 960px) {
    .evotheme-zone--row.evotheme-zone-bp-m > div { display: flex; flex-wrap: wrap; align-items: flex-start; gap: var(--evotheme-zone-rgap) var(--evotheme-zone-cgap); }
    .evotheme-zone--row.evotheme-zone-bp-m > div > .evotheme-module { flex: 1 1 0; min-inline-size: 0; margin-block-start: 0; }
    .evotheme-zone--row.evotheme-zone-bp-m.evotheme-zone-valign-middle > div { align-items: center; }
    .evotheme-zone--row.evotheme-zone-bp-m.evotheme-zone-valign-bottom > div { align-items: flex-end; }
    .evotheme-zone--row.evotheme-zone-bp-m.evotheme-zone-match > div { align-items: stretch; }
    .evotheme-zone--row.evotheme-zone-bp-m.evotheme-zone-cell-divider > div > .evotheme-module + .evotheme-module { padding-inline-start: var(--evotheme-zone-cgap); border-inline-start: var(--evo-border-width, 1px) solid var(--evo-color-border); }
}

@media (min-width: 1200px) {
    .evotheme-zone--row.evotheme-zone-bp-l > div { display: flex; flex-wrap: wrap; align-items: flex-start; gap: var(--evotheme-zone-rgap) var(--evotheme-zone-cgap); }
    .evotheme-zone--row.evotheme-zone-bp-l > div > .evotheme-module { flex: 1 1 0; min-inline-size: 0; margin-block-start: 0; }
    .evotheme-zone--row.evotheme-zone-bp-l.evotheme-zone-valign-middle > div { align-items: center; }
    .evotheme-zone--row.evotheme-zone-bp-l.evotheme-zone-valign-bottom > div { align-items: flex-end; }
    .evotheme-zone--row.evotheme-zone-bp-l.evotheme-zone-match > div { align-items: stretch; }
    .evotheme-zone--row.evotheme-zone-bp-l.evotheme-zone-cell-divider > div > .evotheme-module + .evotheme-module { padding-inline-start: var(--evotheme-zone-cgap); border-inline-start: var(--evo-border-width, 1px) solid var(--evo-color-border); }
}

@media (min-width: 1600px) {
    .evotheme-zone--row.evotheme-zone-bp-xl > div { display: flex; flex-wrap: wrap; align-items: flex-start; gap: var(--evotheme-zone-rgap) var(--evotheme-zone-cgap); }
    .evotheme-zone--row.evotheme-zone-bp-xl > div > .evotheme-module { flex: 1 1 0; min-inline-size: 0; margin-block-start: 0; }
    .evotheme-zone--row.evotheme-zone-bp-xl.evotheme-zone-valign-middle > div { align-items: center; }
    .evotheme-zone--row.evotheme-zone-bp-xl.evotheme-zone-valign-bottom > div { align-items: flex-end; }
    .evotheme-zone--row.evotheme-zone-bp-xl.evotheme-zone-match > div { align-items: stretch; }
    .evotheme-zone--row.evotheme-zone-bp-xl.evotheme-zone-cell-divider > div > .evotheme-module + .evotheme-module { padding-inline-start: var(--evotheme-zone-cgap); border-inline-start: var(--evo-border-width, 1px) solid var(--evo-color-border); }
}

/* Visibilidad por dispositivo de un módulo o de cualquier bloque (clase de módulo: «evotheme-hide-mobile» o «evotheme-hide-desktop»).
   El corte es el del tamaño M de evoBase (960 px). */
@media (max-width: 959.98px) {
    .evotheme-hide-mobile { display: none !important; }
}

@media (min-width: 960px) {
    .evotheme-hide-desktop { display: none !important; }
}