/*
|--------------------------------------------------------------------------
| PAGE — MEMORIAS
|--------------------------------------------------------------------------
| Página interna Memorias.
|
| Usa el mismo sistema visual del Hero principal,
| con una variante específica para esta página.
|--------------------------------------------------------------------------
*/


/* ==========================================================================
   HERO
   ========================================================================== */

.amoladero-hero.amoladero-hero--memorias {
    position: relative;

    width: 100% !important;
    max-width: none !important;

    min-height:
        clamp(620px, 55vw, 820px);

    margin:
        0 !important;

    padding:
        0 !important;

    overflow:
        hidden;

    background:
        var(--amoladero-deep);

    isolation:
        isolate;
}


/* ==========================================================================
   ELIMINAR ESPACIADOS HEREDADOS
   ========================================================================== */

.amoladero-hero.amoladero-hero--memorias,
.amoladero-hero.amoladero-hero--memorias.wp-block-cover {
    margin-top:
        0 !important;

    margin-right:
        0 !important;

    margin-bottom:
        0 !important;

    margin-left:
        0 !important;

    padding-top:
        0 !important;

    padding-right:
        0 !important;

    padding-bottom:
        0 !important;

    padding-left:
        0 !important;
}


.amoladero-hero.amoladero-hero--memorias
> :first-child {
    margin-top:
        0 !important;
}


.amoladero-hero.amoladero-hero--memorias
> :last-child {
    margin-bottom:
        0 !important;
}


/* ==========================================================================
   BACKGROUND IMAGE
   ========================================================================== */

.amoladero-hero.amoladero-hero--memorias
.wp-block-cover__image-background {
    position:
        absolute !important;

    z-index:
        0 !important;

    top:
        0 !important;

    right:
        0 !important;

    bottom:
        0 !important;

    left:
        0 !important;

    inset:
        0 !important;

    display:
        block;

    width:
        100% !important;

    height:
        100% !important;

    min-width:
        100% !important;

    min-height:
        100% !important;

    max-width:
        none !important;

    margin:
        0 !important;

    padding:
        0 !important;

    border:
        0;

    object-fit:
        cover;

    object-position:
        center center;

    transform:
        none !important;

    pointer-events:
        none;
}


/* ==========================================================================
   WORDPRESS DEFAULT OVERLAY
   ========================================================================== */

/*
 * Lo neutralizamos para evitar que WordPress
 * nos cambie opacity/background desde Gutenberg.
 */

.amoladero-hero.amoladero-hero--memorias
.wp-block-cover__background {
    position:
        absolute !important;

    z-index:
        1 !important;

    inset:
        0 !important;

    width:
        100% !important;

    height:
        100% !important;

    margin:
        0 !important;

    padding:
        0 !important;

    background:
        transparent !important;

    opacity:
        0 !important;

    pointer-events:
        none;
}


/* ==========================================================================
   CUSTOM OVERLAY
   ========================================================================== */

.amoladero-hero.amoladero-hero--memorias::after {
    content:
        "";

    position:
        absolute;

    z-index:
        1;

    inset:
        0;

    width:
        100%;

    height:
        100%;

    background:
        linear-gradient(
            180deg,
            rgba(4, 103, 72, 0.30) 0%,
            rgba(4, 103, 72, 0.38) 46%,
            rgba(4, 103, 72, 0.52) 100%
        );

    pointer-events:
        none;
}


/* ==========================================================================
   COVER INNER
   ========================================================================== */

.amoladero-hero.amoladero-hero--memorias
.wp-block-cover__inner-container {
    position:
        relative;

    z-index:
        3;

    display:
        block;

    width:
        100%;

    max-width:
        none !important;

    min-height:
        inherit;

    margin:
        0 !important;

    padding:
        0 !important;
}


/* ==========================================================================
   CONTENT
   ========================================================================== */

.amoladero-hero__content--memorias {
    position:
        relative;

    z-index:
        3;

    display:
        flex;

    flex-direction:
        column;

    align-items:
        center;

    justify-content:
        center;

    width:
        min(
            calc(100% - 120px),
            1440px
        );

    min-height:
        inherit;

    margin:
        0 auto !important;

    /*
     * Dejamos reserva inferior para que el título
     * siga centrado visualmente respecto al SVG.
     */
    padding:
        70px 0
        90px;

    box-sizing:
        border-box;

    text-align:
        center;
}


/* ==========================================================================
   TITLE
   ========================================================================== */

.amoladero-hero__title--memorias {
    width:
        min(760px, 76vw);

    max-width:
        760px;

    margin:
        0 auto !important;

    padding:
        0 !important;

    color:
        var(--amoladero-white);

    font-family:
        var(--amoladero-font-display);

    font-size:
        clamp(4rem, 6.6vw, 7rem);

    font-weight:
        400;

    line-height:
        0.88;

    letter-spacing:
        -0.025em;

    text-align:
        center;

    text-transform:
        uppercase;
}


/* ==========================================================================
   HERO → TRANSICIÓN HACIA ENTREVISTAS
   ========================================================================== */

