@import "sections/header.css";
@import "sections/footer.css";
@import "sections/home.css";
@import "sections/search.css";
/* TODO : import components CSS */

@import "./components/rapid-access.css";
@import "./components/bloc-text.css";
@import "./components/carousel-posts.css";
@import "./components/list-posts.css";
@import "./components/grid-posts.css";
@import "./components/grille-catalogue.css";
@import "./components/slider.css";
@import "./components/carousel.css";
@import "./components/qui-sommes-nous.css";
@import "./components/nos-partenaires.css";
@import "./components/nos-centres.css";
@import "./components/canne-blanche.css";
@import "./components/le-bemob.css";
@import "./components/le-chien-guide.css";

@import "./ninjaforms.css";
@import "./elementor.css";
@import "./animations.css";
@import "../fonts/Luciole.css";
@import "./fonts.css";

:root {
  --swiper-theme-color: var(--color-blue);
  --swiper-pagination-color: var(--color-blue);
  --swiper-navigation-color: var(--color-blue);
}

html {
  font-size: var(--text-base);

  @media screen and (max-width: 768px) {
    font-size: calc(var(--text-base) / 1.2);
  }
}

body {
  font-variant: no-contextual;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

footer {
  justify-self: end;
}

main {
  flex: 1;
}

.admin-bar header {
  top: 32px !important;
}

h1,
.h1,
.titre1 {
  --base-font-size: 40px;

  font-weight: 500 !important;
  font-size: var(--base-font-size) !important;
  line-height: var(--base-font-size) !important;

  @media screen and (max-width: 991px) {
    font-size: calc(var(--base-font-size) / 1.5) !important;
    line-height: calc(var(--base-font-size) / 1.5) !important;
  }
}
h1{
  padding-bottom: 1rem;
}

h2,
.titre2 {
  --base-font-size: 24px;
  font-weight: 700 !important;
  margin-bottom: 20px !important;
  scroll-margin-top: calc(var(--spacing) * 12);
  font-size: var(--base-font-size) !important;
  line-height: calc(var(--base-font-size) * 1.25) !important;
}

h3,
.titre3 {
  --base-font-size: 20px;
  font-size: var(--base-font-size) !important;
  line-height: calc(var(--base-font-size) * 1.25);
  font-weight: 700 !important;
}

.subtitle {
  --base-font-size: 20px;
  text-transform: uppercase;
  font-weight: normal;
  letter-spacing: 30%;
  font-size: var(--base-font-size);
  line-height: calc(var(--base-font-size) * 1.25);
}

p {
  margin-bottom: 1rem !important;
}

small {
  font-size: 16px;
  line-height: 24px;
}

img {
  overflow-clip-margin: unset;
}

.aligncenter {
  margin: auto;
}

.alignright {
  margin-right: 0;
  margin-left: auto;
}

.breadcrumb_last strong {
  font-weight: 400;
}

/* ============================= */
/* START - Helpers */
/* ============================= */
.container {
  max-width: var(--container-width) !important;
  width: 80% !important;
  padding: var(--container-padding);
  margin: 0 auto;

  @media screen and (max-width: 80rem) {
    max-width: 100%;
  }
}

.container-large {
  max-width: var(--container-lg-width) !important;
  width: 80% !important;
  padding: var(--container-padding);
  margin: 0 auto;

  @media screen and (max-width: 80rem) {
    max-width: 100%;
  }
}

.container-small {
  max-width: var(--container-sm-width) !important;
  width: 80% !important;
  padding: var(--container-padding);
  margin: 0 auto;

  @media screen and (max-width: 80rem) {
    max-width: 100%;
  }
}

.-z-1 {
  z-index: -1;
}

.z-0 {
  z-index: 0;
}

.z-1 {
  z-index: 1;
}

.z-2 {
  z-index: 2;
}

/* Buttons */
.btn:not(.not-prose) {
  text-align: center;
  padding: 5px 15px;
  border-radius: 12px;
  cursor: pointer;
  text-wrap: nowrap;

  @media screen and (max-width: 768px) {
    padding: 0.375rem 3rem;
  }
}

main a:not(.btn):not(.mec-load-month-link) {
  color: var(--color-pink);
  font-weight: bold;
  text-decoration: none;
}

.btn.btn-size__normal {
  width: 141px;
  border-width: 3px;
  border-style: solid;
  font-size: 15px;
  font-weight: bold;
}


.section-cta {
  padding: 50px;
  text-align: center;
  color: white;
  display: flex;
  flex-direction: column;
  align-items: center;
}