/*
Theme Name: CLEMiC Theme
Theme URI: https://clemic.com.ar
Author: Posicionarte en Internet
Author URI: https://posicionarte.com.ar
Description: Tema personalizado para la Cooperativa Limitada de Electricidad de Mina Clavero (CLEMiC). Diseño moderno, accesible y adaptable a todos los dispositivos.
Version: 1.1.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: clemic-theme
Tags: cooperative, responsive, custom-colors, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready
*/

/* =====================================================
   VARIABLES DE COLOR Y TIPOGRAFÍA
   ===================================================== */
:root {
    /* Colores de marca principal */
    --color-navy:        #1A3A6B;
    --color-navy-dark:   #0F1E3D;
    --color-navy-light:  #2A4D85;

    /* Colores por servicio (Pantone) */
    --color-energia:     #43B02A;  /* Pantone 7738 C – Energía Eléctrica */
    --color-sepelio:     #2C6FAA;  /* Pantone 7687 C – Sepelio */
    --color-ambulancia:  #F4831F;  /* Pantone 158 C  – Ambulancia */
    --color-comunicacion:#6B3FA0;  /* Pantone 7648 C – Comunicación / Museo Virtual */
    --color-salud:       #00B0AD;  /* Pantone 326 C  – Plan Salud */
    --color-fisiatria:   #FFC20E;  /* Pantone 116 C  – Fisiatría */
    --color-museo:       #6B3FA0;  /* Pantone 7648 C – Museo Virtual CLEMiC */

    /* Colores neutros */
    --color-white:       #FFFFFF;
    --color-gray-50:     #F8F9FA;
    --color-gray-100:    #F1F3F5;
    --color-gray-200:    #E9ECEF;
    --color-gray-400:    #ADB5BD;
    --color-gray-600:    #6C757D;
    --color-gray-800:    #343A40;
    --color-text:        #1A1A2E;

    /* Tipografía */
    --font-sans:    'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
    --font-size-xs: 0.75rem;    /* 12px */
    --font-size-sm: 0.875rem;   /* 14px */
    --font-size-base: 1rem;     /* 16px */
    --font-size-lg: 1.125rem;   /* 18px */
    --font-size-xl: 1.25rem;    /* 20px */
    --font-size-2xl: 1.5rem;    /* 24px */
    --font-size-3xl: 1.875rem;  /* 30px */
    --font-size-4xl: 2.25rem;   /* 36px */

    /* Espaciado */
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-6: 1.5rem;
    --space-8: 2rem;
    --space-12: 3rem;
    --space-16: 4rem;
    --space-5: 1.25rem;
    --space-7: 1.75rem;
    --space-9: 2.25rem;
    --space-10: 2.5rem;
    --space-11: 2.75rem;
    --space-14: 3.5rem;
    --space-20: 5rem;
    --space-24: 6rem;

    /* Bordes */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --radius-xl: 16px;
    --radius-full: 9999px;

    /* Sombras */
    --shadow-sm: 0 1px 3px rgba(0,0,0,0.08);
    --shadow-md: 0 4px 16px rgba(0,0,0,0.10);
    --shadow-lg: 0 8px 32px rgba(0,0,0,0.12);

    /* Layout */
    --container-max: 1200px;
    --container-pad: 1.5rem;

    /* Transiciones */
    --transition: 0.2s ease;
}

/* =====================================================
   RESET Y BASE
   ===================================================== */
*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
}

body {
    font-family: var(--font-sans);
    font-size: var(--font-size-base);
    line-height: 1.6;
    color: var(--color-text);
    background-color: var(--color-white);
    -webkit-font-smoothing: antialiased;
}

img, video {
    max-width: 100%;
    height: auto;
    display: block;
}

a {
    color: var(--color-navy);
    text-decoration: none;
    transition: color var(--transition), opacity var(--transition);
}

a:hover { color: var(--color-energia); }

ul, ol { list-style: none; }

button, input, select, textarea {
    font-family: inherit;
    font-size: inherit;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 600;
    line-height: 1.25;
    color: var(--color-navy);
}

p { margin-bottom: var(--space-4); }
p:last-child { margin-bottom: 0; }

/* =====================================================
   UTILIDADES
   ===================================================== */
.container {
    max-width: var(--container-max);
    margin-inline: auto;
    padding-inline: var(--container-pad);
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border: 0;
}

.btn {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: 0.65rem 1.4rem;
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
    font-weight: 600;
    cursor: pointer;
    border: 2px solid transparent;
    transition: all var(--transition);
    text-decoration: none;
    line-height: 1;
}

.btn-primary {
    background: var(--color-energia);
    color: var(--color-white);
    border-color: var(--color-energia);
}
.btn-primary:hover {
    background: #38961F;
    border-color: #38961F;
    color: var(--color-white);
}

.btn-outline {
    background: transparent;
    color: var(--color-white);
    border-color: rgba(255,255,255,0.4);
}
.btn-outline:hover {
    background: rgba(255,255,255,0.1);
    color: var(--color-white);
}

.btn-secondary {
    background: var(--color-navy);
    color: var(--color-white);
    border-color: var(--color-navy);
}
.btn-secondary:hover {
    background: var(--color-navy-light);
    border-color: var(--color-navy-light);
    color: var(--color-white);
}

.section-title {
    font-size: var(--font-size-2xl);
    font-weight: 700;
    color: var(--color-navy);
    position: relative;
    padding-left: 1rem;
}
.section-title::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 100%;
    background: var(--color-energia);
    border-radius: 2px;
}

.section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--space-8);
}

.section-link {
    font-size: var(--font-size-sm);
    color: var(--color-sepelio);
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
}
.section-link:hover { color: var(--color-navy); }
.section-link svg { width: 16px; height: 16px; }

/* =====================================================
   TOP BAR
   ===================================================== */
.site-topbar {
    background: var(--color-navy-dark);
    color: rgba(255,255,255,0.75);
    font-size: var(--font-size-xs);
    padding: 0.4rem 0;
}

.site-topbar .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
}

.topbar-contact {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    flex-wrap: wrap;
}

.topbar-contact a {
    color: rgba(255,255,255,0.75);
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
}
.topbar-contact a:hover { color: var(--color-energia); }

.topbar-social {
    display: flex;
    align-items: center;
    gap: var(--space-3);
}

.topbar-social a {
    color: rgba(255,255,255,0.6);
    display: flex;
    align-items: center;
    font-size: 0.875rem;
}
.topbar-social a:hover { color: var(--color-energia); }
.topbar-social a svg { width: 15px; height: 15px; }

/* =====================================================
   HEADER
   ===================================================== */
.site-header {
    background: var(--color-white);
    border-bottom: 1px solid var(--color-gray-200);
    position: sticky;
    top: 0;
    z-index: 100;
    box-shadow: var(--shadow-sm);
}

.site-header .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    gap: var(--space-6);
}

.site-logo {
    flex-shrink: 0;
}

.site-logo img {
    height: 52px;
    width: auto;
}

.site-logo .logo-text {
    display: flex;
    flex-direction: column;
}

.site-logo .logo-name {
    font-size: 1.6rem;
    font-weight: 800;
    color: var(--color-navy);
    line-height: 1;
}

.site-logo .logo-tagline {
    font-size: 0.6rem;
    color: var(--color-gray-600);
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

/* Navegación principal */
.primary-navigation {
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.primary-navigation ul {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    list-style: none;
}

.primary-navigation > ul > li {
    position: relative;
}

.primary-navigation > ul > li > a {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 0.5rem 0.75rem;
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--color-navy);
    transition: background var(--transition), color var(--transition);
}

.primary-navigation > ul > li > a:hover,
.primary-navigation > ul > li.current-menu-item > a {
    background: var(--color-gray-100);
    color: var(--color-energia);
}

/* Dropdown */
.primary-navigation ul ul {
    display: none;
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    min-width: 220px;
    background: var(--color-white);
    border: 1px solid var(--color-gray-200);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-md);
    padding: var(--space-2);
    flex-direction: column;
    gap: 2px;
    z-index: 200;
}

.primary-navigation ul li:hover > ul,
.primary-navigation ul li:focus-within > ul {
    display: flex;
}

.primary-navigation ul ul li a {
    display: block;
    padding: 0.5rem 0.75rem;
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
    color: var(--color-gray-800);
}

.primary-navigation ul ul li a:hover {
    background: var(--color-gray-100);
    color: var(--color-navy);
}

/* CTA Factura */
.nav-cta {
    margin-left: var(--space-3);
}

/* Hamburger */
.menu-toggle {
    display: none;
    background: none;
    border: none;
    cursor: pointer;
    padding: var(--space-2);
    color: var(--color-navy);
}

.menu-toggle span {
    display: block;
    width: 22px;
    height: 2px;
    background: currentColor;
    margin: 5px 0;
    transition: all var(--transition);
}

/* =====================================================
   HERO
   ===================================================== */
.site-hero {
    background: var(--color-navy);
    color: var(--color-white);
    padding: var(--space-16) 0;
    position: relative;
    overflow: hidden;
}

.hero-decoration {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
}

.hero-decoration-1 {
    width: 500px;
    height: 500px;
    background: var(--color-energia);
    opacity: 0.06;
    top: -150px;
    right: -100px;
}

.hero-decoration-2 {
    width: 300px;
    height: 300px;
    background: var(--color-salud);
    opacity: 0.05;
    bottom: -100px;
    right: 200px;
}

.hero-decoration-3 {
    width: 200px;
    height: 200px;
    background: var(--color-ambulancia);
    opacity: 0.04;
    top: 50px;
    left: -50px;
}

.hero-inner {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: var(--space-12);
    align-items: center;
}

.hero-badge {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: var(--radius-full);
    padding: 0.35rem 1rem;
    font-size: var(--font-size-xs);
    color: rgba(255,255,255,0.75);
    margin-bottom: var(--space-4);
}

.hero-badge-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--color-energia);
    flex-shrink: 0;
}

.hero-eyebrow {
    font-size: var(--font-size-xs);
    font-weight: 600;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--color-energia);
    margin-bottom: var(--space-3);
}

.hero-title {
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 800;
    color: var(--color-white);
    line-height: 1.15;
    margin-bottom: var(--space-4);
}

.hero-title em {
    font-style: normal;
    color: var(--color-energia);
}

.hero-description {
    font-size: var(--font-size-lg);
    color: rgba(255,255,255,0.70);
    line-height: 1.7;
    margin-bottom: var(--space-8);
    max-width: 520px;
}

.hero-actions {
    display: flex;
    gap: var(--space-3);
    flex-wrap: wrap;
}

.hero-dots {
    display: flex;
    gap: var(--space-2);
    margin-top: var(--space-8);
}

.hero-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: rgba(255,255,255,0.25);
    border: none;
    cursor: pointer;
    padding: 0;
    transition: all var(--transition);
}

.hero-dot.active {
    width: 24px;
    border-radius: 4px;
    background: var(--color-energia);
}

/* Tarjeta lateral del hero */
.hero-card {
    background: rgba(255,255,255,0.07);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: var(--radius-xl);
    padding: var(--space-6);
    min-width: 200px;
    flex-shrink: 0;
}

.hero-stat {
    text-align: center;
    padding: var(--space-3) 0;
    border-bottom: 1px solid rgba(255,255,255,0.08);
}

.hero-stat:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.hero-stat-num {
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--color-white);
    line-height: 1;
}

.hero-stat-label {
    font-size: var(--font-size-xs);
    color: rgba(255,255,255,0.55);
    margin-top: 4px;
}

.hero-localities {
    margin-top: var(--space-3);
    text-align: left;
}

.hero-localities p {
    font-size: 0.7rem;
    color: rgba(255,255,255,0.55);
    line-height: 1.9;
    margin: 0;
}

.hero-localities .highlight {
    color: var(--color-energia);
    font-weight: 500;
}

/* =====================================================
   QUICK ACCESS BAR
   ===================================================== */
.quick-access {
    background: var(--color-gray-50);
    border-bottom: 1px solid var(--color-gray-200);
    padding: var(--space-4) 0;
}

.quick-access-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-3);
}

.quick-card {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    background: var(--color-white);
    border: 1px solid var(--color-gray-200);
    border-radius: var(--radius-lg);
    padding: var(--space-3) var(--space-4);
    transition: all var(--transition);
    text-decoration: none;
    color: inherit;
}

.quick-card:hover {
    border-color: var(--color-navy);
    box-shadow: var(--shadow-sm);
    transform: translateY(-2px);
}

.quick-icon {
    width: 40px;
    height: 40px;
    border-radius: var(--radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.quick-icon svg { width: 20px; height: 20px; }

.quick-icon--factura   { background: #E8F5E2; color: var(--color-energia); }
.quick-icon--tramites  { background: #E8F0FB; color: var(--color-sepelio); }
.quick-icon--socios    { background: #FFF3E8; color: var(--color-ambulancia); }
.quick-icon--radio     { background: #F3EAFC; color: var(--color-comunicacion); }

.quick-info .quick-title {
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--color-navy);
    display: block;
}

.quick-info .quick-sub {
    font-size: var(--font-size-xs);
    color: var(--color-gray-600);
}

/* =====================================================
   SECCIÓN SERVICIOS
   ===================================================== */
.section-services {
    padding: var(--space-16) 0;
    background: var(--color-white);
}

.services-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.service-card {
    border-radius: var(--radius-xl);
    padding: var(--space-6);
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    transition: transform var(--transition), box-shadow var(--transition);
    text-decoration: none;
    position: relative;
    overflow: hidden;
}

.service-card::after {
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    width: 80px;
    height: 80px;
    background: rgba(255,255,255,0.08);
    border-radius: 50%;
    transform: translate(30%, 30%);
}

.service-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-lg);
}

.service-card--energia        { background: var(--color-energia); }
.service-card--salud          { background: var(--color-salud); }
.service-card--ambulancia     { background: var(--color-ambulancia); }
.service-card--sepelio        { background: var(--color-sepelio); }
.service-card--comunicacion   { background: var(--color-comunicacion); }
.service-card--fisiatria      { background: var(--color-fisiatria); }
.service-card--fisiatria .service-name,
.service-card--fisiatria .service-desc,
.service-card--fisiatria .service-link { color: #2a1f00; }
.service-card--financiamiento { background: var(--color-navy); }

.service-icon {
    width: 48px;
    height: 48px;
    background: rgba(255,255,255,0.20);
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.service-icon svg {
    width: 26px;
    height: 26px;
    color: var(--color-white);
}

.service-name {
    font-size: var(--font-size-base);
    font-weight: 700;
    color: var(--color-white);
    margin: 0;
}

.service-desc {
    font-size: var(--font-size-sm);
    color: rgba(255,255,255,0.78);
    line-height: 1.5;
    flex: 1;
}

.service-link {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    font-size: var(--font-size-xs);
    font-weight: 600;
    color: rgba(255,255,255,0.85);
    margin-top: auto;
}

.service-link svg { width: 14px; height: 14px; }
.service-link:hover { color: var(--color-white); }

/* =====================================================
   SECCIÓN NOTICIAS
   ===================================================== */
.section-news {
    padding: var(--space-16) 0;
    background: var(--color-gray-50);
}

.news-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-6);
}

.news-card {
    background: var(--color-white);
    border: 1px solid var(--color-gray-200);
    border-radius: var(--radius-xl);
    overflow: hidden;
    transition: all var(--transition);
    display: flex;
    flex-direction: column;
}

.news-card:hover {
    box-shadow: var(--shadow-md);
    transform: translateY(-3px);
    border-color: var(--color-gray-400);
}

.news-thumbnail {
    position: relative;
    aspect-ratio: 16/9;
    overflow: hidden;
    background: var(--color-gray-100);
}

.news-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.news-card:hover .news-thumbnail img {
    transform: scale(1.04);
}

.news-category-badge {
    position: absolute;
    top: var(--space-3);
    left: var(--space-3);
    background: var(--color-navy);
    color: var(--color-white);
    font-size: var(--font-size-xs);
    font-weight: 600;
    padding: 0.2rem 0.6rem;
    border-radius: var(--radius-full);
}

.news-body {
    padding: var(--space-5);
    display: flex;
    flex-direction: column;
    flex: 1;
}

.news-meta {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    font-size: var(--font-size-xs);
    color: var(--color-gray-600);
    margin-bottom: var(--space-3);
}

.news-title {
    font-size: var(--font-size-base);
    font-weight: 700;
    color: var(--color-navy);
    line-height: 1.4;
    margin-bottom: var(--space-3);
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.news-title a {
    color: inherit;
}

.news-title a:hover { color: var(--color-energia); }

.news-excerpt {
    font-size: var(--font-size-sm);
    color: var(--color-gray-600);
    line-height: 1.6;
    margin-bottom: var(--space-4);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    flex: 1;
}

.news-read-more {
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--color-sepelio);
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    margin-top: auto;
}

.news-read-more:hover { color: var(--color-navy); }

/* =====================================================
   TRÁMITES Y GUÍAS (category-tramites.php)
   ===================================================== */
.tramites-main { padding-bottom: var(--space-16); }

.tramites-search-bar {
    padding: var(--space-8) 0 var(--space-6);
}

.tramites-search-form { max-width: 620px; margin: 0 auto; }

.tramites-search-wrap {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    background: #fff;
    border: 2px solid var(--color-gray-200);
    border-radius: var(--radius-full);
    padding: .45rem .45rem .45rem var(--space-4);
    transition: border-color .2s;
}

.tramites-search-wrap:focus-within { border-color: var(--color-energia); }

.tramites-search-wrap > svg { color: var(--color-gray-400); flex-shrink: 0; }

.tramites-search-input {
    flex: 1;
    border: none;
    outline: none;
    font-size: var(--font-size-base);
    color: var(--color-gray-800);
    background: transparent;
    min-width: 0;
}

.tramites-layout {
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: var(--space-8);
    align-items: start;
}

.tramites-sidebar {
    position: sticky;
    top: 100px;
}

.tramites-sidebar-inner {
    background: var(--color-gray-50);
    border-radius: var(--radius-lg);
    padding: var(--space-5);
    border: 1px solid var(--color-gray-200);
}

.tramites-content--full { grid-column: 1 / -1; }

.tramites-grid {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.tramite-card {
    display: grid;
    grid-template-columns: 64px 1fr auto;
    gap: var(--space-5);
    align-items: center;
    background: #fff;
    border: 1px solid var(--color-gray-200);
    border-radius: var(--radius-lg);
    padding: var(--space-5) var(--space-6);
    transition: border-color .2s, box-shadow .2s, transform .15s;
    text-decoration: none;
    color: inherit;
}

.tramite-card:hover {
    border-color: var(--color-energia);
    box-shadow: var(--shadow-md);
    transform: translateX(4px);
}

.tramite-card-icon {
    width: 56px;
    height: 56px;
    background: #eaf5e9;
    color: var(--color-energia);
    border-radius: var(--radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    overflow: hidden;
}

.tramite-card-icon img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.tramite-card-body { min-width: 0; }

.tramite-tag {
    display: inline-block;
    font-size: var(--font-size-xs);
    font-weight: 700;
    color: var(--color-energia);
    text-transform: uppercase;
    letter-spacing: .07em;
    margin-bottom: .3rem;
}

.tramite-title {
    font-size: var(--font-size-lg);
    font-weight: 700;
    color: var(--color-navy);
    margin: 0 0 .4rem;
    line-height: 1.3;
}

.tramite-title a {
    color: inherit;
    text-decoration: none;
}

.tramite-title a:hover { color: var(--color-energia); }

.tramite-excerpt {
    font-size: var(--font-size-sm);
    color: var(--color-gray-600);
    margin: 0 0 .5rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.tramite-meta {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    flex-wrap: wrap;
}

.tramite-updated {
    font-size: var(--font-size-xs);
    color: var(--color-gray-400);
    display: inline-flex;
    align-items: center;
    gap: .3rem;
}

.tramite-card-cta {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    font-size: var(--font-size-sm);
    font-weight: 700;
    color: var(--color-energia);
    white-space: nowrap;
    text-decoration: none;
    padding: .5rem .9rem;
    border: 2px solid var(--color-energia);
    border-radius: var(--radius-full);
    transition: background .15s, color .15s;
    flex-shrink: 0;
}

.tramite-card-cta:hover {
    background: var(--color-energia);
    color: #fff;
}

.tramites-empty {
    text-align: center;
    padding: var(--space-16) var(--space-8);
    color: var(--color-gray-500);
}

.tramites-empty h2 {
    font-size: var(--font-size-xl);
    color: var(--color-navy);
    margin-bottom: var(--space-2);
}

@media (max-width: 768px) {
    .tramites-layout { grid-template-columns: 1fr; }
    .tramites-sidebar { position: static; }
    .tramite-card { grid-template-columns: 52px 1fr; }
    .tramite-card-cta { display: none; }
    .tramite-title a { color: var(--color-energia); }
}

@media (max-width: 480px) {
    .tramite-card { grid-template-columns: 1fr; }
    .tramite-card-icon { display: none; }
}

/* =====================================================
   MUSEO VIRTUAL CLEMiC
   ===================================================== */
.section-museo {
    padding: var(--space-16) 0;
    background: #fff;
    border-top: 4px solid var(--color-museo);
}

.museo-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-6);
}

.museo-card {
    background: var(--color-gray-50);
    border-radius: var(--radius-lg);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform .2s ease, box-shadow .2s ease;
    border: 1px solid var(--color-gray-200);
}

.museo-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-md);
}

.museo-thumbnail {
    position: relative;
    aspect-ratio: 16/9;
    overflow: hidden;
    background: var(--color-gray-100);
}

.museo-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .4s ease;
}

.museo-card:hover .museo-thumbnail img { transform: scale(1.04); }

.museo-thumb-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f0eaf8;
    color: var(--color-museo);
}

.museo-year-badge {
    position: absolute;
    top: var(--space-3);
    right: var(--space-3);
    background: var(--color-museo);
    color: #fff;
    font-size: var(--font-size-xs);
    font-weight: 700;
    padding: .2rem .6rem;
    border-radius: 999px;
    letter-spacing: .05em;
}

.museo-body {
    padding: var(--space-5);
    display: flex;
    flex-direction: column;
    flex: 1;
    gap: var(--space-2);
}

.museo-epoca {
    font-size: var(--font-size-xs);
    font-weight: 600;
    color: var(--color-museo);
    text-transform: uppercase;
    letter-spacing: .08em;
}

.museo-title {
    font-size: var(--font-size-lg);
    font-weight: 700;
    line-height: 1.3;
    margin: 0;
}

.museo-title a {
    color: var(--color-navy);
    text-decoration: none;
}

.museo-title a:hover { color: var(--color-museo); }

.museo-excerpt {
    font-size: var(--font-size-sm);
    color: var(--color-gray-600);
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    flex: 1;
    margin: 0;
}

.museo-read-more {
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--color-museo);
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    margin-top: auto;
    text-decoration: none;
}

.museo-read-more:hover { color: var(--color-navy); }

.museo-empty {
    text-align: center;
    padding: var(--space-16) var(--space-8);
    color: var(--color-gray-500);
}

.museo-empty-icon {
    margin-bottom: var(--space-4);
    opacity: .6;
}

.museo-empty h3 {
    font-size: var(--font-size-xl);
    color: var(--color-navy);
    margin-bottom: var(--space-2);
}

@media (max-width: 1024px) {
    .museo-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 640px) {
    .museo-grid { grid-template-columns: 1fr; }
}

/* =====================================================
   MEMORIAS Y BALANCES (template-memorias.php)
   ===================================================== */
.memorias-section { padding: var(--space-12) 0; }

