/*
Book Online cab:    --green-light: #b4baa8;
                    --base-color-brand--green-dark: #5e653a;

                    --base-color-brand--off-white: #f9f4ed;
                    --base-color-neutral--neutral-lighter: #f0ece3;

Pie                 --base-color-brand--blue-dark: #174455; --bg-pie:#174455; 
                    --base-color-brand--blue-dark-light: #567884; /* fuente grande del pie 




:root {
    --background-color--background-primary\<deleted\|relume-variable-background-color-1\>: var(--base-color-neutral--neutral-lightest);
    --text-color--text-primary\<deleted\|relume-variable-text-color-1\>: black;
    --link-color--link-primary\<deleted\|relume-variable-link-color-1\>: black;
    --base-color-brand--black-off: #242b2e;
    --base-color-brand--blue-dark: #174455;
    --base-color-brand--green-dark: #5e653a;
    --base-color-brand--off-white: #f9f4ed;
    --border-color--border-primary\<deleted\|relume-variable-border-color-1\>: black;
    --base-color-brand--gold: #bc9d68;
    --base-color-neutral--white: white;
    --base-color-neutral--black\<deleted\|relume-variable-color-neutral-1\>: black;
    --base-color-brand--navbar-text: #174455;
    --base-color-neutral--transparent: transparent;
    --base-color-brand--green-light: #b4baa8;
    --background-color--background-secondary\<deleted\|relume-variable-background-color-2\>: var(--base-color-neutral--neutral-lighter);
    --link-color--link-alternate\<deleted\|relume-variable-link-color-3\>: white;
    --base-color-brand--off-white-dark: #efede7;
    --background-color--background-success\<deleted\|relume-variable-background-color-6\>: var(--base-color-system--success-green-light);
    --text-color--text-success\<deleted\|relume-variable-text-color-4\>: var(--base-color-system--success-green);
    --background-color--background-error\<deleted\|relume-variable-background-color-8\>: var(--base-color-system--error-red-light);
    --text-color--text-error\<deleted\|relume-variable-text-color-5\>: var(--base-color-system--error-red);
    --base-color-brand--navbar-background: #f9f4ed;
    --hero-image-border-radius: 24rem;
    --base-color-neutral--neutral-light: #dfd3bf;
    --image-border-radius: .625rem;
    --base-color-neutral--neutral-lighter: #f0ece3;
    --green-light: #b4baa8;
    --base-color-brand--blue-light: #bdced4;
    --base-color-neutral--neutral-grey: #e3e1d9;
    --gray: #2b3133;
    --base-color-brand--size: 0px;
    --base-color-neutral--neutral-lightest: #f9f4ed;
    --base-color-neutral--neutral-darkest: #242b2e;
    --base-color-system--success-green: #027a48;
    --base-color-system--success-green-light: #ecfdf3;
    --base-color-system--error-red: #b42318;
    --base-color-system--error-red-light: #fef3f2;
  }*/
  @import url('https://fonts.googleapis.com/css2?family=Noto+Serif:ital,wght@0,100..900;1,100..900&display=swap');
  @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Serif:ital,wght@0,300;0,500;0,600;1,300;1,500;1,600&family=IBM+Plex+Sans:ital,wght@0,400;0,500;0,600;1,400;1,500;1,600&display=swap');

:root {
    /**** mis pantallas ************/
    --bs-breakpoint-xs: 0;
    --bs-breakpoint-sm: 576px;
    --bs-breakpoint-md: 768px;
    --bs-breakpoint-lg: 992px;
    --bs-breakpoint-xl: 1200px;
    --bs-breakpoint-xxl: 1400px;
    /* mi columna de la derecha y sy menu **********************/
    --cd-color-gris-claro-fondo: #f2f6fb;
    --cd-color-azul-borde: #034cac;
    --cd-color-gris-texto: #4b6075;
    --cd-color-gris-oscuro-activo: #231F20;
    --cd-color-gris-hover-active: #d9e5f3;
    --cd-color-gris-oscuro-hover-active:#2368b5;

    

    /* mis colores */
    --color-verde-pistacho: #eaffd2;
    --color-verde-raya : #7edb10;
    --color-naranja-comillas: #ffc107;
    --color-gris-texto: #777777;
    /* color fondo mensaje */
    --color-gris-claro-fondo: #f8f9fa;
    --color-gris-verde-fondo: #dce7e8;
    --color-verde-gris-fondo: #266870;
    --color-celeste-azul-fondo: #b8ecff;
    --color-azul-celeste-fondo: #01306f;
    --color-verde-claro-fondo: #e8f5f1;
    /* Colores */
    --overlap-size: 250px;
    --clr-primary-dark: hsl(196, 100%, 15%);
    --clr-primary-base: hsl(196, 100%, 28%);
    --color-primary: #2d5a4a;
    --color-primary-dark: #1e3d33;
    --color-primary-r: #FB411F;
    --color-primary-dark-r: #ff2600;
    --color-strong: #142c25; /*#0f1f1b; #142c25; #1e3f35; #25483f; #284e45; #2f5a50; #355f52; #4f7f6c;*/
    --color-secondary: #e8f5f1;
    --color-accent: #f4a261;
    --top-menu-bg: #f76400;
    --top-menu-text: #ffffff;

    --color-text: #2d5a4a; /*#2c3e50;*/
    --color-text-light: #6c757d;
    --color-bg: #ffffff;
    --color-bg-alt: #f8f9fa;
    --color-border: #e0e0e0;
    --color-success: #28a745;
    --color-error: #dc3545;
    
    /* Tipografía */
    --font-primary-titulos: 'IBM Plex Serif', Georgia, serif;
    --font-primary-texto: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --font-primary: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --font-size-sm: 14px;
    --font-size-base: 16px;
    --font-size-lg: 18px;
    --font-size-xl: 24px;
    --font-size-2xl: 32px;
    --font-size-3xl: 48px;
    --font-size-h1: clamp(2.6rem, 5vw, 3.8rem);
    --font-size-h2: clamp(1.6rem, 2.5vw, 2rem);
    --font-size-h3: clamp(1.1rem, 1.8vw, 1.3rem);
    --font-size-h4: clamp(0.95rem, 1.5vw, 1.05rem);
    --font-size-h5: clamp(0.85rem, 1.3vw, 0.95rem);

    
    /* Espaciado */
    --spacing-xs: 8px;
    --spacing-sm: 16px;
    --spacing-md: 24px;
    --spacing-lg: 32px;
    --spacing-xl: 48px;
    --spacing-2xl: 64px;
    --spacing-3xl: 96px;
    --spacing-4xl: 112px;

    --spacing-6xl:192px;
    
    /* Bordes */
    --border-radius-sm: 8px;
    --border-radius-md: 12px;
    --border-radius-lg: 16px;
    
    /* Sombras */
    --shadow-sm: 0 2px 4px rgba(0,0,0,0.1);
    --shadow-md: 0 4px 8px rgba(0,0,0,0.12);
    --shadow-lg: 0 8px 16px rgba(0,0,0,0.15);
    --shadow-xl: 0 20px 40px rgba(0,0,0,0.2);
    --bs-teal: #20c997;
    --bs-cyan: #0dcaf0;
    --bs-info: #0dcaf0;
    --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075);
    --bs-focus-ring-color: rgba(13, 110, 253, 0.25);
    --swiper-theme-color: #007aff;
    --bs-info-border-subtle: #9eeaf9;
    --bs-info-bg-subtle: #cff4fc;
    
    /* Transiciones */
    --transition-fast: 0.2s ease;
    --transition-normal: 0.3s ease;
    /* colores del pie y menu */
    --bg-pie:#174455; 
    --text-pie:#567884;
    /*--bg-top-menu: #f76400;*/
    --bg-top-menu:#174455; 

    --text-menu:#ffffff;
}

/* ====== MOD IMG MODAL ====== */

.mod-img-modal {
  max-width: 1280px;
  width: 96%;
}

.mod-img-modal__img {
  display: block;
  width: 100%;
  height: auto;
}

.mod-img-modal__top {
  display: flex;
  justify-content: flex-end;
  padding: var(--spacing-lg);
  padding-bottom: 0;
}

.mod-img-modal__top + .modal-body {
  padding-top: 0;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: var(--font-primary);
    font-size: var(--font-size-base);
    color: var(--color-text);
    line-height: 1.6;
    background-color: var(--color-bg);
}

body.nav-open {
    overflow: hidden;
}

/* Page Navigation */
.page {
    display: none !important;
}

.page.active {
    display: block !important;
}

/* Hide Buenas Prácticas unless expressly mostrado */
body:not(.show-bp) #buenaspracticasPage {
    display: none !important;
}
/* tooltip ******************/
.tooltip {
    position: relative;
    display: inline-block;
    cursor: help;
    color: var(--color-primary);
    font-weight: 600;
  }
  
  .tooltip:hover .tooltip__content,
  .tooltip:focus-within .tooltip__content {
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, -6px);
  }
  
  .tooltip__content {
    position: absolute;
    left: 50%;
    bottom: 125%;
    transform: translate(-50%, 0);
    background: #0f172a;
    color: #fff;
    padding: 10px 12px;
    border-radius: 10px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.15);
    max-width: 320px;
    width: max-content;
    opacity: 0;
    visibility: hidden;
    transition: all 150ms ease;
    font-weight: 500;
    line-height: 1.4;
    z-index: 9999;
  }
  .tooltip__content::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -7px;
    border-width: 7px;
    border-style: solid;
    border-color: #0f172a transparent transparent transparent;
  }
  
/****************************** fin tooltip ***********************/
/* Header */
.top-info-bar {
    background: var(--bg-top-menu);
    color: var(--top-menu-text);
    font-size: 0.875rem;
    max-height: 32px;
    overflow: hidden;
    transition: max-height var(--transition-fast), opacity var(--transition-fast), padding var(--transition-fast);
    margin-bottom: 10px;
    will-change: max-height, opacity, padding;
}

.top-info-bar--hidden {
    max-height: 0;
    opacity: 0;
    padding-top: 0;
    padding-bottom: 0;
}

.top-info-inner {
    width: 90vw;
    margin: 0 auto;
    padding: 4px var(--spacing-sm);
    display: flex;
    gap: var(--spacing-md);
    align-items: center;
    justify-content: space-between;
}

.top-info-login {
    font-weight: 600;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    color: var(--top-menu-text);
    text-decoration: none;
    border: 1px solid rgba(255,255,255,0.4);
    padding: 4px 12px;
    border-radius: 999px;
    max-width: 90%;
    flex-shrink: 0;
}

.top-info-login:hover {
    background: rgba(255,255,255,0.15);
}

.top-info-bar {
    background: var(--bg-top-menu);
    color: var(--top-menu-text);
    font-size: 0.875rem;
    max-height: 32px;
    overflow: hidden;
    transition: max-height var(--transition-fast), opacity var(--transition-fast), padding var(--transition-fast);
    margin-bottom: 10px;
    will-change: max-height, opacity, padding;
}

.top-info-bar--hidden {
    max-height: 0;
    opacity: 0;
    padding-top: 0;
    padding-bottom: 0;
}

.top-info-inner {
    width: 90vw;
    margin: 0 auto;
    padding: 4px var(--spacing-sm);
    display: flex;
    gap: var(--spacing-md);
    align-items: center;
    justify-content: space-between;
}

.top-info-left {
    text-align: left;
}

.top-info-left a {
    color: var(--top-menu-text);
    text-decoration: none;
    font-weight: 500;
}

.top-info-right {
    display: flex;
    gap: var(--spacing-md);
    flex-wrap: wrap;
    align-items: center;
}

.top-info-right a {
    color: var(--top-menu-text);
    text-decoration: none;
    font-weight: 600;
}

.top-info-right a:hover {
    opacity: 0.85;
}

.top-info-login {
    font-weight: 600;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    color: var(--top-menu-text);
    text-decoration: none;
    border: 1px solid rgba(255,255,255,0.4);
    padding: 4px 12px;
    border-radius: 999px;
    max-width: 90%;
    flex-shrink: 0;
}

.top-info-login:hover {
    background: rgba(255,255,255,0.15);
}

.top-info-groups {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex: 1;
    gap: var(--spacing-md);
}

.top-info-left {
    text-align: left;
}

.top-info-left a {
    color: var(--top-menu-text);
    text-decoration: none;
    font-weight: 500;
}

.top-info-right {
    display: flex;
    gap: var(--spacing-md);
    flex-wrap: wrap;
    justify-content: flex-end;
    margin-left: auto;
}

.top-info-right a {
    color: var(--top-menu-text);
    text-decoration: none;
    font-weight: 500;
    text-transform: capitalize;
}

.top-info-right a:hover,
.top-info-left a:hover {
    text-decoration: underline;
}

.header {
    background-color: var(--color-bg);
    padding: var(--spacing-sm) 0;
    border-bottom: 1px solid var(--color-border);
    position: sticky;
    top: 0;
    z-index: 2600;
    box-shadow: var(--shadow-sm);
    transition: padding var(--transition-fast);
}

.nav-open .header {
    border-bottom-color: rgba(23, 68, 85, 0.55);
    box-shadow: 0 2px 0 rgba(23, 68, 85, 0.35);
}

.header-container {
    width: 90vw;
    margin: 0 auto;
    padding: 0 var(--spacing-md);
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    position: relative;
}

.logo {
    font-size: var(--font-size-xl);
    font-weight: 700;
    color: var(--color-primary);
    text-decoration: none;
    cursor: pointer;
}

.logo svg {
    fill: currentColor;
}

.header-container .logo {
    flex: 0 0 auto;
}

.nav {
    display: flex;
    gap: var(--spacing-lg);
    align-items: center;
    justify-content: center;
    flex: 1;
}

.header-cta {
    flex: 0 0 auto;
}

.header-cta .btn {
    white-space: nowrap;
}

.nav-link {
    display: inline-block;
    color: var(--color-text);
    text-decoration: none;
    font-weight: 500;
    transition: color var(--transition-fast);
    cursor: pointer;
    position: relative;
    padding-bottom: 4px;
}

.nav-link::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: var(--color-primary);
    transform: scaleX(0);
    transform-origin: center;
    transition: transform var(--transition-fast);
}

.nav-link:hover,
.nav-link:focus {
    color: #dd6b20;
}

.nav-link:hover::after,
.nav-link:focus::after {
    background-color: #dd6b20;
    transform: scaleX(1);
}

.nav-link.active {
    color: var(--color-primary);
}

.nav-link.active::after {
    background-color: var(--color-primary);
    transform: scaleX(1);
}

.nav-item {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.nav-submenu {
    display: none;
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    background-color: #fff;
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius-sm);
    box-shadow: var(--shadow-lg);
    min-width: 260px;
    padding: 10px 12px;
    gap: 4px;
    z-index: 1100;
    flex-direction: column;
    align-items: flex-start;
}

.nav-has-submenu > .nav-link {
    margin-right: 18px;
}

.nav-has-submenu.open > .nav-submenu,
.nav-has-submenu:focus-within > .nav-submenu {
    display: flex;
}

.nav-submenu .nav-submenu {
    position: absolute;
    top: 0;
    left: calc(100% + 16px);
    display: none;
    padding-left: 0;
    min-width: 240px;
    box-shadow: var(--shadow-lg);
    border: 1px solid var(--color-border);
}
.nav-submenu .nav-has-submenu:hover > .nav-submenu,
.nav-submenu .nav-has-submenu:focus-within > .nav-submenu {
    display: flex;
}
.nav-submenu .nav-has-submenu {
    position: relative;
}
.nav-submenu .nav-has-submenu::after {
    content: "";
    position: absolute;
    top: 0;
    left: 100%;
    width: 16px;
    height: 100%;
}

.nav-submenu .nav-sublink {
    display: inline-block;
    padding: 6px 0;
    margin-left: var(--spacing-md);
    margin-right: var(--spacing-md);
    color: var(--color-text);
    font-weight: 500;
    text-decoration: none;
    white-space: nowrap;
}
.nav-submenu .nav-parent {
    display: inline-block;
    padding: 6px 0;
    margin-left: var(--spacing-md);
    margin-right: var(--spacing-md);
}
.nav-submenu .nav-sublink:hover,
.nav-submenu .nav-sublink:focus {
    color: #dd6b20;
}

.nav-submenu .nav-sublink:hover::after,
.nav-submenu .nav-sublink:focus::after {
    background-color: #dd6b20;
}

.content-list {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-sm);
    padding: 0;
    margin: var(--spacing-sm) 0 var(--spacing-md);
    align-items: center;
}

.content-list li {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: var(--border-radius-sm);
    background: var(--color-bg-alt);
    border: 1px solid var(--color-border);
    white-space: nowrap;
}

.tags-center {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--spacing-sm);
    text-align: center;
}

.cta-adherirse {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--spacing-lg);
    align-items: center;
    padding: var(--spacing-lg);
    background: var(--color-bg-alt);
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius-lg);
}