.amoladero-hero.amoladero-hero--memorias {
    overflow: visible;
}


.amoladero-hero.amoladero-hero--memorias::before {
    content: "";

    position: absolute !important;

    z-index: 20;

    top: auto !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;

    width: 100% !important;

    height:
        clamp(52px, 5vw, 76px);

    margin: 0 !important;
    padding: 0 !important;

    background-image:
        url("../../svg/linea-decorativa-hero.svg") !important;

    background-repeat:
        repeat-x !important;

    background-position:
        center center !important;

    background-size:
        auto 100% !important;

    /*
     * La mitad permanece en el Hero
     * y la otra mitad invade Entrevistas.
     */
    transform:
        translateY(50%) !important;

    pointer-events:
        none;
}


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

@media (max-width: 1024px) {

    .amoladero-hero.amoladero-hero--memorias {
        min-height:
            clamp(600px, 72vw, 760px);
    }


    .amoladero-hero__content--memorias {
        width:
            calc(100% - 72px);

        padding:
            70px 0
            90px;
    }


    .amoladero-hero__title--memorias {
        width:
            min(680px, 82vw);

        font-size:
            clamp(3.7rem, 8vw, 5.8rem);
    }


    .amoladero-hero.amoladero-hero--memorias::before {
        height:
            clamp(48px, 6vw, 64px);
    }

}


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

@media (max-width: 781px) {

    .amoladero-hero.amoladero-hero--memorias {
        min-height:
            clamp(620px, 145vw, 840px);
    }


    .amoladero-hero.amoladero-hero--memorias
    .wp-block-cover__image-background {
        top:
            0 !important;

        right:
            0 !important;

        bottom:
            0 !important;

        left:
            0 !important;

        object-position:
            center center;
    }


    .amoladero-hero.amoladero-hero--memorias::after {
        background:
            linear-gradient(
                180deg,
                rgba(4, 103, 72, 0.30) 0%,
                rgba(4, 103, 72, 0.40) 50%,
                rgba(4, 103, 72, 0.56) 100%
            );
    }


    .amoladero-hero__content--memorias {
        width:
            calc(100% - 36px);

        min-height:
            inherit;

        margin:
            0 auto !important;

        padding:
            70px 0
            72px;
    }


    .amoladero-hero__title--memorias {
        width:
            100%;

        max-width:
            560px;

        margin:
            0 auto !important;

        font-size:
            clamp(3.1rem, 13vw, 4.9rem);

        line-height:
            0.9;

        text-align:
            center;
    }


    .amoladero-hero.amoladero-hero--memorias::before {
        top:
            auto !important;

        right:
            0 !important;

        bottom:
            0 !important;

        left:
            0 !important;

        height:
            48px;

        background-position:
            center bottom !important;

        background-size:
            auto 100% !important;

        transform:
            none !important;
    }

}


/* ==========================================================================
   SMALL MOBILE
   ========================================================================== */

@media (max-width: 480px) {

    .amoladero-hero.amoladero-hero--memorias {
        min-height:
            clamp(580px, 154vw, 760px);
    }


    .amoladero-hero__content--memorias {
        width:
            calc(100% - 28px);

        padding:
            64px 0
            66px;
    }


    .amoladero-hero__title--memorias {
        font-size:
            clamp(2.8rem, 12.8vw, 4.1rem);
    }


    .amoladero-hero.amoladero-hero--memorias::before {
        height:
            42px;
    }

}


/* ==========================================================================
   VERY SMALL MOBILE
   ========================================================================== */

@media (max-width: 380px) {

    .amoladero-hero__content--memorias {
        width:
            calc(100% - 24px);
    }


    .amoladero-hero__title--memorias {
        font-size:
            clamp(2.6rem, 12.5vw, 3.7rem);
    }

}


/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

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

    .amoladero-hero.amoladero-hero--memorias
    .wp-block-cover__image-background {
        transition:
            none;
    }

}

/* ==========================================================
   AMOLADERO — MEMORIAS
   SVG GALERÍA DE IMÁGENES
   Centrado validado en DevTools: diferencia 0px

   Ordenador: 560px
   Tablet:    440px
   Móvil:     290px

   No modifica el slider ni otras imágenes.
   ========================================================== */

/* Contenedor del SVG — centrado horizontal */

.memorias-galeria > figure.memorias-galeria__title-svg {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;

    width: 100% !important;
    max-width: 100% !important;

    margin-left: auto !important;
    margin-right: auto !important;

    float: none !important;
}

/* SVG — ordenador */

.memorias-galeria > figure.memorias-galeria__title-svg img {
    display: block !important;

    width: 560px !important;
    max-width: calc(100% - 32px) !important;
    height: auto !important;

    margin-left: auto !important;
    margin-right: auto !important;
}

/* Tablet */

@media (min-width: 768px) and (max-width: 1024px) {
    .memorias-galeria > figure.memorias-galeria__title-svg img {
        width: 440px !important;
    }
}

/* Móvil */

@media (max-width: 767px) {
    .memorias-galeria > figure.memorias-galeria__title-svg img {
        width: 290px !important;
    }
}