.memorias-grid {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.memoria-card {
    display: flex;
    align-items: center;
    gap: var(--space-5);
    background: var(--color-gray-50);
    border: 1px solid var(--color-gray-200);
    border-radius: var(--radius-lg);
    padding: var(--space-5) var(--space-6);
    transition: box-shadow .2s ease, border-color .2s ease;
}

.memoria-card:hover {
    box-shadow: var(--shadow-md);
    border-color: var(--color-sepelio);
}

.memoria-card-icon {
    flex-shrink: 0;
    width: 52px;
    height: 52px;
    background: #e8f0fb;
    color: var(--color-sepelio);
    border-radius: var(--radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
}

.memoria-card-info { flex: 1; min-width: 0; }

.memoria-exercise {
    display: inline-block;
    font-size: var(--font-size-xs);
    font-weight: 700;
    color: var(--color-sepelio);
    text-transform: uppercase;
    letter-spacing: .08em;
    margin-bottom: .25rem;
}

.memoria-title {
    font-size: var(--font-size-lg);
    font-weight: 700;
    color: var(--color-navy);
    margin: 0 0 .3rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.memoria-year {
    font-size: var(--font-size-sm);
    color: var(--color-gray-500);
    display: flex;
    align-items: center;
    gap: .3rem;
    margin: 0;
}

.memoria-card-actions { flex-shrink: 0; }

.btn-sm {
    padding: .45rem 1rem;
    font-size: var(--font-size-sm);
    gap: .4rem;
}

.memoria-download {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    white-space: nowrap;
}

.memoria-no-pdf {
    font-size: var(--font-size-sm);
    color: var(--color-gray-400);
    font-style: italic;
}

.memorias-empty {
    text-align: center;
    padding: var(--space-16) var(--space-8);
    color: var(--color-gray-500);
}

.memorias-empty-icon { margin-bottom: var(--space-4); }

.memorias-empty h3 {
    font-size: var(--font-size-xl);
    color: var(--color-navy);
    margin-bottom: var(--space-2);
}

@media (max-width: 640px) {
    .memoria-card {
        flex-wrap: wrap;
        gap: var(--space-3);
    }
    .memoria-card-actions { width: 100%; }
    .memoria-download { width: 100%; justify-content: center; }
}

/* =====================================================
   PAGE HERO — variantes
   ===================================================== */
.page-hero {
    background: var(--color-navy);
    color: #fff;
    padding: var(--space-12) 0 var(--space-10);
}

.page-hero--museo {
    background: linear-gradient(135deg, #2a1a40 0%, var(--color-museo) 100%);
}

.page-hero--institucional {
    background: linear-gradient(135deg, var(--color-navy) 0%, #1a3a6e 100%);
}

.page-hero--tramites {
    background: linear-gradient(135deg, #1a2e1a 0%, #2c5a2e 100%);
}

.page-hero-title {
    font-size: clamp(1.8rem, 4vw, 2.6rem);
    font-weight: 800;
    color: #fff;
    margin: var(--space-3) 0 var(--space-2);
    line-height: 1.15;
}

.page-hero-desc {
    font-size: var(--font-size-lg);
    color: rgba(255,255,255,.8);
    max-width: 640px;
    margin: 0;
}

/* breadcrumbs */
.breadcrumbs {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    color: rgba(255,255,255,.65);
    margin-bottom: var(--space-4);
    flex-wrap: wrap;
}

.breadcrumbs a {
    color: rgba(255,255,255,.75);
    text-decoration: none;
}

.breadcrumbs a:hover { color: #fff; }

/* =====================================================
   MUSEO VIRTUAL — ARCHIVO
   ===================================================== */
.museo-archive-layout {
    display: grid;
    grid-template-columns: 240px 1fr;
    gap: var(--space-10);
    padding: var(--space-12) 0;
    align-items: start;
}

.museo-archive-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-6);
}

.museo-filter-label {
    font-size: var(--font-size-sm);
    color: var(--color-gray-500);
    margin-bottom: var(--space-5);
}

/* sidebar */
.museo-sidebar-inner {
    background: var(--color-gray-50);
    border-radius: var(--radius-lg);
    padding: var(--space-5);
    border: 1px solid var(--color-gray-200);
    position: sticky;
    top: 100px;
}

.museo-sidebar-title {
    font-size: var(--font-size-sm);
    font-weight: 700;
    color: var(--color-navy);
    text-transform: uppercase;
    letter-spacing: .08em;
    margin: 0 0 var(--space-3);
}

.museo-epoca-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: .2rem;
}

.museo-epoca-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .45rem .6rem;
    border-radius: var(--radius-sm);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    text-decoration: none;
    transition: background .15s, color .15s;
}

.museo-epoca-link:hover,
.museo-epoca-link.active {
    background: #f0eaf8;
    color: var(--color-museo);
    font-weight: 600;
}

.museo-epoca-count {
    font-size: var(--font-size-xs);
    color: var(--color-gray-400);
    background: var(--color-gray-100);
    border-radius: 999px;
    padding: .1rem .45rem;
    font-weight: 600;
}

.museo-epoca-link.active .museo-epoca-count {
    background: #e0d0f5;
    color: var(--color-museo);
}

/* =====================================================
   MUSEO VIRTUAL — ENTRADA INDIVIDUAL
   ===================================================== */
.museo-single-layout {
    display: grid;
    grid-template-columns: 1fr 280px;
    gap: var(--space-10);
    padding: var(--space-12) 0;
    align-items: start;
}

.museo-single-meta {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    margin-bottom: var(--space-2);
    flex-wrap: wrap;
}

.museo-single-year {
    font-size: var(--font-size-sm);
    color: rgba(255,255,255,.75);
    display: inline-flex;
    align-items: center;
    gap: .3rem;
}

.museo-single-thumbnail {
    border-radius: var(--radius-lg);
    overflow: hidden;
    margin-bottom: var(--space-8);
}

.museo-single-thumbnail img {
    width: 100%;
    height: auto;
    display: block;
}

.museo-single-thumbnail figcaption {
    font-size: var(--font-size-sm);
    color: var(--color-gray-500);
    padding: var(--space-3) var(--space-4);
    background: var(--color-gray-50);
    font-style: italic;
}

.museo-entry-content {
    font-size: var(--font-size-base);
    line-height: 1.8;
    color: var(--color-gray-800);
}

.museo-entry-content h2,
.museo-entry-content h3 {
    color: var(--color-navy);
    margin-top: var(--space-8);
}

.museo-entry-content img {
    border-radius: var(--radius-md);
    max-width: 100%;
    height: auto;
}

.museo-single-nav {
    margin-top: var(--space-10);
    padding-top: var(--space-8);
    border-top: 1px solid var(--color-gray-200);
}

.museo-back-link {
    margin-top: var(--space-5);
}

.museo-back-link a {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--color-museo);
    text-decoration: none;
}

.museo-back-link a:hover { color: var(--color-navy); }

/* sidebar de historias relacionadas */
.museo-related-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.museo-related-link {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    text-decoration: none;
    padding: var(--space-2);
    border-radius: var(--radius-sm);
    transition: background .15s;
}

.museo-related-link:hover { background: #f0eaf8; }

.museo-related-thumb {
    width: 60px;
    height: 60px;
    border-radius: var(--radius-sm);
    overflow: hidden;
    flex-shrink: 0;
    background: #f0eaf8;
}

.museo-related-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.museo-related-thumb-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-museo);
    opacity: .5;
}

.museo-related-info {
    display: flex;
    flex-direction: column;
    gap: .2rem;
    min-width: 0;
}

.museo-related-title {
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--color-navy);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 1.3;
}

.museo-related-year {
    font-size: var(--font-size-xs);
    color: var(--color-museo);
    font-weight: 600;
}

/* Responsive museo */
@media (max-width: 1024px) {
    .museo-archive-layout { grid-template-columns: 200px 1fr; gap: var(--space-6); }
    .museo-single-layout { grid-template-columns: 1fr 240px; gap: var(--space-6); }
}

@media (max-width: 768px) {
    .museo-archive-layout {
        grid-template-columns: 1fr;
    }
    .museo-sidebar-inner { position: static; }
    .museo-epoca-list { flex-direction: row; flex-wrap: wrap; gap: var(--space-2); }
    .museo-epoca-link { border: 1px solid var(--color-gray-200); }
    .museo-archive-grid { grid-template-columns: 1fr; }

    .museo-single-layout { grid-template-columns: 1fr; }
    .museo-single-sidebar { order: -1; }
    .museo-sidebar-inner { position: static; }
}

/* =====================================================
   BANDA DE ESTADÍSTICAS
   ===================================================== */
.section-stats {
    background: var(--color-navy);
    padding: var(--space-12) 0;
}

.stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
}

.stat-item {
    text-align: center;
    padding: var(--space-6);
    border-right: 1px solid rgba(255,255,255,0.08);
}

.stat-item:last-child { border-right: none; }

.stat-number {
    font-size: clamp(2rem, 3.5vw, 2.75rem);
    font-weight: 800;
    color: var(--color-energia);
    line-height: 1;
    display: block;
}

.stat-label {
    font-size: var(--font-size-sm);
    color: rgba(255,255,255,0.60);
    margin-top: var(--space-2);
    line-height: 1.4;
}

/* =====================================================
   ABOUT / MISIÓN
   ===================================================== */
.section-about {
    padding: var(--space-16) 0;
    background: var(--color-white);
}

.about-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-16);
    align-items: center;
}

.about-image {
    border-radius: var(--radius-xl);
    overflow: hidden;
    aspect-ratio: 4/3;
}

.about-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.about-eyebrow {
    font-size: var(--font-size-xs);
    font-weight: 600;
    color: var(--color-energia);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-bottom: var(--space-3);
}

.about-content .section-title {
    margin-bottom: var(--space-4);
}

.about-content p {
    color: var(--color-gray-600);
    font-size: var(--font-size-base);
    line-height: 1.75;
}

.about-pillars {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-4);
    margin-top: var(--space-8);
}

.pillar {
    background: var(--color-gray-50);
    border-radius: var(--radius-lg);
    padding: var(--space-4);
    border-left: 3px solid var(--color-energia);
}

.pillar-title {
    font-size: var(--font-size-sm);
    font-weight: 700;
    color: var(--color-navy);
    margin-bottom: var(--space-1);
}

.pillar-text {
    font-size: var(--font-size-xs);
    color: var(--color-gray-600);
    line-height: 1.5;
    margin: 0;
}

/* =====================================================
   CTA / BANNER
   ===================================================== */
.section-cta {
    background: var(--color-energia);
    padding: var(--space-12) 0;
}

.cta-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-8);
}

.cta-text h2 {
    font-size: var(--font-size-2xl);
    font-weight: 800;
    color: var(--color-white);
    margin-bottom: var(--space-2);
}

.cta-text p {
    color: rgba(255,255,255,0.85);
    font-size: var(--font-size-base);
    margin: 0;
}

.cta-actions {
    display: flex;
    gap: var(--space-3);
    flex-shrink: 0;
}

.btn-white {
    background: var(--color-white);
    color: var(--color-energia);
    border-color: var(--color-white);
}
.btn-white:hover {
    background: var(--color-gray-100);
    color: var(--color-energia);
}

/* =====================================================
   PREGUNTAS FRECUENTES
   ===================================================== */
.section-faq {
    padding: var(--space-16) 0;
    background: var(--color-gray-50);
}

.faq-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-4);
    margin-top: var(--space-8);
}

.faq-item {
    background: var(--color-white);
    border: 1px solid var(--color-gray-200);
    border-radius: var(--radius-lg);
    overflow: hidden;
}

.faq-question {
    width: 100%;
    background: none;
    border: none;
    padding: var(--space-4) var(--space-5);
    text-align: left;
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--color-navy);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
}

.faq-question:hover { background: var(--color-gray-50); }
.faq-question svg { width: 18px; height: 18px; flex-shrink: 0; transition: transform var(--transition); }
.faq-item.open .faq-question svg { transform: rotate(180deg); }

.faq-answer {
    display: none;
    padding: 0 var(--space-5) var(--space-4);
    font-size: var(--font-size-sm);
    color: var(--color-gray-600);
    line-height: 1.6;
    border-top: 1px solid var(--color-gray-100);
    padding-top: var(--space-3);
}

.faq-item.open .faq-answer { display: block; }

/* =====================================================
   FOOTER
   ===================================================== */
.site-footer {
    background: var(--color-navy-dark);
    padding: var(--space-16) 0 0;
    color: rgba(255,255,255,0.65);
}

.footer-grid {
    display: grid;
    grid-template-columns: 1.6fr 1fr 1fr 1.2fr;
    gap: var(--space-10);
    margin-bottom: var(--space-12);
}

.footer-brand .footer-logo {
    filter: brightness(0) invert(1);
    height: 40px;
    width: auto;
    margin-bottom: var(--space-4);
}

.footer-brand p {
    font-size: var(--font-size-sm);
    line-height: 1.7;
    color: rgba(255,255,255,0.55);
    margin-bottom: var(--space-4);
    max-width: 28ch;
}

.footer-social {
    display: flex;
    gap: var(--space-2);
    flex-wrap: wrap;
}

.footer-social a {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgba(255,255,255,0.08);
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(255,255,255,0.65);
    transition: all var(--transition);
}

.footer-social a:hover {
    background: var(--color-energia);
    color: var(--color-white);
}

.footer-social a svg { width: 16px; height: 16px; }

.footer-col h4 {
    font-size: var(--font-size-sm);
    font-weight: 700;
    color: var(--color-white);
    margin-bottom: var(--space-4);
    padding-bottom: var(--space-2);
    border-bottom: 1px solid rgba(255,255,255,0.08);
}

.footer-col ul li {
    margin-bottom: var(--space-2);
}

.footer-col ul li a {
    font-size: var(--font-size-sm);
    color: rgba(255,255,255,0.55);
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.footer-col ul li a:hover {
    color: var(--color-energia);
}

.footer-contact-item {
    display: flex;
    align-items: flex-start;
    gap: var(--space-2);
    margin-bottom: var(--space-3);
    font-size: var(--font-size-sm);
    color: rgba(255,255,255,0.55);
}

.footer-contact-item svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    margin-top: 2px;
    color: var(--color-energia);
}

.footer-contact-item a {
    color: rgba(255,255,255,0.55);
}

.footer-contact-item a:hover {
    color: var(--color-energia);
}

.footer-bottom {
    border-top: 1px solid rgba(255,255,255,0.07);
    padding: var(--space-4) 0;
}

.footer-bottom-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
    font-size: var(--font-size-xs);
    color: rgba(255,255,255,0.35);
}

.footer-bottom-links {
    display: flex;
    gap: var(--space-4);
}

.footer-bottom-links a {
    font-size: var(--font-size-xs);
    color: rgba(255,255,255,0.35);
}

.footer-bottom-links a:hover { color: var(--color-energia); }

/* =====================================================
   CONTENIDO DE ENTRADAS (BLOG / SINGLE)
   ===================================================== */
.page-hero {
    background: var(--color-navy);
    padding: var(--space-12) 0;
    color: var(--color-white);
}

.page-hero h1 {
    color: var(--color-white);
    font-size: clamp(1.5rem, 3vw, 2.5rem);
    font-weight: 800;
}

.page-hero .breadcrumb {
    margin-top: var(--space-3);
    font-size: var(--font-size-sm);
    color: rgba(255,255,255,0.60);
    display: flex;
    gap: var(--space-2);
    align-items: center;
}

.page-hero .breadcrumb a { color: rgba(255,255,255,0.60); }
.page-hero .breadcrumb a:hover { color: var(--color-white); }

.content-area {
    padding: var(--space-12) 0;
}

.content-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: var(--space-12);
    align-items: start;
}

.entry-content {
    font-size: var(--font-size-base);
    line-height: 1.8;
    color: var(--color-gray-800);
}

.entry-content h2 {
    font-size: var(--font-size-2xl);
    margin: var(--space-8) 0 var(--space-4);
    color: var(--color-navy);
}

.entry-content h3 {
    font-size: var(--font-size-xl);
    margin: var(--space-6) 0 var(--space-3);
    color: var(--color-navy);
}

.entry-content p { margin-bottom: var(--space-4); }

.entry-content ul, .entry-content ol {
    margin: var(--space-4) 0;
    padding-left: var(--space-6);
    list-style: initial;
}

.entry-content ol { list-style: decimal; }

.entry-content li { margin-bottom: var(--space-2); }

.entry-content img {
    border-radius: var(--radius-lg);
    margin: var(--space-6) 0;
}

.entry-content blockquote {
    border-left: 4px solid var(--color-energia);
    padding: var(--space-4) var(--space-6);
    margin: var(--space-6) 0;
    background: var(--color-gray-50);
    border-radius: 0 var(--radius-md) var(--radius-md) 0;
    font-style: italic;
    color: var(--color-gray-600);
}

.entry-content a {
    color: var(--color-sepelio);
    text-decoration: underline;
}

/* Sidebar */
.sidebar { position: sticky; top: 90px; }

.widget {
    background: var(--color-white);
    border: 1px solid var(--color-gray-200);
    border-radius: var(--radius-xl);
    padding: var(--space-5);
    margin-bottom: var(--space-6);
}

.widget-title {
    font-size: var(--font-size-base);
    font-weight: 700;
    color: var(--color-navy);
    margin-bottom: var(--space-4);
    padding-bottom: var(--space-3);
    border-bottom: 2px solid var(--color-energia);
}

/* =====================================================
   ARCHIVE / LISTADO NOTICIAS
   ===================================================== */
.archive-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-6);
}

/* =====================================================
   PAGINACIÓN
   ===================================================== */
.pagination {
    display: flex;
    justify-content: center;
    gap: var(--space-2);
    margin-top: var(--space-12);
}

.pagination a, .pagination span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
    font-weight: 500;
    border: 1px solid var(--color-gray-200);
    background: var(--color-white);
    color: var(--color-navy);
    text-decoration: none;
    transition: all var(--transition);
}

.pagination a:hover,
.pagination .current {
    background: var(--color-navy);
    color: var(--color-white);
    border-color: var(--color-navy);
}

/* =====================================================
   404 PAGE
   ===================================================== */
.error-404 {
    text-align: center;
    padding: var(--space-16) 0;
}

.error-404 .error-num {
    font-size: 8rem;
    font-weight: 900;
    color: var(--color-gray-200);
    line-height: 1;
}

.error-404 h1 {
    font-size: var(--font-size-2xl);
    margin-bottom: var(--space-4);
}

/* =====================================================
   SEARCH FORM
   ===================================================== */
.search-form {
    display: flex;
    gap: var(--space-2);
}

.search-form input[type="search"] {
    flex: 1;
    padding: 0.6rem 1rem;
    border: 1px solid var(--color-gray-200);
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
    outline: none;
    transition: border-color var(--transition);
}

.search-form input[type="search"]:focus {
    border-color: var(--color-navy);
}

.search-form button {
    background: var(--color-navy);
    color: var(--color-white);
    border: none;
    padding: 0.6rem 1rem;
    border-radius: var(--radius-md);
    cursor: pointer;
    font-size: var(--font-size-sm);
    font-weight: 600;
    transition: background var(--transition);
}

.search-form button:hover { background: var(--color-navy-light); }

/* =====================================================
   WHATSAPP FLOATING BUTTON
   ===================================================== */
.whatsapp-float {
    position: fixed;
    bottom: 24px;
    right: 24px;
    z-index: 999;
    background: #25D366;
    color: var(--color-white);
    width: 56px;
    height: 56px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 20px rgba(37,211,102,0.4);
    transition: all var(--transition);
    text-decoration: none;
}

.whatsapp-float:hover {
    transform: scale(1.08);
    color: var(--color-white);
    box-shadow: 0 6px 28px rgba(37,211,102,0.5);
}

.whatsapp-float svg { width: 28px; height: 28px; }

/* =====================================================
   RESPONSIVE
   ===================================================== */
@media (max-width: 1024px) {
    .footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: var(--space-8);
    }
    .about-grid { grid-template-columns: 1fr; }
    .about-image { order: -1; max-height: 350px; }
    .stats-grid { grid-template-columns: repeat(2, 1fr); }
    .stat-item:nth-child(2) { border-right: none; }
}

@media (max-width: 768px) {
    :root { --container-pad: 1rem; }

    .site-topbar .container { flex-direction: column; gap: var(--space-1); text-align: center; }

    .menu-toggle { display: flex; flex-direction: column; }

    .primary-navigation {
        display: none;
        position: fixed;
        inset: 0;
        background: var(--color-navy-dark);
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
        padding: 5rem var(--container-pad) var(--container-pad);
        z-index: 200;
        overflow-y: auto;
    }

    .primary-navigation.is-open { display: flex; }

    .primary-navigation ul {
        flex-direction: column;
        align-items: flex-start;
        width: 100%;
        gap: var(--space-2);
    }

    .primary-navigation > ul > li { width: 100%; }

    .primary-navigation > ul > li > a {
        color: var(--color-white);
        font-size: var(--font-size-lg);
        padding: var(--space-3);
        width: 100%;
    }

    .primary-navigation ul ul {
        position: static;
        box-shadow: none;
        border: none;
        background: rgba(255,255,255,0.05);
        border-radius: var(--radius-md);
        margin-top: var(--space-1);
    }

    .primary-navigation ul ul li a { color: rgba(255,255,255,0.75); }

    .nav-cta { margin: var(--space-4) 0 0; }

    .hero-inner { grid-template-columns: 1fr; }
    .hero-card { display: none; }

    .quick-access-grid { grid-template-columns: repeat(2, 1fr); }

    .services-grid { grid-template-columns: repeat(2, 1fr); }

    .news-grid { grid-template-columns: 1fr; }

    .faq-grid { grid-template-columns: 1fr; }

    .cta-inner { flex-direction: column; text-align: center; }
    .cta-actions { justify-content: center; }

    .footer-grid { grid-template-columns: 1fr; gap: var(--space-8); }

    .content-layout { grid-template-columns: 1fr; }
    .sidebar { position: static; }

    .archive-grid { grid-template-columns: 1fr; }

    .footer-bottom-inner { flex-direction: column; text-align: center; }
}

@media (max-width: 480px) {
    .hero { padding: var(--space-12) 0; }
    .services-grid { grid-template-columns: 1fr; }
    .quick-access-grid { grid-template-columns: 1fr 1fr; }
    .stats-grid { grid-template-columns: repeat(2, 1fr); }
    .section-title { font-size: var(--font-size-xl); }
}

/* =====================================================
   ACCESIBILIDAD
   ===================================================== */
:focus-visible {
    outline: 3px solid var(--color-energia);
    outline-offset: 2px;
    border-radius: 2px;
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
}

/* =====================================================
   WORDPRESS CORE
   ===================================================== */
.alignleft  { float: left; margin: 0 var(--space-4) var(--space-4) 0; }
.alignright { float: right; margin: 0 0 var(--space-4) var(--space-4); }
.aligncenter { display: block; margin: 0 auto var(--space-4); }
.alignwide  { max-width: calc(var(--container-max) + 4rem); margin-inline: auto; }
.alignfull  { width: 100%; max-width: 100%; }

.wp-caption { max-width: 100%; }
.wp-caption-text { font-size: var(--font-size-xs); color: var(--color-gray-600); text-align: center; margin-top: var(--space-1); }

.gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-3); }
.gallery-item img { border-radius: var(--radius-md); }

.sticky { border-left: 4px solid var(--color-energia); padding-left: var(--space-4); }

/* =====================================================
   BANDA DE ESTADÍSTICAS
   ===================================================== */
.section-stats {
    background: var(--color-navy);
    padding: var(--space-12) 0;
}

.stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-8);
    text-align: center;
}

.stat-item {}

.stat-number {
    display: block;
    font-size: clamp(2.5rem, 5vw, 3.5rem);
    font-weight: 800;
    color: #fff;
    line-height: 1;
    margin-bottom: var(--space-2);
}

.stat-label {
    font-size: var(--font-size-sm);
    color: rgba(255,255,255,.65);
    font-weight: 500;
    margin: 0;
}

/* =====================================================
   SECCIÓN NOSOTROS / MISIÓN
   ===================================================== */
.section-about {
    padding: var(--space-20) 0;
    background: #fff;
}

.about-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(2rem, 4vw, 3.5rem);
    align-items: center;
}

.about-image {
    border-radius: var(--radius-xl);
    overflow: hidden;
    aspect-ratio: 4/3;
}

.about-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.about-eyebrow {
    font-size: var(--font-size-sm);
    font-weight: 700;
    color: var(--color-energia);
    text-transform: uppercase;
    letter-spacing: .1em;
    margin: 0 0 var(--space-3);
}

.about-content p {
    color: var(--color-gray-600);
    line-height: 1.7;
    margin-bottom: var(--space-4);
}

.about-pillars {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-4);
    margin-top: var(--space-6);
}

.pillar {
    background: var(--color-gray-50);
    border-radius: var(--radius-md);
    padding: var(--space-4);
    border-left: 3px solid var(--color-energia);
}

.pillar-title {
    font-size: var(--font-size-sm);
    font-weight: 700;
    color: var(--color-navy);
    margin: 0 0 .3rem;
}

.pillar-text {
    font-size: var(--font-size-sm);
    color: var(--color-gray-500);
    margin: 0;
}

/* =====================================================
   PREGUNTAS FRECUENTES
   ===================================================== */
.section-faq {
    padding: var(--space-20) 0;
    background: var(--color-gray-50);
}

.faq-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-4);
    margin-top: var(--space-8);
}

.faq-item {
    background: #fff;
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-gray-200);
    overflow: hidden;
}

.faq-question {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--space-5) var(--space-6);
    background: none;
    border: none;
    font-size: var(--font-size-base);
    font-weight: 600;
    color: var(--color-navy);
    text-align: left;
    cursor: pointer;
    gap: var(--space-4);
    transition: color .2s;
}

.faq-question svg {
    flex-shrink: 0;
    transition: transform .3s ease;
    color: var(--color-energia);
    width: 20px;
    height: 20px;
}