.cta-adherirse__text {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.cta-adherirse__image {
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 0 23px 23px 0;
}

.cta-adherirse__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

@media (max-width: 768px) {
    .top-info-bar {
        display: none;
    }
}

.nav-submenu .nav-sublink:hover,
.nav-submenu .nav-sublink:focus {
    background-color: var(--color-bg-alt);
    color: #dd6b20;
}


.mobile-menu-btn {
    display: none;
    background: none;
    border: none;
    font-size: 24px;
    cursor: pointer;
    color: var(--color-primary);
    padding: 8px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
}

.mobile-menu-btn:hover,
.mobile-menu-btn:focus {
    background: #b7d8d5;
    border-radius: 8px;
}

/* Botones */
.btn {
    display: inline-block;
    padding: var(--spacing-sm) var(--spacing-lg);
    border-radius: var(--border-radius-md);
    font-weight: 600;
    text-decoration: none;
    transition: all var(--transition-normal);
    cursor: pointer;
    border: none;
    font-size: var(--font-size-base);
}

.btn-primary {
    background-color: var(--color-primary);
    color: white;
}

.btn-primary:hover {
    background-color: var(--color-primary-dark);
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}
.btn-primary-r {
    /*background-color: var(--color-primary-r);*/
    padding: 8px 16px;
    color: white;
    border-radius: 42px;
    border: 1px solid #FF4500;
    background: linear-gradient(180deg,#F44200 0%,#FF4500 100%);
}

.btn-primary-r:hover {
    background-color: var(--color-primary-dark-r);
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}

.btn-secondary {
    background-color: transparent;
    color: var(--color-primary);
    border: 2px solid var(--color-primary);
}

.btn-secondary:hover {
    background-color: var(--color-primary);
    color: #fff;
}

/* Hero outline CTA (blanco por defecto, primario al hover) */
.btn-hero-outline{
    display: inline-block;
    padding: 0.75rem 1.25rem;
    border: 1px solid #fff;
    color: #fff;
    text-decoration: none;
    border-radius: var(--border-radius-md);
    transition: background-color 0.3s ease, color 0.3s ease, transform 0.2s ease;
}
.btn-hero-outline:hover{
    background-color: #fff;
    color: var(--color-primary);
    transform: translateY(-2px);
}
.btn-hero-offset { margin-left: .75rem; }
@media (max-width: 640px) {
  .btn-hero-offset { margin-top: .75rem; margin-left: 0; }
}


/* Modal */
.modal-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.6);
    z-index: 2000;
    opacity: 0;
    transition: opacity var(--transition-normal);
}

.modal-overlay.active {
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 1;
    overflow-y: auto;
}

.modal {
    background-color: white;
    border-radius: var(--border-radius-lg);
    max-width: 600px;
    width: 90%;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: var(--shadow-xl);
    transform: scale(0.9);
    transition: transform var(--transition-normal);
}

/* ====== MOD IMG MODAL (override) ====== */
.modal.mod-img-modal {
    max-width: 1400px;
    width: 96%;
    max-height: 95vh;
}

@media (min-width: 1200px) {
    .modal.mod-img-modal {
        max-width: 1600px;
    }
}

.mod-img-modal .modal-body {
    padding: 0 var(--spacing-lg) var(--spacing-lg);
}

.mod-img-modal__img {
    max-height: 80vh;
    object-fit: contain;
}

.modal-overlay.active .modal {
    transform: scale(1);
}

.modal-header {
    padding: var(--spacing-lg);
    border-bottom: 1px solid var(--color-border);
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: var(--color-secondary);
}

.modal-title {
    font-size: var(--font-size-2xl);
    color: var(--color-primary);
    margin: 0;
}

.modal-close {
    background: none;
    border: none;
    font-size: 28px;
    cursor: pointer;
    color: var(--color-text-light);
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: all var(--transition-fast);
}

.modal-close:hover {
    background-color: rgba(0, 0, 0, 0.1);
    color: var(--color-text);
}

.modal-body {
    padding: var(--spacing-lg);
}

.modal-subtitle {
    color: var(--color-text-light);
    margin-bottom: var(--spacing-lg);
    font-size: var(--font-size-base);
}

/* Formulario */
.form-group {
    margin-bottom: var(--spacing-md);
}

.form-label {
    display: block;
    margin-bottom: var(--spacing-xs);
    font-weight: 600;
    color: var(--color-text);
}

.form-label.required::after {
    content: " *";
    color: var(--color-error);
}

.form-input,
.form-select,
.form-textarea {
    width: 100%;
    padding: var(--spacing-sm);
    border: 2px solid var(--color-border);
    border-radius: var(--border-radius-sm);
    font-size: var(--font-size-base);
    font-family: var(--font-primary);
    transition: border-color var(--transition-fast);
}

.form-input:focus,
.form-select:focus,
.form-textarea:focus {
    outline: none;
    border-color: var(--color-primary);
}

.form-textarea {
    resize: vertical;
    min-height: 100px;
}

.form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-md);
}

.g-recaptcha-slot {
    min-height: 78px;
}

.form-checkbox-group {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.checkbox-label {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    cursor: pointer;
    font-weight: normal;
}

.checkbox-label input[type="checkbox"] {
    width: 18px;
    height: 18px;
    cursor: pointer;
}

.form-radio-group {
    display: flex;
    gap: var(--spacing-lg);
}

.radio-label {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    cursor: pointer;
    font-weight: normal;
}

.radio-label input[type="radio"] {
    width: 18px;
    height: 18px;
    cursor: pointer;
}

.form-help {
    font-size: var(--font-size-sm);
    color: var(--color-text-light);
    margin-top: var(--spacing-xs);
}

.form-error {
    color: var(--color-error);
    font-size: var(--font-size-sm);
    margin-top: var(--spacing-xs);
    display: none;
}

.form-group.error .form-input,
.form-group.error .form-select,
.form-group.error .form-textarea {
    border-color: var(--color-error);
}

.form-group.error .form-error {
    display: block;
}

.form-success {
    background-color: #d4edda;
    color: #155724;
    padding: var(--spacing-md);
    border-radius: var(--border-radius-sm);
    margin-bottom: var(--spacing-md);
    display: none;
}

.form-success.show {
    display: block;
}

.form-error-banner {
    background-color: #fed7d7;
    color: #822727;
    padding: var(--spacing-md);
    border-radius: var(--border-radius-sm);
    margin-bottom: var(--spacing-md);
    display: none;
}

.form-error-banner.show {
    display: block;
}

.login-modal-footer {
    text-align: center;
    margin-top: var(--spacing-md);
    font-size: var(--font-size-sm);
}

.login-modal-footer a {
    color: var(--color-primary);
    font-weight: 600;
    text-decoration: none;
}

.login-modal-footer a:hover {
    text-decoration: underline;
}

.modal-full {
    width: 100%;
}

.modal-footer {
    padding: var(--spacing-lg);
    border-top: 1px solid var(--color-border);
    display: flex;
    justify-content: flex-end;
    gap: var(--spacing-sm);
}

/* Hero Section */
.hero {
    position: relative;
    min-height: 600px;
    background: linear-gradient(135deg, rgba(32, 79, 92, 0.55) 0%, rgba(25, 62, 72, 0.8) 100%), url('../img/empresas_libros.png') center center/cover no-repeat;
    display: flex;
    align-items: center;
    background: linear-gradient(135deg, var(--color-secondary) 0%, #ffffff 100%);
    overflow: hidden;
}

.hero-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--spacing-3xl) var(--spacing-md);
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-xl);
    align-items: center;
}

.hero-content h1 {
    font-size: var(--font-size-3xl);
    color: var(--color-primary);
    margin-bottom: var(--spacing-sm);
    line-height: 1.2;
}

.hero-subtitle {
    font-size: var(--font-size-xl);
    color: var(--color-text-light);
    margin-bottom: var(--spacing-md);
}

.hero-description {
    font-size: var(--font-size-lg);
    color: var(--color-text);
    margin-bottom: var(--spacing-lg);
}

.hero-image {
    width: 100%;
    height: 500px;
    border-radius: var(--border-radius-lg);
    object-fit: cover;
    box-shadow: var(--shadow-lg);
}

/* Contact Page Hero */
.contact-hero {
    background: linear-gradient(135deg, rgba(32, 79, 92, 0.65) 0%, rgba(25, 62, 72, 0.85) 100%), url('../img/contacto-yogadelarisa-eu.png') center/cover no-repeat;
    color: white;
    padding: var(--spacing-3xl) var(--spacing-md);
    text-align: center;
}

.contact-hero h1 {
    font-size: var(--font-size-3xl);
    margin-bottom: var(--spacing-sm);
}

.contact-hero p {
    font-size: var(--font-size-xl);
    opacity: 0.9;
}

/* Content Sections */
.section {
    padding: var(--spacing-3xl) var(--spacing-md);
}

.section-alt {
    background-color: var(--color-bg-alt);
}

.container {
    max-width: 1200px;
    margin: 0 auto;
}

.section-header {
@media (max-width: 991px) {
    .section-header {
        padding-left: 16px;
        padding-right: 16px;
    }
}
/*
    text-align: center;
    margin-bottom: var(--spacing-2xl);*/
}

.blog-section {
    @media (max-width: 991px) {
        .container {padding: 0px 25px;}
    }
}

.blog-section .container .blog-grid  {
    @media (max-width: 991px) {
        .blog-card {margin-top: 3rem;}
    }
}
.section-title {
    font-size: var(--font-size-2xl);
    color: var(--color-primary);
    margin-bottom: var(--spacing-sm);
}

.section-description {
    font-size: var(--font-size-lg);
    color: var(--color-text-light);
    max-width: 800px;
    margin: 0 auto;
    text-align: justify;
}

/* Location Cards */
.locations-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: var(--spacing-xl);
    margin-bottom: var(--spacing-2xl);
}

.location-card {
    background-color: white;
    padding: var(--spacing-xl);
    border-radius: var(--border-radius-lg);
    box-shadow: var(--shadow-md);
}

.location-title {
    font-size: var(--font-size-xl);
    color: var(--color-primary);
    margin-bottom: var(--spacing-md);
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
}

.location-icon {
    font-size: 28px;
}

.location-info {
    margin-bottom: var(--spacing-md);
}

.location-info h4 {
    font-size: var(--font-size-base);
    color: var(--color-text);
    margin-bottom: var(--spacing-xs);
    font-weight: 600;
}

.location-info p {
    color: var(--color-text-light);
    line-height: 1.8;
}

/* Info Boxes */
.info-boxes {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: var(--spacing-lg);
    margin-top: var(--spacing-2xl);
}

.info-box {
    background-color: var(--color-secondary);
    padding: var(--spacing-lg);
    border-radius: var(--border-radius-lg);
    border-left: 4px solid var(--color-primary);
}

.info-box h3 {
    color: var(--color-primary);
    margin-bottom: var(--spacing-sm);
    font-size: var(--font-size-lg);
}

.info-box p {
    color: var(--color-text);
    line-height: 1.8;
}

/* Contact Form Section */
.contact-form-section {
    max-width: 800px;
    margin: 0 auto;
}

.contact-form-card {
    background-color: white;
    padding: var(--spacing-xl);
    border-radius: var(--border-radius-lg);
    box-shadow: var(--shadow-lg);
}

/* FAQ Section */
.faq-container {
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 3rem;
}

.faq-item {
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
    background-color: var(--color-bg);
    margin-bottom: var(--spacing-md);
    border-radius: var(--border-radius-lg);
    overflow: visible;
    border: 1px solid var(--color-border);
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}

.faq-item:hover {
    border-color: var(--color-primary);
    box-shadow: var(--shadow-sm);
}

.faq-question {
    width: 100%;
    /*max-width: 900px;*/
    padding: var(--spacing-lg);
    background-color: transparent;
    border: none;
    text-align: left;
    font-size: var(--font-size-lg);
    font-weight: 600;
    color: var(--color-text);
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--spacing-md);
    transition: color var(--transition-fast), background-color var(--transition-fast);
}

.faq-question:hover {
    background-color: var(--color-bg-alt);
    color: var(--color-primary);
}

.faq-icon {
    font-size: var(--font-size-xl);
    transition: transform var(--transition-normal), color var(--transition-normal);
    color: var(--color-text);
}

.faq-item.active .faq-question {
    color: var(--color-primary);
    background-color: var(--color-bg-alt);
}

.faq-item.active {
    border-color: var(--color-primary);
    box-shadow: var(--shadow-sm);
}

.faq-item.active .faq-icon {
    transform: rotate(180deg);
    color: var(--color-primary);
}

.faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height var(--transition-normal);
}
.faq-answer-content p{
    margin: 0 0 1rem 0;
    line-height: 1.7;
  }
  
  .faq-answer-content p:last-child{
    margin-bottom: 0;
  }
  

/* Tabs */
.tab-trigger {
    cursor: pointer;
}

.tab-content {
    display: none;
}

.tab-content.active {
    display: block;
}

.faq-item.active .faq-answer {
    max-height: none; /* allow long answers to expand fully */
    overflow: visible;
}

.faq-answer-content {
    padding: 0 var(--spacing-lg) var(--spacing-lg) var(--spacing-lg);
    color: var(--color-text);
    line-height: 1.8;
}

/* Services Grid */
.services-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: var(--spacing-lg);
    margin-top: var(--spacing-xl);
}

.service-card {
    background-color: white;
    padding: var(--spacing-lg);
    border-radius: var(--border-radius-lg);
    box-shadow: var(--shadow-md);
    transition: transform var(--transition-normal);
}

.service-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-lg);
}

.service-icon {
    width: 60px;
    height: 60px;
    background-color: var(--color-secondary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: var(--spacing-md);
    font-size: var(--font-size-xl);
}

/* Usa el estilo de service-icon en las feature-card del intro */
.features-grid .feature-icon {
    width: 60px;
    height: 60px;
    background-color: var(--color-secondary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto var(--spacing-md);
    font-size: var(--font-size-xl);
    color: #fff;
}

.service-title {
    font-size: var(--font-size-xl);
    color: var(--color-primary);
    margin-bottom: var(--spacing-sm);
}

.service-description {
    color: var(--color-text-light);
    margin-bottom: var(--spacing-md);
}

.service-list {
    list-style: none;
    padding: 0;
}

.service-list li {
    padding: var(--spacing-xs) 0;
    color: var(--color-text);
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
}

.service-list li:before {
    content: "✓";
    color: var(--color-primary);
    font-weight: bold;
    font-size: var(--font-size-lg);
}

/* Features Section */
.section .container .features-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(300px, 1fr));

    gap: var(--spacing-xl);
    margin-top: var(--spacing-xl);
}

.section .container .features-grid .feature-card {
    text-align: center;
    padding: var(--spacing-lg);
    overflow: hidden;
    border-radius: var(--border-radius-lg);
    box-shadow: var(--shadow-md);
    background: #fff;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.section .container .features-grid .feature-card .feature-image {
    width: 100%;
    height: 250px;
    object-fit: cover;
    border-radius: var(--border-radius-lg);
    margin-bottom: var(--spacing-md);
    display: block;               /* elimina espacios en línea */
    transition: transform .4s ease;
}


.section .container .features-grid .feature-card:hover .feature-image {
    transform: scale(1.08);
}

.section .container .features-grid .feature-card:hover{
    transform: translateY(-6px);
    box-shadow: var(--shadow-lg);
}

.section .container .features-grid .feature-title {
    font-size: var(--font-size-xl);
    color: var(--color-primary);
    margin-bottom: var(--spacing-sm);
}
/* estudio Section */
.section .container .estudio-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(300px, 1fr));
    gap: var(--spacing-xl);
    margin-top: var(--spacing-xl);
    justify-content: center;
    align-items: center;
    justify-items: center;
}

.section .container .estudio-grid .estudio-card {
    text-align: center;
    padding: var(--spacing-lg);
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
}
.section .container .estudio-grid .estudio-card .estudio-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: var(--border-radius-lg);
    margin-bottom: var(--spacing-md);
    display: block;               /* elimina espacios en línea */
    transition: transform .4s ease;
}


.section .container .estudio-grid .estudio-card:hover .estudio-image {
    transform: scale(1.08);
}

.section .container h2 {
    text-align: center;
    /*font-size: var(--font-size-xl);*/
    color: var(--color-primary);
    margin-bottom: var(--spacing-sm);
}
.section .container p, .section .container li {
    text-align: justify;

}
/*.section .container p,
.section .container .enlaces a {
    text-align: justify;
    font-size: var(--font-size-xl);
    color: var(--color-primary);
    margin-bottom: var(--spacing-sm);
}*/

.section .container .enlaces {
    text-align: center;
    /*font-size: var(--font-size-xl);*/
    color: var(--color-primary);
    margin-bottom: var(--spacing-sm);
}

.section .container .enlaces:hover img {
    transform: scale(1.08);
    text-align: center;
    font-size: var(--font-size-xl);
    color: var(--color-primary);
    margin-bottom: var(--spacing-sm);
}

/* Ajustes de centrado para el enlace del PDF */
.section .container .enlaces {
    display: flex;
    justify-content: center;
    text-align: center;
}
.section .container .enlaces a {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-xs);
    text-decoration: none;
}
.section .container .enlaces img {
    display: block;
    margin: 0 auto;
    transition: transform .4s ease;

}
#services .container p {
    text-align: justify;
    
    color: var(--color-text-light);
}
#services .container .margen-inferior {
    margin-bottom: var(--spacing-xl); 
}
.newsletter-form {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
}

.newsletter-form input[type="email"],
.newsletter-form button {
    width: 100%;
}

.newsletter-form .g-recaptcha {
    margin: 0 auto;
    transform-origin: center;
}

/* Asegura columna estable por debajo de 1024px */
@media (max-width: 1023px) {
    .newsletter-form {
        flex-direction: column;
        align-items: stretch;
        flex-wrap: nowrap;
        gap: var(--spacing-md);
    }
    .newsletter-form input[type="email"],
    .newsletter-form button {
        width: 100%;
        flex: 0 0 auto;
    }
    .newsletter-form .g-recaptcha {
        margin: 0 auto;
        transform: scale(0.9);
        transform-origin: center;
    }
}

@media (min-width: 1024px) {
    .newsletter-form {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        gap: var(--spacing-md);
    }
    .newsletter-form input[type="email"] {
        flex: 1 1 260px;
    }
    .newsletter-form .g-recaptcha {
        margin: 0;
    }
    .newsletter-form button {
        flex: 0 0 auto;
        width: auto;
        align-self: stretch;
    }
}

