:root {
    /* Sables / fonds */
    --color-ivory:         #FCF8F3;
    --color-cream:         #F8F2EC;
    --color-sand-light:    #F3E7D8;
    --color-sand:          #E8D3BD;
    --color-dune:          #DAB79A;

    /* Roses peau / nude */
    --color-skin-light:    #F1D8CF;
    --color-skin:          #E5BDB0;
    --color-rose-skin:     #D9A89A;
    --color-blush:         #F7A8AA;
    --color-dusty-rose:    #C59386;

    /* Terre / argile */
    --color-clay-light:    #C97B63;
    --color-terra:         #BE7E5D;
    --color-terracotta:    #B45A45;
    --color-deep-clay:     #8F5247;
    --color-earth:         #6E3C32;

    /* Verts olive / sauge */
    --color-sage-light:    #C9D0C2;
    --color-sage:          #AEB8AC;
    --color-olive-soft:    #96A37C;
    --color-olive:         #7A8F63;
    --color-olive-deep:    #5C6A4B;
    --color-moss:          #4E5A41;

    /* Neutres texte */
    --color-text-main:     #5A433A;
    --color-text-soft:     #8A625A;
    --color-text-inverse:  #FFF9F5;

    /* Lignes / surfaces */
    --color-line:          #D8C7BE;
    --color-outline:       #CBB6AC;
    --color-surface-warm:  #EFE3D3;
    --color-surface-olive: #E5E8DE;

    --button-primary: var(--color-olive-soft);
    --button-primary-hover: var(--color-olive);
    --button-text: #FFF9F5;

    --container-width: 1180px;
    --spacing-section: 96px;

    --font-title-theme: "Bonheur Royale", cursive;
}

@font-face {
    font-family: "Bonheur Royale";
    src: url("../../fonts/BonheurRoyale-Regular.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

.title-theme-font {
    font-family: var(--font-title-theme);
    font-weight: 400;
    font-style: normal;
}

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    font-family: Arial, Helvetica, sans-serif;
    color: var(--color-text-main);
    background: var(--color-cream);
    line-height: 1.6;
}

/* Mobile: widen the readable text area by reducing the default horizontal padding. */
@media (max-width: 420px) {
    .px-6 {
        padding-left: calc(var(--spacing) * 4) !important;
        padding-right: calc(var(--spacing) * 4) !important;
    }
}

/* Mobile: some sections use huge utilities like pl-28/pr-28 (7rem). Reduce them on phones. */
@media (max-width: 640px) {
    /* Global mobile rule: keep all sections vertically compact. */
    body section {
        padding-top: 2rem !important;
        padding-bottom: 2rem !important;
    }

    .info-nature-parallax.pl-28 {
        padding-left: calc(var(--spacing) * 6) !important;
    }

    .info-nature-parallax.pr-28 {
        padding-right: calc(var(--spacing) * 6) !important;
    }

    .info-nature-parallax.pt-28 {
        padding-top: 2rem !important;
    }

    /* Home parallax section has an extra large inline padding-top on its inner wrapper. */
    #elevate_your_practice > .relative.z-10 {
        padding-top: 0 !important;
    }
}

a {
    color: inherit;
    text-decoration: none;
}

img {
    max-width: 100%;
    height: auto;
}

/* Map plugin: force transparent backgrounds to blend into the theme surfaces. */
.tuixlabs-map-section,
.twixlabs-map-section {
    background: transparent !important;
    background-color: transparent !important;
}

/* Contact page */
.info-nature-parallax--contact {
    overflow-x: hidden;
}

.info-nature-parallax--contact .contact-practical-bubble {
    border: 1px solid rgba(0, 0, 0, 0.06);
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.06);
}

.info-nature-parallax--contact .contact-practical-bubble__grid {
    align-items: start;
}

@media (min-width: 1024px) {
    .info-nature-parallax--contact .contact-practical-bubble__card {
        align-items: center;
        text-align: center;
    }

    .info-nature-parallax--contact .contact-practical-bubble__card:first-child > p:last-child {
        max-width: 40ch;
    }
}

.info-nature-parallax--contact .contact-practical-bubble__kicker {
    font-weight: 600;
    font-size: 0.75rem;
    line-height: 1.25rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    opacity: 0.95;
    margin-bottom: 0.25rem;
}

.info-nature-parallax--contact .contact-hours-bubble__grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 10px;
}

.info-nature-parallax--contact .contact-hours-bubble__day {
    min-width: 0;
    padding: 14px 10px;
    border: 1px solid rgba(0, 0, 0, 0.08);
    background: color-mix(in srgb, var(--color-ivory) 54%, transparent);
    text-align: center;
}

.info-nature-parallax--contact .contact-hours-bubble__label {
    margin: 0;
    color: var(--color-earth);
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.25;
    text-transform: uppercase;
}

.info-nature-parallax--contact .contact-hours-bubble__value {
    margin: 8px 0 0;
    color: var(--color-text-main);
    font-size: 0.95rem;
    font-weight: 600;
    line-height: 1.25;
}

.info-nature-parallax--contact .contact-hours-bubble__day.is-closed .contact-hours-bubble__value {
    color: var(--color-text-soft);
    font-weight: 500;
}

.info-nature-parallax--contact .contact-form-slot {
    max-width: 42rem;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}

@media (max-width: 860px) {
    /* Full-bleed map within the contact section padding (px-6). */
    .info-nature-parallax--contact .contact-map-fullbleed {
        margin-left: calc(var(--spacing) * -6);
        margin-right: calc(var(--spacing) * -6);
    }

    .info-nature-parallax--contact .contact-map-fullbleed .tuixlabs-map-section {
        margin-left: 0;
        margin-right: 0;
    }

    .info-nature-parallax--contact .contact-practical-bubble__card {
        align-items: flex-start;
        text-align: left;
    }

    .info-nature-parallax--contact .contact-hours-bubble__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .info-nature-parallax--contact .contact-hours-bubble__day {
        padding: 12px 8px;
    }
}

/* Contact page: make the contact form behave like a normal block inside the 2-col layout. */
.info-nature-parallax--contact .contact-form-slot .tuixlabs-contact-scope,
.info-nature-parallax--contact .contact-form-slot .tuixlabs-contact-scope > div,
.info-nature-parallax--contact .contact-form-slot .tuixlabs-contact-scope .mx-auto {
    max-width: none !important;
}

.info-nature-parallax--contact .contact-form-slot .tuixlabs-contact-scope .px-6,
.info-nature-parallax--contact .contact-form-slot .tuixlabs-contact-scope .lg\\:px-8 {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.info-nature-parallax--contact .contact-form-slot .tuixlabs-contact-scope .py-24,
.info-nature-parallax--contact .contact-form-slot .tuixlabs-contact-scope .sm\\:py-32 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* Ensure the plugin wrapper doesn't push the form down in the 2-col layout. */
.info-nature-parallax--contact .contact-form-slot .tuixlabs-contact-scope > .mx-auto {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

.info-nature-parallax--contact .contact-form-slot .tuixlabs-contact-form {
    margin-top: 0 !important;
}

/* Footer-social plugin: when placed inside our parallax section, it must blend in. */
.info-nature-parallax .tuixlabs-footer-social,
.info-nature-parallax .tuixlabs-footer-social,
.info-nature-parallax .twixlabs-footer-social,
body.front-page .tuixlabs-footer-social,
body.front-page .tuixlabs-footer-social,
body.front-page .twixlabs-footer-social,
body.home .tuixlabs-footer-social,
body.home .tuixlabs-footer-social,
body.home .twixlabs-footer-social {
    background: transparent !important;
    background-color: transparent !important;
}