.faq-question[aria-expanded="true"] svg {
    transform: rotate(180deg);
}

.faq-question:hover { color: var(--color-energia); }

.faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height .35s ease;
}

.faq-answer.open { max-height: 400px; }

.faq-answer p {
    padding: 0 var(--space-6) var(--space-5);
    font-size: var(--font-size-sm);
    color: var(--color-gray-600);
    line-height: 1.7;
    margin: 0;
}

/* =====================================================
   BANNER CTA
   ===================================================== */
.section-cta {
    background: linear-gradient(135deg, var(--color-energia) 0%, #2e8a1a 100%);
    padding: var(--space-14) 0;
}

.cta-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-8);
}

.cta-text h2 {
    font-size: clamp(1.5rem, 3vw, 2rem);
    font-weight: 800;
    color: #fff;
    margin: 0 0 var(--space-2);
}

.cta-text p {
    color: rgba(255,255,255,.85);
    font-size: var(--font-size-lg);
    margin: 0;
}

.cta-actions {
    display: flex;
    gap: var(--space-3);
    flex-shrink: 0;
    flex-wrap: wrap;
}

.btn-white {
    background: #fff;
    color: var(--color-energia);
    border: 2px solid #fff;
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: .75rem 1.5rem;
    border-radius: var(--radius-full);
    font-weight: 700;
    font-size: var(--font-size-base);
    text-decoration: none;
    transition: background .2s, color .2s;
}

.btn-white:hover {
    background: transparent;
    color: #fff;
}

/* =====================================================
   FORMULARIO DE BÚSQUEDA
   ===================================================== */
.search-form {
    display: flex;
    gap: var(--space-2);
    max-width: 480px;
}

.search-field {
    flex: 1;
    padding: .6rem var(--space-4);
    border: 2px solid var(--color-gray-200);
    border-radius: var(--radius-full);
    font-size: var(--font-size-base);
    outline: none;
    transition: border-color .2s;
    background: #fff;
    color: var(--color-gray-800);
}

.search-field:focus { border-color: var(--color-energia); }

.search-submit {
    padding: .6rem var(--space-5);
    background: var(--color-energia);
    color: #fff;
    border: none;
    border-radius: var(--radius-full);
    font-weight: 600;
    cursor: pointer;
    transition: background .2s;
}

.search-submit:hover { background: #2e8a1a; }

/* =====================================================
   FOOTER
   ===================================================== */
.site-footer {
    background: var(--color-navy-dark);
    color: rgba(255,255,255,.75);
    padding: var(--space-16) 0 var(--space-6);
}

.footer-grid {
    display: grid;
    grid-template-columns: 1.6fr 1fr 1fr 1.2fr;
    gap: var(--space-10);
    margin-bottom: var(--space-12);
}

.footer-brand .footer-logo {
    display: block;
    margin-bottom: var(--space-4);
}

.footer-brand .footer-logo img {
    max-width: 160px;
    height: auto;
}

.footer-tagline {
    font-size: var(--font-size-sm);
    line-height: 1.6;
    margin-bottom: var(--space-5);
    color: rgba(255,255,255,.6);
}

.footer-social {
    display: flex;
    gap: var(--space-3);
    flex-wrap: wrap;
}

.footer-social a {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,.08);
    border-radius: var(--radius-sm);
    transition: background .2s;
}

.footer-social a:hover { background: var(--color-energia); }

.footer-social svg {
    width: 18px;
    height: 18px;
    fill: rgba(255,255,255,.8);
}

.footer-col-title {
    font-size: var(--font-size-sm);
    font-weight: 700;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: .08em;
    margin: 0 0 var(--space-4);
}

.footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.footer-links a {
    font-size: var(--font-size-sm);
    color: rgba(255,255,255,.6);
    text-decoration: none;
    transition: color .2s;
}

.footer-links a:hover { color: #fff; }

.footer-contact-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.footer-contact-list li {
    font-size: var(--font-size-sm);
    color: rgba(255,255,255,.6);
    display: flex;
    align-items: flex-start;
    gap: var(--space-2);
    line-height: 1.5;
}

.footer-contact-list a {
    color: rgba(255,255,255,.75);
    text-decoration: none;
}

.footer-contact-list a:hover { color: #fff; }

.footer-bottom {
    border-top: 1px solid rgba(255,255,255,.08);
    padding-top: var(--space-6);
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--space-3);
}

.footer-copyright {
    font-size: var(--font-size-xs);
    color: rgba(255,255,255,.4);
    margin: 0;
}

.footer-bottom-links {
    display: flex;
    gap: var(--space-4);
}

.footer-bottom-links a {
    font-size: var(--font-size-xs);
    color: rgba(255,255,255,.4);
    text-decoration: none;
}

.footer-bottom-links a:hover { color: rgba(255,255,255,.7); }

/* =====================================================
   PAGINACIÓN
   ===================================================== */
.pagination-wrap {
    margin-top: var(--space-10);
}

.pagination-wrap ul {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    list-style: none;
    padding: 0;
    margin: 0;
    flex-wrap: wrap;
}

.pagination-wrap li a,
.pagination-wrap li span {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0 var(--space-3);
    border-radius: var(--radius-sm);
    font-size: var(--font-size-sm);
    font-weight: 600;
    text-decoration: none;
    border: 1px solid var(--color-gray-200);
    color: var(--color-gray-700);
    transition: background .15s, border-color .15s, color .15s;
}

.pagination-wrap li a:hover {
    background: var(--color-energia);
    border-color: var(--color-energia);
    color: #fff;
}

.pagination-wrap li span.current {
    background: var(--color-energia);
    border-color: var(--color-energia);
    color: #fff;
}

/* =====================================================
   NAVEGACIÓN ENTRE ENTRADAS (single)
   ===================================================== */
.post-nav-links {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.post-nav-link {
    display: flex;
    flex-direction: column;
    gap: .3rem;
    padding: var(--space-5);
    background: var(--color-gray-50);
    border-radius: var(--radius-lg);
    text-decoration: none;
    border: 1px solid var(--color-gray-200);
    transition: border-color .2s, box-shadow .2s;
}

.post-nav-link:hover {
    border-color: var(--color-energia);
    box-shadow: var(--shadow-sm);
}

.post-nav-next { text-align: right; }

.post-nav-dir {
    display: flex;
    align-items: center;
    gap: .3rem;
    font-size: var(--font-size-xs);
    font-weight: 700;
    color: var(--color-energia);
    text-transform: uppercase;
    letter-spacing: .07em;
}

.post-nav-next .post-nav-dir { justify-content: flex-end; }

.post-nav-title {
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--color-navy);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 1.3;
}

/* =====================================================
   RESPONSIVE GENERAL
   ===================================================== */
@media (max-width: 1024px) {
    .about-grid { grid-template-columns: 1fr; }
    .about-image { max-width: 560px; }
    .faq-grid { grid-template-columns: 1fr; }
    .footer-grid { grid-template-columns: 1fr 1fr; }
    .stats-grid { grid-template-columns: repeat(2, 1fr); gap: var(--space-6); }
}

@media (max-width: 768px) {
    .cta-inner { flex-direction: column; text-align: center; }
    .cta-actions { justify-content: center; }
    .footer-grid { grid-template-columns: 1fr; }
    .footer-bottom { flex-direction: column; text-align: center; }
    .about-pillars { grid-template-columns: 1fr; }
    .post-nav-links { grid-template-columns: 1fr; }
    .post-nav-next { text-align: left; }
    .post-nav-next .post-nav-dir { justify-content: flex-start; }
}

@media (max-width: 480px) {
    .stats-grid { grid-template-columns: repeat(2, 1fr); }
    .section-faq,
    .section-about,
    .section-stats { padding: var(--space-12) 0; }
}

/* =====================================================
   ANIMACIONES Y UTILIDADES
   ===================================================== */
[data-animate] {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity .6s ease, transform .6s ease;
}

[data-animate].animated {
    opacity: 1;
    transform: none;
}

[data-animate][data-delay="100"] { transition-delay: .1s; }
[data-animate][data-delay="200"] { transition-delay: .2s; }
[data-animate][data-delay="300"] { transition-delay: .3s; }
[data-animate][data-delay="400"] { transition-delay: .4s; }

.btn {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: .75rem 1.75rem;
    border-radius: var(--radius-full);
    font-weight: 700;
    font-size: var(--font-size-base);
    text-decoration: none;
    border: 2px solid transparent;
    cursor: pointer;
    transition: background .2s, color .2s, border-color .2s, box-shadow .2s;
    line-height: 1;
}

.btn-primary {
    background: var(--color-energia);
    color: #fff;
    border-color: var(--color-energia);
}

.btn-primary:hover {
    background: #2e8a1a;
    border-color: #2e8a1a;
    box-shadow: var(--shadow-md);
}

.btn-secondary {
    background: var(--color-navy);
    color: #fff;
    border-color: var(--color-navy);
}

.btn-secondary:hover {
    background: var(--color-navy-dark);
    border-color: var(--color-navy-dark);
}

.btn-outline {
    background: transparent;
    color: #fff;
    border-color: rgba(255,255,255,.5);
}

.btn-outline:hover {
    background: rgba(255,255,255,.15);
    border-color: #fff;
}

.section-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: var(--space-8);
    gap: var(--space-4);
}

.section-title {
    font-size: clamp(1.5rem, 3vw, 2.25rem);
    font-weight: 800;
    color: var(--color-navy);
    line-height: 1.15;
    margin: 0;
}

.section-link {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    font-size: var(--font-size-sm);
    font-weight: 700;
    color: var(--color-energia);
    text-decoration: none;
    white-space: nowrap;
    transition: gap .2s;
}

.section-link:hover { gap: var(--space-2); }

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border-width: 0;
}

.highlight { color: var(--color-energia); font-weight: 600; }


/* ============================================================
   NOTICIAS — ENTRADA INDIVIDUAL (single.php)
   Diseño inspirado en Cadena 3: categoría → título → meta → imagen → contenido
   ============================================================ */

/* Wrapper general de artículo */
.article-wrapper {
    padding: 2.5rem 0 4rem;
    background: var(--color-bg, #f8f9fa);
}

/* Layout: artículo (2/3) + sidebar (1/3) */
.article-layout {
    display: grid;
    grid-template-columns: 1fr 360px;
    gap: 3rem;
    align-items: start;
}

/* ── Breadcrumb compacto ── */
.article-breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .35rem;
    font-size: .8rem;
    color: var(--color-gray-600);
    margin-bottom: 1rem;
}
.article-breadcrumb a {
    color: var(--color-gray-600);
    text-decoration: none;
    transition: color .2s;
}
.article-breadcrumb a:hover { color: var(--color-navy); }
.article-breadcrumb span[aria-hidden] { color: var(--color-gray-400); }
.article-breadcrumb > span:last-child {
    color: var(--color-gray-500);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 30ch;
}

/* ── Label de categoría principal (grande, arriba del título) ── */
.article-category-label {
    margin-bottom: .75rem;
}
.article-cat-link {
    display: inline-block;
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .08em;
    color: var(--color-energia);
    text-decoration: none;
    border-left: 3px solid var(--color-energia);
    padding-left: .6rem;
    line-height: 1;
    transition: color .2s;
}
.article-cat-link:hover { color: var(--color-navy); border-color: var(--color-navy); }

/* Variantes por categoría slug */
.category-noticias      .article-cat-link { color: var(--color-navy); border-color: var(--color-navy); }
.category-institucional .article-cat-link { color: var(--color-sepelio); border-color: var(--color-sepelio); }
.category-comunidad     .article-cat-link { color: var(--color-ambulancia); border-color: var(--color-ambulancia); }

/* ── Título del artículo ── */
.article-title {
    font-size: clamp(1.6rem, 4vw, 2.5rem);
    font-weight: 800;
    line-height: 1.2;
    color: var(--color-navy);
    margin: 0 0 1rem;
}

/* ── Lead / extracto ── */
.article-lead {
    font-size: 1.1rem;
    line-height: 1.65;
    color: var(--color-gray-700);
    border-left: 4px solid var(--color-energia);
    padding-left: 1rem;
    margin: 0 0 1.5rem;
    font-style: italic;
}

/* ── Barra de meta (autor + fecha + share) ── */
.article-meta-bar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .75rem;
    padding: .875rem 0;
    border-top: 1px solid var(--color-gray-200);
    border-bottom: 1px solid var(--color-gray-200);
    margin-bottom: 1.75rem;
    font-size: .85rem;
    color: var(--color-gray-600);
}
.article-author {
    display: flex;
    align-items: center;
    gap: .5rem;
}
.article-avatar {
    width: 36px !important;
    height: 36px !important;
    border-radius: 50%;
    object-fit: cover;
}
.article-author-name { font-weight: 600; color: var(--color-navy); }
.article-date {
    display: flex;
    align-items: center;
    gap: .4rem;
}
.article-time {
    background: var(--color-gray-100);
    padding: .1rem .4rem;
    border-radius: var(--radius-sm, 4px);
    font-size: .78rem;
    font-weight: 600;
    color: var(--color-navy);
}
.article-reading-time { color: var(--color-gray-500); }
.article-meta-sep { color: var(--color-gray-300); }

/* Botones de compartir */
.article-share {
    display: flex;
    gap: .5rem;
    margin-left: auto;
}
.share-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    text-decoration: none;
    transition: transform .2s, opacity .2s;
}
.share-btn:hover { transform: scale(1.1); }
.share-btn svg { width: 16px; height: 16px; }
.share-fb { background: #1877f2; color: #fff; }
.share-tw { background: #000; color: #fff; }
.share-wa { background: #25d366; color: #fff; }

/* ── Imagen hero (full-width dentro del artículo) ── */
.article-hero-image {
    margin: 0 0 2rem;
    border-radius: var(--radius-xl, 12px);
    overflow: hidden;
}
.article-hero-img {
    width: 100%;
    height: auto;
    max-height: 520px;
    object-fit: cover;
    display: block;
}
.article-hero-caption {
    background: var(--color-gray-100);
    padding: .5rem 1rem;
    font-size: .8rem;
    color: var(--color-gray-600);
    font-style: italic;
    margin: 0;
}

/* ── Contenido del artículo ── */
.article-content {
    font-size: 1.05rem;
    line-height: 1.8;
    color: var(--color-gray-800);
    max-width: 72ch;
}
.article-content p { margin-bottom: 1.4em; }
.article-content h2 {
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--color-navy);
    margin: 2em 0 .6em;
    padding-bottom: .3rem;
    border-bottom: 2px solid var(--color-energia);
}
.article-content h3 {
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--color-navy);
    margin: 1.6em 0 .5em;
}
.article-content ul,
.article-content ol {
    padding-left: 1.5rem;
    margin-bottom: 1.4em;
}
.article-content li { margin-bottom: .4em; }
.article-content blockquote {
    border-left: 4px solid var(--color-energia);
    margin: 1.5em 0;
    padding: .75rem 1.25rem;
    background: var(--color-gray-50);
    border-radius: 0 var(--radius-md, 8px) var(--radius-md, 8px) 0;
    font-style: italic;
    color: var(--color-gray-700);
}
.article-content img {
    max-width: 100%;
    height: auto;
    border-radius: var(--radius-md, 8px);
}
.article-content a {
    color: var(--color-energia);
    text-decoration: underline;
    text-decoration-color: transparent;
    transition: text-decoration-color .2s;
}
.article-content a:hover { text-decoration-color: var(--color-energia); }
.article-content strong { color: var(--color-navy); }

/* ── Tags / temas ── */
.article-tags {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
    margin: 2rem 0;
    padding: 1.25rem 0;
    border-top: 1px solid var(--color-gray-200);
}
.article-tags-label {
    font-weight: 700;
    font-size: .85rem;
    color: var(--color-gray-700);
    text-transform: uppercase;
    letter-spacing: .05em;
}
.article-tag-chip {
    display: inline-block;
    background: var(--color-gray-100);
    color: var(--color-navy);
    padding: .25rem .7rem;
    border-radius: var(--radius-full, 999px);
    font-size: .8rem;
    font-weight: 500;
    text-decoration: none;
    transition: background .2s, color .2s;
}
.article-tag-chip:hover {
    background: var(--color-navy);
    color: #fff;
}

/* ── Navegación entre entradas ── */
.article-post-nav {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-top: 2rem;
}
.post-nav-item {
    background: var(--color-gray-50);
    border: 1px solid var(--color-gray-200);
    border-radius: var(--radius-lg, 10px);
    padding: 1rem 1.25rem;
    text-decoration: none;
    display: flex;
    flex-direction: column;
    gap: .3rem;
    transition: border-color .2s, box-shadow .2s;
}
.post-nav-item:hover {
    border-color: var(--color-energia);
    box-shadow: 0 2px 8px rgba(0,0,0,.07);
}
.post-nav-direction {
    display: flex;
    align-items: center;
    gap: .3rem;
    font-size: .75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--color-gray-500);
}
.post-nav-direction svg { width: 14px; height: 14px; }
.post-nav-title {
    font-size: .9rem;
    font-weight: 700;
    color: var(--color-navy);
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.post-nav-next .post-nav-direction { justify-content: flex-end; }
.post-nav-next .post-nav-title { text-align: right; }

/* ── Noticias relacionadas ── */
.article-related {
    margin-top: 3rem;
    padding-top: 2rem;
    border-top: 2px solid var(--color-gray-200);
}
.article-related-title {
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--color-navy);
    margin: 0 0 1.5rem;
    position: relative;
    padding-left: .875rem;
}
.article-related-title::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 1.2em;
    background: var(--color-energia);
    border-radius: 2px;
}
.related-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.25rem;
}
.related-card {
    background: #fff;
    border-radius: var(--radius-lg, 10px);
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(0,0,0,.07);
    transition: box-shadow .2s, transform .2s;
}
.related-card:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,.12);
    transform: translateY(-2px);
}
.related-card-thumb {
    display: block;
    aspect-ratio: 16 / 9;
    overflow: hidden;
}
.related-card-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .3s;
}
.related-card:hover .related-card-thumb img { transform: scale(1.04); }
.related-card-body {
    padding: .875rem 1rem;
}
.related-card-cat {
    display: inline-block;
    font-size: .7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .07em;
    color: var(--color-energia);
    margin-bottom: .3rem;
}
.related-card-title {
    font-size: .9rem;
    font-weight: 700;
    line-height: 1.35;
    margin: 0 0 .4rem;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.related-card-title a {
    color: var(--color-navy);
    text-decoration: none;
    transition: color .2s;
}
.related-card-title a:hover { color: var(--color-energia); }
.related-card-date {
    font-size: .75rem;
    color: var(--color-gray-500);
}

/* ============================================================
   SIDEBAR DE NOTICIAS
   ============================================================ */

.article-sidebar {
    position: sticky;
    top: 90px;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Widget base */
.sidebar-widget {
    background: #fff;
    border-radius: var(--radius-lg, 10px);
    padding: 1.25rem;
    box-shadow: 0 1px 4px rgba(0,0,0,.06);
}

.sidebar-widget-title {
    font-size: .8rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .1em;
    color: var(--color-navy);
    margin: 0 0 1rem;
    padding-bottom: .5rem;
    border-bottom: 2px solid var(--color-energia);
}
.sidebar-widget-title--light {
    color: #fff;
    border-color: var(--color-energia);
}

/* Lista de últimas noticias */
.sidebar-news-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
}
.sidebar-news-item {
    padding: .7rem 0;
    border-bottom: 1px solid var(--color-gray-100);
}
.sidebar-news-item:last-child { border-bottom: none; }

.sidebar-news-meta {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-bottom: .25rem;
}
.sidebar-news-meta time {
    font-size: .7rem;
    font-weight: 700;
    color: var(--color-gray-500);
    font-variant-numeric: tabular-nums;
    min-width: 3ch;
}
.sidebar-news-cat {
    display: inline-block;
    font-size: .65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #fff;
    background: var(--color-energia);
    padding: .1rem .45rem;
    border-radius: var(--radius-full, 999px);
    text-decoration: none;
    transition: background .2s;
}
.sidebar-news-cat:hover { background: var(--color-navy); }
.sidebar-news-title {
    font-size: .85rem;
    font-weight: 600;
    line-height: 1.35;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.sidebar-news-title a {
    color: var(--color-navy);
    text-decoration: none;
    transition: color .2s;
}
.sidebar-news-title a:hover { color: var(--color-energia); }

/* Lista de categorías */
.sidebar-cat-list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.sidebar-cat-list li { border-bottom: 1px solid var(--color-gray-100); }
.sidebar-cat-list li:last-child { border-bottom: none; }
.sidebar-cat-link {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: .5rem 0;
    font-size: .875rem;
    color: var(--color-navy);
    text-decoration: none;
    transition: color .2s;
}
.sidebar-cat-link:hover { color: var(--color-energia); }
.sidebar-cat-link.is-active {
    color: var(--color-energia);
    font-weight: 700;
}
.sidebar-cat-count {
    background: var(--color-gray-100);
    color: var(--color-gray-600);
    font-size: .75rem;
    padding: .1rem .45rem;
    border-radius: var(--radius-full, 999px);
    min-width: 1.6em;
    text-align: center;
}

/* CTA widget */
.sidebar-cta {
    background: var(--color-navy) !important;
}
.sidebar-cta-links {
    display: flex;
    flex-direction: column;
    gap: .625rem;
}
.sidebar-cta-btn {
    width: 100%;
    justify-content: center;
    text-align: center;
}
.btn-outline-light {
    background: transparent;
    border: 2px solid rgba(255,255,255,.4);
    color: #fff;
}
.btn-outline-light:hover {
    background: rgba(255,255,255,.1);
    border-color: #fff;
    color: #fff;
}

/* ============================================================
   NOTICIAS — ARCHIVO (archive.php)
   ============================================================ */

/* Hero del archivo */
.archive-hero {
    background: var(--color-navy);
    color: #fff;
    padding: 2.5rem 0 2rem;
}
.archive-hero .article-breadcrumb,
.archive-hero .article-breadcrumb a { color: rgba(255,255,255,.65); }
.archive-hero .article-breadcrumb a:hover { color: #fff; }
.archive-hero .article-breadcrumb span[aria-hidden] { color: rgba(255,255,255,.35); }
.archive-hero .article-breadcrumb > span:last-child { color: rgba(255,255,255,.85); }
.archive-hero-title {
    font-size: clamp(1.6rem, 3.5vw, 2.4rem);
    font-weight: 800;
    color: #fff;
    margin: .5rem 0 0;
}
.archive-hero-desc {
    font-size: 1rem;
    color: rgba(255,255,255,.75);
    margin: .5rem 0 0;
}

/* Layout del archivo */
.archive-wrapper { padding: 2.5rem 0 4rem; }
.archive-layout {
    display: grid;
    grid-template-columns: 1fr 360px;
    gap: 3rem;
    align-items: start;
}
.archive-main { min-width: 0; }

/* ── Card destacada (primera nota) ── */
.news-card-featured {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    background: #fff;
    border-radius: var(--radius-xl, 12px);
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0,0,0,.08);
    margin-bottom: 2rem;
    transition: box-shadow .2s;
}
.news-card-featured:hover { box-shadow: 0 6px 24px rgba(0,0,0,.13); }
.news-card-featured-thumb {
    display: block;
    overflow: hidden;
}
.news-card-featured-img {
    width: 100%;
    height: 100%;
    min-height: 300px;
    object-fit: cover;
    display: block;
    transition: transform .35s;
}
.news-card-featured:hover .news-card-featured-img { transform: scale(1.04); }
.news-card-featured-body {
    padding: 2rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: .75rem;
}
.news-card-featured-title {
    font-size: 1.4rem;
    font-weight: 800;
    line-height: 1.25;
    margin: 0;
}
.news-card-featured-title a {
    color: var(--color-navy);
    text-decoration: none;
    transition: color .2s;
}
.news-card-featured-title a:hover { color: var(--color-energia); }
.news-card-featured-excerpt {
    font-size: .95rem;
    color: var(--color-gray-600);
    line-height: 1.6;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Badge de categoría */
.news-badge-cat {
    display: inline-block;
    font-size: .7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    background: var(--color-energia);
    color: #fff;
    padding: .2rem .6rem;
    border-radius: var(--radius-full, 999px);
    text-decoration: none;
    transition: background .2s;
    align-self: flex-start;
}
.news-badge-cat:hover { background: var(--color-navy); }
.news-badge-cat--overlay {
    position: absolute;
    top: .75rem;
    left: .75rem;
}

/* Meta de cards */
.news-card-meta {
    display: flex;
    align-items: center;
    gap: .75rem;
    font-size: .8rem;
    color: var(--color-gray-500);
}
.news-card-meta time { font-weight: 500; }
.news-card-sep { color: var(--color-gray-300); }
.news-card-read-more {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    font-size: .8rem;
    font-weight: 700;
    color: var(--color-energia);
    text-decoration: none;
    margin-left: auto;
    transition: gap .2s;
}
.news-card-read-more:hover { gap: .5rem; }

/* ── Grilla de cards secundarias ── */
.news-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
}
.news-card {
    background: #fff;
    border-radius: var(--radius-lg, 10px);
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(0,0,0,.07);
    display: flex;
    flex-direction: column;
    transition: box-shadow .2s, transform .2s;
}
.news-card:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,.12);
    transform: translateY(-3px);
}
.news-card-thumb-wrap {
    position: relative;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: var(--color-gray-100);
}
.news-card-thumb {
    display: block;
    width: 100%;
    height: 100%;
}
.news-card-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .3s;
}
.news-card:hover .news-card-thumb img { transform: scale(1.05); }
.news-card-thumb--placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--color-gray-100);
    color: var(--color-gray-400);
}
.news-card-body {
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: .5rem;
    flex: 1;
}
.news-card-title {
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.35;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.news-card-title a {
    color: var(--color-navy);
    text-decoration: none;
    transition: color .2s;
}
.news-card-title a:hover { color: var(--color-energia); }
.news-card-excerpt {
    font-size: .85rem;
    color: var(--color-gray-600);
    line-height: 1.5;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Paginación del archivo */
.archive-pagination {
    margin-top: 2.5rem;
    display: flex;
    justify-content: center;
}
.archive-pagination .nav-links {
    display: flex;
    gap: .375rem;
    align-items: center;
}
.archive-pagination .page-numbers {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 2.25rem;
    height: 2.25rem;
    padding: 0 .5rem;
    border-radius: var(--radius-md, 8px);
    font-size: .875rem;
    font-weight: 600;
    color: var(--color-navy);
    background: #fff;
    border: 1px solid var(--color-gray-200);
    text-decoration: none;
    transition: all .2s;
}
.archive-pagination .page-numbers:hover,
.archive-pagination .page-numbers.current {
    background: var(--color-energia);
    border-color: var(--color-energia);
    color: #fff;
}
.archive-pagination .page-numbers.dots {
    background: transparent;
    border-color: transparent;
    cursor: default;
}

/* Estado vacío del archivo */
.archive-empty {
    text-align: center;
    padding: 4rem 2rem;
    color: var(--color-gray-500);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}
.archive-empty svg { opacity: .4; }
.archive-empty p { font-size: 1.1rem; margin: 0; }

/* ============================================================
   RESPONSIVE — NOTICIAS
   ============================================================ */

@media (max-width: 1100px) {
    .article-layout,
    .archive-layout {
        grid-template-columns: 1fr 300px;
        gap: 2rem;
    }
    .related-grid { grid-template-columns: repeat(2, 1fr); }
    .news-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 900px) {
    .article-layout,
    .archive-layout {
        grid-template-columns: 1fr;
    }
    .article-sidebar {
        position: static;
        order: -1; /* sidebar arriba en mobile — o mover a abajo si se prefiere */
        display: none; /* se muestra solo en desktop; en mobile ocultar para limpieza */
    }
    .news-card-featured {
        grid-template-columns: 1fr;
    }
    .news-card-featured-img { min-height: 220px; }
    .news-card-featured-body { padding: 1.25rem; }
    .news-grid { grid-template-columns: repeat(2, 1fr); }
    .related-grid { grid-template-columns: 1fr; }
    .article-post-nav { grid-template-columns: 1fr; }
    .article-share { margin-left: 0; }
}

@media (max-width: 600px) {
    .article-title { font-size: 1.5rem; }
    .news-grid { grid-template-columns: 1fr; }
    .article-meta-bar {
        gap: .5rem;
        font-size: .8rem;
    }
    .share-btn { width: 30px; height: 30px; }
    .archive-hero { padding: 1.5rem 0 1.25rem; }
}


/* ============================================================
   MEMORIA Y BALANCE — ENTRADA INDIVIDUAL (single-memoria_balance.php)
   ============================================================ */

.memoria-ficha {
    background: #fff;
    border-radius: var(--radius-xl, 12px);
    box-shadow: 0 2px 12px rgba(0,0,0,.08);
    overflow: hidden;
}

.memoria-ficha-thumb {
    width: 100%;
    max-height: 260px;
    overflow: hidden;
}
.memoria-ficha-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.memoria-ficha-datos {
    padding: 2rem;
    border-bottom: 1px solid var(--color-gray-100);
}

.memoria-ficha-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: .75rem 0;
    border-bottom: 1px solid var(--color-gray-100);
    gap: 1rem;
}
.memoria-ficha-row:last-of-type { border-bottom: none; }
.memoria-ficha-label {
    font-size: .85rem;
    font-weight: 600;
    color: var(--color-gray-600);
    text-transform: uppercase;
    letter-spacing: .05em;
}
.memoria-ficha-value {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--color-navy);
}