/* Fijar columna y 100% ancho en mobile/tablet (override) */
@media (max-width: 1023px) {
  .newsletter-form {
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    gap: var(--spacing-md) !important;
  }
  .newsletter-form input[type="email"],
  .newsletter-form button {
    width: 100% !important;
    flex: 0 0 auto !important;
  }
  .newsletter-form .g-recaptcha {
    margin: 0 auto !important;
    display: block !important;
    transform: scale(0.9);
    transform-origin: center;
  }
}

/* Partners Section */
.partners {
    background-color: var(--color-bg-alt);
    padding: var(--spacing-2xl) var(--spacing-md);
    text-align: center;
}

.partners-title {
    font-size: var(--font-size-lg);
    color: var(--color-text-light);
    margin-bottom: var(--spacing-lg);
}

.partners-grid {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--spacing-xl);
    flex-wrap: wrap;
}
.main-content {
    max-width: 1400px;
    margin: 0 auto;
    padding: 2rem;
    h2 {padding-top: 2rem;}
    li {margin-left: 1rem; text-align: justify;}
    p {text-align: justify;}
}
#homePage .section .container li {
    margin-top:1rem;
}
.ulqueesyr {
    list-style-position: inside;
    padding:1rem; 
    margin-left: 1rem;
}
@media (max-width: 900px) {
    .section .container .estudio-grid {
        grid-template-columns: repeat(2, minmax(400px, 1fr));
        gap: var(--spacing-lg);
    }
    .section .container .estudio-grid, .section .container .features-grid {
        grid-template-columns: repeat(2, minmax(400px, 1fr));
        gap: var(--spacing-lg);
    }
}
@media (max-width: 720px) {
    .section .container .estudio-grid, .section .container .features-grid {
        grid-template-columns: 1fr;
        gap: var(--spacing-md);
    }
    #homePage .section .container p {
        max-width: 90%;
        margin: 0 auto;
        padding-top: 1rem;
    }
    .section-description {

        max-width: 90%;
        margin: 0 auto;
    }

}

/* PolÃ­tica cookies tabla */
.policy-table-wrapper {
  width: 100%;
  overflow-x: auto;
  margin: 16px 0;
  border-radius: 12px;
  border: 1px solid #00384d;
  max-width: 100%;
}
.policy-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 640px;
  background: var(--color-border); /*#567884; */
}
.policy-table thead th { color: whitesmoke !important; background: #345f6e;}
.policy-table th,
.policy-table td {
  padding: 10px 12px;
  border: 1px solid #00384d;
  text-align: left;
  color: #567884;
}
.policy-table thead tr {
  background: var(--color-border);
}
.policy-table tbody tr:nth-child(even) { background: var(--color-bg-alt); }
@media (max-width: 640px) {
  .policy-table { min-width: 520px; }
}
/* Footer */
/*
.footer {
    background-color: var(--bg-pie);
    color: white;
    padding: var(--spacing-xl) var(--spacing-md);
    text-align: center;
}*/

  /******** footer ***************************************************************/
  /*.footer {*/
    /*background-color: var(--clr-primary-dark); *//*var(--color-primary-dark);
    color: white;*/
    /*padding: var(--spacing-xl) var(--spacing-md);
    text-align: center;*/
/*}*/
    .footer {
        color: #fff;
        text-align: center;

    }
    .footer .site-footer {
    /*--overlap-size: 400px;*/
    color: #fff;
    background-image: linear-gradient( to top, var(--clr-primary-dark) 90%, white 10%);

    /*padding: var(--spacing-xl) var(--spacing-md);*/
  }
  .footer .site-footer .site-footer__top {
    
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

  }
  .footer .site-footer .site-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .footer .site-footer .site-footer__top .site-wrapper {
    /*background-color: var(--clr-primary-base);*/
    background: linear-gradient(180deg, var(--clr-primary-dark) 0%, var(--text-pie) 100%);

    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 6rem 0 6rem;
    max-width: 1400px;
    padding: 3rem 5rem;
    border-radius: 20px;
  }
  .footer .site-footer .site-footer__top .site-wrapper .form-suscrib, .buttom-form-suscrib {
    padding: 2rem 1rem;
    border-radius: 20px;

  }
  .footer .site-footer .site-footer__top .site-wrapper .form-suscrib {
    width: 300px;

  }

  .footer .site-footer .site-wrapper > h2,p {
    margin-top: var(--spacing-sm);
  }
  .footer .site-footer .site-wrapper > p + form {
    margin-top: var(--spacing-sm);
  }

  .footer .site-footer .site-footer__top .site-wrapper > form {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 3rem;


  }
  .footer .site-footer .site-footer__bottom {
    padding-block: 4rem;
    background-color: var(--clr-primary-dark);
  }
  .footer .site-footer__bajo {
    padding-block: 4rem;
    background-color: var(--clr-primary-dark);
  }
  .site-footer .site-footer__bottom {
    padding: 0;
    margin: 0;
  }
  .footer .site-footer .site-footer__bottom p {
    color: #567884;
  }
  /*
  .footer .site-footer .site-footer__bottom hr{
    color: #567884;
  }*/

  .footer .site-footer .site-footer__bottom #grid_tres .container #grid_cuatro a {
    color: #567884;
    text-decoration: none;
  }
  .st0 {
    fill:var(--text-pie);
  }
  .site-footer__bottom > div:first-child {
    width: 100%;
  }
  .site-footer__bottom svg {
    width: 100%;
    height: auto;
    margin: 0 auto 2rem;
    display: block;
  }
  /* Footer responsive grids */
  #grid_tres,
  .grid-responsive-2 {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--spacing-lg);
    align-items: start;
  }
  #grid_cuatro,
  .grid-responsive-3 {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--spacing-md);
    align-items: start;
  }
  .maxwidth1400 {
    max-width: 1400px;
    margin: 0 auto;
  }
  @media (min-width: 768px) {
    #grid_tres,
    .grid-responsive-2 {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    #grid_cuatro,
    .grid-responsive-3 {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }
  /* ****************** fin footer ************************************************/

/* Responsive */
@media (max-width: 768px) {
    .top-info-inner {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }
    .top-info-groups {
        flex-direction: column;
        align-items: flex-start;
        width: 100%;
        gap: 4px;
    }
    .top-info-right {
        justify-content: flex-start;
        gap: 12px;
    }

    .hero-container {
        grid-template-columns: 1fr;
        padding: var(--spacing-xl) var(--spacing-md);
    }

    /* Ocultar CTA rojo en móvil */
    .header-cta {
        display: none !important;
    }
    .header-container {
        justify-content: space-between;
    }
    .mobile-menu-btn {
        display: block;
        margin-left: auto;
        padding: 8px;
        position: relative;
        z-index: 2701;
    }

    .header-container .logo {
        position: relative;
        z-index: 2701;
    }
    
    .hero-content h1 {
        font-size: var(--font-size-2xl);
    }
    
    .nav {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        height: 100vh;
        background-color: white;
        flex-direction: column;
        padding: calc(var(--spacing-md) + 64px) var(--spacing-md) var(--spacing-lg);
        box-shadow: var(--shadow-lg);
        justify-content: flex-start;
        align-items: flex-start;
        text-align: left;
        flex: initial;
        overflow-y: auto;
        z-index: 2100;
    }

    .nav::before {
        content: '';
        position: absolute;
        left: 0;
        right: 0;
        top: 64px;
        height: 1px;
        background: rgba(23, 68, 85, 0.35);
    }
    
    .nav.active {
        display: flex;
    }

    .nav-item {
        width: auto;
        align-self: flex-start;
    }

    .nav-submenu {
        position: static;
        display: none;
        background: transparent;
        border: none;
        box-shadow: none;
        padding: 4px 0 0;
        gap: 0;
        align-items: flex-start;
    }

    .nav-has-submenu.open > .nav-submenu {
        display: flex;
    }

    .nav-submenu .nav-sublink {
        margin-left: var(--spacing-lg);
    }

    .nav-submenu .nav-submenu {
        position: static;
        min-width: 0;
        box-shadow: none;
        border: none;
        padding-left: 0;
    }

    .nav-submenu .nav-submenu .nav-sublink,
    .nav-submenu .nav-submenu .nav-parent {
        margin-left: calc(var(--spacing-lg) * 2);
    }

    .cta-adherirse {
        grid-template-columns: 1fr;
    }

    .cta-adherirse__image {
        border-radius: 23px;
    }
    
    .mobile-menu-btn {
        display: block;
        padding: 8px;
    }
    .header-cta {
        margin-left: auto;
    }
    
    .features-grid {
        grid-template-columns: 1fr;
    }
    .section .container .features-grid {
        grid-template-columns: 1fr;
    }
    
    .services-grid {
        grid-template-columns: 1fr;
    }
    .form-row {
        grid-template-columns: 1fr;
    }
    
    .form-radio-group {
        flex-direction: column;
        gap: var(--spacing-sm);
    }
    
    .locations-grid {
        grid-template-columns: 1fr;
    }
    
    .info-boxes {
        grid-template-columns: 1fr;
    }
    .footer .site-footer .site-footer__top .site-wrapper {
        padding:.5rem .5rem;
    }
}
/*  <weight>: Use a value from 100 to 900
    <uniquifier>: Use a unique and descriptive class name */

.noto-serif-pie {
  font-family: "Noto Serif", serif;
  font-optical-sizing: auto;
  font-weight: 200;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;
}
.title {
    font-family: 'Arial Black', sans-serif;
    font-weight: bold;
    fill: currentColor;
    color:var(--text-pie);
    }
.main {
    font-size: 72px;
    letter-spacing: 10%;
    

    }
.espacios {
        font-size: 20px;
        letter-spacing: 60px;
        color:var(--bg-pie);
        
    
        }
.sub {
    font-size: 24px;
    letter-spacing: 60px;
    

    }
    /* NUEVO SVG */
#Capa_1 {
        .cls-1 {
            font-size: 364.76px;
        }

        .cls-1, .cls-2 {
            font-family: PerpetuaTitlingMT-Light, 'Perpetua Titling MT';
            font-weight: 300;
            fill: currentColor;
            color:#567884;
        }

        .cls-3 {
            letter-spacing: -.06em;

        }

        .cls-4 {
            letter-spacing: .98em;

        }

        .cls-5 {
            letter-spacing: 1em;

        }

        .cls-6 {
            letter-spacing: 1em;

        }

        .cls-2 {
            font-size: 100px;

        }

        .cls-7 {
            letter-spacing: 0em;

        }

        .cls-8 {
            letter-spacing: .02em;

        }
    }
.logo svg {
        display: block;
        width: clamp(180px, 20vw, 320px);
        height: auto;
    }
#Capa_2 .cls-1 {
        font-size: 364.76px;
    }
    
#Capa_2 .cls-1,
#Capa_2 .cls-2 {
        font-family: PerpetuaTitlingMT-Light, 'Perpetua Titling MT';
        font-weight: 300;
        fill: currentColor;
        color: #567884;
    }
    
#Capa_2 .cls-2 {
        font-size: 100px;
    }
    
#Capa_2 .cls-3 { letter-spacing: -.06em; }
#Capa_2 .cls-4 { letter-spacing: .98em; }
#Capa_2 .cls-5,
#Capa_2 .cls-6 { letter-spacing: 1em; }
#Capa_2 .cls-7 { letter-spacing: 0; }
#Capa_2 .cls-8 { letter-spacing: .02em; }



    /*
    #Capa_2 {
        .cls-1 {
            font-size: 364.76px;
        }

        .cls-1, .cls-2 {
            font-family: PerpetuaTitlingMT-Light, 'Perpetua Titling MT';
            font-weight: 300;
            /*fill: currentColor;* /
            color:#567884;
        }

        .cls-3 {
            letter-spacing: -.06em;

        }

        .cls-4 {
            letter-spacing: .98em;

        }

        .cls-5 {
            letter-spacing: 1em;

        }

        .cls-6 {
            letter-spacing: 1em;

        }

        .cls-2 {
            font-size: 100px;

        }

        .cls-7 {
            letter-spacing: 0em;

        }

        .cls-8 {
            letter-spacing: .02em;

        }
    }
        */
    .header .header-container .logo a {
        color:#567884;

    }
    .site-footer__bottom hr {
        border: 0;
        border-top: 1px solid #567884;
        margin: 1rem 0;
      }
      

    .crear-espacio-pad-entre-6 {
        padding: var(--spacing-6xl) 0px;
    }
    .crear-espacio-pad-entre-4 {
        padding: var(--spacing-4xl) 0px;
    }
    .crear-espacio-pad-entre-3 {
        padding: var(--spacing-3xl) 0px;
    }
    .crear-espacio-pad-entre-1 {
        padding: var(--spacing-xl) 0px;
    }
    .crear-espacio-pad-entre-01 {
      padding: var(--spacing-xs) 0px;
  }
    .crear-espacio-pad-entre-2 {
        padding: var(--spacing-2xl) 0px;
    }
    .crear-espacio-entre-2 {
        margin: var(--spacing-2xl) 0px;
    }
    .crear-espacio-entre-6 {
        margin: var(--spacing-6xl) 0px;
    }
    .crear-espacio-entre-3 {
        margin: var(--spacing-3xl) 0px;
    }
    .section-cabecera
    {
        padding-left: 1rem;
        padding-right: 1rem;

    }
    #homePage .section .container & .faq-container {
        margin-top:3rem;
    }

    #homePage .section .container h2 {
        text-align: center;
        padding-bottom: 3rem;
     }
    #homePage .section .container .section-cabecera h2 {
       text-align: left;
    }
    #homePage .section .container .section-cabecera p {
        text-align: justify;
     }
     #marco .container .faq-container .section .container {
        padding-top: 3rem;
     }
     @media (max-width: 768px) {
        .section-cabecera
        {
            padding-left: .5rem;
            padding-right: .5rem;
    
        }
        #contactPage .section .container .faq-container .faq-item,
        #contactPage .section .container .locations-grid,
        #contactPage .section .container .info-boxes,
        #contactPage .section .container .contact-form-section {
          margin-left: 0.75rem;
          margin-right: 0.75rem;

        }
        #homePage .section .container .feature-card,
        #homePage .section .container .puertas-grid .puerta-card {
          margin-left: 0.75rem;
          margin-right: 0.75rem;

        }
        #queesyogadelarisaPage .section .container .faq-container .faq-item {
          margin-left: 0.75rem;
          margin-right: 0.75rem;
        }
        #talleresPage .section .course-facts__grid,
        #talleresPage .section .faq-container .faq-item,
        #talleresPage .section .container .cta-final  {
          margin-left: 0.75rem;
          margin-right: 0.75rem;
        }
        #retirosPage .section .course-facts__grid,
        #retirosPage .section .faq-container .faq-item,
        #retirosPage .section .container .cta-final  {
          margin-left: 0.75rem;
          margin-right: 0.75rem;
        }
        
        #entrenamientoUnoaUnoPage .section .course-facts__grid,
        #entrenamientoUnoaUnoPage .section .faq-container .faq-item,
        #entrenamientoUnoaUnoPage .section .container .cta-final  {
          margin-left: 0.75rem;
          margin-right: 0.75rem;
        }
        
        #clubsRisaPage .section .course-facts__grid,
        #clubsRisaPage .section .container .clubs-filters,
        #clubsRisaPage .section .container .clubs-grid,
        #clubsRisaPage .section .faq-container .faq-item,
        #clubsRisaPage .section .container .cta-final  {
          margin-left: 0.75rem;
          margin-right: 0.75rem;
        }
        #congresosPage  .section .container .faq-container .faq-item {
          margin-left: 0.75rem;
          margin-right: 0.75rem;
        }
        #basicoYogaRisaPage .section .container .faq-container .faq-item,
        #basicoYogaRisaPage .section .container .cta-final,
        #basicoYogaRisaPage .section .container .course-facts .course-facts__grid .course-fact,
        #basicoYogaRisaPage .section .container .info-boxes {
          margin-left: 0.75rem;
          margin-right: 0.75rem;
        }
        #monitorYogaRisaPage .section .container .faq-container .faq-item,
        #monitorYogaRisaPage .section .container .cta-final,
        #monitorYogaRisaPage .section .container .course-facts .course-facts__grid .course-fact,
        #monitorYogaRisaPage .section .container .info-boxes,
        #monitorYogaRisaPage .section .container .lista-de-contenidos {
          margin-left: 0.75rem;
          margin-right: 0.75rem;
        }
        #profesorYogaRisaPage .section .faq-container .faq-item,
        #profesorYogaRisaPage .section .container .cta-final,
        #profesorYogaRisaPage .section .container .course-facts .course-facts__grid .course-fact,
        #profesorYogaRisaPage .section .container .info-boxes,
        #profesorYogaRisaPage .section .container .lista-de-contenidos {
          margin-left: 0.75rem;
          margin-right: 0.75rem;
        }
        #avisolegalPage  .section {
          margin-left: 0.75rem;
          margin-right: 0.75rem;
        }
        #avisolegalPage  .section .content-wrapper .content-text .content-list li {
          margin-left: 0.75rem;
          margin-right: 0.75rem;
          display: block;
          white-space: normal;
          overflow-wrap:anywhere;
          word-break: break-word;
        }
        #avisolegalPage .section .content-wrapper .content-text .content-list a {
          overflow-wrap: anywhere;
        }
        #politicaprivacidadPage .section {
          margin-left: 0.75rem;
          margin-right: 0.75rem;
        }
        #politicaprivacidadPage  .section .content-wrapper .content-text .content-list li {
          margin-left: 0.75rem;
          margin-right: 0.75rem;
          display: block;
          white-space: normal;
          overflow-wrap:anywhere;
          word-break: break-word;
        }
        #politicacookiesPage .section {
          margin-left: 0.75rem;
          margin-right: 0.75rem;
        }
        #politicacookiesPage  .section .content-wrapper .content-text .content-list li {
          margin-left: 0.75rem;
          margin-right: 0.75rem;
          display: block;
          white-space: normal;
          overflow-wrap:anywhere;
          word-break: break-word;
        }
        
        
     }
