/* APECRIM La Libertad — estilos exclusivos Nosotros */
.about-hero{min-height:510px;padding:165px 0 85px;display:flex;align-items:center;text-align:center;color:white;background:linear-gradient(125deg,rgba(7,24,39,.97),rgba(16,42,67,.88)),url('../images/hero.jpg') center/cover}.about-hero h1{font-size:clamp(2.2rem,5vw,4rem);max-width:920px;margin:14px auto 20px}.about-hero p{max-width:790px;margin:0 auto 30px;font-size:1.12rem;color:#e5eaf0}.about-eyebrow{color:#E5C56A;letter-spacing:.23em;font-weight:700;font-size:.78rem}.about-subnav{background:#fff;box-shadow:0 7px 28px rgba(7,24,39,.07);position:sticky;top:90px;z-index:90}.about-subnav .container{display:flex;align-items:center;justify-content:center;gap:27px;overflow-x:auto;white-space:nowrap;scrollbar-width:thin}.about-subnav a{color:#102A43;font-weight:600;font-size:.84rem;padding:17px 0}.about-subnav a:hover{color:#C99A2E}.about-section{scroll-margin-top:165px}.about-soft{background:#F5F7FA}.about-prose{max-width:970px;margin:0 auto}.about-prose p{font-size:1.045rem;line-height:1.95;margin-bottom:22px;text-align:justify}.about-lead{max-width:900px;text-align:center;margin:0 auto 40px;color:#526273}.about-quote{text-align:center;max-width:940px;margin:0 auto 30px;padding:25px;border-left:4px solid #C99A2E;background:#F5F7FA;font-family:Montserrat,sans-serif;font-size:1.2rem;font-weight:700;color:#102A43}.objectives-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;list-style:none;counter-reset:none}.objectives-grid li{padding:23px;display:flex;align-items:flex-start;gap:16px;background:white;border:1px solid rgba(36,59,83,.09);border-radius:13px;box-shadow:0 6px 20px rgba(0,0,0,.035)}.objectives-grid li:last-child{grid-column:1/-1}.objective-num{font-family:Montserrat,sans-serif;color:#C99A2E;font-size:1.55rem;font-weight:800;line-height:1.2}.objectives-grid p{font-size:.95rem;line-height:1.75}.members-list{max-width:1000px;margin:auto;display:grid;gap:24px}.member-card{padding:30px 35px;border:1px solid rgba(36,59,83,.12);border-radius:16px;background:#fff;box-shadow:0 10px 32px rgba(7,24,39,.05)}.member-heading{display:flex;gap:20px;align-items:center;padding-bottom:20px;border-bottom:1px solid #e8ebef;margin-bottom:18px}.member-initials{width:66px;height:66px;flex:0 0 66px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#102A43;color:#E5C56A;font-size:1.3rem;font-weight:700}.member-heading h3{font-size:1.25rem;color:#071827}.member-role{color:#866217;font-size:.91rem;margin-top:6px;line-height:1.5}.member-details p{margin:0 0 14px;line-height:1.8;color:#3c4b59}.member-details h4{font-size:.96rem;color:#102A43;margin:24px 0 10px}.profile-list{padding-left:22px;margin-bottom:12px;line-height:1.85;color:#3c4b59}.profile-list li{padding:3px 0}.about-section .section-title{margin-bottom:38px}.footer p{margin-top:8px}.about-hero .btn i{margin-left:8px}@media(max-width:992px){.about-subnav{top:90px}.about-subnav .container{justify-content:flex-start}}@media(max-width:768px){.about-hero{min-height:420px;padding:135px 0 60px}.about-hero p{font-size:1rem}.about-subnav{top:80px}.about-subnav .container{gap:20px}.objectives-grid{grid-template-columns:1fr}.objectives-grid li:last-child{grid-column:auto}.about-prose p{text-align:left;font-size:1rem}.member-card{padding:22px}.member-heading{gap:12px}.member-initials{width:50px;height:50px;flex-basis:50px;font-size:1rem}.member-heading h3{font-size:1.05rem}}@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}}


/* HISTORIA E IDENTIDAD UNIFICADAS */
.about-history{background:#fff}
.about-history .section-title p{max-width:710px;margin:12px auto 0;color:#607080}
.history-intro{max-width:970px;margin:0 auto 22px}
.history-kicker{display:inline-block;font-size:.76rem;font-weight:800;letter-spacing:.19em;color:#A97B19;margin-bottom:12px}
.history-intro h3,.history-split-copy h3{font-size:clamp(1.35rem,2.6vw,2rem);color:var(--primary);margin-bottom:22px;line-height:1.4}
.history-figure{max-width:1040px;margin:42px auto 48px}
.history-figure img{width:100%;display:block;border-radius:18px;object-fit:cover;background:#e9eff3;box-shadow:0 16px 42px rgba(7,24,39,.12)}
.history-figure figcaption{text-align:center;font-size:.84rem;color:#627486;margin-top:12px;font-style:italic}
.history-split{display:grid;grid-template-columns:minmax(0,.87fr) minmax(0,1.13fr);gap:46px;align-items:center;max-width:1100px;margin:46px auto}
.history-split .history-figure{margin:0}
.history-figure-side img{aspect-ratio:5/6;object-fit:cover}
.history-split-copy p{margin-bottom:19px;line-height:1.85;font-size:1rem;color:#354858;text-align:left}
.history-closing{max-width:950px;margin:48px auto 0;background:#f5f7fa;border-left:4px solid #c99a2e;border-radius:12px;padding:27px 32px;display:flex;gap:18px;align-items:center;color:#102a43}
.history-closing i{font-size:2rem;color:#C99A2E}
.history-closing p{font-weight:600;line-height:1.7;margin:0}
@media(max-width:768px){.history-split{grid-template-columns:1fr;gap:26px}.history-figure{margin:30px auto 34px}.history-figure-side img{aspect-ratio:16/11}.history-closing{padding:22px;align-items:flex-start}.history-intro h3,.history-split-copy h3{font-size:1.4rem}}


/* GALERÍA INSTITUCIONAL DE SOCIOS — APECRIM 2026 */
.socios-showcase{background:linear-gradient(180deg,#f5f7fa 0%,#fff 48%,#f5f7fa 100%);padding:105px 0;scroll-margin-top:145px}
.socios-intro{text-align:center;max-width:770px;margin:0 auto 50px}.socios-kicker{font-size:.73rem;font-weight:800;letter-spacing:.23em;color:#a67c21}.socios-intro h2{font-size:clamp(2rem,4vw,3.4rem);color:#071827;margin:12px 0 18px;line-height:1.18}.socios-intro h2 em{font-style:normal;color:#b88a27}.socios-intro p{font-size:1rem;color:#637184;line-height:1.8}
.socios-divider{display:flex;align-items:center;gap:20px;margin:35px 0 30px;color:#a67c21;font-size:.7rem;letter-spacing:.18em}.socios-divider span{height:1px;background:linear-gradient(90deg,transparent,rgba(201,154,46,.45));flex:1}.socios-divider span:last-child{transform:rotate(180deg)}.socios-divider-secondary{margin-top:65px}
.socios-featured{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.socio-feature{overflow:hidden;background:white;border:1px solid rgba(7,24,39,.08);border-radius:18px;box-shadow:0 15px 40px rgba(7,24,39,.07);display:grid;grid-template-columns:40% 60%;min-width:0;transition:transform .3s,box-shadow .3s}.socio-feature:hover{transform:translateY(-5px);box-shadow:0 20px 50px rgba(7,24,39,.13)}.socio-photo{min-height:325px;overflow:hidden;background:#e4e8ec}.socio-photo img{height:100%;width:100%;object-fit:cover;object-position:center 20%;display:block}.socio-information{padding:28px 26px;min-width:0;display:flex;flex-direction:column;align-items:flex-start}.socio-tag{font-size:.62rem;letter-spacing:.13em;color:#b0842d;font-weight:800}.socio-tag i{margin-right:5px}.socio-information h3{font-size:clamp(1.12rem,1.6vw,1.45rem);line-height:1.35;color:#071827;margin:13px 0 8px}.socio-role{font-size:.84rem;color:#a67c21;font-weight:700;line-height:1.5;margin-bottom:16px}.socio-excerpt{font-size:.88rem;line-height:1.73;color:#586777;margin-bottom:18px}.socio-more{width:100%;margin-top:auto;border-top:1px solid #e7edf1;padding-top:12px}.socio-more summary{cursor:pointer;font-size:.82rem;color:#0f334e;font-weight:700;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:6px}.socio-more summary::-webkit-details-marker{display:none}.socio-more summary i{color:#c99a2e;transition:transform .2s}.socio-more[open] summary i{transform:rotate(90deg)}.socio-more p{font-size:.84rem;line-height:1.75;color:#596b7c;margin:13px 0 0}
.socios-gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}.socio-tile{position:relative;margin:0;overflow:hidden;background:#102a43;border-radius:16px;box-shadow:0 14px 30px rgba(7,24,39,.10)}.socio-tile-photo{aspect-ratio:4/5;overflow:hidden}.socio-tile img{width:100%;height:100%;display:block;object-fit:cover;object-position:center 18%;transition:transform .45s}.socio-tile:hover img{transform:scale(1.055)}.socio-tile figcaption{min-height:67px;display:flex;align-items:center;justify-content:center;text-align:center;padding:14px 12px;color:white;font-size:.86rem;font-weight:600;line-height:1.5;border-top:2px solid #c99a2e}
@media(max-width:1100px){.socios-featured{grid-template-columns:1fr}.socio-feature{grid-template-columns:32% 68%}.socios-gallery{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:768px){.socios-showcase{padding:65px 0}.socios-intro{margin-bottom:30px}.socios-divider{gap:9px;font-size:.62rem}.socios-featured{gap:20px}.socio-feature{grid-template-columns:1fr}.socio-photo{height:340px;min-height:0}.socio-photo img{object-position:center 15%}.socio-information{padding:24px}.socios-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.socio-tile figcaption{min-height:70px;font-size:.76rem;padding:9px}}
@media(max-width:420px){.socio-photo{height:300px}.socios-gallery{gap:10px}.socio-tile figcaption{font-size:.71rem}}
@media(prefers-reduced-motion:reduce){.socio-feature,.socio-tile img,.socio-more summary i{transition:none}}

/* =========================================
   APECRIM - PILARES PREMIUM 2026
========================================= */

.pilares-premium {
    position: relative;
    padding: 110px 0 100px;
    overflow: hidden;
    background:
        radial-gradient(
            ellipse at 50% 0%,
            #18354b 0%,
            #071827 70%
        );
    color: #fff;
}

/* Encabezado */

.pilares-heading {
    max-width: 780px;
    margin: 0 auto 65px;
    text-align: center;
}

.pilares-eyebrow {
    display: block;
    margin-bottom: 18px;
    color: #e5c56a;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 3px;
}

.pilares-heading h2 {
    color: #fff;
    font-size: clamp(32px, 4vw, 49px);
    font-weight: 700;
    line-height: 1.2;
}

.pilares-heading h2 span {
    display: block;
    color: #e5c56a;
}

.pilares-heading p {
    max-width: 640px;
    margin: 24px auto 0;
    color: #c5d0da;
    font-size: 17px;
    line-height: 1.85;
}

/* Estructura de columnas */

.pilares-arquitectura {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 28px;
    align-items: stretch;
    max-width: 1120px;
    margin: auto;
}

/* Pilar individual */

.pilar-premium {
    min-width: 0;
    display: flex;
    flex-direction: column;
    transition: transform .4s ease;
}

.pilar-premium:hover {
    transform: translateY(-9px);
}

/* Capitel superior */

.pilar-capitel {
    height: 18px;
    margin: 0 10px;
    border: 1px solid rgba(229,197,106,.55);
    border-radius: 7px 7px 0 0;
    background: linear-gradient(
        90deg,
        #967027,
        #e5c56a,
        #967027
    );
}

.pilar-cuerpo {
    position: relative;
    flex: 1;
    padding: 42px 28px 36px;
    text-align: center;
    background: linear-gradient(
        145deg,
        #17344a,
        #0b2032
    );
    border-left: 1px solid rgba(229,197,106,.25);
    border-right: 1px solid rgba(229,197,106,.25);
    box-shadow: inset 0 0 40px rgba(0,0,0,.12);
}

/* Número */

.pilar-numero {
    display: block;
    margin-bottom: 25px;
    color: rgba(229,197,106,.42);
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
    letter-spacing: 4px;
}

/* Símbolos */

.pilar-simbolo {
    width: 86px;
    height: 86px;
    margin: 0 auto 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(229,197,106,.4);
    border-radius: 50%;
    color: #e5c56a;
    background: rgba(255,255,255,.035);
    font-size: 34px;
    transition: background .35s, transform .35s;
}

.pilar-premium:hover .pilar-simbolo {
    background: rgba(229,197,106,.12);
    transform: scale(1.06);
}

.pilar-cuerpo h3 {
    margin-bottom: 20px;
    color: #fff;
    font-size: 28px;
}

.pilar-linea {
    width: 46px;
    height: 2px;
    margin: 0 auto 25px;
    background: #c99a2e;
}

.pilar-cuerpo p {
    margin-bottom: 26px;
    color: #d1dae2;
    font-size: 15px;
    line-height: 1.85;
}

.pilar-concepto {
    display: block;
    margin-top: auto;
    color: #e5c56a;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.8px;
}

/* Base arquitectónica */

.pilar-base {
    height: 22px;
    margin: 0 4px;
    border-radius: 0 0 7px 7px;
    background: linear-gradient(
        90deg,
        #8e6923,
        #e5c56a,
        #8e6923
    );
}

/* Fundamento visual */

.pilares-fundamento {
    position: relative;
    max-width: 1120px;
    margin: 34px auto 0;
    padding-top: 28px;
    text-align: center;
}

.pilares-fundamento > span {
    display: block;
    height: 5px;
    width: 100%;
    margin-bottom: 27px;
    border-radius: 5px;
    background: linear-gradient(
        90deg,
        transparent,
        #c99a2e 15%,
        #e5c56a 50%,
        #c99a2e 85%,
        transparent
    );
}

.pilares-fundamento p {
    color: #e5c56a;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 3px;
}

.pilares-fundamento small {
    display: block;
    margin-top: 8px;
    color: #b8c8d4;
    font-size: 13px;
}

/* Responsive tablet */

@media (max-width: 992px) {
    .pilares-arquitectura {
        gap: 16px;
    }

    .pilar-cuerpo {
        padding: 36px 18px 30px;
    }

    .pilar-cuerpo h3 {
        font-size: 23px;
    }
}

/* Responsive celular */

@media (max-width: 768px) {
    .pilares-premium {
        padding: 75px 0;
    }

    .pilares-heading {
        margin-bottom: 42px;
    }

    .pilares-heading p {
        font-size: 15px;
    }

    .pilares-arquitectura {
        grid-template-columns: 1fr;
        max-width: 430px;
        gap: 25px;
    }

    .pilar-cuerpo {
        padding: 35px 26px;
    }

    .pilar-cuerpo p {
        font-size: 15px;
    }

    .pilares-fundamento p {
        font-size: 11px;
        letter-spacing: 1.4px;
    }
}

/* Accesibilidad */

@media (prefers-reduced-motion: reduce) {
    .pilar-premium,
    .pilar-simbolo {
        transition: none;
    }
}

/* =====================================
   JUSTICIA Y COMPROMISO - APECRIM
===================================== */

.justicia-premium {
    padding: 110px 0;
    background: #f5f7fa;
    position: relative;
}

/* DISTRIBUCIÓN */

.justicia-grid {
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    gap: 85px;
    align-items: center;
}

/* CONTENIDO */

.justicia-eyebrow {
    display: block;
    margin-bottom: 20px;
    color: #b78926;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2.5px;
}

.justicia-content h2 {
    color: #071827;
    font-size: clamp(32px, 4vw, 48px);
    line-height: 1.2;
    margin-bottom: 25px;
}

.justicia-content h2 span {
    display: block;
    color: #b78926;
}

.justicia-line {
    width: 65px;
    height: 3px;
    background: #c99a2e;
    margin-bottom: 30px;
}

.justicia-content p {
    color: #52606d;
    font-size: 16px;
    line-height: 1.9;
    margin-bottom: 20px;
}

/* PRINCIPIOS */

.justicia-principios {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.justicia-principio {
    display: flex;
    align-items: flex-start;
    gap: 22px;
    padding: 25px;
    background: #fff;
    border: 1px solid rgba(36,59,83,.08);
    border-radius: 16px;
    transition: .3s ease;
}

.justicia-principio:hover {
    transform: translateX(5px);
    border-color: rgba(201,154,46,.4);
    box-shadow: 0 10px 25px rgba(0,0,0,.05);
}

.principio-icon {
    width: 58px;
    height: 58px;
    min-width: 58px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    background: #071827;
    color: #e5c56a;
    font-size: 23px;
}

.justicia-principio h3 {
    color: #071827;
    font-size: 18px;
    margin-bottom: 8px;
}

.justicia-principio p {
    color: #607080;
    font-size: 14px;
    line-height: 1.7;
}

/* COMPROMISO INSTITUCIONAL */

.justicia-compromiso {
    max-width: 1050px;
    margin: 85px auto 0;
    padding: 50px 65px;
    background: #071827;
    color: #fff;
    text-align: center;
    border-radius: 20px;
    position: relative;
}

.justicia-compromiso i {
    display: block;
    font-size: 26px;
    color: #c99a2e;
    margin-bottom: 25px;
}

.justicia-compromiso p {
    max-width: 800px;
    margin: auto;
    font-size: clamp(17px, 2vw, 21px);
    line-height: 1.85;
    font-weight: 400;
}

.justicia-compromiso span {
    display: block;
    margin-top: 28px;
    color: #e5c56a;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 3px;
}

/* TABLET */

@media (max-width: 992px) {

    .justicia-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .justicia-compromiso {
        margin-top: 60px;
    }

}

/* MOBILE */

@media (max-width: 768px) {

    .justicia-premium {
        padding: 70px 0;
    }

    .justicia-content p {
        font-size: 15px;
    }

    .justicia-principio {
        gap: 16px;
        padding: 20px;
    }

    .principio-icon {
        width: 48px;
        height: 48px;
        min-width: 48px;
        font-size: 20px;
    }

    .justicia-principio h3 {
        font-size: 16px;
    }

    .justicia-compromiso {
        padding: 38px 24px;
        margin-top: 45px;
    }

    .justicia-compromiso p {
        font-size: 16px;
    }

}

/* ACCESIBILIDAD */

@media (prefers-reduced-motion: reduce) {

    .justicia-principio {
        transition: none;
    }

}

/* ==========================================
   HISTORIA INSTITUCIONAL MODERNA
   APECRIM 2026
========================================== */

.historia-moderna {
    background: #ffffff;
    padding: 85px 0;
}

/* BLOQUES DE CONTENIDO */

.historia-bloque {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 65px;
    align-items: center;
    max-width: 1080px;
    margin: 0 auto 65px;
}

.historia-inverso {
    grid-template-columns: 320px minmax(0, 1fr);
    gap: 75px;
}

/* TEXTO */

.historia-etiqueta {
    display: inline-block;
    margin-bottom: 15px;
    color: #b78926;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
}

.historia-texto h3 {
    color: #071827;
    font-size: clamp(24px, 3vw, 31px);
    line-height: 1.3;
    margin-bottom: 22px;
}

.historia-texto p {
    color: #52606d;
    font-size: 16px;
    line-height: 1.85;
    margin-bottom: 16px;
}

.historia-texto p:last-child {
    margin-bottom: 0;
}

/* IMÁGENES */

.historia-imagen {
    width: 100%;
    max-width: 360px;
    margin: 0;
}

.historia-inverso .historia-imagen {
    max-width: 320px;
}

.historia-imagen img {
    display: block;
    width: 100%;
    height: 235px;
    object-fit: contain;
    background: #f5f7fa;
    border-radius: 14px;
}

.historia-inverso .historia-imagen img {
    height: 250px;
}

.historia-imagen figcaption {
    margin-top: 12px;
    color: #768392;
    font-size: 12px;
    line-height: 1.5;
    text-align: center;
}

/* CIERRE INSTITUCIONAL */

.historia-mensaje {
    max-width: 900px;
    margin: 5px auto 0;
    padding: 26px 35px;
    display: flex;
    align-items: center;
    gap: 24px;
    background: #f5f7fa;
    border-left: 3px solid #c99a2e;
    border-radius: 0 12px 12px 0;
}

.historia-mensaje i {
    color: #c99a2e;
    font-size: 28px;
    flex-shrink: 0;
}

.historia-mensaje p {
    margin: 0;
    color: #243b53;
    font-size: 16px;
    line-height: 1.75;
    font-weight: 500;
}

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

@media (max-width: 992px) {

    .historia-bloque,
    .historia-inverso {
        grid-template-columns: minmax(0, 1fr) 280px;
        gap: 35px;
    }

    .historia-inverso {
        grid-template-columns: 280px minmax(0, 1fr);
    }

    .historia-imagen,
    .historia-inverso .historia-imagen {
        max-width: 280px;
    }

}

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

@media (max-width: 768px) {

    .historia-moderna {
        padding: 65px 0;
    }

    .historia-bloque,
    .historia-inverso {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 25px;
        margin-bottom: 48px;
    }

    .historia-texto {
        order: 1;
    }

    .historia-imagen {
        order: 2;
    }

    .historia-imagen,
    .historia-inverso .historia-imagen {
        width: 100%;
        max-width: 340px;
        margin: 0 auto;
    }

    .historia-imagen img,
    .historia-inverso .historia-imagen img {
        height: 220px;
    }

    .historia-texto h3 {
        font-size: 25px;
    }

    .historia-texto p {
        font-size: 15px;
    }

    .historia-mensaje {
        padding: 24px;
        gap: 16px;
        align-items: flex-start;
    }

    .historia-mensaje i {
        font-size: 23px;
    }

    .historia-mensaje p {
        font-size: 14px;
    }

}