.memoria-ficha-desc {
    margin-top: 1rem;
    font-size: .95rem;
    color: var(--color-gray-700);
    line-height: 1.65;
}

.memoria-ficha-pdf {
    padding: 2rem;
    text-align: center;
    background: var(--color-gray-50);
}

.memoria-download-btn {
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    font-size: 1rem;
    padding: .875rem 2rem;
    border-radius: var(--radius-full, 999px);
    font-weight: 700;
    letter-spacing: .02em;
    box-shadow: 0 4px 14px rgba(0,0,0,.15);
    transition: transform .2s, box-shadow .2s;
}
.memoria-download-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0,0,0,.2);
}

.memoria-pdf-filename {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    font-size: .8rem;
    color: var(--color-gray-500);
    margin-top: .75rem;
}

.memoria-pdf-unavailable {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .75rem;
    padding: 1rem;
    color: var(--color-gray-500);
}
.memoria-pdf-unavailable p {
    margin: 0;
    font-size: .95rem;
}


/* ============================================================
   HOMEPAGE — CARDS DE NOTICIAS (hp-news-*)
   Rediseño más limpio: imagen con overlay, badge verde,
   meta compacto, título navy, excerpt corto.
   ============================================================ */

.hp-news-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    align-items: stretch;
}

/* Card wrapper */
.hp-news-card {
    background: #fff;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0,0,0,.07);
    display: flex;
    flex-direction: column;
    transition: box-shadow .25s, transform .25s;
    border: 1px solid var(--color-gray-200);
}
.hp-news-card:hover {
    box-shadow: 0 8px 28px rgba(0,0,0,.13);
    transform: translateY(-4px);
}

/* Thumbnail */
.hp-news-thumb {
    display: block;
    position: relative;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: linear-gradient(135deg, #e8f5e9 0%, #e3f2fd 100%);
    flex-shrink: 0;
    text-decoration: none;
}
.hp-news-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .35s ease;
}
.hp-news-card:hover .hp-news-img {
    transform: scale(1.05);
}

/* Overlay sutil en la imagen al hacer hover */
.hp-news-thumb::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0,25,60,.35) 0%, transparent 55%);
    opacity: 0;
    transition: opacity .3s;
}
.hp-news-card:hover .hp-news-thumb::after {
    opacity: 1;
}

/* Placeholder sin imagen */
.hp-news-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #e8f5e9 0%, #e3f2fd 100%);
    color: var(--color-energia);
    opacity: .5;
}

/* Badge de categoría */
.hp-news-cat {
    position: absolute;
    bottom: .75rem;
    left: .75rem;
    background: var(--color-energia);
    color: #fff;
    font-size: .68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .07em;
    padding: .2rem .6rem;
    border-radius: 999px;
    line-height: 1.4;
    z-index: 1;
}

/* Cuerpo de la card */
.hp-news-body {
    padding: 1.1rem 1.25rem 1.25rem;
    display: flex;
    flex-direction: column;
    flex: 1;
    gap: .5rem;
}

/* Meta: fecha · lectura */
.hp-news-meta {
    display: flex;
    align-items: center;
    gap: .4rem;
    font-size: .75rem;
    color: var(--color-gray-500);
    font-weight: 500;
}
.hp-news-meta time { font-variant-numeric: tabular-nums; }

