.elementor-762 .elementor-element.elementor-element-971827a{--display:flex;--min-height:110vh;--justify-content:center;--overlay-opacity:0.5;--margin-top:-200px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-762 .elementor-element.elementor-element-971827a:not(.elementor-motion-effects-element-type-background), .elementor-762 .elementor-element.elementor-element-971827a > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://www.wildreefs.com/wp-content/uploads/2026/06/OceanImageBank_ShaunWolfe_44-scaled.jpg");background-repeat:no-repeat;background-size:cover;}.elementor-762 .elementor-element.elementor-element-971827a::before, .elementor-762 .elementor-element.elementor-element-971827a > .elementor-background-video-container::before, .elementor-762 .elementor-element.elementor-element-971827a > .e-con-inner > .elementor-background-video-container::before, .elementor-762 .elementor-element.elementor-element-971827a > .elementor-background-slideshow::before, .elementor-762 .elementor-element.elementor-element-971827a > .e-con-inner > .elementor-background-slideshow::before, .elementor-762 .elementor-element.elementor-element-971827a > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:transparent;--background-overlay:'';background-image:linear-gradient(173deg, #00000000 3%, #000000 103%);}.elementor-762 .elementor-element.elementor-element-c8aed28{--display:flex;--gap:31px 0px;--row-gap:31px;--column-gap:0px;}.elementor-762 .elementor-element.elementor-element-0161931{text-align:center;}.elementor-762 .elementor-element.elementor-element-0161931 .elementor-heading-title{font-family:"IBM Plex Sans", Sans-serif;font-size:145px;font-weight:bold;color:#FFFFFF;}.elementor-762 .elementor-element.elementor-element-a3fc1dc{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 50px 50px 0px;bottom:0px;color:#FFFFFF;}body:not(.rtl) .elementor-762 .elementor-element.elementor-element-a3fc1dc{right:0px;}body.rtl .elementor-762 .elementor-element.elementor-element-a3fc1dc{left:0px;}.elementor-762 .elementor-element.elementor-element-a3fc1dc p{margin-block-end:0px;}.elementor-762 .elementor-element.elementor-element-389f9c7{--display:flex;--min-height:80vh;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-762 .elementor-element.elementor-element-bda7c47{--display:flex;--align-items:flex-end;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--gap:10px 10px;--row-gap:10px;--column-gap:10px;--padding-top:100px;--padding-bottom:100px;--padding-left:100px;--padding-right:100px;}.elementor-762 .elementor-element.elementor-element-bda7c47.e-con{--align-self:flex-start;}.elementor-762 .elementor-element.elementor-element-4c79ecf{width:var( --container-widget-width, 100% );max-width:100%;--container-widget-width:100%;--container-widget-flex-grow:0;text-align:start;}.elementor-762 .elementor-element.elementor-element-4c79ecf.elementor-element{--align-self:flex-end;}.elementor-762 .elementor-element.elementor-element-4c79ecf .elementor-heading-title{font-family:"IBM Plex Sans", Sans-serif;font-size:60px;font-weight:bold;line-height:1em;color:#174349;}.elementor-762 .elementor-element.elementor-element-406b3c4{width:var( --container-widget-width, 90% );max-width:90%;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;--container-widget-width:90%;--container-widget-flex-grow:0;font-family:"IBM Plex Sans", Sans-serif;font-size:21px;color:var( --e-global-color-primary );}.elementor-762 .elementor-element.elementor-element-406b3c4.elementor-element{--align-self:flex-start;}.elementor-762 .elementor-element.elementor-element-406b3c4 p{margin-block-end:0px;}.elementor-762 .elementor-element.elementor-element-75878d8{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:100px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-762 .elementor-element.elementor-element-44af945:not( .elementor-widget-image ), .elementor-762 .elementor-element.elementor-element-44af945.elementor-widget-image img{-webkit-mask-image:url( https://www.wildreefs.com/wp-content/plugins/elementor/assets/mask-shapes/circle.svg );-webkit-mask-size:contain;-webkit-mask-position:center center;-webkit-mask-repeat:no-repeat;}.elementor-762 .elementor-element.elementor-element-92a978d{--display:flex;--min-height:80vh;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:flex-start;--align-items:center;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:300px;--padding-bottom:100px;--padding-left:100px;--padding-right:100px;}.elementor-762 .elementor-element.elementor-element-56df2f7{width:var( --container-widget-width, 100% );max-width:100%;--container-widget-width:100%;--container-widget-flex-grow:0;text-align:center;}.elementor-762 .elementor-element.elementor-element-56df2f7.elementor-element{--align-self:flex-end;}.elementor-762 .elementor-element.elementor-element-56df2f7 .elementor-heading-title{font-family:"IBM Plex Sans", Sans-serif;font-size:60px;font-weight:bold;line-height:1em;color:#174349;}.elementor-762 .elementor-element.elementor-element-a1f90e2 .elementskit-single-faq .elementskit-faq-header{padding:21px 40px 21px 40px;}.elementor-762 .elementor-element.elementor-element-a1f90e2 .elementskit-single-faq .elementskit-faq-body{color:var( --e-global-color-primary );padding:30px 40px 30px 40px;}@media(max-width:1024px){.elementor-762 .elementor-element.elementor-element-389f9c7{--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-762 .elementor-element.elementor-element-bda7c47.e-con{--order:99999 /* order end hack */;}}@media(max-width:767px){.elementor-762 .elementor-element.elementor-element-bda7c47{--padding-top:30px;--padding-bottom:30px;--padding-left:30px;--padding-right:30px;}.elementor-762 .elementor-element.elementor-element-92a978d{--padding-top:100px;--padding-bottom:30px;--padding-left:30px;--padding-right:30px;}}@media(min-width:768px){.elementor-762 .elementor-element.elementor-element-971827a{--content-width:1400px;}.elementor-762 .elementor-element.elementor-element-bda7c47{--width:50%;}.elementor-762 .elementor-element.elementor-element-75878d8{--width:50%;}}@media(max-width:1024px) and (min-width:768px){.elementor-762 .elementor-element.elementor-element-bda7c47{--width:100%;}.elementor-762 .elementor-element.elementor-element-75878d8{--width:100%;}}/* Start custom CSS for container, class: .elementor-element-bda7c47 *//* =========================================
   SECCIÓN: WHY MARINE RESERVES
   ========================================= */

.marine-reserves-section {
    position: relative;
    overflow: hidden;

    /* Imagen inicial */
    background-position: center bottom !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
}


/* =========================================
   SEGUNDA IMAGEN: CORAL
   Posición: Arriba centro
   ========================================= */

.marine-reserves-section::before {
    content: "";
    position: absolute;
    inset: 0;

    background-image: url("https://www.wildreefs.com/wp-content/uploads/2026/09/OceanImageBank_GabrielBarathieu_09-scaled.jpg");

    /* Cubrir + Arriba centro */
    background-size: cover !important;
    background-position: center top !important;
    background-repeat: no-repeat !important;

    opacity: 0;
    transform: none;

    transition: opacity 0.8s ease;

    pointer-events: none;
    z-index: 0;
}


/* Muestra el coral al pasar sobre el 40% */

.marine-reserves-section:has(.stat-coral:hover)::before {
    opacity: 1;
}


/* Mantiene la imagen inicial sobre el 446% */

.marine-reserves-section:has(.stat-biomass:hover)::before {
    opacity: 0;
}


/* =========================================
   DEGRADADO
   Oscuro desde la derecha hacia la izquierda
   ========================================= */

.marine-reserves-section::after {
    content: "";
    position: absolute;
    inset: 0;

    background: linear-gradient(
        to left,
        rgba(0, 18, 35, 0.60) 0%,
        rgba(0, 18, 35, 0.38) 30%,
        rgba(0, 18, 35, 0.14) 60%,
        rgba(0, 18, 35, 0.03) 100%
    );

    pointer-events: none;
    z-index: 1;
}


/* =========================================
   CONTENIDO SOBRE LAS IMÁGENES
   ========================================= */

.marine-reserves-section > * {
    position: relative;
    z-index: 2;
}


/* =========================================
   INTERACCIÓN DE LOS DATOS
   ========================================= */

.stat-biomass,
.stat-coral {
    position: relative;
    cursor: pointer;

    transition:
        transform 0.3s ease,
        opacity 0.3s ease;
}

.stat-biomass:hover,
.stat-coral:hover {
    transform: translateX(8px);
}


/* =========================================
   CRÉDITO FOTOGRÁFICO
   La posición se controla desde Elementor
   ========================================= */

.photo-credit {
    z-index: 3;
    pointer-events: none;
}


/* Oculta el texto manual de Elementor */

.photo-credit,
.photo-credit * {
    font-size: 0 !important;
    color: transparent !important;
}


/* Crédito de la imagen inicial */

.photo-credit::after {
    content: "Picture by: Lars von Ritten/ Ocean Image Bank";

    display: block;

    font-size: 16px !important;
    line-height: 1.4;
    font-style: italic;
    font-weight: 400;

    color: rgba(255, 255, 255, 0.85) !important;
    white-space: nowrap;
}


/* Crédito de la imagen de coral */

.marine-reserves-section:has(.stat-coral:hover)
.photo-credit::after {
    content: "Picture by: Gabriel Barathieu/ Ocean Image Bank";
}


/* =========================================
   ADAPTACIÓN PARA MÓVIL
   ========================================= */

@media (max-width: 767px) {

    .marine-reserves-section {
        background-position: center bottom !important;
        background-size: cover !important;
    }

    /* Coral también en Arriba centro en móvil */

    .marine-reserves-section::before {
        background-size: cover !important;
        background-position: center top !important;
    }

    .marine-reserves-section::after {
        background: linear-gradient(
            to top,
            rgba(0, 18, 35, 0.60) 0%,
            rgba(0, 18, 35, 0.45) 35%,
            rgba(0, 18, 35, 0.12) 100%
        );
    }

    .stat-biomass:hover,
    .stat-coral:hover {
        transform: none;
    }

    .photo-credit::after {
        font-size: 16px !important;
        white-space: normal;
    }
}/* End custom CSS */