/* TITLES */
.heading {
    font-size: var(--font-size-3xl);
    font-family: var(--font-secondary);
    font-weight: 200;
    letter-spacing: 3.25px;
}

.subheading {
    font-size: var(--font-size-sub-3xl);
    font-family: var(--font-primary);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 2.4px;
}

.double h2,
.general-title {
    font-size: var(--font-size-2xl);
    line-height: var(--font-size-2xl);
    font-family: var(--font-secondary);
    font-weight: 200;
    letter-spacing: 3.25px;
    color: var(--section-foreground);
}

.general-subtitle {
    font-size: calc(var(--font-size-base) - 2px);
    font-family: var(--font-primary);
    font-weight: 500;
    letter-spacing: 2.4px;
    text-transform: uppercase;
    color: var(--section-foreground);
    line-height: calc(var(--font-size-base) + 2px);

    .sejours & {
        color: var(--color-accent);
    }
}

.general-subtitle-extra {
    font-size: var(--font-size-sub-xl);
    font-family: var(--font-primary);
    font-weight: 200;
    letter-spacing: 2.25px;
    text-transform: uppercase;
}

.general-subtitle-suppl {
    font-size: var(--font-size-lg);
    font-family: var(--font-primary);
    font-weight: 500;
}

.card-title {
    font-size: var(--font-size-card);
    font-family: var(--font-secondary);
    font-weight: 200;
    letter-spacing: 2.25px;
    margin-bottom: 10px;
}

.card-subtitle {
    font-size: var(--font-size-sub-2xl);
    font-weight: 400;
    margin-bottom: 30px;
}

h2:not([class]),
.title-h2 {
    font-size: var(--font-size-2xl);
    font-family: var(--font-secondary);
    font-weight: 200;
    letter-spacing: 1.5px;
}

h3:not([class]),
.title-h3 {
    font-size: var(--font-size-xl);
    font-family: var(--font-secondary);
    font-weight: 200;
    letter-spacing: 2.25px;
}

h4:not([class]),
.title-h4 {
    font-size: var(--font-size-sub-xl);
    line-height: var(--font-size-sub-xl);
    font-family: var(--font-secondary);
    font-weight: 200;
    letter-spacing: 1.5px;
}

.flex-left .general-title,
.flex-left .general-subtitle {
    text-align: left;
}

/* COLORS */
.dark {
    color: var(--color-dark);
}

.light {
    color: var(--color-light);
}

/* PARAGRAPH */
legend,
.paragraph,
p,
li {
    font-size: var(--font-size-base);
    line-height: calc(var(--font-size-base) + 4px);
}

b,
strong {
    font-weight: 500;
}

legend {
    font-style: italic;
    color: var(--color-primary);
}

/* BUTTONS */
.testimony__source--link,
.double .double__read-more,
.gform_wrapper .gform_footer input {
    letter-spacing: 2.4px;
    border-bottom: 1px solid var(--color-foreground);
    display: inline-block;
    transition: all .3s ease;
    padding: 8px 0;
    font-weight: 400;
    cursor: pointer;
    text-transform: uppercase;
    text-decoration: none;
    position: relative;
    background-color: transparent !important;
    font-size: var(--font-size-base);
}

.testimony__source--link:hover,
.double .double__read-more:hover,
.gform_wrapper .gform_footer input:hover {
    letter-spacing: 3px;
}

.gform_wrapper .gform_footer input {
    background-color: #fff;
    color: var(--color-foreground);
}

.presentation .btn {
    text-align: center;
    z-index: 3;
}

#newsletter .gform_wrapper :is(.gfield--type-submit .btn_new_gen[type="submit"], .gform_footer .btn_new_gen[type="submit"]),
.container :is(.form .gform_wrapper, .form.gform_wrapper) :is(.gfield--type-submit .btn_new_gen[type="submit"], .gform_footer .btn_new_gen[type="submit"]),
.btn_new_gen {
    display: inline-block;
    width: max-content;
    min-width: max-content;

    padding: 20px 30px;
    border-radius: 0;

    display: flex;
    align-items: center;
    justify-content: center;

    font-size: calc(var(--font-size-base) - 2px);
    line-height: var(--font-size-base);
    font-weight: 500;
    letter-spacing: 2.4px;
    text-transform: uppercase;
    color: #fff;
    background-color: var(--color-dark);
    border: 1px solid var(--color-dark);

    cursor: pointer;
}


#newsletter .gform_wrapper :is(.gfield--type-submit .btn_new_gen[type="submit"]:hover, .gform_footer .btn_new_gen[type="submit"]:hover),
.container :is(.form .gform_wrapper, .form.gform_wrapper) :is(.gfield--type-submit .btn_new_gen[type="submit"]:hover, .gform_footer .btn_new_gen[type="submit"]:hover),
.btn_new_gen:hover {
    background-color: #000;
}

.btn_new_gen--white {
    background-color: var(--color-light);
    color: var(--color-dark);
}

.header .btn_new_gen--white {
    border: 1px solid var(--color-dark);
}

.btn_new_gen--white:hover {
    background-color: var(--color-fore-hover);
}

.btn_new_gen--reverse {
    color: var(--color-primary);
    background-color: transparent;
    border: 1px solid var(--color-primary);
}

.btn_new_gen--reverse:hover {
    color: #fff;
    background-color: var(--color-primary);
}

.btn_new_gen--sejours {
    background-color: var(--color-accent);
    border: 1px solid var(--color-accent);
    width: max-content;
}

