/* Start custom CSS for html, class: .elementor-element-338ac17 *//* =====================================================
   LES GRANGES DE LA HULOTTE
   LEGAL NOTICE & PRIVACY POLICY — ENGLISH
   ===================================================== */

/* CONTENEUR PRINCIPAL */

.hulotte-legal-page {
    --legal-green: #2f5144;
    --legal-green-dark: #244236;
    --legal-beige: #f7f5ef;
    --legal-sage: #e8eee8;
    --legal-text: #3e4842;
    --legal-border: #e1e6df;

    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    padding: 0;
    background: var(--legal-beige);
    color: var(--legal-text);
    font-family: inherit;
    line-height: 1.8;
    box-sizing: border-box;
}

.hulotte-legal-page *,
.hulotte-legal-page *::before,
.hulotte-legal-page *::after {
    box-sizing: border-box;
}


/* =====================================================
   EN-TÊTE
   ===================================================== */

.hulotte-legal-header {
    background: var(--legal-green);
    color: #ffffff;
    text-align: center;
    padding: 85px 30px 75px;
}

.hulotte-legal-header h1 {
    max-width: 850px;
    margin: 0 auto 22px;
    color: #ffffff;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(32px, 4.2vw, 52px);
    font-weight: 400;
    line-height: 1.2;
    letter-spacing: -0.5px;
}

.hulotte-legal-header p {
    max-width: 680px;
    margin: 0 auto;
    color: rgba(255, 255, 255, 0.88);
    font-size: 16px;
    line-height: 1.8;
}


/* =====================================================
   SECTIONS
   ===================================================== */

.hulotte-legal-section {
    max-width: 940px;
    margin: 0 auto;
    padding: 55px 45px;
    border-bottom: 1px solid var(--legal-border);
}

.hulotte-legal-section:last-child {
    border-bottom: none;
    padding-bottom: 85px;
}


/* TITRES */

.hulotte-legal-section h2 {
    margin: 0 0 26px;
    color: var(--legal-green-dark);
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(25px, 3vw, 34px);
    font-weight: 400;
    line-height: 1.3;
}


/* PARAGRAPHES */

.hulotte-legal-section p {
    margin: 0 0 18px;
    font-size: 16px;
    line-height: 1.9;
    color: var(--legal-text);
}

.hulotte-legal-section p:last-child {
    margin-bottom: 0;
}


/* TEXTES EN GRAS */

.hulotte-legal-section strong {
    color: var(--legal-green-dark);
    font-weight: 600;
}


/* LIENS */

.hulotte-legal-section a {
    color: var(--legal-green);
    text-decoration: underline;
    text-underline-offset: 3px;
    transition: color 0.2s ease;
}

.hulotte-legal-section a:hover {
    color: #7c947b;
}

.hulotte-legal-section a:focus-visible {
    outline: 2px solid var(--legal-green);
    outline-offset: 4px;
}


/* =====================================================
   BLOCS DE COORDONNÉES
   ===================================================== */

.hulotte-legal-section:nth-of-type(2),
.hulotte-legal-section:nth-of-type(3),
.hulotte-legal-section:nth-of-type(4) {
    background: #ffffff;
}


/* =====================================================
   ALTERNANCE VISUELLE
   ===================================================== */

.hulotte-legal-section:nth-of-type(6),
.hulotte-legal-section:nth-of-type(7),
.hulotte-legal-section:nth-of-type(8) {
    background: var(--legal-sage);
}


/* =====================================================
   AFFICHAGE TABLETTE
   ===================================================== */

@media (max-width: 1024px) {

    .hulotte-legal-header {
        padding: 70px 30px 65px;
    }

    .hulotte-legal-section {
        padding: 45px 35px;
    }

}


/* =====================================================
   AFFICHAGE MOBILE
   ===================================================== */

@media (max-width: 767px) {

    .hulotte-legal-header {
        padding: 60px 22px 55px;
    }

    .hulotte-legal-header h1 {
        font-size: 32px;
        line-height: 1.25;
    }

    .hulotte-legal-header p {
        font-size: 15px;
    }

    .hulotte-legal-section {
        padding: 38px 22px;
    }

    .hulotte-legal-section h2 {
        font-size: 26px;
        margin-bottom: 20px;
    }

    .hulotte-legal-section p {
        font-size: 15px;
        line-height: 1.8;
    }

    .hulotte-legal-section:last-child {
        padding-bottom: 60px;
    }

}


/* =====================================================
   TRÈS PETITS ÉCRANS
   ===================================================== */

@media (max-width: 380px) {

    .hulotte-legal-header h1 {
        font-size: 28px;
    }

    .hulotte-legal-section {
        padding-left: 18px;
        padding-right: 18px;
    }

}/* End custom CSS */