/* Título */
.hp-news-title {
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.35;
    color: var(--color-navy);
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.hp-news-title a {
    color: inherit;
    text-decoration: none;
    transition: color .2s;
}
.hp-news-title a:hover { color: var(--color-energia); }

/* Excerpt */
.hp-news-excerpt {
    font-size: .875rem;
    color: var(--color-gray-600);
    line-height: 1.6;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    flex: 1;
}

/* Link "Leer nota" */
.hp-news-link {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    font-size: .8rem;
    font-weight: 700;
    color: var(--color-energia);
    text-decoration: none;
    margin-top: .25rem;
    transition: gap .2s, color .2s;
    align-self: flex-start;
}
.hp-news-link:hover {
    color: var(--color-navy);
    gap: .5rem;
}
.hp-news-link svg { flex-shrink: 0; }

/* Responsive */
@media (max-width: 900px) {
    .hp-news-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
    .hp-news-grid { grid-template-columns: 1fr; }
}


/* ============================================================
   SERVICE CARD EXPANDIBLE — Financiamiento Solidario
   ============================================================ */

/* La card expandible no es un <a> sino un <div>, mismo aspecto base */
.service-card--expandable {
    display: flex;
    flex-direction: column;
    cursor: default;               /* no es enlace directo */
    position: relative;
}

/* Botón desplegable */
.service-expand-btn {
    all: unset;               /* elimina estilos del navegador */
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    width: 100%;
    margin-top: .75rem;
    padding: .5rem .85rem;
    background: rgba(255,255,255,.13);
    border: 1.5px solid rgba(255,255,255,.3);
    border-radius: var(--radius-full, 999px);
    color: rgba(255,255,255,.95);
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .04em;
    cursor: pointer;
    transition: background .2s, border-color .2s;
    -webkit-font-smoothing: antialiased;
}
.service-expand-btn:hover,
.service-expand-btn:focus-visible {
    background: rgba(255,255,255,.22);
    border-color: rgba(255,255,255,.55);
    outline: none;
}
.service-expand-btn:focus-visible {
    box-shadow: 0 0 0 3px rgba(255,255,255,.35);
}
.service-expand-btn[aria-expanded="true"] {
    background: rgba(255,255,255,.2);
    border-color: rgba(255,255,255,.5);
}
.service-expand-chevron {
    flex-shrink: 0;
    transition: transform .3s ease;
}
.service-expand-btn[aria-expanded="true"] .service-expand-chevron {
    transform: rotate(180deg);
}

/* Lista de sub-servicios (oculta por defecto con [hidden]) */
.service-sub-list {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    margin-top: .75rem;
    /* Animación de apertura */
    overflow: hidden;
}
.service-sub-list[hidden] {
    display: none;
}

/* Cada sub-servicio */
.service-sub-item {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .7rem .85rem;
    background: rgba(255,255,255,.14);
    border-radius: var(--radius-md, 8px);
    text-decoration: none;
    color: #fff;                          /* blanco explícito, máximo contraste */
    font-size: .82rem;
    font-weight: 500;
    line-height: 1.3;
    transition: background .2s, transform .15s;
    border: 1px solid rgba(255,255,255,.18);
}
.service-sub-item:hover {
    background: rgba(255,255,255,.24);
    transform: translateX(3px);
    color: #fff;
}
.service-sub-icon {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,.2);
    border-radius: 50%;
    color: #fff;
}
.service-sub-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: .2rem;
}
.service-sub-info strong {
    display: block;
    font-size: .85rem;
    font-weight: 700;
    color: #fff;                          /* título siempre blanco */
}
.service-sub-info span {
    display: block;
    font-size: .74rem;
    color: rgba(255,255,255,.82);         /* descripción: casi blanco, sin opacity heredada */
    font-weight: 400;
    line-height: 1.4;
}
.service-sub-arrow {
    flex-shrink: 0;
    color: rgba(255,255,255,.7);
}
/* Borde izquierdo de color por sub-servicio */
.service-sub--ambulancia { border-left: 3px solid var(--color-ambulancia, #F4831F); }
.service-sub--sepelio    { border-left: 3px solid #6aabff; }   /* azul más claro para contrastar sobre navy */
.service-sub--fisiatria  { border-left: 3px solid var(--color-fisiatria, #FFC20E); }

/* Link "Ver más" al pie de la card expandible */
.service-link--main {
    margin-top: .75rem;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    font-size: .8rem;
    font-weight: 700;
    opacity: .85;
    text-decoration: none;
    color: inherit;
    transition: opacity .2s, gap .2s;
}
.service-link--main:hover {
    opacity: 1;
    gap: .55rem;
}
.service-link--main svg { width: 13px; height: 13px; }


.service-card--ucma {
    background: linear-gradient(135deg, #7a7d82 0%, #63666A 100%);
    color: #fff;
}
.service-card--ucma .service-icon { background: rgba(255,255,255,.15); }
.service-card--ucma .service-link { color: rgba(255,255,255,.8); }

.service-card--sillas {
    background: linear-gradient(135deg, #f7637a 0%, #F4364C 100%);
    color: #fff;
}
.service-card--sillas .service-icon { background: rgba(255,255,255,.15); }
.service-card--sillas .service-link { color: rgba(255,255,255,.8); }

/* ═══════════════════════════════════════════════════════════════
   TEMPLATE: ENERGÍA ELÉCTRICA
═══════════════════════════════════════════════════════════════ */

/* ── Hero ─────────────────────────────────────────────────── */
.energia-hero {
    background: linear-gradient(135deg, #3da025 0%, #43B02A 60%, #56c73a 100%);
    color: #fff;
    padding: var(--space-16,4rem) 0 0;
    position: relative;
    overflow: hidden;
}
.energia-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.04'%3E%3Cpolygon points='36 11 38 11 38 13 36 13'/%3E%3Cpolygon points='30 5 32 5 32 7 30 7'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    pointer-events: none;
}
.energia-breadcrumbs { color: rgba(255,255,255,.75); font-size: .85rem; margin-bottom: var(--space-8,2rem); }
.energia-breadcrumbs a { color: rgba(255,255,255,.85); text-decoration: none; }
.energia-breadcrumbs a:hover { color: #fff; text-decoration: underline; }
.energia-breadcrumbs span[aria-hidden] { margin: 0 .35rem; }
.energia-hero-inner {
    text-align: center;
    padding: var(--space-8,2rem) 0 var(--space-12,3rem);
    max-width: 700px;
    margin: 0 auto;
    position: relative;
}
.energia-hero-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,.18);
    border-radius: 50%;
    width: 80px;
    height: 80px;
    margin-bottom: var(--space-5,1.25rem);
}
.energia-hero-title {
    font-size: clamp(2rem, 5vw, 3.2rem);
    font-weight: 800;
    margin: 0 0 var(--space-4,1rem);
    line-height: 1.1;
    color: #fff;
}
.energia-hero-subtitle {
    font-size: 1.1rem;
    color: rgba(255,255,255,.88);
    margin: 0;
    line-height: 1.6;
}
.energia-hero-wave {
    line-height: 0;
    margin-bottom: -2px;
}
.energia-hero-wave svg { width: 100%; height: 80px; display: block; }

/* ── Intro ────────────────────────────────────────────────── */
.energia-intro {
    padding: var(--space-16,4rem) 0;
    background: var(--color-bg-page,#f4f6f9);
}
.energia-intro-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-12,3rem);
    align-items: center;
}
@media (max-width: 768px) {
    .energia-intro-grid { grid-template-columns: 1fr; }
}
.section-eyebrow {
    display: inline-block;
    font-size: .75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .1em;
    color: #43B02A;
    margin-bottom: var(--space-3,.75rem);
}
.energia-intro-heading {
    font-size: clamp(1.4rem, 3vw, 2rem);
    font-weight: 700;
    color: var(--color-text-heading,#1a2533);
    margin: 0 0 var(--space-5,1.25rem);
    line-height: 1.25;
}
.energia-intro-text p {
    color: var(--color-text-body,#374151);
    line-height: 1.7;
    margin-bottom: var(--space-4,1rem);
}
.energia-intro-stats {
    display: flex;
    gap: var(--space-6,1.5rem);
    margin-top: var(--space-6,1.5rem);
    flex-wrap: wrap;
}
.energia-stat {
    display: flex;
    flex-direction: column;
    gap: .2rem;
}
.energia-stat-value {
    font-size: 1.8rem;
    font-weight: 800;
    color: #43B02A;
    line-height: 1;
}
.energia-stat-label {
    font-size: .78rem;
    color: var(--color-text-muted,#6b7280);
    font-weight: 500;
}
/* Photo frame */
.energia-intro-photo { position: relative; }
.energia-photo-frame {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(67,176,42,.2);
}
.energia-photo-frame::before {
    content: '';
    position: absolute;
    inset: -3px;
    border-radius: 19px;
    background: linear-gradient(135deg, #43B02A, #56c73a);
    z-index: -1;
}
.energia-main-img {
    display: block;
    width: 100%;
    height: 380px;
    object-fit: cover;
    border-radius: 14px;
}
.energia-photo-badge {
    position: absolute;
    bottom: 16px;
    left: 16px;
    background: rgba(67,176,42,.92);
    color: #fff;
    padding: .4rem .85rem;
    border-radius: 20px;
    font-size: .8rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: .4rem;
    backdrop-filter: blur(6px);
}

/* ── Pillars ──────────────────────────────────────────────── */
.energia-pillars {
    padding: var(--space-16,4rem) 0;
    background: #fff;
}
.section-header-center {
    text-align: center;
    margin-bottom: var(--space-10,2.5rem);
}
.section-header-center h2 {
    font-size: clamp(1.5rem, 3vw, 2.2rem);
    font-weight: 700;
    color: var(--color-text-heading,#1a2533);
    margin: 0;
}
.energia-pillars-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-6,1.5rem);
}
@media (max-width: 1024px) {
    .energia-pillars-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
    .energia-pillars-grid { grid-template-columns: 1fr; }
}
.energia-pillar {
    background: var(--color-bg-page,#f4f6f9);
    border-radius: 12px;
    padding: var(--space-6,1.5rem);
    border-top: 3px solid #43B02A;
    transition: transform .2s, box-shadow .2s;
}
.energia-pillar:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 30px rgba(67,176,42,.12);
}
.energia-pillar-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    background: rgba(67,176,42,.1);
    border-radius: 12px;
    margin-bottom: var(--space-4,1rem);
    color: #43B02A;
}
.energia-pillar h3 {
    font-size: 1rem;
    font-weight: 700;
    color: var(--color-text-heading,#1a2533);
    margin: 0 0 var(--space-3,.75rem);
}
.energia-pillar p {
    font-size: .9rem;
    color: var(--color-text-body,#374151);
    line-height: 1.6;
    margin: 0;
}

/* ── Gallery ──────────────────────────────────────────────── */
.energia-gallery {
    padding: var(--space-12,3rem) 0;
    background: var(--color-bg-page,#f4f6f9);
}
.energia-gallery-grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    grid-template-rows: auto auto;
    gap: .75rem;
    border-radius: 16px;
    overflow: hidden;
}
@media (max-width: 768px) {
    .energia-gallery-grid { grid-template-columns: 1fr 1fr; }
    .energia-gallery-item--tall { grid-column: 1 / -1; }
}
@media (max-width: 480px) {
    .energia-gallery-grid { grid-template-columns: 1fr; }
    .energia-gallery-item--tall { grid-column: auto; }
}
.energia-gallery-item { overflow: hidden; border-radius: 8px; }
.energia-gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .4s ease;
    min-height: 200px;
}
.energia-gallery-item--tall img { min-height: 420px; }
.energia-gallery-item:hover img { transform: scale(1.04); }

/* ── Benefits ─────────────────────────────────────────────── */
.energia-benefits {
    padding: var(--space-16,4rem) 0;
    background: #fff;
}
.energia-benefits-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-6,1.5rem);
}
@media (max-width: 900px) {
    .energia-benefits-grid { grid-template-columns: 1fr; }
}
.energia-benefit-card {
    display: flex;
    gap: var(--space-4,1rem);
    align-items: flex-start;
    background: var(--color-bg-page,#f4f6f9);
    border-radius: 12px;
    padding: var(--space-6,1.5rem);
    border-left: 4px solid #43B02A;
}
.energia-benefit-icon {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    background: rgba(67,176,42,.1);
    border-radius: 10px;
    color: #43B02A;
}
.energia-benefit-body h3 {
    font-size: 1rem;
    font-weight: 700;
    color: var(--color-text-heading,#1a2533);
    margin: 0 0 .4rem;
}
.energia-benefit-body p {
    font-size: .88rem;
    color: var(--color-text-body,#374151);
    line-height: 1.6;
    margin: 0;
}

/* ── Info / Trámites ──────────────────────────────────────── */
.energia-info {
    padding: var(--space-16,4rem) 0;
    background: var(--color-bg-page,#f4f6f9);
}
.energia-info-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-8,2rem);
}
@media (max-width: 768px) {
    .energia-info-grid { grid-template-columns: 1fr; }
}
.energia-info-card {
    background: #fff;
    border-radius: 14px;
    padding: var(--space-7,1.75rem);
    box-shadow: 0 2px 12px rgba(0,0,0,.06);
}
.energia-info-card--highlight {
    background: linear-gradient(135deg, #3da025 0%, #43B02A 100%);
    color: #fff;
}
.energia-info-card--highlight h3 { color: #fff; }
.energia-info-card-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 10px;
    background: rgba(67,176,42,.1);
    color: #43B02A;
    margin-bottom: var(--space-4,1rem);
}
.energia-info-card--highlight .energia-info-card-icon {
    background: rgba(255,255,255,.2);
    color: #fff;
}
.energia-info-card h3 {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--color-text-heading,#1a2533);
    margin: 0 0 var(--space-4,1rem);
}
.energia-info-list {
    list-style: none;
    padding: 0;
    margin: 0 0 var(--space-5,1.25rem);
    display: flex;
    flex-direction: column;
    gap: .5rem;
}
.energia-info-list li {
    font-size: .9rem;
    color: var(--color-text-body,#374151);
    padding-left: 1.2rem;
    position: relative;
}
.energia-info-list li::before {
    content: '›';
    position: absolute;
    left: 0;
    color: #43B02A;
    font-weight: 700;
}
.btn-outline-energia {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    font-size: .88rem;
    font-weight: 600;
    color: #43B02A;
    border: 1.5px solid #43B02A;
    border-radius: 6px;
    padding: .5rem 1rem;
    text-decoration: none;
    transition: background .2s, color .2s;
}
.btn-outline-energia:hover {
    background: #43B02A;
    color: #fff;
}
/* Contact items */
.energia-contact-items {
    display: flex;
    flex-direction: column;
    gap: .75rem;
}
.energia-contact-item {
    display: flex;
    align-items: flex-start;
    gap: .6rem;
    font-size: .9rem;
    color: rgba(255,255,255,.9);
}
.energia-contact-item svg { flex-shrink: 0; margin-top: 2px; }
.energia-contact-item strong { color: #fff; }

/* ── CTA ──────────────────────────────────────────────────── */
.energia-cta {
    background: linear-gradient(135deg, #2d8a1c 0%, #43B02A 100%);
    padding: var(--space-16,4rem) 0;
    color: #fff;
}
.energia-cta-inner {
    text-align: center;
    max-width: 640px;
    margin: 0 auto;
}
.energia-cta-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,.15);
    border-radius: 50%;
    width: 72px;
    height: 72px;
    margin-bottom: var(--space-5,1.25rem);
    color: #fff;
}
.energia-cta h2 {
    font-size: clamp(1.4rem, 3vw, 2rem);
    font-weight: 800;
    color: #fff;
    margin: 0 0 var(--space-3,.75rem);
}
.energia-cta p {
    font-size: 1rem;
    color: rgba(255,255,255,.85);
    margin: 0 0 var(--space-7,1.75rem);
}
.energia-cta-actions {
    display: flex;
    gap: var(--space-4,1rem);
    justify-content: center;
    flex-wrap: wrap;
}
.btn-white-energia {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    font-size: .95rem;
    font-weight: 700;
    background: #fff;
    color: #43B02A;
    border: none;
    border-radius: 8px;
    padding: .7rem 1.5rem;
    text-decoration: none;
    transition: background .2s, transform .15s;
}
.btn-white-energia:hover { background: #f0fdf0; transform: translateY(-1px); }
.btn-outline-white-energia {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    font-size: .95rem;
    font-weight: 700;
    background: transparent;
    color: #fff;
    border: 2px solid rgba(255,255,255,.6);
    border-radius: 8px;
    padding: .7rem 1.5rem;
    text-decoration: none;
    transition: border-color .2s, background .2s;
}
.btn-outline-white-energia:hover {
    border-color: #fff;
    background: rgba(255,255,255,.1);
}

/* ═══════════════════════════════════════════════════════════
   PLAN SALUD  — Pantone 7687C  #2C6FAA
═══════════════════════════════════════════════════════════ */

/* --- Hero --- */
.salud-hero {
    background: linear-gradient(135deg, #1a4f80 0%, #2C6FAA 50%, #245e92 100%);
    color: #fff;
    padding: var(--space-16, 4rem) 0 0;
    position: relative;
    overflow: hidden;
}
.salud-breadcrumbs { color: rgba(255,255,255,.75); font-size: .85rem; margin-bottom: var(--space-8, 2rem); }
.salud-breadcrumbs a { color: rgba(255,255,255,.85); text-decoration: none; }
.salud-breadcrumbs a:hover { color: #fff; text-decoration: underline; }
.salud-breadcrumbs span { margin: 0 .4rem; }
.salud-hero-inner { text-align: center; padding-bottom: var(--space-10, 2.5rem); }
.salud-hero-badge {
    width: 80px; height: 80px; border-radius: 50%;
    background: rgba(255,255,255,.15);
    display: flex; align-items: center; justify-content: center;
    margin: 0 auto var(--space-4, 1rem);
}
.salud-hero-badge svg { color: #fff; }
.salud-hero-title { font-size: clamp(2rem, 5vw, 3.5rem); font-weight: 800; margin: 0 0 .75rem; letter-spacing: -.02em; }
.salud-hero-subtitle { font-size: clamp(1rem, 2vw, 1.25rem); opacity: .9; max-width: 640px; margin: 0 auto; line-height: 1.6; }
.salud-hero-wave { line-height: 0; margin-top: var(--space-8, 2rem); }
.salud-hero-wave svg { width: 100%; height: auto; display: block; }

/* --- Intro --- */
.salud-intro { padding: var(--space-16, 4rem) 0; }
.salud-intro-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-12, 3rem); align-items: center; }
.salud-eyebrow { color: #2C6FAA; }
.salud-intro-heading { font-size: clamp(1.5rem, 3vw, 2.25rem); font-weight: 700; margin: .5rem 0 1rem; }
.salud-intro-stats { display: flex; gap: var(--space-6, 1.5rem); margin-top: var(--space-8, 2rem); flex-wrap: wrap; }
.salud-stat { text-align: center; }
.salud-stat-value { display: block; font-size: 2rem; font-weight: 800; color: #2C6FAA; line-height: 1; }
.salud-stat-label { font-size: .78rem; color: var(--color-text-muted, #666); margin-top: .2rem; display: block; }
.salud-photo-frame { position: relative; border-radius: 16px; overflow: hidden; box-shadow: 0 20px 60px rgba(44,111,170,.18); }
.salud-main-img { width: 100%; height: 360px; object-fit: cover; display: block; }
.salud-photo-badge { position: absolute; bottom: 1rem; left: 1rem; background: #2C6FAA; color: #fff; border-radius: 30px; padding: .4rem .9rem; font-size: .78rem; font-weight: 700; display: flex; align-items: center; gap: .4rem; }

/* --- Pillars --- */
.salud-pillars { background: var(--color-bg-alt, #f4f6f9); padding: var(--space-16, 4rem) 0; }
.salud-pillars-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-6, 1.5rem); margin-top: var(--space-10, 2.5rem); }
.salud-pillar { background: #fff; border-radius: 12px; padding: var(--space-6, 1.5rem); box-shadow: 0 2px 12px rgba(0,0,0,.06); transition: transform .2s, box-shadow .2s; }
.salud-pillar:hover { transform: translateY(-4px); box-shadow: 0 8px 24px rgba(44,111,170,.12); }
.salud-pillar-icon { width: 52px; height: 52px; background: rgba(44,111,170,.1); border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: var(--space-4, 1rem); }
.salud-pillar-icon svg { width: 26px; height: 26px; stroke: #2C6FAA; }
.salud-pillar h3 { font-size: 1rem; font-weight: 700; margin: 0 0 .5rem; }
.salud-pillar p { font-size: .9rem; color: var(--color-text-muted, #666); margin: 0; line-height: 1.5; }

/* --- Gallery --- */
.salud-gallery { padding: var(--space-16, 4rem) 0; }
.salud-gallery-grid { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: auto auto; gap: var(--space-4, 1rem); }
.salud-gallery-item { border-radius: 12px; overflow: hidden; }
.salud-gallery-item img { width: 100%; height: 260px; object-fit: cover; display: block; transition: transform .4s; }
.salud-gallery-item:hover img { transform: scale(1.04); }
.salud-gallery-item--tall { grid-row: span 2; }
.salud-gallery-item--tall img { height: 100%; min-height: 400px; }

/* --- Benefits --- */
.salud-benefits { background: var(--color-bg-alt, #f4f6f9); padding: var(--space-16, 4rem) 0; }
.salud-benefits-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-6, 1.5rem); margin-top: var(--space-10, 2.5rem); }
.salud-benefit-card { background: #fff; border-radius: 12px; padding: var(--space-6, 1.5rem); display: flex; gap: var(--space-4, 1rem); box-shadow: 0 2px 12px rgba(0,0,0,.06); }
.salud-benefit-icon { flex-shrink: 0; width: 44px; height: 44px; background: rgba(44,111,170,.1); border-radius: 10px; display: flex; align-items: center; justify-content: center; }
.salud-benefit-icon svg { width: 22px; height: 22px; stroke: #2C6FAA; }
.salud-benefit-body h3 { font-size: 1rem; font-weight: 700; margin: 0 0 .4rem; }
.salud-benefit-body p { font-size: .88rem; color: var(--color-text-muted, #666); margin: 0; line-height: 1.5; }

/* --- Info --- */
.salud-info { padding: var(--space-16, 4rem) 0; }
.salud-info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-8, 2rem); }
.salud-info-card { background: var(--color-bg-alt, #f4f6f9); border-radius: 16px; padding: var(--space-8, 2rem); }
.salud-info-card--highlight { background: linear-gradient(135deg, #2C6FAA, #1a4f80); color: #fff; }
.salud-info-card--highlight h3, .salud-info-card--highlight strong { color: #fff; }
.salud-info-card--highlight a { color: #fff; }
.salud-info-card-icon { width: 48px; height: 48px; background: rgba(44,111,170,.12); border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: var(--space-4, 1rem); }
.salud-info-card--highlight .salud-info-card-icon { background: rgba(255,255,255,.2); }
.salud-info-card-icon svg { width: 24px; height: 24px; stroke: #2C6FAA; }
.salud-info-card--highlight .salud-info-card-icon svg { stroke: #fff; }
.salud-info-card h3 { font-size: 1.1rem; font-weight: 700; margin: 0 0 var(--space-4, 1rem); }
.salud-info-list { list-style: none; padding: 0; margin: 0 0 var(--space-6, 1.5rem); }
.salud-info-list li { padding: .45rem 0; border-bottom: 1px solid rgba(0,0,0,.06); font-size: .9rem; display: flex; align-items: center; gap: .5rem; }
.salud-info-list li::before { content: "→"; color: #2C6FAA; font-weight: 700; }
.btn-outline-salud { display: inline-block; border: 2px solid #2C6FAA; color: #2C6FAA; border-radius: 30px; padding: .55rem 1.4rem; font-size: .9rem; font-weight: 600; text-decoration: none; transition: background .2s, color .2s; }
.btn-outline-salud:hover { background: #2C6FAA; color: #fff; }
.salud-contact-items { display: flex; flex-direction: column; gap: .75rem; }
.salud-contact-item { display: flex; flex-direction: column; gap: .15rem; font-size: .9rem; }
.salud-contact-item strong { opacity: .8; font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; }

/* --- CTA --- */
.salud-cta { background: linear-gradient(135deg, #1a4f80, #2C6FAA); color: #fff; padding: var(--space-16, 4rem) 0; }
.salud-cta-inner { text-align: center; max-width: 700px; margin: 0 auto; }
.salud-cta-icon { width: 72px; height: 72px; background: rgba(255,255,255,.15); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto var(--space-4, 1rem); }
.salud-cta-icon svg { color: #fff; }
.salud-cta h2 { font-size: clamp(1.5rem, 3vw, 2rem); font-weight: 800; margin: 0 0 .75rem; }
.salud-cta p { opacity: .9; margin-bottom: var(--space-8, 2rem); }
.salud-cta-actions { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }
.btn-white-salud { background: #fff; color: #2C6FAA; border-radius: 30px; padding: .75rem 2rem; font-weight: 700; text-decoration: none; transition: transform .2s, box-shadow .2s; }
.btn-white-salud:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,.15); }
.btn-outline-white-salud { border: 2px solid rgba(255,255,255,.7); color: #fff; border-radius: 30px; padding: .75rem 2rem; font-weight: 700; text-decoration: none; transition: background .2s; }
.btn-outline-white-salud:hover { background: rgba(255,255,255,.15); }

/* ═══ RESPONSIVE Plan Salud ═══ */
@media (max-width: 1024px) { .salud-pillars-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 900px) { .salud-intro-grid { grid-template-columns: 1fr; } .salud-benefits-grid { grid-template-columns: 1fr; } }
@media (max-width: 768px) { .salud-info-grid { grid-template-columns: 1fr; } .salud-gallery-grid { grid-template-columns: 1fr; } .salud-gallery-item--tall { grid-row: span 1; } .salud-gallery-item img { height: 220px; } .salud-gallery-item--tall img { min-height: 220px; } }
@media (max-width: 600px) { .salud-pillars-grid { grid-template-columns: 1fr; } .salud-intro-stats { flex-direction: column; gap: .75rem; } }


/* ═══════════════════════════════════════════════════════════
   FM CLEMiC 103.5 — Pantone 116C  #FFC20E  (hero dark amber)
═══════════════════════════════════════════════════════════ */

/* --- Hero --- */
.fm-hero {
    background: linear-gradient(135deg, #8B6914 0%, #b8890f 50%, #9b7500 100%);
    color: #fff;
    padding: var(--space-16, 4rem) 0 0;
    position: relative;
    overflow: hidden;
}
.fm-breadcrumbs { color: rgba(255,255,255,.75); font-size: .85rem; margin-bottom: var(--space-8, 2rem); }
.fm-breadcrumbs a { color: rgba(255,255,255,.85); text-decoration: none; }
.fm-breadcrumbs a:hover { color: #fff; text-decoration: underline; }
.fm-breadcrumbs span { margin: 0 .4rem; }
.fm-hero-inner { text-align: center; padding-bottom: var(--space-10, 2.5rem); }
.fm-hero-badge { width: 80px; height: 80px; border-radius: 50%; background: rgba(255,255,255,.15); display: flex; align-items: center; justify-content: center; margin: 0 auto var(--space-4, 1rem); }
.fm-hero-badge svg { color: #fff; }
.fm-hero-title { font-size: clamp(2rem, 5vw, 3.5rem); font-weight: 800; margin: 0 0 .75rem; letter-spacing: -.02em; }
.fm-hero-subtitle { font-size: clamp(1rem, 2vw, 1.25rem); opacity: .9; max-width: 640px; margin: 0 auto; line-height: 1.6; }
.fm-hero-wave { line-height: 0; margin-top: var(--space-8, 2rem); }
.fm-hero-wave svg { width: 100%; height: auto; display: block; }

/* --- Intro --- */
.fm-intro { padding: var(--space-16, 4rem) 0; }
.fm-intro-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-12, 3rem); align-items: center; }
.fm-eyebrow { color: #9b7500; }
.fm-intro-heading { font-size: clamp(1.5rem, 3vw, 2.25rem); font-weight: 700; margin: .5rem 0 1rem; }
.fm-intro-stats { display: flex; gap: var(--space-6, 1.5rem); margin-top: var(--space-8, 2rem); flex-wrap: wrap; }
.fm-stat { text-align: center; }
.fm-stat-value { display: block; font-size: 2rem; font-weight: 800; color: #9b7500; line-height: 1; }
.fm-stat-label { font-size: .78rem; color: var(--color-text-muted, #666); margin-top: .2rem; display: block; }
.fm-photo-frame { position: relative; border-radius: 16px; overflow: hidden; box-shadow: 0 20px 60px rgba(155,117,0,.18); }
.fm-main-img { width: 100%; height: 360px; object-fit: cover; display: block; }
.fm-photo-badge { position: absolute; bottom: 1rem; left: 1rem; background: #9b7500; color: #fff; border-radius: 30px; padding: .4rem .9rem; font-size: .78rem; font-weight: 700; display: flex; align-items: center; gap: .4rem; }

/* --- Pillars --- */
.fm-pillars { background: var(--color-bg-alt, #f4f6f9); padding: var(--space-16, 4rem) 0; }
.fm-pillars-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-6, 1.5rem); margin-top: var(--space-10, 2.5rem); }
.fm-pillar { background: #fff; border-radius: 12px; padding: var(--space-6, 1.5rem); box-shadow: 0 2px 12px rgba(0,0,0,.06); transition: transform .2s, box-shadow .2s; }
.fm-pillar:hover { transform: translateY(-4px); box-shadow: 0 8px 24px rgba(155,117,0,.12); }
.fm-pillar-icon { width: 52px; height: 52px; background: rgba(255,194,14,.15); border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: var(--space-4, 1rem); }
.fm-pillar-icon svg { width: 26px; height: 26px; stroke: #9b7500; }
.fm-pillar h3 { font-size: 1rem; font-weight: 700; margin: 0 0 .5rem; }
.fm-pillar p { font-size: .9rem; color: var(--color-text-muted, #666); margin: 0; line-height: 1.5; }

/* --- Gallery --- */
.fm-gallery { padding: var(--space-16, 4rem) 0; }
.fm-gallery-grid { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: auto auto; gap: var(--space-4, 1rem); }
.fm-gallery-item { border-radius: 12px; overflow: hidden; }
.fm-gallery-item img { width: 100%; height: 260px; object-fit: cover; display: block; transition: transform .4s; }
.fm-gallery-item:hover img { transform: scale(1.04); }
.fm-gallery-item--tall { grid-row: span 2; }
.fm-gallery-item--tall img { height: 100%; min-height: 400px; }

/* --- Benefits --- */
.fm-benefits { background: var(--color-bg-alt, #f4f6f9); padding: var(--space-16, 4rem) 0; }
.fm-benefits-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-6, 1.5rem); margin-top: var(--space-10, 2.5rem); }
.fm-benefit-card { background: #fff; border-radius: 12px; padding: var(--space-6, 1.5rem); display: flex; gap: var(--space-4, 1rem); box-shadow: 0 2px 12px rgba(0,0,0,.06); }
.fm-benefit-icon { flex-shrink: 0; width: 44px; height: 44px; background: rgba(255,194,14,.15); border-radius: 10px; display: flex; align-items: center; justify-content: center; }
.fm-benefit-icon svg { width: 22px; height: 22px; stroke: #9b7500; }
.fm-benefit-body h3 { font-size: 1rem; font-weight: 700; margin: 0 0 .4rem; }
.fm-benefit-body p { font-size: .88rem; color: var(--color-text-muted, #666); margin: 0; line-height: 1.5; }

/* --- Info --- */
.fm-info { padding: var(--space-16, 4rem) 0; }
.fm-info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-8, 2rem); }
.fm-info-card { background: var(--color-bg-alt, #f4f6f9); border-radius: 16px; padding: var(--space-8, 2rem); }
.fm-info-card--highlight { background: linear-gradient(135deg, #8B6914, #b8890f); color: #fff; }
.fm-info-card--highlight h3, .fm-info-card--highlight strong { color: #fff; }
.fm-info-card--highlight a { color: #fff; }
.fm-info-card-icon { width: 48px; height: 48px; background: rgba(255,194,14,.2); border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: var(--space-4, 1rem); }
.fm-info-card--highlight .fm-info-card-icon { background: rgba(255,255,255,.2); }
.fm-info-card-icon svg { width: 24px; height: 24px; stroke: #9b7500; }
.fm-info-card--highlight .fm-info-card-icon svg { stroke: #fff; }
.fm-info-card h3 { font-size: 1.1rem; font-weight: 700; margin: 0 0 var(--space-4, 1rem); }
.fm-info-list { list-style: none; padding: 0; margin: 0 0 var(--space-6, 1.5rem); }
.fm-info-list li { padding: .45rem 0; border-bottom: 1px solid rgba(0,0,0,.06); font-size: .9rem; display: flex; align-items: center; gap: .5rem; }
.fm-info-list li::before { content: "→"; color: #9b7500; font-weight: 700; }
.btn-outline-fm { display: inline-block; border: 2px solid #9b7500; color: #9b7500; border-radius: 30px; padding: .55rem 1.4rem; font-size: .9rem; font-weight: 600; text-decoration: none; transition: background .2s, color .2s; }
.btn-outline-fm:hover { background: #9b7500; color: #fff; }
.fm-contact-items { display: flex; flex-direction: column; gap: .75rem; }
.fm-contact-item { display: flex; flex-direction: column; gap: .15rem; font-size: .9rem; }
.fm-contact-item strong { opacity: .8; font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; }

/* --- CTA --- */
.fm-cta { background: linear-gradient(135deg, #8B6914, #b8890f); color: #fff; padding: var(--space-16, 4rem) 0; }
.fm-cta-inner { text-align: center; max-width: 700px; margin: 0 auto; }
.fm-cta-icon { width: 72px; height: 72px; background: rgba(255,255,255,.15); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto var(--space-4, 1rem); }
.fm-cta-icon svg { color: #fff; }
.fm-cta h2 { font-size: clamp(1.5rem, 3vw, 2rem); font-weight: 800; margin: 0 0 .75rem; }
.fm-cta p { opacity: .9; margin-bottom: var(--space-8, 2rem); }
.fm-cta-actions { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }
.btn-white-fm { background: #fff; color: #8B6914; border-radius: 30px; padding: .75rem 2rem; font-weight: 700; text-decoration: none; transition: transform .2s, box-shadow .2s; }
.btn-white-fm:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,.15); }
.btn-outline-white-fm { border: 2px solid rgba(255,255,255,.7); color: #fff; border-radius: 30px; padding: .75rem 2rem; font-weight: 700; text-decoration: none; transition: background .2s; }
.btn-outline-white-fm:hover { background: rgba(255,255,255,.15); }

/* ═══ RESPONSIVE FM CLEMiC ═══ */
@media (max-width: 1024px) { .fm-pillars-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 900px) { .fm-intro-grid { grid-template-columns: 1fr; } .fm-benefits-grid { grid-template-columns: 1fr; } }
@media (max-width: 768px) { .fm-info-grid { grid-template-columns: 1fr; } .fm-gallery-grid { grid-template-columns: 1fr; } .fm-gallery-item--tall { grid-row: span 1; } .fm-gallery-item img { height: 220px; } .fm-gallery-item--tall img { min-height: 220px; } }
@media (max-width: 600px) { .fm-pillars-grid { grid-template-columns: 1fr; } .fm-intro-stats { flex-direction: column; gap: .75rem; } }


/* ═══════════════════════════════════════════════════════════
   CITECoop / UCMA — Pantone 425C  #63666A
═══════════════════════════════════════════════════════════ */

/* --- Hero --- */
.citecoop-hero {
    background: linear-gradient(135deg, #3f4245 0%, #63666A 50%, #535659 100%);
    color: #fff;
    padding: var(--space-16, 4rem) 0 0;
    position: relative;
    overflow: hidden;
}
.citecoop-breadcrumbs { color: rgba(255,255,255,.75); font-size: .85rem; margin-bottom: var(--space-8, 2rem); }
.citecoop-breadcrumbs a { color: rgba(255,255,255,.85); text-decoration: none; }
.citecoop-breadcrumbs a:hover { color: #fff; text-decoration: underline; }
.citecoop-breadcrumbs span { margin: 0 .4rem; }
.citecoop-hero-inner { text-align: center; padding-bottom: var(--space-10, 2.5rem); }
.citecoop-hero-badge { width: 80px; height: 80px; border-radius: 50%; background: rgba(255,255,255,.15); display: flex; align-items: center; justify-content: center; margin: 0 auto var(--space-4, 1rem); }
.citecoop-hero-badge svg { color: #fff; }
.citecoop-hero-title { font-size: clamp(2rem, 5vw, 3.5rem); font-weight: 800; margin: 0 0 .75rem; letter-spacing: -.02em; }
.citecoop-hero-subtitle { font-size: clamp(1rem, 2vw, 1.25rem); opacity: .9; max-width: 640px; margin: 0 auto; line-height: 1.6; }
.citecoop-hero-wave { line-height: 0; margin-top: var(--space-8, 2rem); }
.citecoop-hero-wave svg { width: 100%; height: auto; display: block; }

/* --- Intro --- */
.citecoop-intro { padding: var(--space-16, 4rem) 0; }
.citecoop-intro-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-12, 3rem); align-items: center; }
.citecoop-eyebrow { color: #63666A; }
.citecoop-intro-heading { font-size: clamp(1.5rem, 3vw, 2.25rem); font-weight: 700; margin: .5rem 0 1rem; }
.citecoop-intro-stats { display: flex; gap: var(--space-6, 1.5rem); margin-top: var(--space-8, 2rem); flex-wrap: wrap; }
.citecoop-stat { text-align: center; }
.citecoop-stat-value { display: block; font-size: 2rem; font-weight: 800; color: #63666A; line-height: 1; }
.citecoop-stat-label { font-size: .78rem; color: var(--color-text-muted, #666); margin-top: .2rem; display: block; }
.citecoop-photo-frame { position: relative; border-radius: 16px; overflow: hidden; box-shadow: 0 20px 60px rgba(99,102,106,.2); }
.citecoop-main-img { width: 100%; height: 360px; object-fit: cover; display: block; }
.citecoop-photo-badge { position: absolute; bottom: 1rem; left: 1rem; background: #63666A; color: #fff; border-radius: 30px; padding: .4rem .9rem; font-size: .78rem; font-weight: 700; display: flex; align-items: center; gap: .4rem; }

/* --- Pillars --- */
.citecoop-pillars { background: var(--color-bg-alt, #f4f6f9); padding: var(--space-16, 4rem) 0; }
.citecoop-pillars-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-6, 1.5rem); margin-top: var(--space-10, 2.5rem); }
.citecoop-pillar { background: #fff; border-radius: 12px; padding: var(--space-6, 1.5rem); box-shadow: 0 2px 12px rgba(0,0,0,.06); transition: transform .2s, box-shadow .2s; }
.citecoop-pillar:hover { transform: translateY(-4px); box-shadow: 0 8px 24px rgba(99,102,106,.14); }
.citecoop-pillar-icon { width: 52px; height: 52px; background: rgba(99,102,106,.12); border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: var(--space-4, 1rem); }
.citecoop-pillar-icon svg { width: 26px; height: 26px; stroke: #63666A; }
.citecoop-pillar h3 { font-size: 1rem; font-weight: 700; margin: 0 0 .5rem; }
.citecoop-pillar p { font-size: .9rem; color: var(--color-text-muted, #666); margin: 0; line-height: 1.5; }

/* --- Gallery --- */
.citecoop-gallery { padding: var(--space-16, 4rem) 0; }
.citecoop-gallery-grid { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: auto auto; gap: var(--space-4, 1rem); }
.citecoop-gallery-item { border-radius: 12px; overflow: hidden; }
.citecoop-gallery-item img { width: 100%; height: 260px; object-fit: cover; display: block; transition: transform .4s; }
.citecoop-gallery-item:hover img { transform: scale(1.04); }
.citecoop-gallery-item--tall { grid-row: span 2; }
.citecoop-gallery-item--tall img { height: 100%; min-height: 400px; }

/* --- Benefits --- */
.citecoop-benefits { background: var(--color-bg-alt, #f4f6f9); padding: var(--space-16, 4rem) 0; }
.citecoop-benefits-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-6, 1.5rem); margin-top: var(--space-10, 2.5rem); }
.citecoop-benefit-card { background: #fff; border-radius: 12px; padding: var(--space-6, 1.5rem); display: flex; gap: var(--space-4, 1rem); box-shadow: 0 2px 12px rgba(0,0,0,.06); }
.citecoop-benefit-icon { flex-shrink: 0; width: 44px; height: 44px; background: rgba(99,102,106,.12); border-radius: 10px; display: flex; align-items: center; justify-content: center; }
.citecoop-benefit-icon svg { width: 22px; height: 22px; stroke: #63666A; }
.citecoop-benefit-body h3 { font-size: 1rem; font-weight: 700; margin: 0 0 .4rem; }
.citecoop-benefit-body p { font-size: .88rem; color: var(--color-text-muted, #666); margin: 0; line-height: 1.5; }

/* --- Info --- */
.citecoop-info { padding: var(--space-16, 4rem) 0; }
.citecoop-info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-8, 2rem); }
.citecoop-info-card { background: var(--color-bg-alt, #f4f6f9); border-radius: 16px; padding: var(--space-8, 2rem); }
.citecoop-info-card--highlight { background: linear-gradient(135deg, #3f4245, #63666A); color: #fff; }
.citecoop-info-card--highlight h3, .citecoop-info-card--highlight strong { color: #fff; }
.citecoop-info-card--highlight a { color: #fff; }
.citecoop-info-card-icon { width: 48px; height: 48px; background: rgba(99,102,106,.12); border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: var(--space-4, 1rem); }
.citecoop-info-card--highlight .citecoop-info-card-icon { background: rgba(255,255,255,.2); }
.citecoop-info-card-icon svg { width: 24px; height: 24px; stroke: #63666A; }
.citecoop-info-card--highlight .citecoop-info-card-icon svg { stroke: #fff; }
.citecoop-info-card h3 { font-size: 1.1rem; font-weight: 700; margin: 0 0 var(--space-4, 1rem); }
.citecoop-info-list { list-style: none; padding: 0; margin: 0 0 var(--space-6, 1.5rem); }
.citecoop-info-list li { padding: .45rem 0; border-bottom: 1px solid rgba(0,0,0,.06); font-size: .9rem; display: flex; align-items: center; gap: .5rem; }
.citecoop-info-list li::before { content: "→"; color: #63666A; font-weight: 700; }
.btn-outline-citecoop { display: inline-block; border: 2px solid #63666A; color: #63666A; border-radius: 30px; padding: .55rem 1.4rem; font-size: .9rem; font-weight: 600; text-decoration: none; transition: background .2s, color .2s; }
.btn-outline-citecoop:hover { background: #63666A; color: #fff; }
.citecoop-contact-items { display: flex; flex-direction: column; gap: .75rem; }
.citecoop-contact-item { display: flex; flex-direction: column; gap: .15rem; font-size: .9rem; }
.citecoop-contact-item strong { opacity: .8; font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; }

/* --- CTA --- */
.citecoop-cta { background: linear-gradient(135deg, #3f4245, #63666A); color: #fff; padding: var(--space-16, 4rem) 0; }
.citecoop-cta-inner { text-align: center; max-width: 700px; margin: 0 auto; }
.citecoop-cta-icon { width: 72px; height: 72px; background: rgba(255,255,255,.15); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto var(--space-4, 1rem); }
.citecoop-cta-icon svg { color: #fff; }
.citecoop-cta h2 { font-size: clamp(1.5rem, 3vw, 2rem); font-weight: 800; margin: 0 0 .75rem; }
.citecoop-cta p { opacity: .9; margin-bottom: var(--space-8, 2rem); }
.citecoop-cta-actions { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }
.btn-white-citecoop { background: #fff; color: #63666A; border-radius: 30px; padding: .75rem 2rem; font-weight: 700; text-decoration: none; transition: transform .2s, box-shadow .2s; }
.btn-white-citecoop:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,.15); }
.btn-outline-white-citecoop { border: 2px solid rgba(255,255,255,.7); color: #fff; border-radius: 30px; padding: .75rem 2rem; font-weight: 700; text-decoration: none; transition: background .2s; }
.btn-outline-white-citecoop:hover { background: rgba(255,255,255,.15); }

/* ═══ RESPONSIVE CITECoop ═══ */
@media (max-width: 1024px) { .citecoop-pillars-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 900px) { .citecoop-intro-grid { grid-template-columns: 1fr; } .citecoop-benefits-grid { grid-template-columns: 1fr; } }
@media (max-width: 768px) { .citecoop-info-grid { grid-template-columns: 1fr; } .citecoop-gallery-grid { grid-template-columns: 1fr; } .citecoop-gallery-item--tall { grid-row: span 1; } .citecoop-gallery-item img { height: 220px; } .citecoop-gallery-item--tall img { min-height: 220px; } }
@media (max-width: 600px) { .citecoop-pillars-grid { grid-template-columns: 1fr; } .citecoop-intro-stats { flex-direction: column; gap: .75rem; } }


/* ═══════════════════════════════════════════════════════════
   FINANCIAMIENTO SOLIDARIO — Pantone 1788C  #F4364C
═══════════════════════════════════════════════════════════ */

/* --- Hero --- */
.finsol-hero {
    background: linear-gradient(135deg, #b3152a 0%, #F4364C 50%, #d12940 100%);
    color: #fff;
    padding: var(--space-16, 4rem) 0 0;
    position: relative;
    overflow: hidden;
}
.finsol-breadcrumbs { color: rgba(255,255,255,.75); font-size: .85rem; margin-bottom: var(--space-8, 2rem); }
.finsol-breadcrumbs a { color: rgba(255,255,255,.85); text-decoration: none; }
.finsol-breadcrumbs a:hover { color: #fff; text-decoration: underline; }
.finsol-breadcrumbs span { margin: 0 .4rem; }
.finsol-hero-inner { text-align: center; padding-bottom: var(--space-10, 2.5rem); }
.finsol-hero-badge { width: 80px; height: 80px; border-radius: 50%; background: rgba(255,255,255,.15); display: flex; align-items: center; justify-content: center; margin: 0 auto var(--space-4, 1rem); }
.finsol-hero-badge svg { color: #fff; }
.finsol-hero-title { font-size: clamp(2rem, 5vw, 3.5rem); font-weight: 800; margin: 0 0 .75rem; letter-spacing: -.02em; }
.finsol-hero-subtitle { font-size: clamp(1rem, 2vw, 1.25rem); opacity: .9; max-width: 640px; margin: 0 auto; line-height: 1.6; }
.finsol-hero-wave { line-height: 0; margin-top: var(--space-8, 2rem); }
.finsol-hero-wave svg { width: 100%; height: auto; display: block; }

/* --- Intro --- */
.finsol-intro { padding: var(--space-16, 4rem) 0; }
.finsol-intro-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-12, 3rem); align-items: center; }
.finsol-eyebrow { color: #c8182e; }
.finsol-intro-heading { font-size: clamp(1.5rem, 3vw, 2.25rem); font-weight: 700; margin: .5rem 0 1rem; }
.finsol-intro-stats { display: flex; gap: var(--space-6, 1.5rem); margin-top: var(--space-8, 2rem); flex-wrap: wrap; }
.finsol-stat { text-align: center; }
.finsol-stat-value { display: block; font-size: 2rem; font-weight: 800; color: #c8182e; line-height: 1; }
.finsol-stat-label { font-size: .78rem; color: var(--color-text-muted, #666); margin-top: .2rem; display: block; }
.finsol-photo-frame { position: relative; border-radius: 16px; overflow: hidden; box-shadow: 0 20px 60px rgba(244,54,76,.18); }
.finsol-main-img { width: 100%; height: 360px; object-fit: cover; display: block; }
.finsol-photo-badge { position: absolute; bottom: 1rem; left: 1rem; background: #c8182e; color: #fff; border-radius: 30px; padding: .4rem .9rem; font-size: .78rem; font-weight: 700; display: flex; align-items: center; gap: .4rem; }

/* --- Pillars --- */
.finsol-pillars { background: var(--color-bg-alt, #f4f6f9); padding: var(--space-16, 4rem) 0; }
.finsol-pillars-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-6, 1.5rem); margin-top: var(--space-10, 2.5rem); }
.finsol-pillar { background: #fff; border-radius: 12px; padding: var(--space-6, 1.5rem); box-shadow: 0 2px 12px rgba(0,0,0,.06); transition: transform .2s, box-shadow .2s; }
.finsol-pillar:hover { transform: translateY(-4px); box-shadow: 0 8px 24px rgba(244,54,76,.12); }
.finsol-pillar-icon { width: 52px; height: 52px; background: rgba(244,54,76,.1); border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: var(--space-4, 1rem); }
.finsol-pillar-icon svg { width: 26px; height: 26px; stroke: #c8182e; }
.finsol-pillar h3 { font-size: 1rem; font-weight: 700; margin: 0 0 .5rem; }
.finsol-pillar p { font-size: .9rem; color: var(--color-text-muted, #666); margin: 0; line-height: 1.5; }

/* --- Gallery --- */
.finsol-gallery { padding: var(--space-16, 4rem) 0; }
.finsol-gallery-grid { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: auto auto; gap: var(--space-4, 1rem); }
.finsol-gallery-item { border-radius: 12px; overflow: hidden; }
.finsol-gallery-item img { width: 100%; height: 260px; object-fit: cover; display: block; transition: transform .4s; }
.finsol-gallery-item:hover img { transform: scale(1.04); }
.finsol-gallery-item--tall { grid-row: span 2; }
.finsol-gallery-item--tall img { height: 100%; min-height: 400px; }

/* --- Benefits --- */
.finsol-benefits { background: var(--color-bg-alt, #f4f6f9); padding: var(--space-16, 4rem) 0; }
.finsol-benefits-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-6, 1.5rem); margin-top: var(--space-10, 2.5rem); }
.finsol-benefit-card { background: #fff; border-radius: 12px; padding: var(--space-6, 1.5rem); display: flex; gap: var(--space-4, 1rem); box-shadow: 0 2px 12px rgba(0,0,0,.06); }
.finsol-benefit-icon { flex-shrink: 0; width: 44px; height: 44px; background: rgba(244,54,76,.1); border-radius: 10px; display: flex; align-items: center; justify-content: center; }
.finsol-benefit-icon svg { width: 22px; height: 22px; stroke: #c8182e; }
.finsol-benefit-body h3 { font-size: 1rem; font-weight: 700; margin: 0 0 .4rem; }
.finsol-benefit-body p { font-size: .88rem; color: var(--color-text-muted, #666); margin: 0; line-height: 1.5; }

/* --- Info --- */
.finsol-info { padding: var(--space-16, 4rem) 0; }
.finsol-info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-8, 2rem); }
.finsol-info-card { background: var(--color-bg-alt, #f4f6f9); border-radius: 16px; padding: var(--space-8, 2rem); }
.finsol-info-card--highlight { background: linear-gradient(135deg, #b3152a, #F4364C); color: #fff; }
.finsol-info-card--highlight h3, .finsol-info-card--highlight strong { color: #fff; }
.finsol-info-card--highlight a { color: #fff; }
.finsol-info-card-icon { width: 48px; height: 48px; background: rgba(244,54,76,.1); border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: var(--space-4, 1rem); }
.finsol-info-card--highlight .finsol-info-card-icon { background: rgba(255,255,255,.2); }
.finsol-info-card-icon svg { width: 24px; height: 24px; stroke: #c8182e; }
.finsol-info-card--highlight .finsol-info-card-icon svg { stroke: #fff; }
.finsol-info-card h3 { font-size: 1.1rem; font-weight: 700; margin: 0 0 var(--space-4, 1rem); }
.finsol-info-list { list-style: none; padding: 0; margin: 0 0 var(--space-6, 1.5rem); }
.finsol-info-list li { padding: .45rem 0; border-bottom: 1px solid rgba(0,0,0,.06); font-size: .9rem; display: flex; align-items: center; gap: .5rem; }
.finsol-info-list li::before { content: "→"; color: #c8182e; font-weight: 700; }
.btn-outline-finsol { display: inline-block; border: 2px solid #c8182e; color: #c8182e; border-radius: 30px; padding: .55rem 1.4rem; font-size: .9rem; font-weight: 600; text-decoration: none; transition: background .2s, color .2s; }
.btn-outline-finsol:hover { background: #c8182e; color: #fff; }
.finsol-contact-items { display: flex; flex-direction: column; gap: .75rem; }
.finsol-contact-item { display: flex; flex-direction: column; gap: .15rem; font-size: .9rem; }
.finsol-contact-item strong { opacity: .8; font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; }

/* --- CTA --- */
.finsol-cta { background: linear-gradient(135deg, #b3152a, #F4364C); color: #fff; padding: var(--space-16, 4rem) 0; }
.finsol-cta-inner { text-align: center; max-width: 700px; margin: 0 auto; }
.finsol-cta-icon { width: 72px; height: 72px; background: rgba(255,255,255,.15); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto var(--space-4, 1rem); }
.finsol-cta-icon svg { color: #fff; }
.finsol-cta h2 { font-size: clamp(1.5rem, 3vw, 2rem); font-weight: 800; margin: 0 0 .75rem; }
.finsol-cta p { opacity: .9; margin-bottom: var(--space-8, 2rem); }
.finsol-cta-actions { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }
.btn-white-finsol { background: #fff; color: #c8182e; border-radius: 30px; padding: .75rem 2rem; font-weight: 700; text-decoration: none; transition: transform .2s, box-shadow .2s; }
.btn-white-finsol:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,.15); }
.btn-outline-white-finsol { border: 2px solid rgba(255,255,255,.7); color: #fff; border-radius: 30px; padding: .75rem 2rem; font-weight: 700; text-decoration: none; transition: background .2s; }
.btn-outline-white-finsol:hover { background: rgba(255,255,255,.15); }

/* ═══ RESPONSIVE Financiamiento ═══ */
@media (max-width: 1024px) { .finsol-pillars-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 900px) { .finsol-intro-grid { grid-template-columns: 1fr; } .finsol-benefits-grid { grid-template-columns: 1fr; } }
@media (max-width: 768px) { .finsol-info-grid { grid-template-columns: 1fr; } .finsol-gallery-grid { grid-template-columns: 1fr; } .finsol-gallery-item--tall { grid-row: span 1; } .finsol-gallery-item img { height: 220px; } .finsol-gallery-item--tall img { min-height: 220px; } }
@media (max-width: 600px) { .finsol-pillars-grid { grid-template-columns: 1fr; } .finsol-intro-stats { flex-direction: column; gap: .75rem; } }

/* ═══════════════════════════════════════════════════════════
   PÁGINA DE SERVICIOS  —  template-servicios.php
═══════════════════════════════════════════════════════════ */

/* ── Hero ────────────────────────────────────────────────── */
.srv-hero {
    background: linear-gradient(135deg, #1a2235 0%, #1f2d4a 55%, #16213a 100%);
    color: #fff;
    padding: var(--space-16, 4rem) 0 0;
    position: relative;
    overflow: hidden;
}
.srv-breadcrumbs {
    color: rgba(255,255,255,.65);
    font-size: .85rem;
    margin-bottom: var(--space-8, 2rem);
}
.srv-breadcrumbs a { color: rgba(255,255,255,.8); text-decoration: none; }
.srv-breadcrumbs a:hover { color: #fff; text-decoration: underline; }
.srv-breadcrumbs span { margin: 0 .4rem; }
.srv-hero-inner { text-align: center; padding-bottom: var(--space-10, 2.5rem); }
.srv-hero-badge {
    width: 80px; height: 80px; border-radius: 50%;
    background: rgba(255,255,255,.1);
    display: flex; align-items: center; justify-content: center;
    margin: 0 auto var(--space-4, 1rem);
    border: 1px solid rgba(255,255,255,.15);
}
.srv-hero-badge svg { color: rgba(255,255,255,.9); }
.srv-hero-title {
    font-size: clamp(2.2rem, 5vw, 3.8rem);
    font-weight: 800;
    margin: 0 0 .75rem;
    letter-spacing: -.03em;
    color: #ffffff;
    text-shadow: 0 2px 12px rgba(0,0,0,0.45);
}
.srv-hero-subtitle {
    font-size: clamp(1rem, 2vw, 1.2rem);
    opacity: .8;
    max-width: 660px;
    margin: 0 auto;
    line-height: 1.65;
}
.srv-hero-wave { line-height: 0; margin-top: var(--space-8, 2rem); }
.srv-hero-wave svg { width: 100%; height: auto; display: block; }

/* ── Intro ───────────────────────────────────────────────── */
.srv-intro { padding: var(--space-12, 3rem) 0; background: var(--color-bg-page, #f4f6f9); }
.srv-intro-inner { max-width: 820px; margin: 0 auto; text-align: center; }
.srv-intro-lead {
    font-size: 1.08rem;
    line-height: 1.75;
    color: var(--color-text, #222);
    margin-bottom: var(--space-8, 2rem);
}
.srv-intro-pillars {
    display: flex;
    gap: var(--space-6, 1.5rem);
    justify-content: center;
    flex-wrap: wrap;
}
.srv-intro-pillar {
    display: flex;
    align-items: center;
    gap: .5rem;
    background: #fff;
    border-radius: 30px;
    padding: .5rem 1.1rem;
    font-size: .88rem;
    font-weight: 600;
    color: var(--color-text, #333);
    box-shadow: 0 2px 8px rgba(0,0,0,.06);
}
.srv-intro-pillar-icon { font-size: 1.1rem; }

/* ── Cards grid ──────────────────────────────────────────── */
.srv-grid-section { padding: var(--space-16, 4rem) 0; background: var(--color-bg-page, #f4f6f9); }
.srv-cards-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-6, 1.5rem);
}

/* ── Single card ─────────────────────────────────────────── */
.srv-card {
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 4px 16px rgba(0,0,0,.07);
    display: flex;
    flex-direction: column;
    transition: transform .25s, box-shadow .25s;
    position: relative;
}
.srv-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 16px 40px rgba(0,0,0,.12);
}

/* Top color bar */
.srv-card-bar {
    height: 5px;
    background: var(--srv-color, #444);
}

.srv-card-body {
    padding: var(--space-6, 1.5rem);
    display: flex;
    flex-direction: column;
    flex: 1;
    gap: var(--space-4, 1rem);
}

/* Header: icon + title */
.srv-card-header {
    display: flex;
    align-items: flex-start;
    gap: var(--space-4, 1rem);
}
.srv-card-icon {
    flex-shrink: 0;
    width: 52px; height: 52px;
    border-radius: 14px;
    background: var(--srv-light, rgba(0,0,0,.06));
    display: flex;
    align-items: center;
    justify-content: center;
}
.srv-card-icon svg {
    width: 26px; height: 26px;
    stroke: var(--srv-color, #444);
}
.srv-card-title-wrap { flex: 1; padding-top: .1rem; }
.srv-card-tagline {
    display: block;
    font-size: .75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--srv-color, #444);
    margin-bottom: .2rem;
    opacity: .85;
}
.srv-card-name {
    font-size: 1.15rem;
    font-weight: 800;
    margin: 0;
    line-height: 1.25;
    color: var(--color-text, #1a1a2e);
}

/* Description */
.srv-card-desc {
    font-size: .9rem;
    line-height: 1.65;
    color: var(--color-text-muted, #555);
    margin: 0;
    flex: 1;
}

/* Stats */
.srv-card-stats {
    display: flex;
    gap: var(--space-4, 1rem);
    padding: var(--space-3, .75rem) var(--space-4, 1rem);
    background: var(--srv-light, rgba(0,0,0,.04));
    border-radius: 10px;
}
.srv-card-stat { flex: 1; text-align: center; }
.srv-stat-value {
    display: block;
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--srv-color, #444);
    line-height: 1.1;
}
.srv-stat-label {
    display: block;
    font-size: .72rem;
    color: var(--color-text-muted, #666);
    margin-top: .15rem;
    line-height: 1.3;
}

/* Footer / CTA */
.srv-card-footer { margin-top: auto; }
.srv-card-btn {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    border: 2px solid var(--srv-color, #444);
    color: var(--srv-color, #444);
    border-radius: 30px;
    padding: .55rem 1.3rem;
    font-size: .88rem;
    font-weight: 700;
    text-decoration: none;
    transition: background .2s, color .2s, border-color .2s;
    width: 100%;
    justify-content: center;
}
.srv-card-btn:hover {
    background: var(--srv-color, #444);
    color: #fff;
}
.srv-card-btn svg {
    transition: transform .2s;
}
.srv-card-btn:hover svg {
    transform: translateX(3px);
}

/* ── Last card full-width if odd count ───────────────────── */
.srv-cards-grid .srv-card:last-child:nth-child(3n+1) {
    grid-column: 1 / -1;
    max-width: 420px;
    margin: 0 auto;
}
/* If 5 cards: last row has 2 cards — make them span nicely */
.srv-cards-grid .srv-card:nth-last-child(2):nth-child(3n+1),
.srv-cards-grid .srv-card:nth-last-child(1):nth-child(3n+2) {
    /* Let the grid flow naturally with 2 in last row */
}

/* ── CTA Final ───────────────────────────────────────────── */
.srv-cta {
    background: linear-gradient(135deg, #217a14 0%, #43B02A 60%, #2e8a1a 100%);
    color: #fff;
    padding: var(--space-16, 4rem) 0;
}
.srv-cta-inner {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: var(--space-10, 2.5rem);
    align-items: center;
}
.srv-cta-left h2 {
    font-size: clamp(1.5rem, 3vw, 2rem);
    font-weight: 800;
    margin: .35rem 0 .75rem;
}
.srv-cta-left p { opacity: .85; line-height: 1.6; margin: 0; max-width: 520px; }
.srv-cta-right {
    display: flex;
    flex-direction: column;
    gap: .75rem;
    flex-shrink: 0;
}
.srv-cta-btn-primary {
    background: #fff;
    color: #1f2d4a;
    border-radius: 30px;
    padding: .75rem 1.75rem;
    font-weight: 700;
    text-decoration: none;
    text-align: center;
    transition: transform .2s, box-shadow .2s;
    white-space: nowrap;
}
.srv-cta-btn-primary:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,.2); }
.srv-cta-btn-outline {
    border: 2px solid rgba(255,255,255,.6);
    color: #fff;
    border-radius: 30px;
    padding: .75rem 1.75rem;
    font-weight: 700;
    text-decoration: none;
    text-align: center;
    transition: background .2s;
    white-space: nowrap;
}
.srv-cta-btn-outline:hover { background: rgba(255,255,255,.12); }

/* ── Responsive ──────────────────────────────────────────── */
@media (max-width: 1100px) {
    .srv-cards-grid { grid-template-columns: repeat(2, 1fr); }
    .srv-cards-grid .srv-card:last-child:nth-child(3n+1) {
        grid-column: auto;
        max-width: none;
        margin: 0;
    }
}
@media (max-width: 768px) {
    .srv-cta-inner { grid-template-columns: 1fr; }
    .srv-cta-right { flex-direction: row; flex-wrap: wrap; }
}
@media (max-width: 640px) {
    .srv-cards-grid { grid-template-columns: 1fr; }
    .srv-intro-pillars { flex-direction: column; align-items: center; }
    .srv-cta-right { flex-direction: column; }
}

/* ═══════════════════════════════════════════════════════════
   PLAN SALUD  — Pantone 326C  #00B0AD  (teal)
   Contraste hero bg #005756 vs blanco: ~12:1  ✓ AAA
   Contraste color #00B0AD vs blanco en texto grande: ~3.9:1  ✓ AA Large
═══════════════════════════════════════════════════════════ */

.salud-hero {
    background: linear-gradient(135deg, #005756 0%, #007a78 50%, #009998 100%);
    color: #fff;
    padding: var(--space-16, 4rem) 0 0;
    position: relative;
    overflow: hidden;
}
.salud-breadcrumbs { color: rgba(255,255,255,.78); font-size: .85rem; margin-bottom: var(--space-8, 2rem); }
.salud-breadcrumbs a { color: rgba(255,255,255,.88); text-decoration: none; }
.salud-breadcrumbs a:hover { color: #fff; text-decoration: underline; }
.salud-breadcrumbs span { margin: 0 .4rem; }
.salud-hero-inner { text-align: center; padding-bottom: var(--space-10, 2.5rem); }
.salud-hero-badge {
    width: 80px; height: 80px; border-radius: 50%;
    background: rgba(255,255,255,.15);
    display: flex; align-items: center; justify-content: center;
    margin: 0 auto var(--space-4, 1rem);
}
.salud-hero-badge svg { color: #fff; }
.salud-hero-title { font-size: clamp(2rem, 5vw, 3.5rem); font-weight: 800; margin: 0 0 .75rem; letter-spacing: -.02em; }
.salud-hero-subtitle { font-size: clamp(1rem, 2vw, 1.25rem); opacity: .92; max-width: 640px; margin: 0 auto; line-height: 1.6; }
.salud-hero-wave { line-height: 0; margin-top: var(--space-8, 2rem); }
.salud-hero-wave svg { width: 100%; height: auto; display: block; }

.salud-intro { padding: var(--space-16, 4rem) 0; }
.salud-intro-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-12, 3rem); align-items: center; }
.salud-eyebrow { color: #007a78; }
.salud-intro-heading { font-size: clamp(1.5rem, 3vw, 2.25rem); font-weight: 700; margin: .5rem 0 1rem; }
.salud-intro-stats { display: flex; gap: var(--space-6, 1.5rem); margin-top: var(--space-8, 2rem); flex-wrap: wrap; }
.salud-stat { text-align: center; }
.salud-stat-value { display: block; font-size: 2rem; font-weight: 800; color: #007a78; line-height: 1; }
.salud-stat-label { font-size: .78rem; color: var(--color-text-muted, #666); margin-top: .2rem; display: block; }
.salud-photo-frame { position: relative; border-radius: 16px; overflow: hidden; box-shadow: 0 20px 60px rgba(0,176,173,.18); }
.salud-main-img { width: 100%; height: 360px; object-fit: cover; display: block; }
.salud-photo-badge { position: absolute; bottom: 1rem; left: 1rem; background: #007a78; color: #fff; border-radius: 30px; padding: .4rem .9rem; font-size: .78rem; font-weight: 700; display: flex; align-items: center; gap: .4rem; }

.salud-pillars { background: var(--color-bg-alt, #f4f6f9); padding: var(--space-16, 4rem) 0; }
.salud-pillars-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-6, 1.5rem); margin-top: var(--space-10, 2.5rem); }
.salud-pillar { background: #fff; border-radius: 12px; padding: var(--space-6, 1.5rem); box-shadow: 0 2px 12px rgba(0,0,0,.06); transition: transform .2s, box-shadow .2s; }
.salud-pillar:hover { transform: translateY(-4px); box-shadow: 0 8px 24px rgba(0,176,173,.14); }
.salud-pillar-icon { width: 52px; height: 52px; background: rgba(0,176,173,.1); border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: var(--space-4, 1rem); }
.salud-pillar-icon svg { width: 26px; height: 26px; stroke: #007a78; }
.salud-pillar h3 { font-size: 1rem; font-weight: 700; margin: 0 0 .5rem; }
.salud-pillar p { font-size: .9rem; color: var(--color-text-muted, #666); margin: 0; line-height: 1.5; }

.salud-gallery { padding: var(--space-16, 4rem) 0; }
.salud-gallery-grid { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: auto auto; gap: var(--space-4, 1rem); }
.salud-gallery-item { border-radius: 12px; overflow: hidden; }
.salud-gallery-item img { width: 100%; height: 260px; object-fit: cover; display: block; transition: transform .4s; }
.salud-gallery-item:hover img { transform: scale(1.04); }
.salud-gallery-item--tall { grid-row: span 2; }
.salud-gallery-item--tall img { height: 100%; min-height: 400px; }

.salud-benefits { background: var(--color-bg-alt, #f4f6f9); padding: var(--space-16, 4rem) 0; }
.salud-benefits-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-6, 1.5rem); margin-top: var(--space-10, 2.5rem); }
.salud-benefit-card { background: #fff; border-radius: 12px; padding: var(--space-6, 1.5rem); display: flex; gap: var(--space-4, 1rem); box-shadow: 0 2px 12px rgba(0,0,0,.06); }
.salud-benefit-icon { flex-shrink: 0; width: 44px; height: 44px; background: rgba(0,176,173,.1); border-radius: 10px; display: flex; align-items: center; justify-content: center; }
.salud-benefit-icon svg { width: 22px; height: 22px; stroke: #007a78; }
.salud-benefit-body h3 { font-size: 1rem; font-weight: 700; margin: 0 0 .4rem; }
.salud-benefit-body p { font-size: .88rem; color: var(--color-text-muted, #666); margin: 0; line-height: 1.5; }

.salud-info { padding: var(--space-16, 4rem) 0; }
.salud-info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-8, 2rem); }
.salud-info-card { background: var(--color-bg-alt, #f4f6f9); border-radius: 16px; padding: var(--space-8, 2rem); }
.salud-info-card--highlight { background: linear-gradient(135deg, #005756, #007a78); color: #fff; }
.salud-info-card--highlight h3, .salud-info-card--highlight strong { color: #fff; }
.salud-info-card--highlight a { color: #fff; }
.salud-info-card-icon { width: 48px; height: 48px; background: rgba(0,176,173,.12); border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: var(--space-4, 1rem); }
.salud-info-card--highlight .salud-info-card-icon { background: rgba(255,255,255,.2); }
.salud-info-card-icon svg { width: 24px; height: 24px; stroke: #007a78; }
.salud-info-card--highlight .salud-info-card-icon svg { stroke: #fff; }
.salud-info-card h3 { font-size: 1.1rem; font-weight: 700; margin: 0 0 var(--space-4, 1rem); }
.salud-info-list { list-style: none; padding: 0; margin: 0 0 var(--space-6, 1.5rem); }
.salud-info-list li { padding: .45rem 0; border-bottom: 1px solid rgba(0,0,0,.06); font-size: .9rem; display: flex; align-items: center; gap: .5rem; }
.salud-info-list li::before { content: "→"; color: #007a78; font-weight: 700; }
.btn-outline-salud { display: inline-block; border: 2px solid #007a78; color: #007a78; border-radius: 30px; padding: .55rem 1.4rem; font-size: .9rem; font-weight: 600; text-decoration: none; transition: background .2s, color .2s; }
.btn-outline-salud:hover { background: #007a78; color: #fff; }
.salud-contact-items { display: flex; flex-direction: column; gap: .75rem; }
.salud-contact-item { display: flex; flex-direction: column; gap: .15rem; font-size: .9rem; }
.salud-contact-item strong { opacity: .8; font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; }

.salud-cta { background: linear-gradient(135deg, #005756, #007a78); color: #fff; padding: var(--space-16, 4rem) 0; }
.salud-cta-inner { text-align: center; max-width: 700px; margin: 0 auto; }
.salud-cta-icon { width: 72px; height: 72px; background: rgba(255,255,255,.15); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto var(--space-4, 1rem); }
.salud-cta-icon svg { color: #fff; }
.salud-cta h2 { font-size: clamp(1.5rem, 3vw, 2rem); font-weight: 800; margin: 0 0 .75rem; }
.salud-cta p { opacity: .92; margin-bottom: var(--space-8, 2rem); }
.salud-cta-actions { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }
.btn-white-salud { background: #fff; color: #005756; border-radius: 30px; padding: .75rem 2rem; font-weight: 700; text-decoration: none; transition: transform .2s, box-shadow .2s; }
.btn-white-salud:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,.15); }
.btn-outline-white-salud { border: 2px solid rgba(255,255,255,.75); color: #fff; border-radius: 30px; padding: .75rem 2rem; font-weight: 700; text-decoration: none; transition: background .2s; }
.btn-outline-white-salud:hover { background: rgba(255,255,255,.15); }

@media (max-width: 1024px) { .salud-pillars-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 900px) { .salud-intro-grid { grid-template-columns: 1fr; } .salud-benefits-grid { grid-template-columns: 1fr; } }
@media (max-width: 768px) { .salud-info-grid { grid-template-columns: 1fr; } .salud-gallery-grid { grid-template-columns: 1fr; } .salud-gallery-item--tall { grid-row: span 1; } .salud-gallery-item img, .salud-gallery-item--tall img { height: 220px; min-height: 0; } }
@media (max-width: 600px) { .salud-pillars-grid { grid-template-columns: 1fr; } .salud-intro-stats { flex-direction: column; gap: .75rem; } }


/* ═══════════════════════════════════════════════════════════
   FM CLEMiC 103.5 — Pantone 7648C  #6B3FA0  (violeta)
   Contraste hero bg #3d2568 vs blanco: ~13.4:1  ✓ AAA
   Contraste #6B3FA0 vs blanco en texto: ~7.3:1  ✓ AAA
═══════════════════════════════════════════════════════════ */

.fm-hero {
    background: linear-gradient(135deg, #2d1a50 0%, #52328a 55%, #6B3FA0 100%);
    color: #fff;
    padding: var(--space-16, 4rem) 0 0;
    position: relative;
    overflow: hidden;
}
.fm-breadcrumbs { color: rgba(255,255,255,.78); font-size: .85rem; margin-bottom: var(--space-8, 2rem); }
.fm-breadcrumbs a { color: rgba(255,255,255,.88); text-decoration: none; }
.fm-breadcrumbs a:hover { color: #fff; text-decoration: underline; }
.fm-breadcrumbs span { margin: 0 .4rem; }
.fm-hero-inner { text-align: center; padding-bottom: var(--space-10, 2.5rem); }
.fm-hero-badge { width: 80px; height: 80px; border-radius: 50%; background: rgba(255,255,255,.15); display: flex; align-items: center; justify-content: center; margin: 0 auto var(--space-4, 1rem); }
.fm-hero-badge svg { color: #fff; }
.fm-hero-title { font-size: clamp(2rem, 5vw, 3.5rem); font-weight: 800; margin: 0 0 .75rem; letter-spacing: -.02em; }
.fm-hero-subtitle { font-size: clamp(1rem, 2vw, 1.25rem); opacity: .92; max-width: 640px; margin: 0 auto; line-height: 1.6; }
.fm-hero-wave { line-height: 0; margin-top: var(--space-8, 2rem); }
.fm-hero-wave svg { width: 100%; height: auto; display: block; }

.fm-intro { padding: var(--space-16, 4rem) 0; }
.fm-intro-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-12, 3rem); align-items: center; }
.fm-eyebrow { color: #52328a; }
.fm-intro-heading { font-size: clamp(1.5rem, 3vw, 2.25rem); font-weight: 700; margin: .5rem 0 1rem; }
.fm-intro-stats { display: flex; gap: var(--space-6, 1.5rem); margin-top: var(--space-8, 2rem); flex-wrap: wrap; }
.fm-stat { text-align: center; }
.fm-stat-value { display: block; font-size: 2rem; font-weight: 800; color: #52328a; line-height: 1; }
.fm-stat-label { font-size: .78rem; color: var(--color-text-muted, #666); margin-top: .2rem; display: block; }
.fm-photo-frame { position: relative; border-radius: 16px; overflow: hidden; box-shadow: 0 20px 60px rgba(107,63,160,.2); }
.fm-main-img { width: 100%; height: 360px; object-fit: cover; display: block; }
.fm-photo-badge { position: absolute; bottom: 1rem; left: 1rem; background: #52328a; color: #fff; border-radius: 30px; padding: .4rem .9rem; font-size: .78rem; font-weight: 700; display: flex; align-items: center; gap: .4rem; }

.fm-pillars { background: var(--color-bg-alt, #f4f6f9); padding: var(--space-16, 4rem) 0; }
.fm-pillars-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-6, 1.5rem); margin-top: var(--space-10, 2.5rem); }
.fm-pillar { background: #fff; border-radius: 12px; padding: var(--space-6, 1.5rem); box-shadow: 0 2px 12px rgba(0,0,0,.06); transition: transform .2s, box-shadow .2s; }
.fm-pillar:hover { transform: translateY(-4px); box-shadow: 0 8px 24px rgba(107,63,160,.14); }
.fm-pillar-icon { width: 52px; height: 52px; background: rgba(107,63,160,.1); border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: var(--space-4, 1rem); }
.fm-pillar-icon svg { width: 26px; height: 26px; stroke: #52328a; }
.fm-pillar h3 { font-size: 1rem; font-weight: 700; margin: 0 0 .5rem; }
.fm-pillar p { font-size: .9rem; color: var(--color-text-muted, #666); margin: 0; line-height: 1.5; }

.fm-gallery { padding: var(--space-16, 4rem) 0; }
.fm-gallery-grid { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: auto auto; gap: var(--space-4, 1rem); }
.fm-gallery-item { border-radius: 12px; overflow: hidden; }
.fm-gallery-item img { width: 100%; height: 260px; object-fit: cover; display: block; transition: transform .4s; }
.fm-gallery-item:hover img { transform: scale(1.04); }
.fm-gallery-item--tall { grid-row: span 2; }
.fm-gallery-item--tall img { height: 100%; min-height: 400px; }

.fm-benefits { background: var(--color-bg-alt, #f4f6f9); padding: var(--space-16, 4rem) 0; }
.fm-benefits-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-6, 1.5rem); margin-top: var(--space-10, 2.5rem); }
.fm-benefit-card { background: #fff; border-radius: 12px; padding: var(--space-6, 1.5rem); display: flex; gap: var(--space-4, 1rem); box-shadow: 0 2px 12px rgba(0,0,0,.06); }
.fm-benefit-icon { flex-shrink: 0; width: 44px; height: 44px; background: rgba(107,63,160,.1); border-radius: 10px; display: flex; align-items: center; justify-content: center; }
.fm-benefit-icon svg { width: 22px; height: 22px; stroke: #52328a; }
.fm-benefit-body h3 { font-size: 1rem; font-weight: 700; margin: 0 0 .4rem; }
.fm-benefit-body p { font-size: .88rem; color: var(--color-text-muted, #666); margin: 0; line-height: 1.5; }

.fm-info { padding: var(--space-16, 4rem) 0; }
.fm-info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-8, 2rem); }
.fm-info-card { background: var(--color-bg-alt, #f4f6f9); border-radius: 16px; padding: var(--space-8, 2rem); }
.fm-info-card--highlight { background: linear-gradient(135deg, #2d1a50, #52328a); color: #fff; }
.fm-info-card--highlight h3, .fm-info-card--highlight strong { color: #fff; }
.fm-info-card--highlight a { color: #fff; }
.fm-info-card-icon { width: 48px; height: 48px; background: rgba(107,63,160,.12); border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: var(--space-4, 1rem); }
.fm-info-card--highlight .fm-info-card-icon { background: rgba(255,255,255,.2); }
.fm-info-card-icon svg { width: 24px; height: 24px; stroke: #52328a; }
.fm-info-card--highlight .fm-info-card-icon svg { stroke: #fff; }
.fm-info-card h3 { font-size: 1.1rem; font-weight: 700; margin: 0 0 var(--space-4, 1rem); }
.fm-info-list { list-style: none; padding: 0; margin: 0 0 var(--space-6, 1.5rem); }
.fm-info-list li { padding: .45rem 0; border-bottom: 1px solid rgba(0,0,0,.06); font-size: .9rem; display: flex; align-items: center; gap: .5rem; }
.fm-info-list li::before { content: "→"; color: #52328a; font-weight: 700; }
.btn-outline-fm { display: inline-block; border: 2px solid #52328a; color: #52328a; border-radius: 30px; padding: .55rem 1.4rem; font-size: .9rem; font-weight: 600; text-decoration: none; transition: background .2s, color .2s; }
.btn-outline-fm:hover { background: #52328a; color: #fff; }
.fm-contact-items { display: flex; flex-direction: column; gap: .75rem; }
.fm-contact-item { display: flex; flex-direction: column; gap: .15rem; font-size: .9rem; }
.fm-contact-item strong { opacity: .8; font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; }

.fm-cta { background: linear-gradient(135deg, #2d1a50, #52328a); color: #fff; padding: var(--space-16, 4rem) 0; }
.fm-cta-inner { text-align: center; max-width: 700px; margin: 0 auto; }
.fm-cta-icon { width: 72px; height: 72px; background: rgba(255,255,255,.15); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto var(--space-4, 1rem); }
.fm-cta-icon svg { color: #fff; }
.fm-cta h2 { font-size: clamp(1.5rem, 3vw, 2rem); font-weight: 800; margin: 0 0 .75rem; }
.fm-cta p { opacity: .92; margin-bottom: var(--space-8, 2rem); }
.fm-cta-actions { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }
.btn-white-fm { background: #fff; color: #2d1a50; border-radius: 30px; padding: .75rem 2rem; font-weight: 700; text-decoration: none; transition: transform .2s, box-shadow .2s; }
.btn-white-fm:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,.15); }
.btn-outline-white-fm { border: 2px solid rgba(255,255,255,.75); color: #fff; border-radius: 30px; padding: .75rem 2rem; font-weight: 700; text-decoration: none; transition: background .2s; }
.btn-outline-white-fm:hover { background: rgba(255,255,255,.15); }

@media (max-width: 1024px) { .fm-pillars-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 900px) { .fm-intro-grid { grid-template-columns: 1fr; } .fm-benefits-grid { grid-template-columns: 1fr; } }
@media (max-width: 768px) { .fm-info-grid { grid-template-columns: 1fr; } .fm-gallery-grid { grid-template-columns: 1fr; } .fm-gallery-item--tall { grid-row: span 1; } .fm-gallery-item img, .fm-gallery-item--tall img { height: 220px; min-height: 0; } }
@media (max-width: 600px) { .fm-pillars-grid { grid-template-columns: 1fr; } .fm-intro-stats { flex-direction: column; gap: .75rem; } }


/* ═══════════════════════════════════════════════════════════
   CITECoop / UCMA — Pantone 425C  #63666A  (gris)
   Contraste hero bg #2a2c2e vs blanco: ~16:1  ✓ AAA
   Contraste #63666A vs blanco: ~5.2:1  ✓ AA
═══════════════════════════════════════════════════════════ */

.citecoop-hero {
    background: linear-gradient(135deg, #2a2c2e 0%, #3f4245 55%, #52555a 100%);
    color: #fff;
    padding: var(--space-16, 4rem) 0 0;
    position: relative;
    overflow: hidden;
}
.citecoop-breadcrumbs { color: rgba(255,255,255,.78); font-size: .85rem; margin-bottom: var(--space-8, 2rem); }
.citecoop-breadcrumbs a { color: rgba(255,255,255,.88); text-decoration: none; }
.citecoop-breadcrumbs a:hover { color: #fff; text-decoration: underline; }
.citecoop-breadcrumbs span { margin: 0 .4rem; }
.citecoop-hero-inner { text-align: center; padding-bottom: var(--space-10, 2.5rem); }
.citecoop-hero-badge { width: 80px; height: 80px; border-radius: 50%; background: rgba(255,255,255,.15); display: flex; align-items: center; justify-content: center; margin: 0 auto var(--space-4, 1rem); }
.citecoop-hero-badge svg { color: #fff; }
.citecoop-hero-title { font-size: clamp(2rem, 5vw, 3.5rem); font-weight: 800; margin: 0 0 .75rem; letter-spacing: -.02em; }
.citecoop-hero-subtitle { font-size: clamp(1rem, 2vw, 1.25rem); opacity: .92; max-width: 640px; margin: 0 auto; line-height: 1.6; }
.citecoop-hero-wave { line-height: 0; margin-top: var(--space-8, 2rem); }
.citecoop-hero-wave svg { width: 100%; height: auto; display: block; }

.citecoop-intro { padding: var(--space-16, 4rem) 0; }
.citecoop-intro-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-12, 3rem); align-items: center; }
.citecoop-eyebrow { color: #3f4245; }
.citecoop-intro-heading { font-size: clamp(1.5rem, 3vw, 2.25rem); font-weight: 700; margin: .5rem 0 1rem; }
.citecoop-intro-stats { display: flex; gap: var(--space-6, 1.5rem); margin-top: var(--space-8, 2rem); flex-wrap: wrap; }
.citecoop-stat { text-align: center; }
.citecoop-stat-value { display: block; font-size: 2rem; font-weight: 800; color: #3f4245; line-height: 1; }
.citecoop-stat-label { font-size: .78rem; color: var(--color-text-muted, #666); margin-top: .2rem; display: block; }
.citecoop-photo-frame { position: relative; border-radius: 16px; overflow: hidden; box-shadow: 0 20px 60px rgba(99,102,106,.22); }
.citecoop-main-img { width: 100%; height: 360px; object-fit: cover; display: block; }
.citecoop-photo-badge { position: absolute; bottom: 1rem; left: 1rem; background: #3f4245; color: #fff; border-radius: 30px; padding: .4rem .9rem; font-size: .78rem; font-weight: 700; display: flex; align-items: center; gap: .4rem; }

.citecoop-pillars { background: var(--color-bg-alt, #f4f6f9); padding: var(--space-16, 4rem) 0; }
.citecoop-pillars-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-6, 1.5rem); margin-top: var(--space-10, 2.5rem); }
.citecoop-pillar { background: #fff; border-radius: 12px; padding: var(--space-6, 1.5rem); box-shadow: 0 2px 12px rgba(0,0,0,.06); transition: transform .2s, box-shadow .2s; }
.citecoop-pillar:hover { transform: translateY(-4px); box-shadow: 0 8px 24px rgba(99,102,106,.16); }
.citecoop-pillar-icon { width: 52px; height: 52px; background: rgba(99,102,106,.12); border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: var(--space-4, 1rem); }
.citecoop-pillar-icon svg { width: 26px; height: 26px; stroke: #3f4245; }
.citecoop-pillar h3 { font-size: 1rem; font-weight: 700; margin: 0 0 .5rem; }
.citecoop-pillar p { font-size: .9rem; color: var(--color-text-muted, #666); margin: 0; line-height: 1.5; }

.citecoop-gallery { padding: var(--space-16, 4rem) 0; }
.citecoop-gallery-grid { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: auto auto; gap: var(--space-4, 1rem); }
.citecoop-gallery-item { border-radius: 12px; overflow: hidden; }
.citecoop-gallery-item img { width: 100%; height: 260px; object-fit: cover; display: block; transition: transform .4s; }
.citecoop-gallery-item:hover img { transform: scale(1.04); }
.citecoop-gallery-item--tall { grid-row: span 2; }
.citecoop-gallery-item--tall img { height: 100%; min-height: 400px; }

.citecoop-benefits { background: var(--color-bg-alt, #f4f6f9); padding: var(--space-16, 4rem) 0; }
.citecoop-benefits-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-6, 1.5rem); margin-top: var(--space-10, 2.5rem); }
.citecoop-benefit-card { background: #fff; border-radius: 12px; padding: var(--space-6, 1.5rem); display: flex; gap: var(--space-4, 1rem); box-shadow: 0 2px 12px rgba(0,0,0,.06); }
.citecoop-benefit-icon { flex-shrink: 0; width: 44px; height: 44px; background: rgba(99,102,106,.12); border-radius: 10px; display: flex; align-items: center; justify-content: center; }
.citecoop-benefit-icon svg { width: 22px; height: 22px; stroke: #3f4245; }
.citecoop-benefit-body h3 { font-size: 1rem; font-weight: 700; margin: 0 0 .4rem; }
.citecoop-benefit-body p { font-size: .88rem; color: var(--color-text-muted, #666); margin: 0; line-height: 1.5; }

.citecoop-info { padding: var(--space-16, 4rem) 0; }
.citecoop-info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-8, 2rem); }
.citecoop-info-card { background: var(--color-bg-alt, #f4f6f9); border-radius: 16px; padding: var(--space-8, 2rem); }
.citecoop-info-card--highlight { background: linear-gradient(135deg, #2a2c2e, #3f4245); color: #fff; }
.citecoop-info-card--highlight h3, .citecoop-info-card--highlight strong { color: #fff; }
.citecoop-info-card--highlight a { color: #fff; }
.citecoop-info-card-icon { width: 48px; height: 48px; background: rgba(99,102,106,.12); border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: var(--space-4, 1rem); }
.citecoop-info-card--highlight .citecoop-info-card-icon { background: rgba(255,255,255,.2); }
.citecoop-info-card-icon svg { width: 24px; height: 24px; stroke: #3f4245; }
.citecoop-info-card--highlight .citecoop-info-card-icon svg { stroke: #fff; }
.citecoop-info-card h3 { font-size: 1.1rem; font-weight: 700; margin: 0 0 var(--space-4, 1rem); }
.citecoop-info-list { list-style: none; padding: 0; margin: 0 0 var(--space-6, 1.5rem); }
.citecoop-info-list li { padding: .45rem 0; border-bottom: 1px solid rgba(0,0,0,.06); font-size: .9rem; display: flex; align-items: center; gap: .5rem; }
.citecoop-info-list li::before { content: "→"; color: #3f4245; font-weight: 700; }
.btn-outline-citecoop { display: inline-block; border: 2px solid #3f4245; color: #3f4245; border-radius: 30px; padding: .55rem 1.4rem; font-size: .9rem; font-weight: 600; text-decoration: none; transition: background .2s, color .2s; }
.btn-outline-citecoop:hover { background: #3f4245; color: #fff; }
.citecoop-contact-items { display: flex; flex-direction: column; gap: .75rem; }
.citecoop-contact-item { display: flex; flex-direction: column; gap: .15rem; font-size: .9rem; }
.citecoop-contact-item strong { opacity: .8; font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; }

.citecoop-cta { background: linear-gradient(135deg, #2a2c2e, #3f4245); color: #fff; padding: var(--space-16, 4rem) 0; }
.citecoop-cta-inner { text-align: center; max-width: 700px; margin: 0 auto; }
.citecoop-cta-icon { width: 72px; height: 72px; background: rgba(255,255,255,.15); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto var(--space-4, 1rem); }
.citecoop-cta-icon svg { color: #fff; }
.citecoop-cta h2 { font-size: clamp(1.5rem, 3vw, 2rem); font-weight: 800; margin: 0 0 .75rem; }
.citecoop-cta p { opacity: .92; margin-bottom: var(--space-8, 2rem); }
.citecoop-cta-actions { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }
.btn-white-citecoop { background: #fff; color: #2a2c2e; border-radius: 30px; padding: .75rem 2rem; font-weight: 700; text-decoration: none; transition: transform .2s, box-shadow .2s; }
.btn-white-citecoop:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,.15); }
.btn-outline-white-citecoop { border: 2px solid rgba(255,255,255,.75); color: #fff; border-radius: 30px; padding: .75rem 2rem; font-weight: 700; text-decoration: none; transition: background .2s; }
.btn-outline-white-citecoop:hover { background: rgba(255,255,255,.15); }

@media (max-width: 1024px) { .citecoop-pillars-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 900px) { .citecoop-intro-grid { grid-template-columns: 1fr; } .citecoop-benefits-grid { grid-template-columns: 1fr; } }
@media (max-width: 768px) { .citecoop-info-grid { grid-template-columns: 1fr; } .citecoop-gallery-grid { grid-template-columns: 1fr; } .citecoop-gallery-item--tall { grid-row: span 1; } .citecoop-gallery-item img, .citecoop-gallery-item--tall img { height: 220px; min-height: 0; } }
@media (max-width: 600px) { .citecoop-pillars-grid { grid-template-columns: 1fr; } .citecoop-intro-stats { flex-direction: column; gap: .75rem; } }


/* ═══════════════════════════════════════════════════════════
   FINANCIAMIENTO SOLIDARIO — Navy  #1A3A6B
   Contraste hero bg #081226 vs blanco: ~20:1  ✓ AAA
   Contraste #1A3A6B vs blanco: ~12:1  ✓ AAA
═══════════════════════════════════════════════════════════ */

.finsol-hero {
    background: linear-gradient(135deg, #081226 0%, #0F1E3D 55%, #1A3A6B 100%);
    color: #fff;
    padding: var(--space-16, 4rem) 0 0;
    position: relative;
    overflow: hidden;
}
.finsol-breadcrumbs { color: rgba(255,255,255,.78); font-size: .85rem; margin-bottom: var(--space-8, 2rem); }
.finsol-breadcrumbs a { color: rgba(255,255,255,.88); text-decoration: none; }
.finsol-breadcrumbs a:hover { color: #fff; text-decoration: underline; }
.finsol-breadcrumbs span { margin: 0 .4rem; }
.finsol-hero-inner { text-align: center; padding-bottom: var(--space-10, 2.5rem); }
.finsol-hero-badge { width: 80px; height: 80px; border-radius: 50%; background: rgba(255,255,255,.15); display: flex; align-items: center; justify-content: center; margin: 0 auto var(--space-4, 1rem); }
.finsol-hero-badge svg { color: #fff; }
.finsol-hero-title { font-size: clamp(2rem, 5vw, 3.5rem); font-weight: 800; margin: 0 0 .75rem; letter-spacing: -.02em; }
.finsol-hero-subtitle { font-size: clamp(1rem, 2vw, 1.25rem); opacity: .92; max-width: 640px; margin: 0 auto; line-height: 1.6; }
.finsol-hero-wave { line-height: 0; margin-top: var(--space-8, 2rem); }
.finsol-hero-wave svg { width: 100%; height: auto; display: block; }

.finsol-intro { padding: var(--space-16, 4rem) 0; }
.finsol-intro-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-12, 3rem); align-items: center; }
.finsol-eyebrow { color: #1A3A6B; }
.finsol-intro-heading { font-size: clamp(1.5rem, 3vw, 2.25rem); font-weight: 700; margin: .5rem 0 1rem; }
.finsol-intro-stats { display: flex; gap: var(--space-6, 1.5rem); margin-top: var(--space-8, 2rem); flex-wrap: wrap; }
.finsol-stat { text-align: center; }
.finsol-stat-value { display: block; font-size: 2rem; font-weight: 800; color: #1A3A6B; line-height: 1; }
.finsol-stat-label { font-size: .78rem; color: var(--color-text-muted, #666); margin-top: .2rem; display: block; }
.finsol-photo-frame { position: relative; border-radius: 16px; overflow: hidden; box-shadow: 0 20px 60px rgba(26,58,107,.2); }
.finsol-main-img { width: 100%; height: 360px; object-fit: cover; display: block; }
.finsol-photo-badge { position: absolute; bottom: 1rem; left: 1rem; background: #1A3A6B; color: #fff; border-radius: 30px; padding: .4rem .9rem; font-size: .78rem; font-weight: 700; display: flex; align-items: center; gap: .4rem; }

.finsol-pillars { background: var(--color-bg-alt, #f4f6f9); padding: var(--space-16, 4rem) 0; }
.finsol-pillars-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-6, 1.5rem); margin-top: var(--space-10, 2.5rem); }
.finsol-pillar { background: #fff; border-radius: 12px; padding: var(--space-6, 1.5rem); box-shadow: 0 2px 12px rgba(0,0,0,.06); transition: transform .2s, box-shadow .2s; }
.finsol-pillar:hover { transform: translateY(-4px); box-shadow: 0 8px 24px rgba(26,58,107,.14); }
.finsol-pillar-icon { width: 52px; height: 52px; background: rgba(26,58,107,.1); border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: var(--space-4, 1rem); }
.finsol-pillar-icon svg { width: 26px; height: 26px; stroke: #1A3A6B; }
.finsol-pillar h3 { font-size: 1rem; font-weight: 700; margin: 0 0 .5rem; }
.finsol-pillar p { font-size: .9rem; color: var(--color-text-muted, #666); margin: 0; line-height: 1.5; }

.finsol-gallery { padding: var(--space-16, 4rem) 0; }
.finsol-gallery-grid { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: auto auto; gap: var(--space-4, 1rem); }
.finsol-gallery-item { border-radius: 12px; overflow: hidden; }
.finsol-gallery-item img { width: 100%; height: 260px; object-fit: cover; display: block; transition: transform .4s; }
.finsol-gallery-item:hover img { transform: scale(1.04); }
.finsol-gallery-item--tall { grid-row: span 2; }
.finsol-gallery-item--tall img { height: 100%; min-height: 400px; }

.finsol-benefits { background: var(--color-bg-alt, #f4f6f9); padding: var(--space-16, 4rem) 0; }
.finsol-benefits-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-6, 1.5rem); margin-top: var(--space-10, 2.5rem); }
.finsol-benefit-card { background: #fff; border-radius: 12px; padding: var(--space-6, 1.5rem); display: flex; gap: var(--space-4, 1rem); box-shadow: 0 2px 12px rgba(0,0,0,.06); }
.finsol-benefit-icon { flex-shrink: 0; width: 44px; height: 44px; background: rgba(26,58,107,.1); border-radius: 10px; display: flex; align-items: center; justify-content: center; }
.finsol-benefit-icon svg { width: 22px; height: 22px; stroke: #1A3A6B; }
.finsol-benefit-body h3 { font-size: 1rem; font-weight: 700; margin: 0 0 .4rem; }
.finsol-benefit-body p { font-size: .88rem; color: var(--color-text-muted, #666); margin: 0; line-height: 1.5; }

.finsol-info { padding: var(--space-16, 4rem) 0; }
.finsol-info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-8, 2rem); }
.finsol-info-card { background: var(--color-bg-alt, #f4f6f9); border-radius: 16px; padding: var(--space-8, 2rem); }
.finsol-info-card--highlight { background: linear-gradient(135deg, #081226, #1A3A6B); color: #fff; }
.finsol-info-card--highlight h3, .finsol-info-card--highlight strong { color: #fff; }
.finsol-info-card--highlight a { color: #fff; }
.finsol-info-card-icon { width: 48px; height: 48px; background: rgba(26,58,107,.1); border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: var(--space-4, 1rem); }
.finsol-info-card--highlight .finsol-info-card-icon { background: rgba(255,255,255,.2); }
.finsol-info-card-icon svg { width: 24px; height: 24px; stroke: #1A3A6B; }
.finsol-info-card--highlight .finsol-info-card-icon svg { stroke: #fff; }
.finsol-info-card h3 { font-size: 1.1rem; font-weight: 700; margin: 0 0 var(--space-4, 1rem); }
.finsol-info-list { list-style: none; padding: 0; margin: 0 0 var(--space-6, 1.5rem); }
.finsol-info-list li { padding: .45rem 0; border-bottom: 1px solid rgba(0,0,0,.06); font-size: .9rem; display: flex; align-items: center; gap: .5rem; }
.finsol-info-list li::before { content: "→"; color: #1A3A6B; font-weight: 700; }
.btn-outline-finsol { display: inline-block; border: 2px solid #1A3A6B; color: #1A3A6B; border-radius: 30px; padding: .55rem 1.4rem; font-size: .9rem; font-weight: 600; text-decoration: none; transition: background .2s, color .2s; }
.btn-outline-finsol:hover { background: #1A3A6B; color: #fff; }
.finsol-contact-items { display: flex; flex-direction: column; gap: .75rem; }
.finsol-contact-item { display: flex; flex-direction: column; gap: .15rem; font-size: .9rem; }
.finsol-contact-item strong { opacity: .8; font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; }

.finsol-cta { background: linear-gradient(135deg, #081226, #1A3A6B); color: #fff; padding: var(--space-16, 4rem) 0; }
.finsol-cta-inner { text-align: center; max-width: 700px; margin: 0 auto; }
.finsol-cta-icon { width: 72px; height: 72px; background: rgba(255,255,255,.15); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto var(--space-4, 1rem); }
.finsol-cta-icon svg { color: #fff; }
.finsol-cta h2 { font-size: clamp(1.5rem, 3vw, 2rem); font-weight: 800; margin: 0 0 .75rem; }
.finsol-cta p { opacity: .92; margin-bottom: var(--space-8, 2rem); }
.finsol-cta-actions { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }
.btn-white-finsol { background: #fff; color: #081226; border-radius: 30px; padding: .75rem 2rem; font-weight: 700; text-decoration: none; transition: transform .2s, box-shadow .2s; }
.btn-white-finsol:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,.15); }
.btn-outline-white-finsol { border: 2px solid rgba(255,255,255,.75); color: #fff; border-radius: 30px; padding: .75rem 2rem; font-weight: 700; text-decoration: none; transition: background .2s; }
.btn-outline-white-finsol:hover { background: rgba(255,255,255,.15); }

@media (max-width: 1024px) { .finsol-pillars-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 900px) { .finsol-intro-grid { grid-template-columns: 1fr; } .finsol-benefits-grid { grid-template-columns: 1fr; } }
@media (max-width: 768px) { .finsol-info-grid { grid-template-columns: 1fr; } .finsol-gallery-grid { grid-template-columns: 1fr; } .finsol-gallery-item--tall { grid-row: span 1; } .finsol-gallery-item img, .finsol-gallery-item--tall img { height: 220px; min-height: 0; } }
@media (max-width: 600px) { .finsol-pillars-grid { grid-template-columns: 1fr; } .finsol-intro-stats { flex-direction: column; gap: .75rem; } }


/* ═══════════════════════════════════════════════════════════
   PÁGINA DE SERVICIOS  —  template-servicios.php
═══════════════════════════════════════════════════════════ */

.srv-hero {
    background: linear-gradient(135deg, #1a2235 0%, #1f2d4a 55%, #16213a 100%);
    color: #fff;
    padding: var(--space-16, 4rem) 0 0;
    position: relative;
    overflow: hidden;
}
.srv-breadcrumbs { color: rgba(255,255,255,.72); font-size: .85rem; margin-bottom: var(--space-8, 2rem); }
.srv-breadcrumbs a { color: rgba(255,255,255,.85); text-decoration: none; }
.srv-breadcrumbs a:hover { color: #fff; text-decoration: underline; }
.srv-breadcrumbs span { margin: 0 .4rem; }
.srv-hero-inner { text-align: center; padding-bottom: var(--space-10, 2.5rem); }
.srv-hero-badge { width: 80px; height: 80px; border-radius: 50%; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.15); display: flex; align-items: center; justify-content: center; margin: 0 auto var(--space-4, 1rem); }
.srv-hero-badge svg { color: rgba(255,255,255,.92); }
.srv-hero-title { font-size: clamp(2.2rem, 5vw, 3.8rem); font-weight: 800; margin: 0 0 .75rem; letter-spacing: -.03em; color: #ffffff; text-shadow: 0 2px 12px rgba(0,0,0,.45); }
.srv-hero-subtitle { font-size: clamp(1rem, 2vw, 1.2rem); opacity: .85; max-width: 660px; margin: 0 auto; line-height: 1.65; }
.srv-hero-wave { line-height: 0; margin-top: var(--space-8, 2rem); }
.srv-hero-wave svg { width: 100%; height: auto; display: block; }

.srv-intro { padding: var(--space-12, 3rem) 0; background: var(--color-bg-page, #f4f6f9); }
.srv-intro-inner { max-width: 820px; margin: 0 auto; text-align: center; }
.srv-intro-lead { font-size: 1.08rem; line-height: 1.75; color: var(--color-text, #222); margin-bottom: var(--space-8, 2rem); }
.srv-intro-pillars { display: flex; gap: var(--space-6, 1.5rem); justify-content: center; flex-wrap: wrap; }
.srv-intro-pillar { display: flex; align-items: center; gap: .5rem; background: #fff; border-radius: 30px; padding: .5rem 1.1rem; font-size: .88rem; font-weight: 600; color: var(--color-text, #333); box-shadow: 0 2px 8px rgba(0,0,0,.06); }
.srv-intro-pillar-icon { font-size: 1.1rem; }

.srv-grid-section { padding: var(--space-16, 4rem) 0; background: var(--color-bg-page, #f4f6f9); }
.srv-cards-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-6, 1.5rem); }

.srv-card { background: #fff; border-radius: 16px; overflow: hidden; box-shadow: 0 4px 16px rgba(0,0,0,.07); display: flex; flex-direction: column; transition: transform .25s, box-shadow .25s; }
.srv-card:hover { transform: translateY(-6px); box-shadow: 0 16px 40px rgba(0,0,0,.12); }
.srv-card-bar { height: 5px; background: var(--srv-color, #444); }
.srv-card-body { padding: var(--space-6, 1.5rem); display: flex; flex-direction: column; flex: 1; gap: var(--space-4, 1rem); }

.srv-card-header { display: flex; align-items: flex-start; gap: var(--space-4, 1rem); }
.srv-card-icon { flex-shrink: 0; width: 52px; height: 52px; border-radius: 14px; background: var(--srv-light, rgba(0,0,0,.06)); display: flex; align-items: center; justify-content: center; }
.srv-card-icon svg { width: 26px; height: 26px; stroke: var(--srv-color, #444); }
.srv-card-title-wrap { flex: 1; padding-top: .1rem; }
.srv-card-tagline { display: block; font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--srv-color, #444); margin-bottom: .2rem; }
.srv-card-name { font-size: 1.15rem; font-weight: 800; margin: 0; line-height: 1.25; color: var(--color-text, #1a1a2e); }

.srv-card-desc { font-size: .9rem; line-height: 1.65; color: var(--color-text-muted, #555); margin: 0; flex: 1; }

.srv-card-stats { display: flex; gap: var(--space-4, 1rem); padding: var(--space-3, .75rem) var(--space-4, 1rem); background: var(--srv-light, rgba(0,0,0,.04)); border-radius: 10px; }
.srv-card-stat { flex: 1; text-align: center; }
.srv-stat-value { display: block; font-size: 1.15rem; font-weight: 800; color: var(--srv-color, #444); line-height: 1.1; }
.srv-stat-label { display: block; font-size: .72rem; color: var(--color-text-muted, #666); margin-top: .15rem; line-height: 1.3; }

.srv-card-footer { margin-top: auto; }
.srv-card-btn { display: inline-flex; align-items: center; gap: .5rem; border: 2px solid var(--srv-color, #444); color: var(--srv-color, #444); border-radius: 30px; padding: .55rem 1.3rem; font-size: .88rem; font-weight: 700; text-decoration: none; transition: background .2s, color .2s; width: 100%; justify-content: center; }
.srv-card-btn:hover { background: var(--srv-color, #444); color: #fff; }
.srv-card-btn svg { transition: transform .2s; }
.srv-card-btn:hover svg { transform: translateX(3px); }

.srv-cta { background: linear-gradient(135deg, #217a14 0%, #43B02A 60%, #2e8a1a 100%); color: #fff; padding: var(--space-16, 4rem) 0; }
.srv-cta-inner { display: grid; grid-template-columns: 1fr auto; gap: var(--space-10, 2.5rem); align-items: center; }
.srv-cta-left h2 { font-size: clamp(1.5rem, 3vw, 2rem); font-weight: 800; margin: .35rem 0 .75rem; }
.srv-cta-left p { opacity: .88; line-height: 1.6; margin: 0; max-width: 520px; }
.srv-cta-right { display: flex; flex-direction: column; gap: .75rem; flex-shrink: 0; }
.srv-cta-btn-primary { background: #fff; color: #1a5c0e; border-radius: 30px; padding: .75rem 1.75rem; font-weight: 700; text-decoration: none; text-align: center; transition: transform .2s, box-shadow .2s; white-space: nowrap; }
.srv-cta-btn-primary:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,.2); }
.srv-cta-btn-outline { border: 2px solid rgba(255,255,255,.65); color: #fff; border-radius: 30px; padding: .75rem 1.75rem; font-weight: 700; text-decoration: none; text-align: center; transition: background .2s; white-space: nowrap; }
.srv-cta-btn-outline:hover { background: rgba(255,255,255,.12); }

@media (max-width: 1100px) { .srv-cards-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 768px) { .srv-cta-inner { grid-template-columns: 1fr; } .srv-cta-right { flex-direction: row; flex-wrap: wrap; } }
@media (max-width: 640px) { .srv-cards-grid { grid-template-columns: 1fr; } .srv-intro-pillars { flex-direction: column; align-items: center; } .srv-cta-right { flex-direction: column; } }

/* ═══════════════════════════════════════════════════════════
   PÁGINA DE NOTICIAS  —  template-noticias.php
═══════════════════════════════════════════════════════════ */
.nws-hero{background:linear-gradient(135deg,#1a2235 0%,#1c304f 60%,#152640 100%);color:#fff;padding:3.5rem 0 0;position:relative;overflow:hidden}
.nws-hero-bg{position:absolute;inset:0;background:radial-gradient(ellipse 80% 60% at 20% 40%,rgba(26,58,107,.35) 0%,transparent 70%),radial-gradient(ellipse 50% 50% at 85% 20%,rgba(67,176,42,.08) 0%,transparent 60%)}
.nws-breadcrumbs{font-size:.82rem;margin-bottom:1.2rem;display:flex;gap:.3rem;align-items:center;position:relative;z-index:1}
.nws-breadcrumbs a{color:rgba(255,255,255,.65);text-decoration:none}
.nws-breadcrumbs a:hover{color:#fff}
.nws-breadcrumbs span{color:rgba(255,255,255,.4)}
.nws-hero-content{text-align:center;padding-bottom:2.5rem;position:relative;z-index:1}
.nws-hero-icon{width:72px;height:72px;margin:0 auto 1rem;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);border-radius:50%;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.9)}
.nws-hero-title{font-size:clamp(2rem,5vw,3.2rem)!important;font-weight:800!important;margin:0 0 .6rem!important;letter-spacing:-.03em!important;color:#fff!important;text-shadow:0 2px 16px rgba(0,0,0,.45)!important}
.nws-hero-sub{font-size:1.05rem;color:rgba(255,255,255,.78);max-width:500px;margin:0 auto;line-height:1.65}
.nws-hero-wave{line-height:0;margin-top:2rem;position:relative;z-index:1}
.nws-hero-wave svg{display:block;width:100%}
.nws-filters-wrap{background:#fff;border-bottom:1px solid #e4e8ed;padding:.9rem 0;position:sticky;top:0;z-index:90;box-shadow:0 2px 10px rgba(0,0,0,.06)}
.nws-filters{display:flex;flex-wrap:wrap;gap:.45rem;align-items:center}
.nws-pill{display:inline-flex;align-items:center;gap:.35rem;padding:.38rem 1rem;border-radius:20px;font-size:.8rem;font-weight:600;text-decoration:none;color:#5f6b7c;background:#f4f6f9;border:1.5px solid #e4e8ed;transition:all .15s;white-space:nowrap}
.nws-pill:hover{background:#e8f0fa;color:#1a3a6b;border-color:#1a3a6b}
.nws-pill--active{background:#1a3a6b!important;color:#fff!important;border-color:#1a3a6b!important}
.nws-pill-num{background:rgba(0,0,0,.1);border-radius:10px;padding:0 .45rem;font-size:.7rem;line-height:1.7}
.nws-pill--active .nws-pill-num{background:rgba(255,255,255,.25)}
.nws-main{background:#f4f6f9;padding:2.5rem 0 4rem;min-height:50vh}
.nws-active-filter{display:flex;align-items:center;gap:.75rem;margin-bottom:1.4rem;font-size:.88rem;color:#5f6b7c}
.nws-remove-filter{color:#1a3a6b;font-weight:600;text-decoration:none;font-size:.82rem;padding:.25rem .7rem;border:1.5px solid #1a3a6b;border-radius:20px;transition:all .15s}
.nws-remove-filter:hover{background:#1a3a6b;color:#fff}
.nws-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.nws-card--hero{grid-column:1 / -1;display:grid;grid-template-columns:1fr 1fr;min-height:280px}
.nws-card--hero .nws-card-img-wrap{height:auto;min-height:280px}
.nws-card--hero .nws-card-title{font-size:1.35rem!important}
.nws-card--hero .nws-card-excerpt{-webkit-line-clamp:4}
.nws-card{background:#fff;border-radius:14px;overflow:hidden;border:1px solid #e4e8ed;transition:box-shadow .2s,transform .2s;display:flex;flex-direction:column}
.nws-card:hover{box-shadow:0 8px 28px rgba(26,58,107,.13);transform:translateY(-3px)}
.nws-card-img-wrap{display:block;overflow:hidden;height:185px;background:linear-gradient(135deg,#d0dcea 0%,#b8cce0 100%);flex-shrink:0}
.nws-card-img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s}
.nws-card:hover .nws-card-img{transform:scale(1.05)}
.nws-card-no-img{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:#8fa3be;background:linear-gradient(135deg,#d4e0ef 0%,#c0d0e4 100%)}
.nws-card-body{padding:1.15rem 1.25rem 1.3rem;display:flex;flex-direction:column;flex:1;gap:.55rem}
.nws-card-tag{display:inline-flex;align-items:center;gap:.5rem;font-size:.72rem;font-weight:700;padding:.25rem .75rem;border-radius:20px;text-transform:uppercase;letter-spacing:.5px;width:fit-content;line-height:1.5}
.nws-card-title{font-size:1rem!important;font-weight:700!important;color:#1a2235!important;line-height:1.4!important;margin:0!important}
.nws-card-title a{color:inherit!important;text-decoration:none!important;transition:color .15s}
.nws-card-title a:hover{color:#1a3a6b!important}
.nws-card-excerpt{font-size:.875rem!important;color:#4b5563!important;line-height:1.65!important;margin:0!important;flex:1;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.nws-card-foot{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-top:auto;padding-top:.7rem;border-top:1px solid #f0f2f5}
.nws-card-meta{display:inline-flex;align-items:center;gap:.35rem;font-size:.78rem;color:#6b7280}
.nws-card-meta svg{color:#9ca3af;flex-shrink:0}
.nws-read-more{display:inline-flex;align-items:center;gap:.3rem;font-size:.8rem;font-weight:700;color:#1a3a6b;text-decoration:none;transition:gap .15s;white-space:nowrap}
.nws-read-more:hover{gap:.5rem}
.nws-pager{display:flex;justify-content:center;gap:.5rem;margin-top:2.5rem;flex-wrap:wrap}
.nws-pager-btn{width:42px;height:42px;display:flex;align-items:center;justify-content:center;border-radius:10px;font-size:.88rem;font-weight:600;text-decoration:none;color:#5f6b7c;background:#fff;border:1.5px solid #e4e8ed;transition:all .15s}
.nws-pager-btn:hover{border-color:#1a3a6b;color:#1a3a6b}
.nws-pager-btn.active{background:#1a3a6b;color:#fff;border-color:#1a3a6b}
.nws-empty{text-align:center;padding:4rem 0}
.nws-empty-icon{width:96px;height:96px;border-radius:50%;background:#fff;border:1px solid #e4e8ed;display:flex;align-items:center;justify-content:center;margin:0 auto 1rem}
.nws-empty h3{font-size:1.15rem;font-weight:700;color:#1a2235;margin-bottom:.5rem}
.nws-empty p{color:#5f6b7c;max-width:360px;margin:0 auto;font-size:.92rem}
@media(max-width:1024px){.nws-grid{grid-template-columns:repeat(2,1fr)}.nws-card--hero{grid-column:span 2}}
@media(max-width:700px){.nws-grid{grid-template-columns:1fr}.nws-card--hero{grid-column:span 1;grid-template-columns:1fr}.nws-card--hero .nws-card-img-wrap{height:200px;min-height:200px}.nws-hero-title{font-size:1.75rem!important}.nws-pill{font-size:.75rem;padding:.32rem .8rem}}