.readable,
.prose,
.text-content {
  max-width: 78ch;
  margin-left: auto;
  margin-right: auto;
  line-height: 1.6;
}
/* =========================
   TIPOGRAFÍA GLOBAL (CLAMP)
   Pegar al final del CSS
   ========================= */

/* Base */
html { font-size: 16px; }

body{
  font-family: var(--font-primary);
  font-size: clamp(1rem, 0.25vw + 0.95rem, 1.125rem); /* 16px -> 18px */
  line-height: 1.65;
}

/* Títulos: IBM Plex Serif */
h1, h2, h3, h4, h5{
  font-family: var(--font-primary-titulos);
  color: var(--color-primary);
  font-weight: 300;
  letter-spacing: -0.01em;
  margin: 0 0 0.6em;
}

/* Escala de títulos */
h1{
  padding: 3rem 0px;
  font-weight: 400;

  font-size: clamp(2.1rem, 4.2vw, 3.2rem); /* 33.6px -> 51.2px */
  line-height: 1.10;
}

h2{
  padding: 2.25rem 0px;
  font-size: clamp(1.7rem, 3vw, 2.3rem);   /* 27.2px -> 36.8px */
  line-height: 1.15;
}

h3{
  padding: 1.75rem 0px;
  font-size: clamp(1.35rem, 2.1vw, 1.8rem); /* 21.6px -> 28.8px */
  line-height: 1.20;
}

h4{
  padding: 1.5rem 0px;
  font-size: clamp(1.15rem, 1.4vw, 1.4rem); /* 18.4px -> 22.4px */
  line-height: 1.25;
}

h5{
  padding: 1.25rem;
  font-size: clamp(1.0rem, 1.1vw, 1.2rem);  /* 16px -> 19.2px */
  line-height: 1.30;
}

/* Cuerpo: párrafos y listas */
p, li{
  font-family: var(--font-primary);
  font-size: inherit;      /* hereda del body */
  line-height: 1.65;
}
ul, ol {
    list-style-position: outside;
    margin-left: 1rem;
    
}

/* Enlaces: mismo tamaño que el texto */
a{
  font-family: var(--font-primary);
  font-size: inherit;
  line-height: inherit;
}

/* Textos pequeños */
small, .small, .muted{
  font-size: clamp(0.875rem, 0.2vw + 0.85rem, 0.95rem); /* 14px -> 15.2px */
  line-height: 1.55;
}

/* Formularios (UX consistente) */
label{
  font-family: var(--font-primary);
  font-size: clamp(0.95rem, 0.2vw + 0.9rem, 1rem); /* ~15.2 -> 16 */
  line-height: 1.35;
  font-weight: 600;
}

input, textarea, select, button{
  font-family: var(--font-primary);
  font-size: clamp(1rem, 0.2vw + 0.95rem, 1.0625rem); /* 16 -> 17 */
  line-height: 1.35;
}

textarea{ line-height: 1.5; }

/* =========================
   LECTURA CÓMODA (78ch)
   ========================= */
.readable, .prose, .text-content{
  max-width: 78ch;
  margin-left: auto;
  margin-right: auto;
}

/* Importante: el line-height de lectura aplícalo a texto, no al wrapper */
.readable p, .readable li,
.prose p, .prose li,
.text-content p, .text-content li{
  line-height: 1.7;
}

/* Móvil: no limites ancho, solo padding */
@media (max-width: 768px){
  .readable, .prose, .text-content{
    max-width: 100%;
    padding-left: 1rem;
    padding-right: 1rem;
  }
}
@media (max-width: 768px){
    .readable p,
    .readable li{
      line-height: 1.6;
    }
  }
  

/* Ritmo vertical dentro del wrapper de lectura */
.readable > * + *{
    margin-top: 1rem;
  }
  
  /* Más aire antes de H2/H3 dentro del texto */
  .readable h2{
    margin-top: 2.2rem;
    margin-bottom: .75rem;
  }
  
  .readable h3{
    margin-top: 1.6rem;
    margin-bottom: .5rem;
  }
  .readable{
    max-width: 78ch;
    margin-inline: auto;
  }
  
  /* Texto largo: más cómodo */
  .readable p,
  .readable li{
    line-height: 1.7;
    font-size: clamp(1rem, 0.25vw + 0.95rem, 1.125rem); /* 16 -> 18px */
  }
  .readable .divider{
    height: 1px;
    background: var(--color-border);
    margin: 2rem 0;
  }
  
.miMain{
    width:100%

}
.ancho-total {
    width:100%
}
.max-ancho-1400 {
    max-width: 1400px;
    margin-left: auto;
    margin-right: auto;

}
.max-ancho-720 {
    max-width: 720px;
}
.hero-empresas {
    background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
    color: white;
    padding: var(--spacing-3xl) var(--spacing-md);
    text-align: center;
    h1, h2 {color:var(--color-secondary);}
}
.hero-empresas-bg{
    background: linear-gradient(135deg, rgba(32, 79, 92, 0.6) 0%, rgba(25, 62, 72, 0.85) 100%), url('../img/empresas_dichosas.png') center center/cover no-repeat;
}
.hero-index {
    background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
    color: white;
    padding: var(--spacing-3xl) var(--spacing-md);
    text-align: center;
    h1, h2 {color:var(--color-secondary);}
}
.hero-index-bg{
    background: linear-gradient(135deg, rgba(32, 79, 92, 0.6) 0%, rgba(25, 62, 72, 0.85) 100%), url('../img/empresas_libros.png') center center/cover no-repeat;
}
.hero-entrena-1-a-1{
    background: linear-gradient(135deg, rgba(32, 79, 92, 0.6) 0%, rgba(25, 62, 72, 0.85) 100%), url('../img/coaching-one-to-one-w.png') center center/cover no-repeat;
}
.hero-clubs{
    background: linear-gradient(135deg, rgba(32, 79, 92, 0.6) 0%, rgba(25, 62, 72, 0.85) 100%), url('../img/clubs-de-la-risa-w.png') center center/cover no-repeat;
}
.hero-basico{
    background: linear-gradient(135deg, rgba(32, 79, 92, 0.6) 0%, rgba(25, 62, 72, 0.85) 100%), url('../img/formacion-yoga-de-la-risa-h.png') center center/cover no-repeat;
}
.hero-monitor{
    background: linear-gradient(135deg, rgba(32, 79, 92, 0.6) 0%, rgba(25, 62, 72, 0.85) 100%), url('../img/yr-monitores-w.png') center center/cover no-repeat;
}
.hero-profesor{
    background: linear-gradient(135deg, rgba(32, 79, 92, 0.6) 0%, rgba(25, 62, 72, 0.85) 100%), url('../img/yr-profesores-w.png') center center/cover no-repeat;
}
.hero-talleres{
    background: linear-gradient(135deg, rgba(32, 79, 92, 0.6) 0%, rgba(25, 62, 72, 0.85) 100%), url('../img/taller-w.png') center center/cover no-repeat;
}
.hero-retiro{
    background: linear-gradient(135deg, rgba(32, 79, 92, 0.6) 0%, rgba(25, 62, 72, 0.85) 100%), url('../img/retiros-w.png') center center/cover no-repeat;
}
.hero-congreso{
    background: linear-gradient(135deg, rgba(32, 79, 92, 0.6) 0%, rgba(25, 62, 72, 0.85) 100%), url('../img/congresos-w.png') center center/cover no-repeat;
}
.hero-profesionales{
    background: linear-gradient(135deg, rgba(32, 79, 92, 0.6) 0%, rgba(25, 62, 72, 0.85) 100%), url('../img/profesionales-yoga-de-la-risa.png') center center/cover no-repeat;
}
.cuerpo {
    width: 90%;
    margin: 0px auto;
    padding: 1rem;
    max-width: 1400px;
}

#bienestar-corporativo-contacto .modal-footer{
    background: transparent;
  }

/* Aire lateral en móvil para Bienestar corporativo */
@media (max-width: 768px){
  #bienestarCorporativoPage .readable,
  #bienestarCorporativoPage .contact-form-card,
  #bienestarCorporativoPage .max-ancho-1400,
  #bienestarCorporativoPage .cuerpo{
    padding-inline: 1rem;
  }
}

/* Fuerza ocultar el botón de menú en escritorio */
@media (min-width: 1025px){
  .mobile-menu-btn{
    display: none !important;
  }
}

/* Centrar y hacer responsive el formulario corporativo */
#bienestarCorporativoPage .contact-form-section{
  max-width: 900px;
  width: 100%;
  margin: 0 auto;
}
#bienestarCorporativoPage .contact-form-card{
  width: 100%;
}
@media (max-width: 1024px){
  #bienestarCorporativoPage .contact-form-card{
    padding: var(--spacing-lg);
  }
}
/* Primer párrafo tras el hero */
.intro-block{
    padding-top: clamp(1.25rem, 3vw, 2rem);
    padding-bottom: clamp(1.25rem, 3vw, 2rem);
  }
  
  .intro-lead{
    margin: 0;
    font-size: clamp(1.05rem, 0.9vw + 0.9rem, 1.2rem);
    line-height: 1.75;
    color: var(--color-text);
  }
  
  /* Si quieres un poco más de “presencia” sin parecer marketing */
  @media (min-width: 992px){
    .intro-lead{
      font-size: clamp(1.1rem, 0.7vw + 1rem, 1.25rem);
    }
  }

  /* Intro Yoga de la Risa */
.intro-block {
    margin-bottom: var(--spacing-xl);
  }
  
  .intro-lead {
    margin: 0;
    font-size: clamp(1.05rem, 0.9vw + 0.9rem, 1.2rem);
    line-height: 1.75;
    color: var(--color-text);
  }
  
  /* Bloque de 3 ideas clave */
  .intro-features {
    margin-top: var(--spacing-xl);
  }
  
  .intro-features .feature-card {
    padding: var(--spacing-lg);
  }
  
  .feature-icon {
    font-size: 2rem;
    margin-bottom: var(--spacing-sm);
    color: var(--color-primary);
  }
  
  /* Ajustes responsive */
  @media (max-width: 768px) {
    .intro-features {
      margin-top: var(--spacing-lg);
    }
  }
  
/* Beneficios en dos capas */
#beneficios-yoga-risa .benefits-block{
    margin-top: var(--spacing-xl);
  }
  
  #beneficios-yoga-risa .benefits-block h3{
    font-size: clamp(1.2rem, 1vw + 1rem, 1.5rem);
    margin-bottom: var(--spacing-sm);
    color: var(--color-primary);
  }
  
  #beneficios-yoga-risa .benefits-block p{
    margin: 0 0 1rem 0;
    line-height: 1.75;
  }
  
  #beneficios-yoga-risa .benefits-block p:last-child{
    margin-bottom: 0;
  }
  
  /* Puertas Personas / Empresas */
  .audience-doors{
    margin-top: var(--spacing-2xl);
    padding: var(--spacing-lg);
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius-lg);
    background: var(--color-bg);
  }
  
  .audience-doors__lead{
    margin: 0 0 var(--spacing-sm) 0;
    font-weight: 700;
  }
  
  .audience-doors__actions{
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-sm);
    align-items: center;
  }
  
  .audience-doors__btn{
    padding: 10px 14px;
    border-radius: 999px;
  }
  
  .audience-doors__note{
    margin: var(--spacing-sm) 0 0 0;
    color: var(--color-text-light);
    font-size: 0.95rem;
  }
  .section .container .formats-note {
    padding-top: 3rem;
    text-align: center;
  }
  
  @media (max-width: 768px){
    .audience-doors{
      padding: var(--spacing-md);
    }
    .audience-doors__actions{
      flex-direction: column;
      align-items: stretch;
    }
    .audience-doors__btn{
      width: 100%;
      text-align: center;
    }
  }
  
/* Puertas Personas / Empresas */

.puertas-orientacion {
    padding-top: var(--spacing-2xl);
    padding-bottom: var(--spacing-2xl);
  }
  
  .puertas-inner {
    max-width: 1400px;
    margin: 0 auto;
    text-align: center;
  }
  
  .puertas-title {
    font-family: var(--font-primary-titulos);
    font-size: clamp(1.6rem, 2.5vw, 2rem);
    color: var(--color-primary);
    margin-bottom: var(--spacing-sm);
  }
  .puertas-title-h3 {
    font-family: var(--font-primary-texto);
    font-size: clamp(1.1rem, 1.8vw, 1.3rem);
    font-style: italic;
    font-weight: 400;
    color: var(--color-primary-soft);
    margin-bottom: var(--spacing-md);
    line-height: 1.5;
  }
  .puertas-intro {
    color: var(--color-text-light);
    margin-bottom: var(--spacing-lg);
    text-align: center;
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
  }
  
  .puertas-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--spacing-lg);
    margin-top: var(--spacing-lg);
  }
  
  .puerta-card {
    padding: var(--spacing-lg);
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius-lg);
    background-color: var(--color-bg);
    text-align: left;
    display: flex;
    flex-direction: column;
    height: 100%;
  }
  
  .puerta-card h3 {
    font-family: var(--font-primary-titulos);
    /*font-size: 1.1rem;*/
    color: var(--color-primary);
    margin-bottom: var(--spacing-xs);
    /*font-family: var(--font-primary-texto);*/
    font-size: clamp(1.1rem, 1.8vw, 1.3rem);
    font-style: italic;
    font-weight: 400;
    /*color: var(--color-primary-soft);*/
    /*margin-bottom: var(--spacing-md);*/
    line-height: 1.5;
  }
  .puerta-card h4 {
    font-family: var(--font-primary-texto);
    font-size: clamp(0.95rem, 1.5vw, 1.05rem);
    font-style: normal;
    font-weight: 500;
    color: var(--color-primary-soft);
    margin-bottom: var(--spacing-xs);
    line-height: 1.4;
  }
  
  
  .puerta-card p {
    font-size: 0.95rem;
    color: var(--color-text);
    margin-bottom: var(--spacing-sm);
  }
  
  .puerta-link {
    font-weight: 600;
    color: var(--color-primary);
    text-decoration: none;
    margin-top: auto;
    display: inline-block;
  }
  
  .puerta-link:hover {
    text-decoration: underline;
  }
  
  /* Responsive */
  @media (max-width: 768px) {
    .puertas-grid {
      grid-template-columns: 1fr;
    }
  }
  /* Página: Qué es el Yoga de la Risa® */

#queEsYogaRisaPage .quees-title {
    font-family: var(--font-primary-titulos);
    font-size: clamp(2rem, 3.2vw, 2.8rem);
    line-height: 1.15;
    margin-bottom: var(--spacing-sm);
    text-align: left;
  }
  
  #queEsYogaRisaPage .quees-lead {
    max-width: 78ch;
    margin-left: 0;
    margin-right: 0;
    text-align: justify;
  }
  
  #queEsYogaRisaPage .quees-body h2 {
    font-family: var(--font-primary-titulos);
    font-size: clamp(1.25rem, 2vw, 1.6rem);
    color: var(--color-primary);
    margin-top: var(--spacing-xl);
    margin-bottom: var(--spacing-sm);
    text-align: left;
  }
  
  #queEsYogaRisaPage .quees-body p {
    margin-top: var(--spacing-sm);
    text-align: justify;
  }
  
  #queEsYogaRisaPage .quees-cta-row {
    display: flex;
    gap: var(--spacing-sm);
    flex-wrap: wrap;
    justify-content: flex-start;
    margin-top: var(--spacing-xl);
    margin-bottom: var(--spacing-lg);
  }
  
  #queEsYogaRisaPage .quees-note {
    margin-top: var(--spacing-lg);
    padding: var(--spacing-md);
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius-lg);
    background: var(--color-bg-alt);
    color: var(--color-text);
    font-size: 0.95rem;
    line-height: 1.7;
  }
  
  /* Ajuste móvil: ya tienes readable al 100%, esto solo asegura respiración */
  @media (max-width: 768px) {
    #queEsYogaRisaPage .quees-cta-row {
      flex-direction: column;
      align-items: stretch;
    }
  }
  
/*********** que es yoga de la risa **********************************/

/* HERO - Qué es el Yoga de la Risa® */

.hero-quees-bg {
    position: relative;
    background-image:
      linear-gradient(
        135deg,
        rgba(23, 68, 85, 0.78) 0%,
        rgba(94, 101, 58, 0.65) 55%,
        rgba(23, 68, 85, 0.78) 100%
      ),
      url("../img/que-es-yoga-de-la-risa-r1.png");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 520px;
    display: flex;
    align-items: center;
  }
  
  .hero-quees-bg h1 {
    color: #fff;
    font-family: var(--font-primary-titulos);
    line-height: 1.1;
    font-size: clamp(2.1rem, 4vw, 3.2rem);
    margin-bottom: 0.75rem;
  }
  
  .hero-subtitle--light {
    color: rgba(255, 255, 255, 0.92);
    max-width: 72ch;
  }
  
  /* Botonera */
  .hero-actions {
    margin-top: 1.25rem;
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
    align-items: center;
  }
  
  /* Botón secundario “claro” para fondo oscuro */
  .hero-btn-secondary--light {
    display: inline-block;
    padding: 0.75rem 1.25rem;
    border: 1px solid rgba(255,255,255,0.75);
    color: rgba(255,255,255,0.95);
    text-decoration: none;
    border-radius: var(--border-radius-md);
    background: rgba(255,255,255,0.08);
    transition: transform var(--transition-fast), background var(--transition-fast), opacity var(--transition-fast);
  }
  
  .hero-btn-secondary--light:hover {
    background: rgba(255,255,255,0.14);
    transform: translateY(-2px);
  }
  .hero-actions--stack{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:0.75rem;
  }
  
  /* Responsive */
  @media (max-width: 768px) {
    .hero-quees-bg {
      min-height: 460px;
    }
  
    .hero-subtitle--light {
      max-width: 100%;
    }
  
    .hero-actions {
      flex-direction: column;
      align-items: stretch;
    }
  
    .hero-actions a {
      text-align: center;
      color: var(--color-secundary);
      text-decoration: none;
    }
    .hero-actions p {
        text-align: center;

      }
  }
  /* Principios - layout editorial */
