.elementor-kit-4{--e-global-color-primary:#0A0F23;--e-global-color-secondary:#AAAAAA;--e-global-color-text:#7A7A7A;--e-global-color-accent:#A3BCB8;--e-global-color-249bedd:#FFFFFF;--e-global-typography-primary-font-family:"Asen Pro";--e-global-typography-primary-font-size:90px;--e-global-typography-primary-font-weight:200;--e-global-typography-primary-text-transform:uppercase;--e-global-typography-primary-letter-spacing:6.3px;--e-global-typography-secondary-font-family:"Asen Pro";--e-global-typography-secondary-font-size:20px;--e-global-typography-secondary-font-weight:600;--e-global-typography-secondary-text-transform:none;--e-global-typography-secondary-letter-spacing:1.3px;--e-global-typography-secondary-word-spacing:0px;--e-global-typography-text-font-family:"Asen Pro";--e-global-typography-text-font-size:14px;--e-global-typography-text-font-weight:300;--e-global-typography-text-text-transform:none;--e-global-typography-text-line-height:24px;--e-global-typography-text-letter-spacing:1.9px;--e-global-typography-accent-font-family:"Asen Pro";--e-global-typography-accent-font-size:18px;--e-global-typography-accent-font-weight:500;--e-global-typography-accent-text-transform:uppercase;--e-global-typography-76e1033-font-family:"Asen Pro";background-color:#FFFFFF;background-image:url("https://atrium-menuiseries.fr/wp-content/uploads/2025/09/test-grille-masion-11.jpg");background-repeat:repeat;background-size:300px auto;}.elementor-kit-4 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1280px;}.e-con{--container-max-width:1280px;}.elementor-widget:not(:last-child){--kit-widget-spacing:24px;}.elementor-element{--widgets-spacing:24px 24px;--widgets-spacing-row:24px;--widgets-spacing-column:24px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1280px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-4{--e-global-typography-primary-font-size:56px;--e-global-typography-primary-line-height:1em;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS */.exclusion{mix-blend-mode:exclusion!important}

body, html {
  scroll-behavior: smooth; 
  overflow-x: hidden !important; 
}

.displaynone{display:none;}


.e-n-tab-title-text{    font-family: 'Asen Pro' !important;
    font-weight: 300 !important;}


h1, h2, h3, h4, p, a{overflow-wrap: anywhere; }


.caroussel-img{
    overflow:clip !important;
}

.caroussel-img .elementor-image-carousel{height:350px !important}

.caroussel-img img{object-fit: cover !important;
    height:350px !important
}

.swiper-pagination-bullet{    border-radius: 4px!important;
    width: 24px!important;
    height: 4px!important;
    margin-right: -1px !important;
    margin-left:0 !important;
}





/* --- 1. BASE & FLUIDITÉ --- */
html { scroll-behavior: smooth; }

/* --- 2. TITRES H1, H2, H3 (CORRECTIF) --- */
/* On cache le contenu tant que le JS n'a pas fait le travail pour éviter le "flash" */
.atrium-anim-title { visibility: hidden; }
.atrium-anim-title.is-ready { visibility: visible; }

/* Style des conteneurs de mots pour empêcher la césure bizarre */
.atrium-word {
    display: inline-block;
    white-space: nowrap; /* Empêche le mot de se casser */
    margin-right: 0px; /* Espace naturel entre les mots */
    vertical-align: top;
}

/* Style des lettres individuelles */
.atrium-char {
    display: inline-block;
    opacity: 0;
    transform: translateY(40px) rotate(2deg); /* Départ plus bas et légèrement pivoté */
    transition: none;
    will-change: transform, opacity;
}

/* L'animation qui se lance */
.atrium-anim-title.is-visible .atrium-char {
    animation: premiumTitleReveal 1.2s cubic-bezier(0.23, 1, 0.32, 1) forwards; /* Ralenti (1.2s) */
}

@keyframes premiumTitleReveal {
    0% {
        opacity: 0;
        transform: translateY(40px) rotate(2deg);
    }
    100% {
        opacity: 1;
        transform: translateY(0) rotate(0deg);
    }
}

/* --- 3. CLASS .gamme-cont (HOVER PREMIUM) --- */
/* Assure que le conteneur gère bien le positionnement */
.gamme-cont {
    position: relative;
    overflow: hidden; /* Important pour que l'image ne sorte pas */
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Création du filtre sombre (overlay) */
.gamme-cont::before {
    content: '';
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: linear-gradient(to top, rgba(0,0,0,0.7), rgba(0,0,0,0)); /* Dégradé noir en bas */
    opacity: 0;
    transition: opacity 0.6s ease;
    z-index: 1;
    pointer-events: none;
}

.degradearp::before{    content: '';
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: linear-gradient(to top, rgba(0,0,0,0.7), rgba(0,0,0,0)); /* Dégradé noir en bas */
    opacity: 0.7;
    transition: opacity 0.6s ease;
    z-index: 1;
    pointer-events: none;}

.gamme-cont:hover::before {
    opacity: 1; /* Le filtre apparait au survol */
}

/* Animation du texte à l'intérieur de la gamme */
.gamme-cont .elementor-widget-heading {
    position: relative;
    z-index: 2; /* Pour être au dessus du filtre */
    transition: transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}

.gamme-cont:hover .elementor-widget-heading {
    transform: translateY(-15px); /* Remonte légèrement */
}

/* --- 4. BOUTONS DISCRETS --- */
.elementor-button {
    transition: all 0.5s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    transform: translateY(0);
    box-shadow: 0 4px 10px rgba(0,0,0,0.05); /* Ombre très légère de base */
}

.elementor-button:hover {
    transform: translateY(-2px); /* Mouvement petit (-2px seulement) */
    box-shadow: 0 8px 20px rgba(0,0,0,0.1); /* Ombre diffuse mais légère */
}

/* --- 5. PARAGRAPHES (APPARITION DOUCE) --- */
/* On cible les paragraphes et textes */
p, .elementor-widget-text-editor {
    opacity: 0;
    transform: translateY(15px); /* Décalage très faible */
    transition: opacity 1s ease-out, transform 1s ease-out;
}

/* Classe ajoutée par JS quand visible */
.fade-content-in {
    opacity: 1 !important;
    transform: translateY(0) !important;
}


/* 1. État initial des caractères (avant l'animation) */
.atrium-anim-title .atrium-char {
    opacity: 0;                   /* Invisible au départ */
    display: inline-block;        /* Nécessaire pour les transformations */
    filter: blur(8px);            /* LE FLOU DE 8PX DEMANDÉ */
    transform: translateY(20px);  /* (Optionnel) Légère descente pour remonter ensuite */
    will-change: opacity, filter, transform; /* Optimisation des performances */
}

/* 2. Lancement de l'animation quand le JS ajoute la classe 'is-visible' */
.atrium-anim-title.is-visible .atrium-char {
    /* On lance l'animation définie plus bas nommée 'atriumFadeBlur' */
    animation-name: atriumFadeBlur;
    animation-duration: 0.8s;      /* Durée de l'animation */
    animation-fill-mode: forwards; /* Reste dans l'état final à la fin */
    animation-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); /* Transition fluide */
    
    /* Note : Le 'animation-delay' est déjà géré par votre JavaScript */
}

/* 3. Définition des étapes de l'animation (Keyframes) */
@keyframes atriumFadeBlur {
    0% {
        opacity: 0;
        filter: blur(8px);          /* Départ : Flou 8px */
        transform: translateY(20px); /* Départ : Plus bas */
    }
    100% {
        opacity: 1;
        filter: blur(0px);          /* Arrivée : Net (0px) */
        transform: translateY(0);    /* Arrivée : En place */
    }
}


/* --- EXCLUSION DU HEADER --- */
/* Cible tous les éléments de texte dans le header Elementor */
.elementor-location-header .atrium-anim-title,
.elementor-location-header .atrium-char,
.elementor-location-header p,
.elementor-location-header h1,
.elementor-location-header h2,
.elementor-location-header h3
{
    opacity: 1 !important;        /* Force la visibilité immédiate */
    filter: none !important;      /* Supprime le flou */
    transform: none !important;   /* Annule le déplacement vers le bas */
    animation: none !important;   /* Stoppe toute animation */
    transition: none !important;  /* Supprime les transitions */
}/* End custom CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'Asen Pro';
	font-style: normal;
	font-weight: 100;
	font-display: auto;
	src: url('https://atrium-menuiseries.fr/wp-content/uploads/2025/10/AsenPro-Thin.woff') format('woff');
}
@font-face {
	font-family: 'Asen Pro';
	font-style: normal;
	font-weight: 200;
	font-display: auto;
	src: url('https://atrium-menuiseries.fr/wp-content/uploads/2025/10/AsenPro-ExtraLight.woff') format('woff');
}
@font-face {
	font-family: 'Asen Pro';
	font-style: normal;
	font-weight: 300;
	font-display: auto;
	src: url('https://atrium-menuiseries.fr/wp-content/uploads/2025/10/AsenPro-Light.woff') format('woff');
}
@font-face {
	font-family: 'Asen Pro';
	font-style: normal;
	font-weight: normal;
	font-display: auto;
	src: url('https://atrium-menuiseries.fr/wp-content/uploads/2025/10/AsenPro-Regular.woff') format('woff');
}
@font-face {
	font-family: 'Asen Pro';
	font-style: normal;
	font-weight: 400;
	font-display: auto;
	src: url('https://atrium-menuiseries.fr/wp-content/uploads/2025/10/AsenPro-Regular.woff') format('woff');
}
@font-face {
	font-family: 'Asen Pro';
	font-style: normal;
	font-weight: 500;
	font-display: auto;
	src: url('https://atrium-menuiseries.fr/wp-content/uploads/2025/10/AsenPro-Medium.woff') format('woff');
}
@font-face {
	font-family: 'Asen Pro';
	font-style: normal;
	font-weight: 600;
	font-display: auto;
	src: url('https://atrium-menuiseries.fr/wp-content/uploads/2025/10/AsenPro-Semibold.woff') format('woff');
}
@font-face {
	font-family: 'Asen Pro';
	font-style: normal;
	font-weight: 700;
	font-display: auto;
	src: url('https://atrium-menuiseries.fr/wp-content/uploads/2025/10/AsenPro-Bold.woff') format('woff');
}
@font-face {
	font-family: 'Asen Pro';
	font-style: normal;
	font-weight: bold;
	font-display: auto;
	src: url('https://atrium-menuiseries.fr/wp-content/uploads/2025/10/AsenPro-Bold.woff') format('woff');
}
@font-face {
	font-family: 'Asen Pro';
	font-style: normal;
	font-weight: 800;
	font-display: auto;
	src: url('https://atrium-menuiseries.fr/wp-content/uploads/2025/10/AsenPro-ExtraBold.woff') format('woff');
}
@font-face {
	font-family: 'Asen Pro';
	font-style: normal;
	font-weight: 900;
	font-display: auto;
	src: url('https://atrium-menuiseries.fr/wp-content/uploads/2025/10/AsenPro-Black.woff') format('woff');
}
/* End Custom Fonts CSS */