@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400..800;1,400..800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap');

.page-container {
    position: relative; /* Necesario para que el pseudo-elemento se posicione relativo a este contenedor */
    overflow: hidden; /* Asegura que el pseudo-elemento no se desborde del contenedor */
}

.page-container::before {
    content: ""; /* Necesario para que el pseudo-elemento se muestre */
    position: absolute; /* Coloca el pseudo-elemento sobre el contenido */
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    /* background: url("./../images/resources/BACKGROUND-0.jpg") no-repeat center center;  */
    background-size: cover;
    opacity: .5; /* Ajusta la opacidad de la imagen de fondo */
    pointer-events: none; /* Asegura que el pseudo-elemento no interfiera con las interacciones del usuario */
    z-index: 0; /* Coloca el pseudo-elemento por debajo del contenido */
}
.card-main-body{
    opacity: .8!important; /* Ajusta la opacidad de la imagen de fondo */

}
.page-container > * {
    position: relative; /* Asegura que los elementos hijos estén por encima del pseudo-elemento */
    z-index: 1; /* Asegura que los elementos hijos estén por encima del pseudo-elemento */
}

/* Definición de clases para los diferentes fondos */
.page-container.bg-0::before {
    background: url("./../images/resources/BACKGROUND-0.jpg") no-repeat center center;
}

.page-container.bg-1::before {
    background: url("./../images/resources/BACKGROUND-1.jpg") no-repeat center center;
}

.page-container.bg-2::before {
    background: url("./../images/resources/BACKGROUND-2.jpg") no-repeat center center;
}

/* Aquí puedes añadir más clases si tienes más fondos */

/*Variables de colores, fuentes, etc*/
:root{
    --color-sand-100: #CEB7A2;
    --color-sand-80: #E8CEB6;
    --color-sand-60: #F7DFC8;
    --color-sand-40: #F7E8DA ;
    --color-wood-text: #786f67;
    --color-wood-100: #6E6259 ;
    --color-wood-80: #87786D ;
    --color-wood-60: #A18F82 ;
    --color-wood-40: #BAA697 ;
    --color-infinite-blue-dark: #152847; 
    --color-infinite-blue: #1C355E;
    --color-infinite-blue-light: #25477d;
    --color-infinite-red: #7C212E;
    --color-infinite-red-light: #912736;
    --color-infinite-red-dark: #611a24;
    --color-infinite-black: #10181F;


    --font-title: "EB Garamond";
    --font-body: "Inter"
}