.principios {
    display: grid;
    gap: var(--spacing-lg);
    margin-top: var(--spacing-lg);
  }
  
  .principio {
    padding: var(--spacing-md);
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius-lg);
    background: #fff;
  }
  
  .section-alt .principio {
    background: rgba(255,255,255,0.9);
  }
  
  .principio h3 {
    font-family: var(--font-primary-titulos);
    font-size: clamp(1.15rem, 1.8vw, 1.45rem);
    line-height: 1.25;
    color: var(--color-primary);
    margin-bottom: var(--spacing-xs);
    text-align: left;
  }
  
  .principio p {
    margin-top: var(--spacing-xs);
    text-align: justify;
  }
  
  .principio__meta {
    margin-top: 0;
    margin-bottom: var(--spacing-xs);
    font-size: 0.95rem;
  }
  
  .principio__meta a {
    font-weight: 600;
    text-decoration: none;
    color: var(--color-primary);
  }
  
  .principio__meta a:hover {
    text-decoration: underline;
  }
  
  /* En pantallas grandes, 2 columnas para mejorar escaneo */
  @media (min-width: 992px) {
    .principios {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    /* El bloque del marco (normalmente más “serio”) puede ocupar ancho completo */
    #marco-etico {
      grid-column: 1 / -1;
    }
  }
/* Beneficios - estilo editorial */
.beneficios {
    display: grid;
    gap: var(--spacing-lg);
    margin-top: var(--spacing-lg);
  }
  
  .beneficio {
    padding: var(--spacing-md);
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius-lg);
    background: #fff;
  }
  
  .beneficio h3 {
    font-family: var(--font-primary-titulos);
    font-size: clamp(1.1rem, 1.7vw, 1.35rem);
    line-height: 1.25;
    color: var(--color-primary);
    margin-bottom: var(--spacing-xs);
    text-align: left;
  }
  
  .beneficio p {
    margin-top: var(--spacing-xs);
    text-align: justify;
  }
  
  .beneficios-link {
    margin-top: var(--spacing-xl);
    text-align: center;
  }
  
  .beneficios-link a:hover {
    text-decoration: underline;
  }
  
  /* Desktop: 2 columnas, más escaneable */
  @media (min-width: 992px) {
    .beneficios {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }
/* Enlace editorial de scroll en hero */
.hero-scroll-hint {
    margin-top: 1.25rem;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.95rem;
    color: rgba(255, 255, 255, 0.85);
    text-decoration: none;
    font-weight: 500;
    transition: opacity var(--transition-fast), transform var(--transition-fast);
  }
  
  .hero-scroll-hint:hover {
    opacity: 1;
    transform: translateY(2px);
    text-decoration: underline;
  }
  
  .hero-scroll-icon {
    font-size: 1.1rem;
    line-height: 1;
  }
  
  /* En móvil, centrado y un poco más separado */
  @media (max-width: 768px) {
    .hero-scroll-hint {
      justify-content: center;
      width: 100%;
      margin-top: 1.5rem;
    }
  }
  
  /* HERO Personas (imagen + overlay) */
.hero-personas-bg {
  position: relative;
  background-image:
    linear-gradient(135deg, rgba(23,68,85,0.78) 0%, rgba(94,101,58,0.65) 55%, rgba(23,68,85,0.78) 100%),
    url("../img/formacion-yoga-de-la-risa-h.png");
  background-size: cover;
  background-position: center;
  min-height: 520px;
  display: flex;
  align-items: center;
}

.hero-personas-bg h1 {
  color: #fff;
  font-family: var(--font-primary-titulos);
  line-height: 1.1;
  font-size: clamp(2.1rem, 4vw, 3.2rem);
  margin-bottom: 0.75rem;
}

/* Cards */
.cards-grid {
  display: grid;
  gap: var(--spacing-lg);
  margin-top: var(--spacing-lg);
}

.cards-grid--2 {
  grid-template-columns: 1fr;
}

.card {
  padding: var(--spacing-lg);
  border: 1px solid var(--color-border);
  border-radius: var(--border-radius-lg);
  background: #fff;
}

.card h3 {
  font-family: var(--font-primary-titulos);
  color: var(--color-primary);
  font-size: clamp(1.1rem, 1.7vw, 1.35rem);
  margin-bottom: var(--spacing-xs);
}

.card-meta {
  margin-top: var(--spacing-sm);
  color: var(--color-text-light);
  font-size: 0.95rem;
}

/* Steps */
.steps {
  display: grid;
  gap: var(--spacing-lg);
  margin-top: var(--spacing-lg);
}

.step {
  padding: var(--spacing-md);
  border-left: 4px solid var(--color-primary);
  background: var(--color-bg-alt);
  border-radius: var(--border-radius-lg);
}

.step h3 {
  font-family: var(--font-primary-titulos);
  color: var(--color-primary);
  margin-bottom: var(--spacing-xs);
}

/* CTA box */
.cta-box {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--spacing-lg);
  margin-top: var(--spacing-lg);
  padding: var(--spacing-lg);
  border: 1px solid var(--color-border);
  border-radius: var(--border-radius-lg);
  background: #fff;
}

.cta-box__actions {
  display: flex;
  gap: var(--spacing-sm);
  flex-wrap: wrap;
  align-items: center;
}

/* Responsive grids */
@media (min-width: 992px) {
  .cards-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .cards-grid--2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .steps {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .cta-box {
    grid-template-columns: 1.2fr 0.8fr;
    align-items: center;
  }
}

@media (max-width: 768px) {
  .hero-personas-bg { min-height: 460px; }
}
#yogaPersonasHero .hero-actions a {
  text-align:center;
}
#yogaPersonasHero .hero-actions  {
  justify-content: center;
}
/***************************** personas ********************************/

/* ===== Cards Formación con imagen: alturas iguales + CTA alineado ===== */

.section .container .features-grid {
  align-items: stretch; /* asegura mismo alto visual en el grid */
}

.section .container .features-grid .feature-card.feature-card--image {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 0 !important;        /* imagen a borde */
  overflow: hidden;             /* recorta el hover de la imagen */
  border-radius: var(--border-radius-lg);
  background: #fff;
  box-shadow: var(--shadow-md);
}

/* Imagen: cover, ancho total, bordes solo arriba */
.section .container .features-grid .feature-card.feature-card--image .feature-image {
  display: block;
  width: 100%;
  height: 220px;                /* desktop */
  object-fit: cover;
  object-position: center;

  border-top-left-radius: var(--border-radius-lg);
  border-top-right-radius: var(--border-radius-lg);
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;

  transform: scale(1);
  transition: transform 0.45s ease;
  will-change: transform;
}

/* Hover sin salirse */
.section .container .features-grid .feature-card.feature-card--image:hover .feature-image {
  transform: scale(1.06);
}

/* Padding solo para contenido (no para la imagen) */
.section .container .features-grid .feature-card.feature-card--image .feature-title,
.section .container .features-grid .feature-card.feature-card--image p {
  padding-left: var(--spacing-lg);
  padding-right: var(--spacing-lg);
}

.section .container .features-grid .feature-card.feature-card--image .feature-title {
  padding-top: var(--spacing-md);
}

/* Permite que el texto “estire” y el CTA quede abajo en todas */
.section .container .features-grid .feature-card.feature-card--image p {
  flex: 1 1 auto;
  margin-bottom: var(--spacing-md);
}

/* CTA: centrado + aire inferior + alineado en todas */
.section .container .features-grid .feature-card.feature-card--image .feature-card-cta {
  margin-top: auto;             /* ancla al fondo */
  display: flex;
  justify-content: center;
  padding: 0 var(--spacing-lg) var(--spacing-lg);
}

/* ===== Breakpoints: imagen menos alta en móvil ===== */
@media (max-width: 991px) {
  .section .container .features-grid .feature-card.feature-card--image .feature-image {
    height: 200px;
  }
}

@media (max-width: 768px) {
  .section .container .features-grid .feature-card.feature-card--image .feature-image {
    height: 170px;
  }
}

@media (max-width: 420px) {
  .section .container .features-grid .feature-card.feature-card--image .feature-image {
    height: 150px;
  }
}
/*********************************** congreso *****************************/
.hero-congreso {
  position: relative;
  background-position: center;
  background-size: cover;
}

.hero-congreso::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(23, 68, 85, 0.55); /* overlay coherente con tu verde/azul */
  z-index: 1;
}

.hero-congreso-content {
  position: relative;
  z-index: 2;
  padding: 6rem 1rem;
}

.hero-cta-group {
  margin-top: 2rem;
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}

.hero-cta-group .btn {
  white-space: nowrap;
}
.btn-hero-clear {
  background: transparent !important;
  background-color: transparent !important;
  border: 1px solid #fff;
  color: #fff;
  box-shadow: none !important;
  text-shadow: none !important;
}
.btn-hero-clear:hover,
.btn-hero-clear:focus {
  background: #fff !important;
  color: var(--color-primary);
  transform: none;
  box-shadow: none !important;
}

@media (max-width: 768px) {
  .hero-cta-group {
      flex-direction: column;
      align-items: center;
  }
}
.info-boxes--compact {
  margin-top: var(--spacing-xl);
}
.info-boxes--compact .info-box p {
  margin-top: 0.5rem;
}
/* Form Congreso */
.form-congreso {
  margin-top: var(--spacing-lg);
}

/* Honeypot oculto */
.hp-field {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* Ajuste visual del bloque */
#contactoCongreso .readable {
  padding-top: var(--spacing-md);
  padding-bottom: var(--spacing-md);
}

/* Enlaces dentro del checkbox */
#contactoCongreso .checkbox-label a.link {
  color: var(--color-primary);
  text-decoration: underline;
  font-weight: 600;
}
/* Honeypot oculto */
.hp-field {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.info-boxes--compact {
  margin-top: var(--spacing-xl);
}
/********************** curso basico ******************/
.hero-curso-basico { position: relative; background-size: cover; background-position: center; }
.hero-curso-basico::before { content:""; position:absolute; inset:0; background: rgba(23,68,85,0.55); z-index:1; }
.hero-curso-content { position: relative; z-index:2; padding: 6rem 1rem; }
.hp-field { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.info-boxes--compact { margin-top: var(--spacing-xl); }
.course-facts {
  margin-top: var(--spacing-lg);
}

.course-facts__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--spacing-md);
  margin-top: var(--spacing-lg);
}

.course-fact {
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: var(--border-radius-lg);
  padding: var(--spacing-md);
  box-shadow: var(--shadow-sm);
  text-align: left;
}

.course-fact__label {
  font-size: var(--font-size-sm);
  color: var(--color-text-light);
  font-weight: 600;
  margin-bottom: 6px;
}

.course-fact__value {
  color: var(--color-text);
  font-weight: 600;
  line-height: 1.4;
}

.course-facts__note {
  margin-top: var(--spacing-md);
  color: var(--color-text-light);
  font-size: var(--font-size-sm);
}

/* Responsive */
@media (max-width: 900px) {
  .course-facts__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 640px) {
  .course-facts__grid {
    grid-template-columns: 1fr;
  }
}
.cta-final {
  text-align: center;
  padding: var(--spacing-xl);
  border-radius: var(--border-radius-lg);
  border: 1px solid var(--color-border);
  background: var(--color-bg-alt);
  box-shadow: var(--shadow-sm);
}

.cta-final h2 {
  margin-bottom: var(--spacing-sm);
}

.cta-final p {
  margin-top: var(--spacing-sm);
}

.cta-final__actions {
  margin-top: var(--spacing-lg);
  display: flex;
  gap: var(--spacing-sm);
  justify-content: center;
  flex-wrap: wrap;
}

.cta-final__micro {
  margin-top: var(--spacing-md);
  font-size: var(--font-size-sm);
  color: var(--color-text-light);
}
/******************* lideres ********************************/
.hero-curso-monitor {
  position: relative;
  background-size: cover;
  background-position: center;
}

.hero-curso-monitor::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(23, 68, 85, 0.55);
  z-index: 1;
}

.hero-curso-monitor .hero-curso-content {
  position: relative;
  z-index: 2;
  padding: 6rem 1rem;
}
/********************** profesor **********************/
.hero-curso-profesor {
  position: relative;
  background-size: cover;
  background-position: center;
}

.hero-curso-profesor::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(23, 68, 85, 0.6);
  z-index: 1;
}

.hero-curso-profesor .hero-curso-content {
  position: relative;
  z-index: 2;
  padding: 6rem 1rem;
}
/****************************************** clubs ********************************/
/* HERO clubs (solo si necesitas imagen/overlay distinto) */
.hero-clubs {
  position: relative;
  background-size: cover;
  background-position: center;
}
.hero-clubs::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(23, 68, 85, 0.6);
  z-index: 1;
}
.hero-clubs .hero-curso-content {
  position: relative;
  z-index: 2;
  padding: 6rem 1rem;
}

/* Filters */
.clubs-filters {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr)) auto;
  gap: var(--spacing-md);
  align-items: end;
  margin-top: var(--spacing-lg);
  margin-bottom: var(--spacing-lg);
}
.clubs-filters__actions {
  display: flex;
  justify-content: flex-end;
}

/* Clubs grid */
.clubs-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--spacing-lg);
}

.club-card {
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: var(--border-radius-lg);
  box-shadow: var(--shadow-md);
  padding: var(--spacing-lg);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  text-align: left;
}

.club-card__top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--spacing-sm);
  margin-bottom: var(--spacing-sm);
}

.club-badge {
  display: inline-flex;
  align-items: center;
  padding: 6px 10px;
  border-radius: 999px;
  font-weight: 700;
  font-size: var(--font-size-sm);
  border: 1px solid var(--color-border);
}
.club-badge--active {
  background: rgba(2, 122, 72, 0.10);
  color: #027a48;
  border-color: rgba(2, 122, 72, 0.25);
}
.club-badge--paused {
  background: rgba(188, 157, 104, 0.12);
  color: #7a5a2a;
  border-color: rgba(188, 157, 104, 0.35);
}

.club-tag {
  font-size: var(--font-size-sm);
  color: var(--color-text-light);
  font-weight: 600;
}

.club-title {
  font-size: var(--font-size-xl);
  color: var(--color-primary);
  margin-bottom: var(--spacing-sm);
}

.club-meta {
  display: grid;
  gap: 6px;
  color: var(--color-text);
  margin-bottom: var(--spacing-sm);
  font-size: var(--font-size-base);
}

.club-desc {
  color: var(--color-text-light);
  margin-bottom: var(--spacing-md);
}

.club-actions {
  margin-top: auto;
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-sm);
  justify-content: center; /* centra botones como pediste */
  padding-top: var(--spacing-sm);
  padding-bottom: 6px; /* pequeño aire inferior */
}

/* Responsive */
@media (max-width: 991px) {
  .clubs-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .clubs-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .clubs-filters__actions { justify-content: flex-start; }
}
@media (max-width: 640px) {
  .clubs-grid { grid-template-columns: 1fr; }
  .clubs-filters { grid-template-columns: 1fr; }
}

/* ========== MOD TABS ========== */
.mod-tabs {
  width: 100%;
}