.btn_new_gen--sejours:hover {
    color: var(--color-accent);
    background-color: var(--color-light);
}

.btn_new_gen--centered {
    margin: 0 auto;
}

@media screen and (max-width: 1280px) {
    .btn_new_gen--desktop {
        display: none;
    }
    
    .devis .devis__form .gform_wrapper .gform_footer .btn_new_gen[type="submit"],
    .masonry__element.masonry__form .gform_wrapper :is(.gfield--type-submit .btn_new_gen[type="submit"], .gform_footer .btn_new_gen[type="submit"]),
    .formulaire .formulaire__form .gform_wrapper .gform_footer .btn_new_gen[type="submit"],
    .btn_new_gen {
        width: 100%;
    }
}

.section--background-light {
    background-color: var(--color-light);
    --section-foreground: var(--color-dark);
}

.section--background-dark {
    background-color: var(--color-dark);
    --section-foreground: var(--color-light);
}

/* Breadcrumbs */
#breadcrumbs {
    align-items: center;
    justify-content: center;
    list-style: none;
    display: flex;
    gap: 5px;
    padding: unset;

}

.stories_intro #breadcrumbs {
    justify-content: flex-start;
    position: static;
    color: var(--color-foreground);
}

.second_header .casualdisplay-breadcrumbs {
    padding: 40px var(--general-margin-lr);
}

.breadcrumbs--left-aligned .casualdisplay-breadcrumbs {
    padding: 0 0 80px;
}

.soirees__intro .casualdisplay-breadcrumbs {
    padding: 0;
}

.breadcrumbs--left-aligned #breadcrumbs {
    justify-content: flex-start;
    width: 100%;
}

@media screen and (max-width: 767px) {
    .breadcrumbs--left-aligned .casualdisplay-breadcrumbs {
        padding: 10px 0 0;
    }
}

.breadcrumbs {
    position: absolute;
    top: 140px;
    left: 20px;
    z-index: 1;
    color: #fff;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1.2px;
}

.breadcrumbs li {
    font-size: 12px;
}

.single-post .breadcrumbs {
    position: static;
    top: auto;
    left: auto;
    z-index: auto;
    color: inherit;
}

@media screen and (min-width: 600px) {
    .breadcrumbs {
        top: 100px;
    }
}

@media screen and (min-width: 768px) {
    .breadcrumbs {
        left: 50px;
    }
}

@media screen and (min-width: 1280px) {
    .breadcrumbs {
        top: 180px;
        left: 100px;
    }
}



/* Accordeons */
.accordion {
    border-bottom: 1px solid color-mix(in srgb, var(--color-foreground) 20%, transparent);
}

.accordion:first-of-type {
    border-top: 1px solid color-mix(in srgb, var(--color-foreground) 20%, transparent);
}

.accordion__header {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    margin: 0;
    padding: var(--general-margin-inside) 15px var(--general-margin-inside) 0;

    font-size: var(--font-size-sub-2xl);

}

.accordion__expand {
    display: none;
}

.accordion__expand--more {
    display: inline-block;
}

.accordion__expand--less {
    display: none;
}

.accordion--active .accordion__expand--more {
    display: none;
}

.accordion--active .accordion__expand--less {
    display: inline-block;
}

.accordion__header:hover {
    cursor: pointer;
}

.accordion__content {
    display: grid !important;
    grid-template-rows: 0fr;
    overflow: hidden;
    opacity: 0;
    transition: margin 1s ease, opacity 1s ease, grid-template-rows 1s ease;
    font-size: var(--font-size-xsall);
    text-align: left;
}

.accordion__content .edit p {
    font-size: calc(var(--font-size-base) + 1px);
}

.accordion--active .accordion__content {
    grid-template-rows: 1fr;
    margin-top: 10px;
    opacity: 1;
}

.accordion__content>div {
    visibility: hidden;
    transition: visibility 1s ease;
    min-height: 0;
}

.accordion--active .accordion__content>div {
    visibility: visible;
}

body .faq {
    position: relative;
    padding-bottom: calc(var(--general-margin-tb) + 2rem);
}

.faq__title .btn {
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    margin-bottom: 2rem;
}

@media screen and (min-width: 561px) {
    .accordion--mobile:first-of-type,
    .accordion--mobile {
        border: none;
    }
}

@media screen and (max-width: 560px) {
    .accordion--mobile {
        width: 100%;
        display: flex;
        flex-direction: column;
    }
    
    .accordion__content--mobile * {
        height: 0;
        margin: 0;
    }
    
    .accordion--active .accordion__content * {
        height: auto;
        margin-bottom: initial;
    }
}

@media screen and (min-width: 561px) {
    .accordion--mobile {
        border-top: none;
        padding: 0;
    }

    .accordion__header--mobile {
        display: block;
        cursor: default;
        padding: 0;
    }

    .accordion__content--mobile {
        display: block !important;
        overflow: auto;
        opacity: 1;
        transition: none;
    }

    .accordion__content--mobile>div {
        visibility: visible;
    }

    .accordion__expand--mobile {
        display: none;
    }
}

@media screen and (min-width: 1024px) {
    .faq__title {
        position: relative;
    }

    .faq__title .btn {
        position: absolute;
        left: inherit;
        bottom: inherit;
        right: 0;
        top: 0;
    }
}

/* Custom Scrollbar */

.minimalist::-webkit-scrollbar {
    width: var(--scrollbar-width);
}

.minimalist::-webkit-scrollbar-thumb {
    background-color: var(--color-primary);
}