.mod-tabs-g {
  border: 1px solid var(--color-border, #e2e8f0);
  border-radius: var(--border-radius-lg, 16px);
  background: var(--color-bg, #fff);
  overflow: hidden;
}

.mod-tabs-g-tab {
  border: 0;
  background: transparent;
  color: var(--color-text, #0f172a);
  padding: 10px 14px;
  font-weight: 600;
  cursor: pointer;
  border-bottom: 2px solid transparent;
}

.mod-tabs-g-tab.is-active,
.mod-tabs-g-tab[aria-selected="true"] {
  color: var(--color-primary, #0f172a);
  border-bottom-color: var(--color-primary, #0f172a);
  background: rgba(15, 23, 42, 0.06);
}

.mod-tabs-g-panel {
  display: none;
  padding: var(--spacing-md, 16px);
  border-top: 1px solid var(--color-border, #e2e8f0);
}

.mod-tabs-g-panel.is-active {
  display: block;
}

.mod-tabs-g-panel[hidden] {
  display: none;
}

.mod-tabs-g-panel__content {
  min-height: 24px;
}

.mod-tabs-g-skel {
  padding: 12px 14px;
  border: 1px dashed var(--color-border, #e2e8f0);
  border-radius: var(--border-radius-md, 10px);
  background: var(--color-bg-alt, #f8fafc);
  color: var(--color-text-light, #64748b);
  font-size: var(--font-size-sm, 0.95rem);
}

@media (max-width: 640px) {
  .dashboard-layout .main-content {
    padding: 0.75rem;
  }
  .dashboard-layout .mod-tabs-g-panel {
    padding: 10px;
  }
  .dashboard-layout .mod-tabs-g-tab {
    padding: 8px 10px;
  }
}

.mod-msg {
  padding: 12px 14px;
  border-radius: var(--border-radius-md, 10px);
  border: 1px solid transparent;
  font-size: var(--font-size-sm, 0.95rem);
}

.mod-msg--danger {
  border-color: rgba(220, 38, 38, 0.3);
  background: rgba(220, 38, 38, 0.08);
  color: #b91c1c;
}

/* ========== MOD SOLICITUDES ========== */
.mod-solicitudes__layout {
  display: grid;
  gap: 16px;
  align-items: start;
}
@media (min-width: 900px) {
  .mod-solicitudes__layout {
    grid-template-columns: 1fr 320px;
  }
}
@media (max-width: 899px) {
  .mod-solicitudes__layout {
    grid-template-columns: 1fr;
  }
}

.mod-solicitudes__side {
  display: grid;
  gap: 16px;
  align-content: start;
  min-width: 0;
}

.mod-solicitudes__main {
  padding-top: 8px;
}

.mod-side-card {
  padding: 12px;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 12px;
  background: #fff;
  min-width: 0;
}

.mod-side-title {
  margin: 0 0 10px;
  font-size: 0.95rem;
  font-weight: 600;
}

.mod-side-kpis {
  margin: 0;
  display: grid;
  gap: 10px;
}
.mod-side-kpis > div {
  display: flex;
  justify-content: space-between;
  gap: 10px;
}
.mod-side-kpis dt { font-weight: 600; }
.mod-side-kpis dd { margin: 0; }

.mod-ayuda-cards {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(8, minmax(0, 1fr));
}

@media (max-width: 1279px) {
  .mod-ayuda-cards {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 1199px) {
  .mod-ayuda-cards {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 899px) {
  .mod-ayuda-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 599px) {
  .mod-ayuda-cards {
    grid-template-columns: 1fr;
  }
}

.mod-ayuda-resumen .mod-btn {
  margin-top: 10px;
  font-size: 0.95rem;
}

.mod-ayuda-resumen .mod-side-title {
  font-size: 1rem;
}

.mod-tabs-g-tabs--center {
  justify-content: center;
}

.analytics-block {
  margin-bottom: 24px;
}

.analytics-header {
  text-align: center;
  margin-bottom: 12px;
}

.analytics-header .workspace-hint {
  text-align: center;
}

.analytics-cards {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

@media (max-width: 1499px) {
  .analytics-cards {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 899px) {
  .analytics-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 599px) {
  .analytics-cards {
    grid-template-columns: 1fr;
  }
}

.mod-kpi.is-hot {
  background: #e8f6ee;
  border-radius: 10px;
  padding: 6px 8px;
}

.mod-kpi.is-hot dt,
.mod-kpi.is-hot dd {
  color: #1f7a4c;
}
.mod-side-chips { margin: 0 0 10px; }
.mod-chip {
  display: inline-block;
  padding: 4px 8px;
  border: 1px solid rgba(0,0,0,0.10);
  border-radius: 999px;
  font-size: 0.85rem;
  margin: 4px 6px 0 0;
}
.mod-contactos__layout { display: grid; gap: 16px; align-items: start; }
@media (min-width: 900px) {
  .mod-contactos__layout { grid-template-columns: 1fr 320px; }
}
@media (max-width: 899px) {
  .mod-contactos__layout { grid-template-columns: 1fr; }
}
.mod-contactos__side { display: grid; gap: 16px; align-content: start; min-width: 0; }
.mod-empresas__layout { display: grid; gap: 16px; align-items: start; }
@media (min-width: 900px) {
  .mod-empresas__layout { grid-template-columns: 1fr 320px; }
}
@media (max-width: 899px) {
  .mod-empresas__layout { grid-template-columns: 1fr; }
}
.mod-empresas__side { display: grid; gap: 16px; align-content: start; min-width: 0; }
.mod-adhesion__layout { display: grid; gap: 16px; align-items: start; }
@media (min-width: 900px) {
  .mod-adhesion__layout { grid-template-columns: 1fr 320px; }
}
@media (max-width: 899px) {
  .mod-adhesion__layout { grid-template-columns: 1fr; }
}
.mod-col-toggle {
  background: none;
  border: 0;
  padding: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
}
.mod-pay-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.mod-pay-status--ok {
  background: #d7f5e6;
  color: #136a3c;
}
.mod-pay-status--pendiente {
  background: #f7f3d7;
  color: #7b6510;
}
.mod-pay-status--vencido {
  background: #fde2e2;
  color: #8b1f1f;
}
.mod-table--coltoggle.col-hide-doc_hash td[data-col="doc_hash"],
.mod-table--coltoggle.col-hide-ip td[data-col="ip"],
.mod-table--coltoggle.col-hide-user_agent td[data-col="user_agent"],
.mod-table--coltoggle.col-hide-id td[data-col="id"],
.mod-table--coltoggle.col-hide-accepted_at td[data-col="accepted_at"],
.mod-table--coltoggle.col-hide-nombre td[data-col="nombre"],
.mod-table--coltoggle.col-hide-apellidos td[data-col="apellidos"],
.mod-table--coltoggle.col-hide-correo td[data-col="correo"],
.mod-table--coltoggle.col-hide-telefono td[data-col="telefono"],
.mod-table--coltoggle.col-hide-certificacion td[data-col="certificacion"],
.mod-table--coltoggle.col-hide-doc_version td[data-col="doc_version"],
.mod-table--coltoggle.col-hide-status td[data-col="status"],
.mod-table--coltoggle.col-hide-review_notes td[data-col="review_notes"],
.mod-table--coltoggle.col-hide-reviewed_at td[data-col="reviewed_at"],
.mod-table--coltoggle.col-hide-valid_from td[data-col="valid_from"],
.mod-table--coltoggle.col-hide-valid_until td[data-col="valid_until"],
.mod-table--coltoggle.col-hide-certificate td[data-col="certificate"],
.mod-table--coltoggle.col-hide-actions td[data-col="actions"] {
  display: none;
}
.mod-table--coltoggle.col-hide-doc_hash th[data-col="doc_hash"],
.mod-table--coltoggle.col-hide-ip th[data-col="ip"],
.mod-table--coltoggle.col-hide-user_agent th[data-col="user_agent"],
.mod-table--coltoggle.col-hide-id th[data-col="id"],
.mod-table--coltoggle.col-hide-accepted_at th[data-col="accepted_at"],
.mod-table--coltoggle.col-hide-nombre th[data-col="nombre"],
.mod-table--coltoggle.col-hide-apellidos th[data-col="apellidos"],
.mod-table--coltoggle.col-hide-correo th[data-col="correo"],
.mod-table--coltoggle.col-hide-telefono th[data-col="telefono"],
.mod-table--coltoggle.col-hide-certificacion th[data-col="certificacion"],
.mod-table--coltoggle.col-hide-doc_version th[data-col="doc_version"],
.mod-table--coltoggle.col-hide-status th[data-col="status"],
.mod-table--coltoggle.col-hide-review_notes th[data-col="review_notes"],
.mod-table--coltoggle.col-hide-reviewed_at th[data-col="reviewed_at"],
.mod-table--coltoggle.col-hide-valid_from th[data-col="valid_from"],
.mod-table--coltoggle.col-hide-valid_until th[data-col="valid_until"],
.mod-table--coltoggle.col-hide-certificate th[data-col="certificate"],
.mod-table--coltoggle.col-hide-actions th[data-col="actions"] {
  opacity: 0.5;
}

.mod-help__layout { display: grid; gap: 16px; align-items: start; }
@media (min-width: 900px) {
  .mod-help__layout { grid-template-columns: 1fr 320px; }
}
@media (max-width: 899px) {
  .mod-help__layout { grid-template-columns: 1fr; }
}
.mod-adhesion__side { display: grid; gap: 16px; align-content: start; min-width: 0; }
@media (min-width: 900px) {
  .mod-help .mod-filters {
    grid-template-columns: 150px 1fr 170px 170px auto;
    align-items: center;
  }
  .mod-help .mod-filters__actions {
    justify-content: flex-start;
    align-self: center;
  }
}
@media (min-width: 900px) {
  .mod-contactos .mod-filters {
    grid-template-columns: 150px 150px 1fr 170px 170px auto;
    align-items: center;
  }
  .mod-contactos .mod-filters__actions {
    justify-content: flex-start;
    align-self: center;
  }
}
@media (min-width: 900px) {
  .mod-congresos .mod-filters {
    grid-template-columns: 150px 150px 1fr 170px 170px auto;
    align-items: center;
  }
  .mod-congresos .mod-filters__actions {
    justify-content: flex-start;
    align-self: center;
  }
}
@media (min-width: 900px) {
  .mod-adhesion .mod-filters {
    grid-template-columns: 150px 1fr 170px 170px auto;
    align-items: center;
  }
  .mod-adhesion .mod-filters__actions {
    justify-content: flex-start;
    align-self: center;
  }
}
.mod-congresos__layout { display: grid; gap: 16px; align-items: start; }
@media (min-width: 900px) {
  .mod-empresas .mod-filters {
    grid-template-columns: 150px 1fr 170px 170px auto;
    align-items: center;
  }
  .mod-empresas .mod-filters__actions {
    justify-content: flex-start;
    align-self: center;
  }
}
@media (min-width: 900px) {
  .mod-congresos__layout { grid-template-columns: 1fr 320px; }
}
@media (max-width: 899px) {
  .mod-congresos__layout { grid-template-columns: 1fr; }
}
.mod-congresos__side { display: grid; gap: 16px; align-content: start; min-width: 0; }
@media (min-width: 900px) {
  .mod-solicitudes .mod-filters {
    grid-template-columns: 180px 180px 1fr 170px 170px auto;
    align-items: center;
  }
  .mod-solicitudes .mod-filters__actions {
    justify-content: flex-start;
    align-self: center;
  }
}
.mod-side-group { margin-top: 12px; }
.mod-side-title { font-weight: 600; margin: 0 0 6px; font-size: 0.9rem; }
.mod-side-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 6px;
}
.mod-side-list li {
  display: flex;
  justify-content: space-between;
  gap: 10px;
}

.mod-side-chip {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 10px;
  border: 1px solid rgba(0,0,0,0.08);
  background: #fff;
  cursor: pointer;
  text-align: left;
}
.mod-side-chip:hover { background: #f8fafc; }
.mod-side-chip.is-active {
  background: #eef2f7;
  border-color: rgba(0,0,0,0.14);
}
.mod-side-chip__label { font-weight: 600; }
.mod-side-chip__count { font-weight: 800; }

/* ====== MOD ALUMNO HUB ====== */
.mod-alumno-hub__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 12px;
}

.mod-alumno-hub__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  font-size: 0.9rem;
  opacity: 0.85;
}

.mod-alumno-hub__layout {
  display: grid;
  gap: 16px;
  align-items: start;
}

@media (min-width: 900px) {
  .mod-alumno-hub__layout {
    grid-template-columns: 2fr 1fr 1fr;
  }
}

.mod-alumno-form label {
  display: block;
  margin: 8px 0 6px;
  font-weight: 600;
}

.mod-alumno-form input,
.mod-alumno-form select,
.mod-alumno-form textarea {
  width: 100%;
  min-height: 38px;
}

.mod-alumno-form__cols {
  display: grid;
  gap: 16px;
}

@media (min-width: 900px) {
  .mod-alumno-form__cols {
    grid-template-columns: 1fr 1fr;
  }
}

.mod-alumno-form__actions {
  margin-top: 12px;
}

.mod-alumno-hub__list {
  list-style: none;
  margin: 0 0 12px;
  padding: 0;
  display: grid;
  gap: 8px;
}

.mod-alumno-hub__item-title {
  font-weight: 600;
}

.mod-alumno-hub__item-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  font-size: 0.85rem;
  opacity: 0.8;
}

.mod-alumno-hub__stack {
  display: grid;
  gap: 12px;
}

.mod-section-divider {
  height: 1px;
  width: 100%;
  background: rgba(0, 0, 0, 0.08);
  margin: 8px 0 12px;
}

.mod-section-header {
  padding: 8px 10px;
  margin: -4px -4px 8px;
  border-radius: 8px;
  background: #f8fafc;
}

/* ====== MOD SERVICIOS CATALOGO ====== */
.mod-servicios-catalogo__layout {
  display: grid;
  gap: 16px;
  align-items: start;
}

@media (min-width: 900px) {
  .mod-servicios-catalogo__layout {
    grid-template-columns: 1fr 320px;
  }
}

/* ====== MOD ALUMNOS SERVICIOS ====== */
.mod-alumnos-servicios__layout {
  display: grid;
  gap: 16px;
  align-items: start;
}

@media (min-width: 900px) {
  .mod-alumnos-servicios__layout {
    grid-template-columns: 1fr 320px;
  }
}

.mod-bulk {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  margin: 10px 0 12px;
  padding: 10px;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 12px;
  background: #fff;
}
.mod-bulk__right {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}
.mod-bulk__filters {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.mod-bulk select { min-height: 38px; }
.mod-btn.is-active {
  background: #eef2f7;
  border-color: rgba(0,0,0,0.14);
}
.mod-btn[disabled] { opacity: .55; cursor: not-allowed; }
@media (max-width: 699px) {
  .mod-bulk { flex-direction: column; align-items: stretch; }
  .mod-bulk__right { justify-content: space-between; }
}

.mod-filters {
  display: grid;
  gap: 10px;
  margin: 10px 0 14px;
}
@media (min-width: 700px) {
  .mod-filters {
    grid-template-columns: 160px 200px 200px 1fr;
    align-items: center;
  }
}
.mod-filters select,
.mod-filters input {
  min-height: 38px;
  width: 100%;
}
.mod-filters input[name="q"] {
  width: 100%;
}
.mod-filters select[multiple] {
  min-height: 76px;
  padding: 6px;
}
.mod-solicitudes .mod-filters select[name="estado[]"],
.mod-solicitudes .mod-filters select[name="nivel[]"] {
  min-height: 38px;
  padding: 6px 8px;
}
.mod-filters__perpage { max-width: 180px; }

.mod-table {
  width: 100%;
}

/* ====== MOD TABLE - ZEBRA ROWS ====== */
.mod-table {
  border-collapse: collapse;
  width: 100%;
}

.mod-table tbody tr:nth-child(odd) {
  background-color: #ffffff;
}

.mod-table tbody tr:nth-child(even) {
  background-color: #f8fafc;
}

.mod-table tbody tr:hover {
  background-color: #eef2f7;
}

.mod-table th,
.mod-table td {
  padding: 8px 10px;
  text-align: left;
  vertical-align: middle;
}

.mod-table thead th {
  background-color: #f1f5f9;
  font-weight: 600;
  border-bottom: 1px solid rgba(0,0,0,0.08);
}

.mod-table-actions {
  display: grid;
  gap: 6px;
}

.mod-edit-form {
  display: grid;
  gap: 12px;
}

.mod-edit-grid {
  display: grid;
  gap: 12px;
}

.mod-edit-grid--note {
  grid-template-columns: 180px 1fr;
  align-items: center;
}

.mod-edit-field {
  position: relative;
  display: block;
  padding-top: 10px;
}

.mod-edit-field--full {
  grid-column: 1 / -1;
}

.mod-edit-form label {
  position: absolute;
  top: 0;
  left: 10px;
  padding: 0 6px;
  font-weight: 600;
  font-size: 0.78rem;
  color: #475569;
  background: #fff;
}

.mod-edit-form input,
.mod-edit-form select,
.mod-edit-form textarea {
  width: 100%;
  padding: 12px 10px 10px;
  border-radius: 10px;
  border: 1px solid #cbd5f5;
}

.mod-edit-note {
  padding-top: 6px;
  border-top: 1px dashed rgba(0, 0, 0, 0.08);
}

.mod-edit-history {
  margin-top: 16px;
}

.mod-badge {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 600;
  border: 1px solid rgba(15, 23, 42, 0.12);
  background: #f1f5f9;
  color: #0f172a;
  text-transform: capitalize;
  white-space: nowrap;
}

.mod-badge--contactado { background: #e0f2fe; color: #075985; border-color: #bae6fd; }
.mod-badge--interesado { background: #fef3c7; color: #92400e; border-color: #fde68a; }
.mod-badge--inscrito { background: #dcfce7; color: #166534; border-color: #bbf7d0; }
.mod-badge--aplazado { background: #e2e8f0; color: #334155; border-color: #cbd5f5; }
.mod-badge--cancelado { background: #fee2e2; color: #991b1b; border-color: #fecaca; }
.mod-badge--borrado { background: #f1f5f9; color: #475569; border-color: #e2e8f0; }

.mod-status-select {
  width: 100%;
  min-height: 30px;
  padding: 4px 8px;
  border-radius: 999px;
  border: 1px solid rgba(15, 23, 42, 0.12);
  background: #f1f5f9;
  color: #0f172a;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: capitalize;
}

.mod-status-select--contactado { background: #e0f2fe; color: #075985; border-color: #bae6fd; }
.mod-status-select--interesado { background: #fef3c7; color: #92400e; border-color: #fde68a; }
.mod-status-select--inscrito { background: #dcfce7; color: #166534; border-color: #bbf7d0; }
.mod-status-select--aplazado { background: #e2e8f0; color: #334155; border-color: #cbd5f5; }
.mod-status-select--cancelado { background: #fee2e2; color: #991b1b; border-color: #fecaca; }
.mod-status-select--borrado { background: #f1f5f9; color: #475569; border-color: #e2e8f0; }
.mod-status-select--nuevo { background: #86efac; color: #065f46; border-color: #4ade80; }
.mod-status-select--leido { background: #e0f2fe; color: #075985; border-color: #bae6fd; }
.mod-status-select--respondido { background: #dcfce7; color: #166534; border-color: #bbf7d0; }
.mod-status-select--archivado { background: #e2e8f0; color: #334155; border-color: #cbd5f5; }
.mod-status-select--prospecto { background: #fef9c3; color: #854d0e; border-color: #fde68a; }

.mod-filters__actions {
  display: flex;
  gap: 8px;
  justify-content: flex-start;
}

.mod-filters--historial {
  display: grid;
  gap: 10px;
  align-items: end;
}

@media (min-width: 700px) {
  .mod-filters--historial {
    grid-template-columns: 260px 180px 180px auto;
  }
  .mod-filters--historial input[name="q"] {
    min-width: 0;
  }
}

.mod-filters--historial .mod-btn {
  background: #1f7a8c;
  color: #fff;
  border: 1px solid #1f7a8c;
  padding: 10px 16px;
  border-radius: 10px;
}

.mod-filters--historial .mod-btn:hover {
  filter: brightness(0.95);
}

.mod-filters--historial .mod-btn--ghost {
  background: #f8fafc;
  color: #0f172a;
  border-color: #cbd5f5;
}

.mod-edit-form .mod-btn {
  background: #1f7a8c;
  color: #fff;
  border: 1px solid #1f7a8c;
  padding: 10px 16px;
  border-radius: 10px;
}

.mod-edit-form .mod-btn:hover {
  filter: brightness(0.95);
}

.mod-edit-form .mod-btn + .mod-btn {
  background: #f8fafc;
  color: #0f172a;
  border-color: #cbd5f5;
}

@media (min-width: 720px) {
  .mod-edit-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 719px) {
  .mod-edit-grid--note {
    grid-template-columns: 1fr;
  }
}

.mod-th-sort {
  cursor: pointer;
  user-select: none;
}

.mod-th-sort:hover {
  background: rgba(0,0,0,0.03);
}

.mod-sort-ind {
  margin-left: 6px;
  opacity: 0.75;
  font-size: 0.85em;
}

.mod-btn--block {
  display: block;
  width: 100%;
  text-align: center;
}

.mod-table tbody tr.js-row-click {
  cursor: pointer;
}
.mod-table tbody tr.js-row-click .mod-btn {
  cursor: pointer;
}

.mod-table--sm td,
.mod-table--sm th {
  padding: 6px 8px;
}

.mod-table tbody tr:nth-child(even) {
  background-color: #f8fafc;
}
.mod-table tbody tr:nth-child(odd) {
  background-color: #ffffff;
}
.mod-table tbody tr:hover {
  background-color: #eef2f7;
}
.mod-table tbody tr:only-child {
  background-color: #ffffff;
}

.js-row-open { cursor: pointer; }
.js-row-open:hover {
  outline: 2px solid rgba(0,0,0,0.06);
  outline-offset: -2px;
}

.js-con-row-open {
  cursor: pointer;
}

.js-con-row-open:hover {
  outline: 2px solid rgba(0,0,0,0.06);
  outline-offset: -2px;
}

.js-cong-row-open {
  cursor: pointer;
}

.js-cong-row-open:hover {
  outline: 2px solid rgba(0,0,0,0.06);
  outline-offset: -2px;
}

.js-ayu-row-open {
  cursor: pointer;
}

.js-ayu-row-open:hover {
  outline: 2px solid rgba(0,0,0,0.06);
  outline-offset: -2px;
}

.js-adh-row-open {
  cursor: pointer;
}

.js-adh-row-open:hover {
  outline: 2px solid rgba(0,0,0,0.06);
  outline-offset: -2px;
}

.js-emp-row-open {
  cursor: pointer;
}

.js-emp-row-open:hover {
  outline: 2px solid rgba(0,0,0,0.06);
  outline-offset: -2px;
}

.mod-table-nav {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-top: 12px;
  border-top: 1px solid rgba(0,0,0,0.08);
  padding-top: 10px;
}
@media (max-width: 699px) {
  .mod-table-nav {
    flex-direction: column;
    align-items: stretch;
  }
}

/* ====== SOLICITUD DETALLE - ESPACIADO ====== */
.mod-solicitud-actions {
  padding-top: 12px;
  display: grid;
  gap: 12px;
}
.mod-solicitud-actions__form label {
  display: block;
  margin: 0 0 6px;
}
.mod-solicitud-actions__form select {
  min-height: 38px;
}
.mod-solicitud-actions__form .mod-btn {
  margin-left: 8px;
}
@media (max-width: 699px) {
  .mod-solicitud-actions__form .mod-btn {
    margin-left: 0;
    margin-top: 8px;
  }
}

/* ========== MOD RESUMEN ========== */
.mod-resumen__groups {
  display: grid;
  gap: 16px;
  align-items: start;
}
@media (min-width: 900px) {
  .mod-resumen__groups {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.mod-resumen__group {
  min-width: 0;
}

/* ====== MOD RESUMEN - AJUSTES FINALES ====== */
.mod-resumen__group h4 {
  margin: 0 0 10px;
  font-size: 0.95rem;
  font-weight: 600;
}

.mod-resumen__group {
  padding: 12px;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 12px;
  background: #fff;
}

.mod-table-wrap { width: 100%; }

@media (max-width: 699px) {
  .mod-table-wrap { overflow-x: auto; }
  .mod-table { min-width: 720px; }
  .is-col-hide-sm { display: none; }
}

@media (max-width: 699px) {
  .mod-side-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 12px;
  }
  .mod-side-kpis > div { display: block; }
  .mod-side-kpis dt { font-size: 0.85rem; opacity: 0.8; }
  .mod-side-kpis dd { font-size: 1.05rem; font-weight: 700; margin-top: 2px; }
}


.mod-newsletter__layout { display: grid; gap: 16px; align-items: start; }
@media (min-width: 900px) {
  .mod-newsletter__layout { grid-template-columns: 1fr 320px; }
}
@media (max-width: 899px) {
  .mod-newsletter__layout { grid-template-columns: 1fr; }
}
.mod-newsletter__side { display: grid; gap: 16px; align-content: start; min-width: 0; }
@media (min-width: 700px) {
  .mod-newsletter .mod-filters {
    grid-template-columns: 200px 1fr 160px 160px auto;
    align-items: center;
  }
  .mod-newsletter .mod-filters__actions {
    justify-content: flex-end;
  }
}

.mod-admins__layout { display: grid; gap: 16px; align-items: start; }
@media (min-width: 900px) {
  .mod-admins__layout { grid-template-columns: 1fr 320px; }
}
@media (max-width: 899px) {
  .mod-admins__layout { grid-template-columns: 1fr; }
}
.mod-admins__side { display: grid; gap: 16px; align-content: start; min-width: 0; }
@media (min-width: 700px) {
  .mod-admins .mod-filters {
    grid-template-columns: 160px 140px 1fr 160px 160px auto;
    align-items: center;
  }
  .mod-admins .mod-filters__actions {
    justify-content: flex-end;
  }
}
.mod-alumnos__layout { display: grid; gap: 16px; align-items: start; }
@media (min-width: 900px) {
  .mod-alumnos__layout { grid-template-columns: 1fr 320px; }
}
@media (max-width: 899px) {
  .mod-alumnos__layout { grid-template-columns: 1fr; }
}
.mod-alumnos__side { display: grid; gap: 16px; align-content: start; min-width: 0; }
@media (min-width: 700px) {
  .mod-alumnos .mod-filters {
    grid-template-columns: 160px 160px 1fr 160px 160px auto;
    align-items: center;
  }
  .mod-alumnos .mod-filters__actions {
    justify-content: flex-end;
  }
}
.mod-alumnos-redes__layout { display: grid; gap: 16px; align-items: start; }
@media (min-width: 900px) {
  .mod-alumnos-redes__layout { grid-template-columns: 1fr 320px; }
}
@media (max-width: 899px) {
  .mod-alumnos-redes__layout { grid-template-columns: 1fr; }
}
.mod-alumnos-redes__side { display: grid; gap: 16px; align-content: start; min-width: 0; }
@media (min-width: 700px) {
  .mod-alumnos-redes .mod-filters {
    grid-template-columns: 180px 140px 1fr auto;
    align-items: center;
  }
  .mod-alumnos-redes .mod-filters__actions {
    justify-content: flex-end;
  }
}
.mod-alumnos-cursos__layout { display: grid; gap: 16px; align-items: start; }
@media (min-width: 900px) {
  .mod-alumnos-cursos__layout { grid-template-columns: 1fr 320px; }
}
@media (max-width: 899px) {
  .mod-alumnos-cursos__layout { grid-template-columns: 1fr; }
}
.mod-alumnos-cursos__side { display: grid; gap: 16px; align-content: start; min-width: 0; }
@media (min-width: 700px) {
  .mod-alumnos-cursos .mod-filters {
    grid-template-columns: 220px 160px 140px 1fr auto;
    align-items: center;
  }
  .mod-alumnos-cursos .mod-filters__actions {
    justify-content: flex-end;
  }
}
.mod-cursos-publicados__layout { display: grid; gap: 16px; align-items: start; }
@media (min-width: 900px) {
  .mod-cursos-publicados__layout { grid-template-columns: 1fr 320px; }
}
@media (max-width: 899px) {
  .mod-cursos-publicados__layout { grid-template-columns: 1fr; }
}
.mod-cursos-publicados__side { display: grid; gap: 16px; align-content: start; min-width: 0; }
@media (min-width: 700px) {
  .mod-cursos-publicados .mod-filters {
    grid-template-columns: 220px 160px 1fr 160px 160px auto;
    align-items: center;
  }
  .mod-cursos-publicados .mod-filters__actions {
    justify-content: flex-end;
  }
}
.mod-status-select--activo { background: #dcfce7; color: #166534; border-color: #bbf7d0; }
.mod-status-select--inactivo { background: #f1f5f9; color: #475569; border-color: #e2e8f0; }
.mod-status-select--bloqueado { background: #fee2e2; color: #991b1b; border-color: #fecaca; }
.mod-status-select--pendiente { background: #fef3c7; color: #92400e; border-color: #fde68a; }
.mod-status-select--baja { background: #fee2e2; color: #991b1b; border-color: #fecaca; }
.mod-status-select--en_proceso { background: #fef3c7; color: #92400e; border-color: #fde68a; }
.mod-status-select--aprobado { background: #dcfce7; color: #166534; border-color: #bbf7d0; }
.mod-status-select--rechazado { background: #fee2e2; color: #991b1b; border-color: #fecaca; }

.mod-prealumnos__layout {
  display: grid;
  gap: 16px;
  align-items: start;
}

@media (min-width: 900px) {
  .mod-prealumnos__layout {
    grid-template-columns: 1fr 320px;
  }
}

.mod-prealumnos-docs__layout {
  display: grid;
  gap: 16px;
  align-items: start;
}

@media (min-width: 900px) {
  .mod-prealumnos-docs__layout {
    grid-template-columns: 1fr 320px;
  }
}
/********************** sobre mi ***************************/
/* =========================
   YR · Sobre mí (maqueta)
   ========================= */

   :root{
    --yr-bg: var(--color-bg);
    --yr-panel: color-mix(in srgb, var(--color-secondary) 55%, white);
    --yr-panel2: color-mix(in srgb, var(--color-secondary) 80%, white);
    --yr-text: var(--color-text);
    --yr-muted: var(--color-text-light);
    --yr-border: var(--color-border);
    --yr-radius: 18px;
    --yr-shadow: var(--shadow-md);
    --yr-max: 1120px;
  
    /* Alineado con la paleta principal del sitio */
    --yr-brand: var(--color-primary);
    --yr-brand2: var(--color-accent);
  }
  
  .yr-page{
    background: var(--yr-bg);
    color: var(--yr-text);
  }
  
  .yr-container{
    max-width: var(--yr-max);
    margin: 0 auto;
    padding: 0 18px;
  }
  
  /* Typo */
  .yr-h1{ font-size: clamp(30px, 4vw, 46px); line-height: 1.06; margin: 0 0 10px; }
  .yr-h2{ font-size: 18px; color: var(--yr-muted); margin: 0 0 14px; }
  .yr-h3{ font-size: 24px; margin: 0 0 10px; }
  .yr-h4{ font-size: 16px; margin: 0 0 10px; }
  .yr-muted{ color: var(--yr-muted); margin: 0; }
  .yr-lead{ font-size: 16px; line-height: 1.6; margin: 0 0 16px; color: var(--yr-text); }
  .yr-lead-sm{ font-size: 15px; line-height: 1.6; margin: 0 0 12px; color: var(--yr-text); }
  .yr-reg{ font-size: .75em; vertical-align: super; }
  
  .yr-eyebrow{
    color: var(--yr-muted);
    letter-spacing: .06em;
    text-transform: uppercase;
    font-size: 12px;
    margin: 0 0 10px;
  }
  
  /* Buttons */
  .yr-cta{ display: flex; gap: 12px; flex-wrap: wrap; margin-top: 10px; }
  .yr-cta--center{ justify-content: center; }
  .yr-btn{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 16px;
    border-radius: 14px;
    border: 1px solid var(--yr-border);
    text-decoration: none;
    font-weight: 650;
    color: var(--yr-text);
    background: color-mix(in srgb, var(--yr-panel) 70%, white);
  }
  .yr-btn--primary{
    background: var(--yr-brand);
    color: #fff;
    border-color: var(--yr-brand);
  }
  .yr-btn--ghost{
    background: transparent;
    border-color: var(--yr-brand);
    color: var(--yr-brand);
  }
  
  /* Sections */
  .yr-section{ padding: 38px 0; }
  .yr-section--alt{
    background: radial-gradient(900px 420px at 10% 20%, color-mix(in srgb, var(--yr-brand) 12%, transparent), transparent 55%),
                radial-gradient(820px 380px at 90% 10%, color-mix(in srgb, var(--yr-brand2) 10%, transparent), transparent 55%),
                var(--yr-bg);
  }
  .yr-section--final{ padding: 46px 0; }
  .yr-section--final .yr-container{
    display: flex;
    justify-content: center;
  }

  .yr-final{
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    max-width: 960px;
    padding: 22px 18px;
    border-radius: var(--yr-radius);
    border: 1px solid var(--yr-border);
    background: var(--yr-panel2);
    box-shadow: var(--yr-shadow);
    margin: 0 auto;
  }
  .yr-section__head{ margin-bottom: 16px; }
  
  /* Hero */
  .yr-hero{
    padding: 56px 0 32px;
    background: radial-gradient(1200px 600px at 15% 10%, color-mix(in srgb, var(--yr-brand) 18%, transparent), transparent 55%),
                radial-gradient(900px 500px at 80% 20%, color-mix(in srgb, var(--yr-brand2) 16%, transparent), transparent 55%),
                var(--yr-bg);
  }
  .yr-hero__grid{
    display: grid;
    grid-template-columns: 1.15fr .85fr;
    gap: 22px;
    align-items: start;
  }
  .yr-hero__card{
    background: linear-gradient(180deg, color-mix(in srgb, var(--yr-panel) 70%, white), var(--yr-panel2));
    border: 1px solid var(--yr-border);
    border-radius: var(--yr-radius);
    box-shadow: var(--yr-shadow);
    padding: 14px;
  }
  .yr-photo{
    height: 280px;
    border-radius: 16px;
    background: color-mix(in srgb, var(--yr-panel) 60%, white);
    border: 1px dashed color-mix(in srgb, var(--yr-border) 70%, transparent);
    background-image: url('../img/javier_ruiz_gomez.Master_trainer_.png');
    background-size: cover;
    background-position: center;
    margin-bottom: 12px;
    /* Para usar tu imagen:
       background-image:url('/ruta/tu-foto.jpg');
       background-size:cover;
       background-position:center;
    */
  }
  
  .yr-quote{
    margin: 0 0 12px;
    padding: 12px 12px;
    border-left: 3px solid color-mix(in srgb, var(--yr-brand) 35%, transparent);
    color: var(--yr-text);
    background: color-mix(in srgb, var(--yr-panel) 70%, white);
    border-radius: 12px;
  }
  
  .yr-badges{ display: flex; gap: 8px; flex-wrap: wrap; }
  .yr-badge{
    font-size: 12px;
    padding: 6px 10px;
    border-radius: 999px;
    border: 1px solid var(--yr-border);
    background: color-mix(in srgb, var(--yr-panel) 70%, white);
    color: var(--yr-text);
  }
  
  /* Cards / grids */
  .yr-card{
    background: var(--yr-panel);
    border: 1px solid var(--yr-border);
    border-radius: var(--yr-radius);
    box-shadow: var(--yr-shadow);
    padding: 16px;
  }
  .yr-card-sin{
    background: #f8fafc;
    border: 1px solid var(--yr-border);
    border-radius: var(--yr-radius);
    padding: 16px;
  }
  .yr-card--soft{ background: var(--yr-panel2); }
  
  .yr-grid2{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
  }
  .yr-grid3{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
  }
  
  /* Lists */
  .yr-list{
    margin: 10px 0 0;
    padding-left: 18px;
    color: var(--yr-text);
  }
  .yr-list li{ margin: 8px 0; }
  .yr-list--cols{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px 22px;
  }
  
  /* Prose */
  .yr-prose p{ margin: 0 0 10px; line-height: 1.7; color: var(--yr-text); }
  
  /* Timeline */
  .yr-timeline{
    margin-top: 14px;
    display: grid;
    gap: 12px;
  }
  .yr-timeline__item{
    display: grid;
    grid-template-columns: 14px 1fr;
    gap: 10px;
    align-items: start;
  }
  .yr-timeline__dot{
    width: 10px; height: 10px;
    margin-top: 6px;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--yr-brand), var(--yr-brand2));
  }
  .yr-timeline__title{
    margin: 0 0 2px;
    font-weight: 750;
    color: var(--yr-text);
  }
  
  /* Highlight block */
  .yr-highlight{
    display: grid;
    grid-template-columns: 1.2fr .8fr;
    gap: 14px;
    padding: 18px;
    border-radius: var(--yr-radius);
    border: 1px solid var(--yr-border);
    background: linear-gradient(135deg, color-mix(in srgb, var(--yr-brand) 12%, white), color-mix(in srgb, var(--yr-brand2) 10%, white));
    box-shadow: var(--yr-shadow);
  }
  .yr-highlight__aside{
    background: color-mix(in srgb, var(--yr-panel) 70%, white);
    border: 1px solid var(--yr-border);
    border-radius: 16px;
    padding: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
  }
  .yr-quote2{
    margin: 0;
    font-size: 16px;
    line-height: 1.6;
    color: var(--yr-text);
  }
  .yr-quote2--title{
    font-size: clamp(20px, 2.2vw, 28px);
    line-height: 1.35;
    font-weight: 650;
  }
  
  /* Tags list */
  .yr-tags{
    list-style: none;
    padding: 0;
    margin: 10px 0 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }
  .yr-tags li{
    padding: 7px 10px;
    border-radius: 999px;
    border: 1px solid var(--yr-border);
    background: color-mix(in srgb, var(--yr-panel) 70%, white);
    color: var(--yr-text);
    font-size: 12px;
  }
  
  /* Trust band */
  .yr-trust{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 18px;
    border-radius: var(--yr-radius);
    border: 1px solid var(--yr-border);
    background: linear-gradient(135deg, color-mix(in srgb, var(--yr-brand) 14%, white), color-mix(in srgb, var(--yr-brand2) 10%, white));
    box-shadow: var(--yr-shadow);
  }
  .yr-trust__cta{ flex: 0 0 auto; }
  
  /* Final */
  .yr-final{
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: 22px 18px;
    border-radius: var(--yr-radius);
    border: 1px solid var(--yr-border);
    background: var(--yr-panel2);
    box-shadow: var(--yr-shadow);
  }
  
  /* Responsive */
  @media (max-width: 960px){
    .yr-hero__grid{ grid-template-columns: 1fr; }
    .yr-grid2{ grid-template-columns: 1fr; }
    .yr-grid3{ grid-template-columns: 1fr; }
    .yr-highlight{ grid-template-columns: 1fr; }
    .yr-list--cols{ grid-template-columns: 1fr; }
    .yr-trust{ flex-direction: column; align-items: flex-start; }
  }
  
/* sobre mi fondo foto ***/
/* Foto en la card de autoridad */
.yr-photoWrap{
  width: 100%;
  border-radius: 16px;
  overflow: hidden;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
}

.yr-photoImg{
  width: 100%;
  height: 280px;          /* ajusta si quieres 240/300 */
  object-fit: cover;
  object-position: center top;
  display: block;
}
@media (max-width: 900px){
  .yr-photoImg{ height: 220px; }
}
.cta-center{
  text-align: center;
}


/******************* titulos ****************************/
h1 {
  font-family: var(--font-primary-titulos);
  /*font-size: clamp(3rem, 6vw, 4.8rem);*/
  font-style: normal;
  /*font-weight: 700;*/
  color: var(--color-primary);
  margin-bottom: var(--spacing-md);
  line-height: 1.1;
}


h2 {
  font-family: var(--font-primary-titulos);
  font-size: clamp(1.6rem, 2.5vw, 2rem);
  font-style: normal;
  font-weight: 600;
  color: var(--color-primary);
  margin-bottom: var(--spacing-sm);
  line-height: 1.25;
}

h3 {
  font-family: var(--font-primary-titulos);
  font-size: clamp(1.1rem, 1.8vw, 1.3rem);
  font-style: italic;
  font-weight: 400;
  color: var(--color-primary);
  margin-bottom: var(--spacing-xs);
  line-height: 1.5;
}

h4 {
  font-family: var(--font-primary-texto);
  font-size: clamp(0.95rem, 1.5vw, 1.05rem);
  font-style: normal;
  font-weight: 500;
  color: var(--color-primary-soft);
  margin-bottom: var(--spacing-xs);
  line-height: 1.4;
}

h5 {
  font-family: var(--font-primary-texto);
  font-size: clamp(0.85rem, 1.3vw, 0.95rem);
  font-style: normal;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-primary-soft);
  margin-bottom: var(--spacing-xxs);
  line-height: 1.3;
}
em {
  font-style: italic;
  letter-spacing: -0.01em;

}
strong {
  color: var(--color-strong);
  font-weight: 500;
}
p strong, span strong {
  font-weight: 600;
}

li strong {
  font-weight: 700;
}
@media (max-width: 700px) {
  .yr-section--final {
    margin-left: .75rem;
    margin-right: .75rem;}
  .footer .site-footer .site-footer__top .site-wrapper {
    padding-left: 2rem;
    padding-right: 2rem;
    }
  
}

/* Cita editorial */
.yr-quote {
  margin: var(--spacing-md) 0;
  padding: calc(var(--spacing-md) + 4px) var(--spacing-md);
  border-left: 4px solid var(--color-primary);
  background: rgba(45, 90, 74, 0.06);
  border-radius: 10px;
}

.yr-quote__text {
  margin: 0;
  font-family: var(--font-primary-titulos);
  font-size: clamp(1.1rem, 2vw, 1.35rem);
  font-style: italic;
  font-weight: 500;
  color: var(--color-primary);
  line-height: 1.45;
}

.yr-quote__caption {
  margin-top: var(--spacing-xs);
  font-family: var(--font-primary-texto);
  font-size: clamp(0.85rem, 1.3vw, 0.95rem);
  font-weight: 500;
  color: var(--color-primary-soft);
  opacity: 0.95;
}
/* Cita editorial centrada */
.yr-quote--center {
  max-width: 760px;
  margin: var(--spacing-lg) auto;
  padding: var(--spacing-md) var(--spacing-lg);
  text-align: center;
  border-left: none;
  border-top: 2px solid var(--color-primary);
  background: rgba(45, 90, 74, 0.05);
  border-radius: 12px;
}

.yr-quote--center .yr-quote__text {
  margin: 0;
  font-family: var(--font-primary-titulos);
  font-size: clamp(1.15rem, 2.2vw, 1.45rem);
  font-style: italic;
  font-weight: 500;
  color: var(--color-primary);
  line-height: 1.5;
}

.yr-quote--center .yr-quote__caption {
  margin-top: var(--spacing-sm);
  font-family: var(--font-primary-texto);
  font-size: clamp(0.8rem, 1.2vw, 0.9rem);
  font-weight: 500;
  color: var(--color-primary-soft);
}
  .yr-cta-row{
  display:flex;
  align-items:center;
  justify-content:center;
  gap: var(--spacing-sm);
  flex-wrap: wrap;
  margin-top: var(--spacing-md);
}

  .yr-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 0.75rem 1.15rem;
  border-radius: 999px;
  text-decoration:none;
  font-family: var(--font-primary-texto);
  font-weight:600;
  line-height:1;
}

.yr-btn--primary{
  background: var(--color-primary);
  color: #fff;
}

.yr-link{
  font-family: var(--font-primary-texto);
  font-weight:600;
  color: var(--color-primary);
  text-decoration: none;
  padding: 0.25rem 0.2rem;
}

  .yr-link:hover{
  text-decoration: underline;
}
/*************************************** blog de la home***************************************/
/*
.home-blog { background:#f8fafc; padding:64px 0 }
.home-blog__inner { max-width:1100px; margin:0 auto; padding:0 18px }
.home-blog__header h2 { margin:0 0 8px }
.home-blog__header p { color:#64748b; max-width:70ch }

.home-blog__list { display:flex; flex-direction:column; gap:22px; margin-top:32px }

.home-blog__item {
  display:flex;
  gap:20px;
  background:#fff;
  border:1px solid #e2e8f0;
  border-radius:16px;
  padding:16px;
}

.home-blog__media { flex:0 0 120px }
.home-blog__media img {
  width:120px; height:80px;
  object-fit:cover;
  border-radius:12px;
}

.home-blog__content h3 {
  margin:0 0 6px;
  font-size:18px;
}

.home-blog__content p {
  margin:6px 0 10px;
  color:#475569;
  line-height:1.5;
}

.home-blog__meta {
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

.home-blog__link {
  font-weight:700;
  color:#1f7a8c;
  text-decoration:none;
}

@media (max-width:640px) {
  .home-blog__item { flex-direction:column }
  .home-blog__media img { width:100%; height:auto }
} */
.home-blog{padding:42px 0}
.home-blog__inner{max-width:1100px;margin:0 auto;padding:0 18px}
.home-blog__header p{color:#64748b;max-width:70ch}
.home-blog__list{display:flex;flex-direction:column;gap:18px;margin-top:22px}
.home-blog__item{display:flex;gap:18px;background:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:14px}
.home-blog__media{flex:0 0 120px}
.home-blog__media img{width:120px;height:80px;object-fit:cover;border-radius:12px;display:block}
.home-blog__title{margin:0 0 6px;font-size:18px;line-height:1.25}
.home-blog__title a{text-decoration:none;color:#0f172a;font-weight:900}
.home-blog__title a:hover{color:#1f7a8c}
.home-blog__meta{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 8px}
.home-blog__excerpt{margin:0 0 10px;color:#475569;line-height:1.5}
.home-blog__link{font-weight:800;text-decoration:none;color:#1f7a8c}
.home-blog__footer{max-width:1100px;margin:0 auto;padding:0 18px;}
@media(max-width:640px){
  .home-blog__item{flex-direction:column}
  .home-blog__media{flex:0 0 auto}
  .home-blog__media img{width:100%;height:auto}
}

/* Blog privado en panel: estilo igual al articulo publico */
#workspacePanel{
  --yr-bg: #f8fafc;
  --yr-surface: #ffffff;
  --yr-text: #0f172a;
  --yr-muted: #64748b;
  --yr-border: #e2e8f0;
  --yr-accent: #1f7a8c;
  --yr-shadow: 0 18px 40px rgba(15,23,42,0.08);
  --yr-radius: 16px;
  --yr-read: 760px;
}
#workspacePanel .yr-wrap{
  max-width: var(--yr-read);
  margin: 16px auto 24px;
  padding: 0 18px;
}
#workspacePanel .yr-card{
  background: var(--yr-surface);
  border-radius: var(--yr-radius);
  box-shadow: var(--yr-shadow);
  padding: 34px;
}
@media (max-width: 640px){
  #workspacePanel .yr-card{ padding: 22px; border-radius: 14px; }
}
#workspacePanel .yr-h1{ margin: 0 0 10px; font-size: clamp(26px, 4vw, 40px); line-height: 1.15; }
#workspacePanel .yr-meta{
  display:flex; flex-wrap:wrap; gap: 12px;
  color: var(--yr-muted);
  font-size: 14px;
  margin-bottom: 18px;
}
#workspacePanel .yr-views{
  display:inline-flex;
  align-items:center;
  gap:6px;
  white-space: nowrap;
}
#workspacePanel .yr-views svg{ width:16px; height:16px; opacity:.9; }
#workspacePanel .yr-cover{ margin: 18px 0 26px; }
#workspacePanel .yr-cover img{ width:100%; display:block; border-radius: 14px; }
#workspacePanel .yr-excerpt{
  margin: 0 0 18px;
  font-weight: 700;
  color: var(--yr-text);
}
#workspacePanel .yr-body{
  line-height: 1.85;
  font-size: 18px;
  color: var(--yr-text);
}
#workspacePanel .yr-body p{ margin: 0 0 16px; }
#workspacePanel .yr-body h2{ margin: 30px 0 12px; font-size: 24px; line-height: 1.25; }
#workspacePanel .yr-body h3{ margin: 24px 0 10px; font-size: 20px; line-height: 1.25; }
#workspacePanel .yr-body ul,
#workspacePanel .yr-body ol{ padding-left: 22px; margin: 0 0 16px; }
#workspacePanel .yr-body blockquote{
  margin: 20px 0;
  padding: 14px 16px;
  border-left: 4px solid var(--yr-border);
  color: var(--yr-muted);
  background: #f1f5f9;
  border-radius: 12px;
}
#workspacePanel .yr-body a{
  font-weight: 700;
  text-decoration: none;
  border-bottom: 1px solid rgba(31,122,140,.35);
  color: var(--yr-accent);
}
#workspacePanel .yr-body a:hover{ border-bottom-color: rgba(31,122,140,.8); }
#workspacePanel .yr-nav{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  margin-top: 28px;
  padding-top: 22px;
  border-top: 1px solid var(--yr-border);
}
#workspacePanel .yr-nav__link{
  padding: 10px 14px;
  border: 1px solid #cbd5e1;
  border-radius: 12px;
  text-decoration:none;
  color: var(--yr-text);
  background: #fff;
  font-weight: 800;
}
#workspacePanel .yr-nav__link:hover{
  background: var(--yr-accent);
  color: #fff;
  border-color: var(--yr-accent);
}
#workspacePanel .yr-nav__disabled{
  padding: 10px 14px;
  border: 1px solid var(--yr-border);
  border-radius: 12px;
  color: #94a3b8;
  font-weight: 800;
}

/* Recursos Mi Espacio: imagen a 100% */
.resource-card__image {
  width: 100%;
  line-height: 0;
}
.resource-card__image img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}
.resource-detail__image {
  width: 100%;
  line-height: 0;
}
.resource-detail__image img {
  width: 100%;
  height: auto;
  object-fit: cover;
  display: block;
}

/* Usuarios v2 form */
#workspacePanel .yr-form{
  display: flex;
  flex-direction: column;
  gap: 18px;
}
#workspacePanel .yr-grid{
  display: grid;
  gap: 16px 18px;
}
#workspacePanel .yr-grid--2{
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
#workspacePanel .yr-grid--3{
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
#workspacePanel .yr-field{
  position: relative;
  display: flex;
  flex-direction: column;
}
#workspacePanel .yr-field > label{
  position: absolute;
  top: -9px;
  left: 12px;
  padding: 0 6px;
  font-size: 12px;
  line-height: 1;
  color: var(--yr-muted);
  background: var(--yr-surface, #fff);
  border-radius: 10px;
  letter-spacing: 0.02em;
}
#workspacePanel .yr-field input,
#workspacePanel .yr-field select,
#workspacePanel .yr-field textarea{
  width: 100%;
  padding: 14px 12px 12px;
  border: 1px solid var(--yr-border);
  border-radius: 12px;
  background: var(--yr-surface, #fff);
  color: var(--yr-text);
}
#workspacePanel .yr-field input:focus,
#workspacePanel .yr-field select:focus,
#workspacePanel .yr-field textarea:focus{
  outline: none;
  border-color: var(--yr-accent);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--yr-accent) 25%, transparent);
}
#workspacePanel .yr-switch{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 12px 12px;
  border: 1px solid var(--yr-border);
  border-radius: 12px;
  background: var(--yr-surface, #fff);
}
#workspacePanel .yr-switch span{
  white-space: nowrap;
}
#workspacePanel .yr-switch span{
  white-space: nowrap;
}

#workspacePanel .yr-roles{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px 16px;
  margin-top: 10px;
}
#workspacePanel .yr-checkbox{
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border: 1px solid var(--yr-border);
  border-radius: 10px;
  background: color-mix(in srgb, var(--yr-surface, #fff) 92%, var(--yr-accent) 8%);
}
#workspacePanel .yr-actions{
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
#workspacePanel .yr-crud{
  display: flex;
  flex-direction: column;
  gap: 16px;
}
#workspacePanel .yr-crud__header{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
#workspacePanel .yr-crud__header h3{
  margin: 0;
}
#workspacePanel .yr-crud__filters{
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items: center;
}
#workspacePanel .yr-crud__filters input,
#workspacePanel .yr-crud__filters select{
  padding: 10px 12px;
  border: 1px solid var(--yr-border);
  border-radius: 10px;
  background: var(--yr-surface, #fff);
}
#workspacePanel .yr-crud__table{
  border: 1px solid var(--yr-border);
  border-radius: 14px;
  overflow: hidden;
  background: var(--yr-surface, #fff);
  box-shadow: var(--yr-shadow);
}
#workspacePanel .yr-crud__table table{
  width: 100%;
  border-collapse: collapse;
}
#workspacePanel .yr-crud__table thead{
  background: color-mix(in srgb, var(--yr-accent) 12%, var(--yr-surface, #fff));
}
#workspacePanel .yr-crud__table th,
#workspacePanel .yr-crud__table td{
  padding: 12px 14px;
  border-bottom: 1px solid var(--yr-border);
  text-align: left;
  font-size: 14px;
}
#workspacePanel .yr-crud__table tbody tr:hover{
  background: color-mix(in srgb, var(--yr-accent) 8%, transparent);
}
#workspacePanel .yr-crud__table .btn{
  padding: 6px 10px;
  border-radius: 8px;
  border: 1px solid var(--yr-border);
  background: var(--yr-surface, #fff);
  cursor: pointer;
}

/* Mi espacio - Mis tests */
.tab-mis-tests {
  background-image: url('/escuela/img/cards/yoga-risa-6.png');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  min-height: 190px;
  width: 100%;
  padding: 24px;
  border-radius: 14px;
  position: relative;
  color: #ffffff;
  overflow: hidden;
}
.tab-mis-tests::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(2, 10, 18, 0.55), rgba(2, 10, 18, 0.35));
  pointer-events: none;
}
.tab-mis-tests > * {
  position: relative;
  z-index: 1;
}
