/* Source: main.css */
body {
	font-family: "Roboto Condensed", Arial, sans-serif;
	font-weight: 400;
	font-style: normal;
}

/* Light Italic */
.rcli {
	font-family: "Roboto Condensed", Arial, sans-serif !important;
	font-weight: 300 !important;
	font-style: italic !important;
}

/*  Bold Italic */
.rcbi {
	font-family: "Roboto Condensed", Arial, sans-serif !important;
	font-weight: 700 !important;
	font-style: italic !important;
}
/* Prompt ExtraLight */
.pel {
	font-family: "Prompt", sans-serif !important;
	font-weight: 200 !important;
	font-style: normal !important;
}

/*  ExtraBold Italic */
.rcebi {
	font-family: "Roboto Condensed", Arial, sans-serif !important;
	font-weight: 800 !important;
	font-style: italic !important;
}

/* Prompt Light */
.pl {
	font-family: "Prompt", sans-serif !important;
	font-weight: 300 !important;
	font-style: normal !important;
}

/* Prompt Bold */
.pb {
	font-family: "Prompt", sans-serif !important;
	font-weight: 700 !important;
	font-style: normal !important;
}

/* Prompt Medium */
.pm {
	font-family: "Prompt", sans-serif !important;
	font-weight: 500 !important;
	font-style: normal !important;
}

.font22 {
	font-size: 22px !important;
}

.font32 {
	font-size: 32px !important;
}
.font35 {
	font-size: 35px !important;
}

.font50 {
	font-size: 50px !important;
}
.font13 {
	font-size: 13px !important;
}
.font60{
	font-size: 60px !important;
}
.font40{
	font-size: 40px !important;
}
.font25{
	font-size: 25px !important;
}
.mt5{
	margin-top: 5rem !important;
}
.mt10{
	margin-top: 10rem !important;
}


.interligne50{
	line-height: 50px !important;
}
.interligne35{
	line-height: 35px !important;
}

.couleurB{
	color:white !important;
}

.couleurBleu{
	color:#0F4254 !important;
}

.bouton2{
	width: 207px;
	height: 48px;
	padding: 0 24px;
	border-radius: 24px;
	background-color: #ffffff;
	color: #124f60;
	font-size: 20px;
	text-decoration: none;
	transition: transform 200ms ease-in-out, box-shadow 200ms ease-in-out;
}
/* Source: accueil/index.css */
/* ==========================================================
   ACCUEIL - BASE COMMUNE
   Fichier sans règles responsive de largeur.
   Les overrides sont dans mobile.css, tablette.css, PC.css et PCXXL.css.
   ========================================================== */

/* ---- CLIM ATOUTS ---- */

.clim-atouts {
    position: relative;
    overflow: hidden;
    padding-top: 70px;
    padding-bottom: 70px;
}

.clim-atouts.my-5 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.clim-atouts__background {
    position: absolute;
    inset: 0;
    z-index: 0;
    display: block;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

.clim-atouts__background img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.clim-atouts .container {
    position: relative;
    z-index: 1;
}

.clim-atouts__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-items: center;
    gap: 45px;
}

.clim-atouts__item {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 24px;
}

.clim-atouts__icon {
    display: block;
    flex: 0 0 auto;
    width: 54px;
}

.clim-atouts__icon img {
    display: block;
    width: 100%;
    height: auto;
}

.clim-atouts__text {
    margin: 0;
    color: #0d4053;
    line-height: 1.15;
}


/* ---- CLIMATISATION / BLOCS IMAGE-TEXTE ---- */

.climatisation {
    position: relative;
    background-color: #124f60;
    background-image: var(--clim-background, url("image/images/accueil/defaut/background-clim-bleu.jpg"));
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    overflow: hidden;
}

.climatisation__row {
    position: relative;
    width: 100%;
    margin: 0;
    --bs-gutter-x: 0;
    align-items: stretch;
}

.climatisation__left {
    position: relative;
    display: flex;
    align-items: center;
    min-width: 0;
}

.climatisation__content {
    width: 100%;
    padding: clamp(50px, 7vw, 130px) clamp(40px, 6vw, 110px) clamp(50px, 7vw, 130px) clamp(50px, 7.5vw, 145px);
    box-sizing: border-box;
    color: #ffffff;
}

.climatisation__title {
    margin: 0;
    color: #ffffff;
    font-family: "Roboto Condensed", Arial, sans-serif;
    font-size: clamp(28px, 2.1vw, 40px);
    font-weight: 700;
    font-style: italic;
    line-height: 1.15;
}

.climatisation__trait {
    display: block;
    width: clamp(170px, 15vw, 285px);
    margin-top: clamp(18px, 1.5vw, 28px);
    margin-bottom: clamp(34px, 3vw, 55px);
}

.climatisation__trait img {
    display: block;
    width: 100%;
    height: auto;
}

.climatisation__content p {
    width: 100%;
    max-width: 720px;
    margin-top: 0;
    margin-bottom: clamp(18px, 1.5vw, 28px);
    color: #ffffff;
    font-family: "Prompt", Arial, sans-serif;
    font-size: clamp(15px, 1.15vw, 22px);
    font-weight: 300;
    line-height: 1.45;
}

.climatisation__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    min-height: 48px;
    margin-top: clamp(18px, 1.8vw, 34px);
    padding: 8px 14px 8px 24px;
    border: 0;
    border-radius: 999px;
    background-color: #ffffff;
    color: #124f60;
    font-family: "Prompt", Arial, sans-serif;
    font-size: clamp(14px, 1vw, 18px);
    font-weight: 500;
    line-height: 1;
    text-decoration: none;
    transition: transform 200ms ease-in-out, box-shadow 200ms ease-in-out;
}

.climatisation__button:hover {
    color: #124f60;
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgb(0 0 0 / 18%);
}

.climatisation__button-arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    font-family: Arial, sans-serif;
    font-size: 28px;
    font-weight: 400;
    line-height: 1;
}

.climatisation__right {
    position: relative;
    align-self: stretch;
    min-width: 0;
    min-height: 100%;
    overflow: hidden;
}

.climatisation__picture {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
}

.climatisation__picture img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    object-position: center top;
}


/* ---- FORMES DE SÉPARATION ---- */

.forme-verte {
    display: block;
    width: 100%;
    height: 165px;
    overflow: hidden;
    line-height: 0;
}

.forme-verte img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top;
}

.forme-rouge {
    position: relative;
    width: 100%;
    height: 165px;
    overflow: hidden;
    line-height: 0;
}

.forme-rouge__visuel {
    display: block;
    width: 100%;
    height: 100%;
}

.forme-rouge__visuel img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top;
}

.forme-rouge__bouton {
    position: absolute;
    z-index: 2;

    top: 65%;
    left: 50%;
    transform: translate(-50%, -50%);

    display: inline-flex;
    align-items: center;
    justify-content: space-between;

    width: 180px;
    height: 48px;
    padding: 0 24px;

    border-radius: 24px;
    background-color: #ffffff;
    color: #124f60;

    font-size: 20px;
    line-height: 1;
    text-decoration: none;

    transition:
            transform 200ms ease-in-out,
            box-shadow 200ms ease-in-out;
}

.forme-rouge__bouton:hover {
    transform: translate(-50%, -50%) scale(1.04);
    box-shadow: 0 4px 12px rgb(0 0 0 / 15%);
}

.forme-rouge__fleche {
    width: 8px;
    height: 8px;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
    transform: rotate(45deg);
}

.forme-rouge__bouton:focus-visible {
    outline: 2px solid #ffffff;
    outline-offset: 3px;
}


/* ---- AUTRES PRODUITS ---- */

.autres-produits {
    width: 100%;
    padding: 60px 0 80px;
    overflow: hidden;
    background-color: #fff;
}

.autres-produits *, .autres-produits *::before, .autres-produits *::after {
    box-sizing: border-box;
}

.autres-produits__grille {
    display: grid;
    grid-template-columns: minmax(0, 1fr)minmax(150px, 215px)minmax(0, 1fr);
    align-items: center;
    gap: clamp(25px, 3vw, 60px);
    width: 100%;
}

.produit {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(18px, 2vw, 40px);
    min-width: 0;
}

.produit__visuel {
    display: block;
    flex: 0 0 auto;
    line-height: 0;
}

.produit__visuel img {
    display: block;
    max-width: 100%;
    height: auto;
}

.produit--poele .produit__visuel img {
    width: clamp(145px, 12vw, 200px);
}

.produit--brasero .produit__visuel img {
    width: clamp(200px, 17vw, 285px);
}

.produit__contenu {
    display: flex;
    flex: 0 1 250px;
    flex-direction: column;
    justify-content: center;
    width: clamp(160px, 15vw, 250px);
    min-width: 0;
}

.produit__trait {
    display: block;
    width: 100%;
    line-height: 0;
}

.produit__trait img {
    display: block;
    width: 100%;
    height: auto;
}

.autres-produits__logo {
    display: block;
    width: 100%;
    line-height: 0;
}

.autres-produits__logo img {
    display: block;
    width: 100%;
    max-width: 215px;
    height: auto;
    margin: 0 auto;
}


/* ---- RÉNOVATION ---- */

.renovation {
    position: relative;
    width: 100%;
    max-width: 1920px;
    margin-right: auto;
    margin-left: auto;
    background-color: #124f60;
    background-image: var(
            --renovation-background,
            url("image/images/accueil/defaut/background-renov.jpg")
    );
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    overflow: hidden;
}

.renovation__row {
    position: relative;
    width: 100%;
    margin: 0;
    --bs-gutter-x: 0;
    align-items: stretch;
}

.renovation__left {
    position: relative;
    align-self: stretch;
    min-width: 0;
    min-height: 100%;
    overflow: hidden;
}

.renovation__picture {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
}

.renovation__picture img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    object-position: center top;
}

.renovation__right {
    position: relative;
    display: flex;
    align-items: center;
    min-width: 0;
}

.renovation__content {
    width: 100%;
    padding: clamp(50px, 7vw, 130px)
            clamp(50px, 7.5vw, 145px)
            clamp(50px, 7vw, 130px)
            clamp(40px, 6vw, 110px);
    box-sizing: border-box;
    color: #ffffff;
}

.renovation__title {
    margin: 0;
    color: #ffffff;
    font-family: "Roboto Condensed", Arial, sans-serif;
    font-size: clamp(28px, 2.1vw, 40px);
    font-weight: 700;
    font-style: italic;
    line-height: 1.15;
}

.renovation__trait {
    display: block;
    width: clamp(170px, 15vw, 285px);
    margin-top: clamp(18px, 1.5vw, 28px);
    margin-bottom: clamp(34px, 3vw, 55px);
}

.renovation__trait img {
    display: block;
    width: 100%;
    height: auto;
}

.renovation__content p {
    width: 100%;
    max-width: 720px;
    margin-top: 0;
    margin-bottom: clamp(18px, 1.5vw, 28px);
    color: #ffffff;
    font-family: "Prompt", Arial, sans-serif;
    font-size: clamp(15px, 1.15vw, 22px);
    font-weight: 300;
    line-height: 1.45;
}

.renovation__content strong {
    font-weight: 700;
}


/* ---- PRESTATIONS RÉNOVATION ---- */

.prestations-renovation__grille {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 55px 45px;
    width: 100%;
    max-width: 1260px;
    margin-right: auto;
    margin-left: auto;
}

.prestation-renovation:nth-child(1) {
    grid-column: 1 / span 2;
}

.prestation-renovation:nth-child(2) {
    grid-column: 3 / span 2;
}

.prestation-renovation:nth-child(3) {
    grid-column: 5 / span 2;
}

.prestation-renovation:nth-child(4) {
    grid-column: 2 / span 2;
}

.prestation-renovation:nth-child(5) {
    grid-column: 4 / span 2;
}

.prestation-renovation {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 0;
    text-align: center;
}

.prestation-renovation__icone {
    display: block;
    width: 54px;
    height: 54px;
    margin-bottom: 16px;
}

.prestation-renovation__icone img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.prestation-renovation__titre {
    margin: 0;
    color: #124f60;
    font-family: "Roboto Condensed", Arial, sans-serif;
    font-size: clamp(19px, 1.5vw, 25px);
    font-weight: 700;
    font-style: italic;
    line-height: 1.15;
    text-align: center;
}

.prestation-renovation__trait {
    display: block;
    width: min(185px, 80%);
    margin-top: 8px;
}

.prestation-renovation__trait img {
    display: block;
    width: 100%;
    height: auto;
}


/* ---- SERVICES PISCINE ---- */

.piscine-services {
    width: 100%;
    padding: 35px 20px 45px;
    overflow: hidden;
    background-color: #ffffff;
}

.piscine-services__container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}

.piscine-services__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: start;
    justify-items: center;
    gap: 35px 40px;
}

.piscine-services__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    max-width: 350px;
    margin: 0;
    text-align: center;
}

.piscine-services__item--liner {
    grid-column: 2;
}

.piscine-services__icon {
    display: block;
    width: 82.39px;
    height: 82.39px;
    margin: 0 0 8px;
    flex-shrink: 0;
}

.piscine-services__icon img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.piscine-services__title {
    margin: 0;
    padding: 0;
    color: #0d4053;
    font-size: 20px;
    font-weight: 700;
    font-style: italic;
    line-height: 1.35;
    text-align: center;
}

.piscine-services__trait {
    display: block;
    width: 150px;
    max-width: 100%;
    margin: 7px 0 0;
}

.piscine-services__trait img {
    display: block;
    width: 100%;
    height: auto;
}


/* ---- SUIVI SERVICE ---- */

.suivi-service {
    width: 100%;
    padding: 40px 20px 25px;
    overflow: hidden;
    background-color: #ffffff;
}

.suivi-service__container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}

.suivi-service__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    margin: 0 auto;
    text-align: center;
}

.suivi-service__title {
    margin: 0;
    padding: 0;
    color: #0d4053;
    font-size: 24px;
    font-weight: 700;
    font-style: italic;
    line-height: 1.4;
    text-align: center;
}

.suivi-service__trait {
    display: block;
    width: 185px;
    max-width: 100%;
    margin: 10px 0 0;
}

.suivi-service__trait img {
    display: block;
    width: 100%;
    height: auto;
}


/* ---- EXPERT / SOCIAL ---- */

.pbc-expert-social,
.pbc-expert-social *,
.pbc-expert-social *::before,
.pbc-expert-social *::after {
    box-sizing: border-box;
}

.pbc-expert-social {
    --pbc-blue: #0f4254;
    --pbc-yellow: #ffd500;
    --pbc-white: #ffffff;
    position: relative;
    width: 100%;
    overflow: hidden;
    color: var(--pbc-blue);
    background-color: var(--pbc-white);
    font-family: "Prompt", Arial, sans-serif;
}

.pbc-expert {
    position: relative;
    z-index: 1;
    width: 100%;
    min-height: 350px;
    background-color: var(--pbc-white);
}

.pbc-expert__container {
    display: grid;
    grid-template-columns: minmax(390px, 48%) minmax(0, 52%);
    width: min(1120px, calc(100% - 40px));
    min-height: 350px;
    margin-right: auto;
    margin-left: auto;
}

.pbc-expert__visual {
    --person-width: 205px;
    --person-right: 24px;
    position: relative;
    min-width: 0;
    min-height: 350px;
    overflow: visible;
}

.pbc-expert__person {
    position: absolute;
    z-index: 2;
    top: 30px;
    right: var(--person-right);
    display: block;
    width: var(--person-width);
    height: auto;
    margin: 0;
    line-height: 0;
}

.pbc-expert__person img {
    display: block;
    width: 100%;
    max-width: none;
    height: auto;
    object-fit: contain;
    object-position: center bottom;
}

.pbc-expert__button {
    position: absolute;
    z-index: 3;
    top: 50%;
    right: calc(
            var(--person-right) +
            var(--person-width) -
            12px
    );
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 11px;
    min-height: 36px;
    padding: 8px 15px 8px 16px;
    border: 2px solid var(--pbc-yellow);
    border-radius: 999px;
    color: var(--pbc-blue);
    background-color: var(--pbc-yellow);
    font-family: "Prompt", Arial, sans-serif;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    transform: translateY(-50%);
    transition: color 180ms ease,
            background-color 180ms ease,
            border-color 180ms ease,
            transform 180ms ease;
}

.pbc-expert__button-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: Arial, sans-serif;
    font-size: 19px;
    font-weight: 400;
    line-height: 1;
    transition: transform 180ms ease;
}

.pbc-expert__button:hover {
    color: var(--pbc-white);
    background-color: var(--pbc-blue);
    border-color: var(--pbc-blue);
    transform: translateY(calc(-50% - 2px));
}

.pbc-expert__button:hover .pbc-expert__button-arrow {
    transform: translateX(4px);
}

.pbc-expert__button:focus-visible {
    outline: 3px solid rgb(15 66 84 / 35%);
    outline-offset: 4px;
}

.pbc-expert__content {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    min-width: 0;
    padding: 55px
            0
            65px
            35px;
}

.pbc-expert__list {
    display: flex;
    flex-direction: column;
    gap: 13px;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
}

.pbc-expert__item {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    align-items: center;
    gap: 13px;
    width: 100%;
    margin: 0;
    padding: 0;
    color: var(--pbc-blue);
    font-family: "Prompt", Arial, sans-serif;
    font-size: clamp(14px, 1.15vw, 16px);
    font-weight: 500;
    line-height: 1.35;
}

.pbc-expert__item .font25 {
    font-size: inherit !important;
}

.pbc-expert__check {
    display: block;
    width: 16px;
    height: 16px;
    line-height: 0;
}

.pbc-expert__check img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.pbc-social {
    position: relative;
    z-index: 2;
    width: 100%;
    min-height: 235px;
    padding: 18px
            20px
            45px;
    background-color: var(--pbc-yellow);
}

.pbc-social::before {
    position: absolute;
    z-index: 0;
    top: -59px;
    right: 0;
    left: 0;
    width: 100%;
    height: 60px;
    background-color: var(--pbc-yellow);
    clip-path: polygon(
            0 0,
            100% 85%,
            100% 100%,
            0 100%
    );
    content: "";
}

.pbc-social__container {
    position: relative;
    z-index: 1;
    width: min(760px, 100%);
    margin-right: auto;
    margin-left: auto;
    text-align: center;
}

.pbc-social__title {
    display: flex;
    align-items: baseline;
    justify-content: center;
    flex-wrap: wrap;
    gap: 7px;
    margin: 0;
    color: var(--pbc-blue);
    font-family: "Roboto Condensed",
            "Arial Narrow",
            Arial,
            sans-serif;
    font-size: clamp(28px, 2.2vw, 34px);
    line-height: 1;
    text-transform: uppercase;
}

.pbc-social__title strong {
    font-weight: 800;
}

.pbc-social__title span {
    font-weight: 300;
    font-style: italic;
}

.pbc-social__line {
    display: block;
    width: 118px;
    height: 10px;
    margin: 10px
            auto
            23px;
    line-height: 0;
}

.pbc-social__line img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: fill;
}

.pbc-social__text {
    width: 100%;
    max-width: 480px;
    margin-right: auto;
    margin-left: auto;
    color: var(--pbc-blue);
    font-family: "Prompt", Arial, sans-serif;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.45;
}

.pbc-social__links {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    margin-top: 17px;
}

.pbc-social__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    line-height: 0;
    text-decoration: none;
    transition: opacity 180ms ease,
            transform 180ms ease;
}

.pbc-social__link picture {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

.pbc-social__link img {
    display: block;
    width: auto;
    max-width: 19px;
    height: 18px;
}

.pbc-social__link:hover {
    opacity: 0.7;
    transform: translateY(-3px);
}

.pbc-social__link:focus-visible {
    border-radius: 3px;
    outline: 3px solid rgb(15 66 84 / 35%);
    outline-offset: 5px;
}


/* ---- LABELS ---- */

.labels-section,
.labels-section *,
.labels-section *::before,
.labels-section *::after {
    box-sizing: border-box;
}

.labels-section {
    position: relative;
    width: 100%;
    padding: clamp(45px, 5vw, 80px)
            20px
            clamp(55px, 6vw, 95px);
    overflow: hidden;
    background-color: #ffffff;
}

.labels-section__container {
    width: 100%;
    max-width: 1320px;
    margin-right: auto;
    margin-left: auto;
}

.labels-section__header {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    text-align: center;
}

.labels-section__title {
    margin: 0;
    color: #124f60;
    font-family: "Roboto Condensed", Arial, sans-serif;
    font-size: clamp(34px, 3vw, 50px);
    font-weight: 300;
    font-style: italic;
    line-height: 1.1;
    text-transform: uppercase;
}

.labels-section__title span {
    font-weight: 700;
}

.labels-section__trait {
    display: block;
    width: clamp(180px, 18vw, 285px);
    margin-top: 14px;
    line-height: 0;
}

.labels-section__trait img {
    display: block;
    width: 100%;
    height: auto;
}

.labels-section__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-items: center;
    column-gap: clamp(25px, 4vw, 75px);
    row-gap: 35px;
    width: 100%;
    margin-top: clamp(45px, 5vw, 75px);
}

.labels-section__item {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-width: 0;
    min-height: 125px;
    margin: 0;
    padding: 10px;
}

.labels-section__picture {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    margin: 0;
    line-height: 0;
}

.labels-section__picture img {
    display: block;
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: 100%;
    margin: 0;
    object-fit: contain;
}

.labels-section__item--eparco img {
    width: min(100%, 220px);
}

.labels-section__item--everblue img {
    width: min(100%, 165px);
}

.labels-section__item--qualipac img,
.labels-section__item--qualibois img {
    width: min(100%, 155px);
}


/* ---- BOUTONS ---- */

.bouton-site {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    width: 207px;
    height: 48px;
    padding: 0 24px;
    border-radius: 24px;
    background-color: #ffffff;
    color: #124f60;
    font-size: 20px;
    text-decoration: none;
    transition: transform 200ms ease-in-out, box-shadow 200ms ease-in-out;
}

.bouton-site::after {
    flex-shrink: 0;
    margin-left: 14px;
    font-size: 27px;
    font-weight: 400;
    line-height: 1;
    content: "›";
    transition: transform 200ms ease-in-out;
}

.bouton-site:hover {
    color: #124f60;
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgb(0 0 0 / 18%);
}

.bouton-site:hover::after {
    transform: translateX(3px);
}

.bouton-site:focus-visible {
    outline: 3px solid #f9a01b;
    outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
    /* ---- EXPERT / SOCIAL ---- */

    .pbc-expert__button,
    .pbc-expert__button-arrow,
    .pbc-social__link {
        transition: none;
    }
}


.bouton-site_fond_rouge {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    width: 200px;
    height: 48px;
    padding: 0 24px;
    border-radius: 24px;
    background-color: #ffffff;
    color: #124f60;
    font-size: 20px;
    text-decoration: none;
    transition: transform 200ms ease-in-out, box-shadow 200ms ease-in-out;
}
/* Source: accueil/mobile.css */
/* ==========================================================
   ACCUEIL - MOBILE <= 767.98px
   ========================================================== */

@media screen and (max-width: 767.98px) {
    /* ---- PRESENTATION ---- */

    .presentation {
        position: relative;
        width: 100%;
        max-width: 100%;
        overflow-x: clip;
    }

    .presentation__row {
        position: relative;
        display: flex;
        flex-direction: column;
        width: 100%;
        max-width: 100%;
        margin-top: 3rem !important;
        margin-right: 0;
        margin-left: 0;
        --bs-gutter-x: 0;
        align-items: stretch;
    }

    .presentation__content {
        position: relative;
        flex: 0 0 100%;
        width: 100%;
        max-width: 100%;
        padding-right: clamp(20px, 6vw, 32px);
        padding-left: clamp(20px, 6vw, 32px);
        box-sizing: border-box;
    }

    .presentation__intro {
        width: 100%;
        max-width: none;
        margin-top: 0;
        margin-bottom: 2rem;
        font-size: clamp(16px, 4.3vw, 19px) !important;
        line-height: 1.5;
        overflow-wrap: break-word;
        word-break: normal;
        hyphens: none;
    }

    .presentation__content > picture {
        display: block;
    }

    .presentation__content > picture img, .presentation__content .text-end img {
        display: block;
        width: clamp(180px, 55vw, 260px);
        max-width: 100%;
        height: auto;
    }

    .presentation__content .text-end {
        display: flex;
        justify-content: flex-end;
        width: 100%;
        margin-top: 1.5rem;
    }

    .presentation__texte-fort {
        width: 100%;
        max-width: none;
        margin-top: 2rem !important;
        margin-bottom: 0;
        font-size: clamp(29px, 8vw, 38px) !important;
        line-height: 1.16 !important;
        overflow-wrap: normal;
        word-break: normal;
        hyphens: none;
    }

    .presentation__visual {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 100%;
        width: 100%;
        max-width: 100%;
        margin-top: 2.5rem;
        padding-right: clamp(16px, 4vw, 24px);
        padding-left: clamp(16px, 4vw, 24px);
        box-sizing: border-box;
        overflow: visible;
    }

    .presentation__picture {
        position: relative;
        display: block;
        flex-shrink: 1;
        width: min(460px, 100%);
        max-width: 100%;
        margin-right: auto;
        margin-left: auto;
        overflow: visible;
    }

    .presentation__picture img {
        display: block;
        width: 100%;
        max-width: 100%;
        height: auto;
        object-fit: contain;
    }


    /* ---- CLIM ATOUTS ---- */

    .clim-atouts {
        padding-top: 42px;
        padding-bottom: 42px;
    }

    .clim-atouts .container {
        padding-right: 22px;
        padding-left: 22px;
    }

    .clim-atouts__grid {
        grid-template-columns: 1fr;
        gap: 36px;
    }

    .clim-atouts__item {
        justify-content: initial;
        width: min(300px, 100%);
        margin-right: auto;
        margin-left: auto;
        gap: 24px;
        display: grid;
        grid-template-columns: 42px minmax(0, 1fr);
        align-items: center;
    }

    .clim-atouts__icon {
        width: 36px;
    }

    .clim-atouts__text {
        font-size: clamp(27px, 8vw, 35px) !important;
        line-height: 1.16;
    }

    .clim-atouts__background {
        display: none !important;
    }


    /* ---- CLIMATISATION / BLOCS IMAGE-TEXTE ---- */

    .climatisation {
        background-position: left top;
    }

    .climatisation__content {
        padding: 45px clamp(20px, 6vw, 32px);
    }

    .climatisation__title {
        font-size: clamp(27px, 8vw, 34px);
    }

    .climatisation__trait {
        width: clamp(160px, 55vw, 230px);
        margin-top: 18px;
        margin-bottom: 32px;
    }

    .climatisation__content p {
        max-width: none;
        font-size: clamp(15px, 4.2vw, 18px);
        line-height: 1.5;
    }

    .climatisation__button {
        min-height: 44px;
        margin-top: 18px;
        font-size: 15px;
    }

    .climatisation__right {
        min-height: 0;
    }

    .climatisation__picture {
        position: relative;
        inset: auto;
        width: 100%;
        height: auto;
    }

    .climatisation__picture img {
        width: 100%;
        max-width: 100%;
        height: auto;
        object-fit: contain;
    }


    /* ---- AUTRES PRODUITS ---- */

    .autres-produits {
        padding: 50px 0 65px;
    }

    .autres-produits__grille {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 45px 25px;
        width: 100%;
        padding: 0 20px;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .autres-produits__logo {
        order: 1;
        width: 170px;
        margin: 0 auto;
        grid-column: 1 / -1;
        grid-row: 1;
    }

    .produit--poele {
        order: 2;
        grid-column: 1;
        grid-row: 2;
    }

    .produit--brasero {
        order: 3;
        grid-column: 2;
        grid-row: 2;
    }

    .produit {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
        gap: 20px;
    }

    .produit__contenu {
        width: min(100%, 240px);
        flex: none;
    }

    .produit--poele .produit__visuel img {
        width: 175px;
    }

    .produit--brasero .produit__visuel img {
        width: 245px;
    }


    /* ---- PRESTATIONS RÉNOVATION ---- */

    .prestations-renovation {
        padding: 55px
                    clamp(20px, 6vw, 32px)
                    95px;
    }

    .prestations-renovation::after {
        bottom: -58px;
        height: 85px;
        transform: rotate(3deg);
    }

    .prestations-renovation__grille {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 45px;
        max-width: 420px;
    }

    .prestation-renovation,
    .prestation-renovation:nth-child(5) {
        width: 100%;
        margin: 0;
    }

    .prestation-renovation__icone {
        width: 50px;
        height: 50px;
        margin-bottom: 14px;
    }

    .prestation-renovation__titre {
        font-size: clamp(20px, 6vw, 24px);
    }

    .prestation-renovation__trait {
        width: min(180px, 65%);
        margin-top: 9px;
    }


    /* ---- SERVICES PISCINE ---- */

    .piscine-services {
        padding: 30px 15px 40px;
    }

    .piscine-services__grid {
        grid-template-columns: 1fr;
        gap: 38px;
    }

    .piscine-services__item,
    .piscine-services__item--liner {
        grid-column: auto;
        width: 100%;
        max-width: 100%;
    }

    .piscine-services__icon,
    .piscine-services__icon img {
        width: 82.39px;
        height: 82.39px;
    }

    .piscine-services__title {
        font-size: 18px;
        line-height: 1.4;
    }

    .piscine-services__trait {
        width: 145px;
    }


    /* ---- SUIVI SERVICE ---- */

    .suivi-service {
        padding: 30px 15px 25px;
    }

    .suivi-service__icon,
    .suivi-service__icon img {
        width: 84.33px;
        height: 84.33px;
    }

    .suivi-service__title {
        font-size: 20px;
        line-height: 1.4;
    }

    .suivi-service__trait {
        width: 170px;
    }


    /* ---- EXPERT / SOCIAL ---- */

    .pbc-expert {
        min-height: auto;
    }

    .pbc-expert__container {
        grid-template-columns: 1fr;
        width: min(620px, calc(100% - 32px));
        min-height: auto;
    }

    .pbc-expert__visual {
        --person-width: min(220px, 68vw);
        min-height: 335px;
    }

    .pbc-expert__person {
        top: 10px;
        right: auto;
        left: 50%;
        transform: translateX(-50%);
        bottom: 0;
        width: min(220px, 68vw);
        height: 315px;
    }

    .pbc-expert__button {
        top: auto;
        right: auto;
        bottom: 18px;
        left: 50%;
        transform: translateX(-50%);
    }

    .pbc-expert__button:hover {
        transform: translateX(-50%) translateY(-2px);
    }

    .pbc-expert__content {
        width: min(500px, 100%);
        margin-right: auto;
        margin-left: auto;
        padding: 30px 0 78px;
        margin: 0 auto;
    }

    .pbc-expert__list {
        gap: 15px;
    }

    .pbc-expert__item {
        grid-template-columns: 18px minmax(0, 1fr);
        gap: 13px;
        font-size: 15px;
    }

    .pbc-social {
        padding-top: 29px;
    }

    .pbc-social::before {
        top: -39px;
        height: 40px;
        clip-path: polygon(
                    0 0,
                    100% 75%,
                    100% 100%,
                    0 100%
            );
    }


    /* ---- LABELS ---- */

    .labels-section {
        padding: 40px
                    clamp(16px, 5vw, 28px)
                    55px;
    }

    .labels-section__title {
        font-size: clamp(32px, 10vw, 42px);
    }

    .labels-section__trait {
        width: min(220px, 65vw);
        margin-top: 12px;
    }

    .labels-section__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: clamp(15px, 5vw, 30px);
        row-gap: 30px;
        margin-top: 40px;
    }

    .labels-section__item {
        min-height: 105px;
        padding: 8px;
    }

    .labels-section__item--eparco img {
        width: min(100%, 175px);
    }

    .labels-section__item--everblue img {
        width: min(100%, 135px);
    }

    .labels-section__item--qualipac img,
    .labels-section__item--qualibois img {
        width: min(100%, 130px);
    }
}

@media screen and (max-width: 480px) {
    /* ---- EXPERT / SOCIAL ---- */

    .pbc-expert__container {
        width: calc(100% - 24px);
    }

    .pbc-expert__visual {
        --person-width: min(205px, 72vw);
        min-height: 310px;
    }

    .pbc-expert__person {
        top: 8px;
        width: min(205px, 72vw);
        height: 290px;
    }

    .pbc-expert__button {
        bottom: 14px;
        min-height: 35px;
        padding: 8px 14px;
        font-size: 12px;
    }

    .pbc-expert__content {
        padding: 25px
                    0
                    66px;
        padding-top: 25px;
        padding-bottom: 66px;
    }

    .pbc-expert__list {
        gap: 14px;
    }

    .pbc-expert__item {
        align-items: start;
        font-size: 14px;
        line-height: 1.45;
    }

    .pbc-expert__check {
        margin-top: 2px;
    }

    .pbc-social {
        min-height: 250px;
        padding: 27px 16px 40px;
    }

    .pbc-social__title {
        display: block;
        font-size: 29px;
        line-height: 1.08;
    }

    .pbc-social__title strong,
    .pbc-social__title span {
        display: block;
    }

    .pbc-social__title span {
        margin-top: 3px;
    }

    .pbc-social__line {
        width: 105px;
        height: 9px;
        margin-top: 11px;
        margin-bottom: 20px;
    }

    .pbc-social__text {
        max-width: 330px;
        font-size: 13px;
    }

    .pbc-social__text br {
        display: none;
    }
}

@media screen and (max-width: 420px) {
    /* ---- CLIM ATOUTS ---- */

    .clim-atouts {
        padding-top: 38px;
        padding-bottom: 38px;
    }

    .clim-atouts__grid {
        gap: 32px;
    }

    .clim-atouts__item {
        width: min(280px, 100%);
        grid-template-columns: 36px minmax(0, 1fr);
        gap: 20px;
    }

    .clim-atouts__icon {
        width: 32px;
    }

    .clim-atouts__text {
        font-size: clamp(25px, 8vw, 31px) !important;
    }


    /* ---- LABELS ---- */

    .labels-section {
        padding-right: 14px;
        padding-left: 14px;
    }

    .labels-section__grid {
        column-gap: 12px;
        row-gap: 24px;
    }

    .labels-section__item {
        min-height: 90px;
        padding: 6px;
    }

    .labels-section__item--eparco img {
        width: min(100%, 145px);
    }

    .labels-section__item--everblue img {
        width: min(100%, 112px);
    }

    .labels-section__item--qualipac img,
    .labels-section__item--qualibois img {
        width: min(100%, 108px);
    }
}

@media screen and (max-width: 360px) {
    /* ---- EXPERT / SOCIAL ---- */

    .pbc-expert__visual {
        --person-width: min(190px, 74vw);
        min-height: 292px;
    }

    .pbc-expert__person {
        width: min(190px, 74vw);
        height: 272px;
    }

    .pbc-expert__item {
        font-size: 13.5px;
    }

    .pbc-social__title {
        font-size: 27px;
    }
}

@media screen and (max-width: 340px) {
    /* ---- LABELS ---- */

    .labels-section__grid {
        grid-template-columns: 1fr;
        row-gap: 20px;
    }

    .labels-section__item {
        min-height: 90px;
    }

    .labels-section__item--eparco img {
        width: min(100%, 180px);
    }

    .labels-section__item--everblue img {
        width: min(100%, 135px);
    }

    .labels-section__item--qualipac img,
    .labels-section__item--qualibois img {
        width: min(100%, 130px);
    }
}

/* Source: accueil/PC.css */
/* ==========================================================
   ACCUEIL - ORDINATEUR 992px à 1399.98px
   ========================================================== */

@media screen and (min-width: 992px) and (max-width: 1399.98px) {
    /* ---- PRESENTATION ---- */

    .presentation {
        position: relative;
        width: 100%;
        max-width: 100%;
    }

    .presentation__row {
        position: relative;
        width: 100%;
        max-width: 100%;
        margin-right: 0;
        margin-left: 0;
        --bs-gutter-x: 0;
        align-items: stretch;
    }

    .presentation__content {
        position: relative;
        padding-left: clamp(45px, 5vw, 75px);
        padding-right: clamp(25px, 3vw, 45px);
    }

    .presentation__intro {
        width: 100%;
        max-width: 600px;
        margin-top: 0;
        margin-bottom: 3rem;
        font-size: clamp(17px, 1.6vw, 22px) !important;
        line-height: 1.45;
    }

    .presentation__texte-fort {
        width: 100%;
        max-width: 600px;
        font-size: clamp(34px, 3vw, 42px) !important;
        line-height: 1.2 !important;
        overflow-wrap: normal;
        word-break: normal;
    }

    .presentation__visual {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        align-self: stretch;
        min-height: 0;
        padding-right: clamp(20px, 3vw, 45px);
        padding-left: 10px;
        overflow: visible;
    }

    .presentation__picture {
        position: relative;
        display: block;
        flex-shrink: 0;
        width: min(580px, calc(50vw - 50px));
        max-width: none;
        margin: 0;
        overflow: visible;
    }

    .presentation__picture img {
        display: block;
        width: 100%;
        height: auto;
        max-width: none;
        object-fit: contain;
    }


    /* ---- AUTRES PRODUITS ---- */

    .autres-produits__grille {
        grid-template-columns: minmax(0, 1fr)minmax(130px, 180px)minmax(0, 1fr);
        gap: 20px;
    }

    .produit {
        gap: 15px;
    }

    .produit__contenu {
        flex-basis: 180px;
        width: 180px;
    }

    .produit--poele .produit__visuel img {
        width: 160px;
    }

    .produit--brasero .produit__visuel img {
        width: 220px;
    }


    /* ---- EXPERT / SOCIAL ---- */

    .pbc-expert {
        min-height: 330px;
    }

    .pbc-expert__container {
        grid-template-columns: minmax(390px, 48%) minmax(0, 52%);
        width: min(960px, calc(100% - 32px));
        min-height: 330px;
    }

    .pbc-expert__visual {
        --person-width: 205px;
        --person-right: 0px;
        min-height: 330px;
    }

    .pbc-expert__person {
        top: 30px;
    }

    .pbc-expert__content {
        padding: 45px
                    10px
                    55px
                    25px;
    }

    .pbc-expert__list {
        gap: 12px;
    }

    .pbc-expert__item {
        gap: 12px;
        font-size: 14px;
    }


    /* ---- LABELS ---- */

    .labels-section {
        padding-right: 30px;
        padding-left: 30px;
    }

    .labels-section__grid {
        column-gap: clamp(20px, 3vw, 45px);
    }

    .labels-section__item {
        min-height: 110px;
    }

    .labels-section__item--eparco img {
        width: min(100%, 190px);
    }

    .labels-section__item--everblue img {
        width: min(100%, 145px);
    }

    .labels-section__item--qualipac img,
    .labels-section__item--qualibois img {
        width: min(100%, 135px);
    }
}

/* Source: accueil/PCXXL.css */
/* ==========================================================
   ACCUEIL - GRAND ÉCRAN >= 1400px
   ========================================================== */

@media screen and (min-width: 1400px) {
    /* ---- PRESENTATION ---- */

    .presentation {
        position: relative;
        width: 100%;
        max-width: 100%;
    }

    .presentation__row {
        position: relative;
        width: 100%;
        max-width: 1320px;
        margin-right: auto;
        margin-left: auto;
        padding-right: 12px;
        padding-left: 12px;
        box-sizing: border-box;
        --bs-gutter-x: 0;
        align-items: stretch;
    }

    .presentation__content {
        position: relative;
        padding-left: 0;
        padding-right: 40px;
    }

    .presentation__intro {
        width: 100%;
        max-width: 640px;
        margin-top: 0;
        margin-bottom: 3rem;
        font-size: 22px !important;
        line-height: 1.45;
    }

    .presentation__texte-fort {
        width: 100%;
        max-width: 640px;
        font-size: 50px !important;
        line-height: 50px !important;
    }

    .presentation__visual {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        align-self: stretch;
        min-height: 0;
        padding-left: 30px;
        padding-right: 0;
        overflow: visible;
    }

    .presentation__picture {
        position: relative;
        display: block;
        flex-shrink: 0;
        width: min(650px, 100%);
        max-width: none;
        margin: 0;
        overflow: visible;
    }

    .presentation__picture img {
        display: block;
        width: 100%;
        height: auto;
        max-width: none;
        object-fit: contain;
    }
}

/* Source: accueil/tablette.css */
/* ==========================================================
   ACCUEIL - TABLETTE 768px à 991.98px
   ========================================================== */

@media screen and (min-width: 768px) and (max-width: 991.98px) {
    /* ---- PRESENTATION ---- */

    .presentation {
        position: relative;
        width: 100%;
        max-width: 100%;
    }

    .presentation__row {
        position: relative;
        display: flex;
        flex-direction: column;
        width: 100%;
        max-width: 100%;
        margin-right: 0;
        margin-left: 0;
        --bs-gutter-x: 0;
        align-items: stretch;
    }

    .presentation__content {
        position: relative;
        flex: 0 0 100%;
        width: 100%;
        max-width: 100%;
        padding-right: clamp(32px, 6vw, 60px);
        padding-left: clamp(32px, 6vw, 60px);
    }

    .presentation__intro {
        width: 100%;
        max-width: 720px;
        margin-top: 0;
        margin-bottom: 2.5rem;
        font-size: clamp(18px, 2.3vw, 21px) !important;
        line-height: 1.5;
        overflow-wrap: break-word;
    }

    .presentation__texte-fort {
        width: 100%;
        max-width: 720px;
        font-size: clamp(32px, 4.5vw, 38px) !important;
        line-height: 1.2 !important;
        overflow-wrap: normal;
        word-break: normal;
    }

    .presentation__visual {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 100%;
        width: 100%;
        max-width: 100%;
        margin-top: 2.5rem;
        padding-right: clamp(32px, 6vw, 60px);
        padding-left: clamp(32px, 6vw, 60px);
        overflow: visible;
    }

    .presentation__picture {
        position: relative;
        display: block;
        flex-shrink: 1;
        width: min(560px, 100%);
        max-width: 100%;
        margin-right: auto;
        margin-left: auto;
        overflow: visible;
    }

    .presentation__picture img {
        display: block;
        width: 100%;
        max-width: 100%;
        height: auto;
        object-fit: contain;
    }


    /* ---- CLIM ATOUTS ---- */

    .clim-atouts {
        padding-top: 55px;
        padding-bottom: 55px;
    }

    .clim-atouts__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 45px 35px;
    }

    .clim-atouts__item {
        justify-content: flex-start;
        width: min(320px, 100%);
        margin-right: auto;
        margin-left: auto;
        gap: 22px;
    }

    .clim-atouts__icon {
        width: 46px;
    }

    .clim-atouts__text {
        font-size: clamp(26px, 4vw, 34px) !important;
    }

    .clim-atouts__background {
        display: none !important;
    }


    /* ---- CLIMATISATION / BLOCS IMAGE-TEXTE ---- */

    .climatisation {
        background-position: left center;
    }

    .climatisation__content {
        padding: 60px clamp(40px, 7vw, 70px);
    }

    .climatisation__title {
        font-size: clamp(30px, 4vw, 38px);
    }

    .climatisation__content p {
        max-width: 100%;
        font-size: clamp(17px, 2.3vw, 20px);
    }

    .climatisation__right {
        min-height: 0;
    }

    .climatisation__picture {
        position: relative;
        inset: auto;
        width: 100%;
        height: auto;
    }

    .climatisation__picture img {
        width: 100%;
        max-width: 100%;
        height: auto;
        object-fit: contain;
    }


    /* ---- AUTRES PRODUITS ---- */

    .autres-produits {
        padding: 50px 0 65px;
    }

    .autres-produits__grille {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 45px 25px;
    }

    .autres-produits__logo {
        grid-column: 1 / -1;
        grid-row: 1;
        width: 170px;
        margin: 0 auto;
    }

    .produit--poele {
        grid-column: 1;
        grid-row: 2;
    }

    .produit--brasero {
        grid-column: 2;
        grid-row: 2;
    }

    .produit {
        flex-direction: column;
        gap: 20px;
    }

    .produit__contenu {
        flex: none;
        width: min(100%, 240px);
    }

    .produit--poele .produit__visuel img {
        width: 175px;
    }

    .produit--brasero .produit__visuel img {
        width: 245px;
    }


    /* ---- PRESTATIONS RÉNOVATION ---- */

    .prestations-renovation {
        padding: 65px 35px 100px;
    }

    .prestations-renovation__grille {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 55px 30px;
        max-width: 800px;
    }

    .prestation-renovation:nth-child(1),
    .prestation-renovation:nth-child(2),
    .prestation-renovation:nth-child(3),
    .prestation-renovation:nth-child(4) {
        grid-column: auto;
    }

    .prestation-renovation:nth-child(5) {
        grid-column: 1 / -1;
        width: 50%;
        margin-right: auto;
        margin-left: auto;
    }

    .prestation-renovation__icone {
        width: 52px;
        height: 52px;
    }

    .prestation-renovation__titre {
        font-size: clamp(20px, 2.6vw, 24px);
    }

    .prestation-renovation__trait {
        width: min(180px, 75%);
    }


    /* ---- SERVICES PISCINE ---- */

    .piscine-services {
        padding: 35px 20px 40px;
    }

    .piscine-services__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 40px 25px;
    }

    .piscine-services__item--liner {
        grid-column: auto;
    }


    /* ---- EXPERT / SOCIAL ---- */

    .pbc-expert {
        min-height: 310px;
    }

    .pbc-expert__visual {
        --person-width: 202px;
        --person-right: 0px;
        min-height: 310px;
    }

    .pbc-expert__list {
        gap: 10px;
    }

    .pbc-expert__check {
        width: 15px;
        height: 15px;
    }

    .pbc-expert__container {
        grid-template-columns: minmax(330px, 47%) minmax(0, 53%);
        width: min(940px, calc(100% - 32px));
        min-height: 310px;
    }

    .pbc-expert__person {
        top: 28px;
        right: 0;
        width: 202px;
        height: clamp(275px, 32vw, 310px);
    }

    .pbc-expert__button {
        font-size: 12px;
        right: clamp(140px, 18vw, 180px);
    }

    .pbc-expert__content {
        padding: 38px 10px 50px 25px;
    }

    .pbc-expert__item {
        grid-template-columns: 16px minmax(0, 1fr);
        gap: 12px;
        font-size: 13px;
        line-height: 1.35;
    }


    /* ---- LABELS ---- */

    .labels-section {
        padding: 45px
                    25px
                    65px;
    }

    .labels-section__title {
        font-size: clamp(36px, 5vw, 44px);
    }

    .labels-section__trait {
        width: 220px;
    }

    .labels-section__grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        column-gap: 20px;
        margin-top: 45px;
    }

    .labels-section__item {
        min-height: 95px;
        padding: 8px;
    }

    .labels-section__item--eparco img {
        width: min(100%, 155px);
    }

    .labels-section__item--everblue img {
        width: min(100%, 120px);
    }

    .labels-section__item--qualipac img,
    .labels-section__item--qualibois img {
        width: min(100%, 115px);
    }
}

/* Source: clim/index.css */
/* ==========================================================
   HEADER CLIMATISATION
   ========================================================== */

.clim-header,
.clim-header *,
.clim-header *::before,
.clim-header *::after {
    box-sizing: border-box;
}

.clim-header {
    --clim-header-blue: #0d4053;
    --clim-header-green: #78b097;
    --clim-header-white: #ffffff;

    position: relative;

    width: 100%;
    margin: 0;
    padding: 0;

    overflow: hidden;

    background-color: var(--clim-header-white);
}

.clim-header__container {
    position: relative;

    display: grid;
    grid-template-columns:
        minmax(0, 50%)
        minmax(0, 50%);

    align-items: stretch;

    gap: 0 !important;
    row-gap: 0 !important;
    column-gap: 0 !important;

    width: 100%;
 /*   max-width: 1920px; */

    aspect-ratio: 1920 / 366;

    margin: 0 auto;
    padding: 0;

    overflow: hidden;
}


/* ==========================================================
   IMAGE DE GAUCHE
   ========================================================== */

.clim-header__image-zone {
    position: relative;

    align-self: stretch;

    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden;
}

.clim-header__image {
    position: absolute;

    inset: 0;

    display: block;

    width: 100%;
    height: 100%;

    margin: 0 !important;
    padding: 0 !important;

    line-height: 0;
}

.clim-header__image img {
    display: block;

    width: 100%;
    height: 100%;
    max-width: none;

    margin: 0 !important;
    padding: 0 !important;

    vertical-align: top;

    object-fit: cover;
    object-position: center center;
}


/* ==========================================================
   ZONE VERTE
   ========================================================== */

.clim-header__green-zone {
    position: relative;

    align-self: stretch;

    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden;
}

/*
 * Le SVG original est masqué.
 * La forme verte est recréée en CSS pour éviter
 * les zones transparentes contenues dans le fichier.
 */
.clim-header__green-shape {
    display: none !important;
}

.clim-header__green-zone::before {
    position: absolute;
    z-index: 0;

    inset: 0;

    display: block;

    width: 100%;
    height: 100%;

    background-color: var(--clim-header-green);

    clip-path: polygon(
            0 0,
            100% 0,
            100% 90%,
            0 100%
    );

    content: "";
}


/* ==========================================================
   CONTENU DE LA ZONE VERTE
   ========================================================== */

.clim-header__content {
    position: absolute;
    z-index: 2;

    top: 44%;
    right: clamp(20px, 3.5vw, 85px);
    left: clamp(20px, 3.5vw, 85px);

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

    gap: clamp(14px, 1.6vw, 30px);

    min-width: 0;

    margin: 0;
    padding: 0;

    transform: translateY(-50%);
}


/* ==========================================================
   SLOGAN
   ========================================================== */

.clim-header__slogan {
    display: flex;
    flex: 0 1 auto;
    flex-direction: column;
    align-items: flex-end;

    min-width: 0;

    margin: 0;
    padding: 0;

    color: var(--clim-header-blue);

    line-height: 1;
    text-align: right;

    white-space: nowrap;
}

.clim-header__slogan-top {
    display: block;

    margin: 0;
    padding: 0;

    font-size: 50px;
    font-weight: 500;
    line-height: 1;
    letter-spacing: 0;

    white-space: nowrap;
}

.clim-header__slogan-bottom {
    display: block;

    margin: 7px 0 0;
    padding: 0;

    font-size: 50px;
    font-weight: 700;
    line-height: 1;

    white-space: nowrap;
}


/* ==========================================================
   SÉPARATEUR BLANC
   ========================================================== */

.clim-header__separator {
    display: block;
    flex: 0 0 2px;

    width: 2px;
    height: 76px;

    margin: 0;
    padding: 0;

    background-color: var(--clim-header-white);
}


/* ==========================================================
   LOGO CLIM LEAL’O
   ========================================================== */

.clim-header__brand {
    display: flex;
    flex: 0 0 auto;
    align-items: center;

    gap: clamp(7px, 0.8vw, 12px);

    min-width: 0;

    margin: 0;
    padding: 0;

    color: var(--clim-header-white);
}

.clim-header__brand-icon {
    display: block;
    flex: 0 0 auto;

    width: 66px;
    height: 66px;

    margin: 0;
    padding: 0;

    line-height: 0;
}

.clim-header__brand-icon img {
    display: block;

    width: 100%;
    height: 100%;
    max-width: none;

    margin: 0;
    padding: 0;

    vertical-align: top;

    object-fit: contain;
}

.clim-header__brand-text {
    display: flex;
    flex-direction: column;

    margin: 0;
    padding: 0;

    color: var(--clim-header-white);

    font-family:
            "Roboto Condensed",
            Arial,
            sans-serif;

    font-size: 30px;
    line-height: 0.9;

    white-space: nowrap;
}

.clim-header__brand-text strong {
    display: block;

    margin: 0;
    padding: 0;

    font-weight: 700;
}

.clim-header__brand-text span {
    display: block;

    margin: 8px 0 0;
    padding: 0;

    font-weight: 500;
}


/* ==========================================================
   PC XXL
   1400PX ET PLUS
   ========================================================== */

@media screen and (min-width: 1400px) {

    .clim-header__container {
        grid-template-columns:
            minmax(0, 50%)
            minmax(0, 50%);

        gap: 0 !important;
    }

    .clim-header__content {
        top: 44%;

        right: clamp(45px, 5vw, 100px);
        left: clamp(45px, 5vw, 100px);

        gap: clamp(18px, 2vw, 35px);
    }

    .clim-header__slogan-top,
    .clim-header__slogan-bottom {
        font-size: 50px;
    }

    .clim-header__separator {
        height: 76px;
    }

    .clim-header__brand-icon {
        width: 66px;
        height: 66px;
    }

    .clim-header__brand-text {
        font-size: 30px;
    }
}


/* ==========================================================
   PC LARGE
   1200PX À 1399PX
   ========================================================== */

@media screen and (min-width: 1200px) and (max-width: 1399.98px) {

    .clim-header__container {
        grid-template-columns:
            minmax(0, 50%)
            minmax(0, 50%);

        gap: 0 !important;
    }

    .clim-header__content {
        top: 44%;

        right: clamp(18px, 2vw, 28px);
        left: clamp(18px, 2vw, 28px);

        gap: clamp(10px, 1.2vw, 17px);
    }

    .clim-header__slogan-top,
    .clim-header__slogan-bottom {
        font-size: 50px;
    }

    .clim-header__slogan-bottom {
        margin-top: 5px;
    }

    .clim-header__separator {
        height: 66px;
    }

    .clim-header__brand {
        gap: 7px;
    }

    .clim-header__brand-icon {
        width: 50px;
        height: 50px;
    }

    .clim-header__brand-text {
        font-size: 23px;
    }

    .clim-header__brand-text span {
        margin-top: 5px;
    }
}


/* ==========================================================
   PETIT PC
   992PX À 1199PX
   ========================================================== */

@media screen and (min-width: 992px) and (max-width: 1199.98px) {

    .clim-header__container {
        grid-template-columns:
            minmax(0, 44%)
            minmax(0, 56%);

        gap: 0 !important;
    }

    .clim-header__content {
        top: 44%;

        right: 14px;
        left: 14px;

        gap: 10px;
    }

    .clim-header__slogan-top,
    .clim-header__slogan-bottom {
        font-size: 50px;
    }

    .clim-header__slogan-bottom {
        margin-top: 5px;
    }

    .clim-header__separator {
        height: 62px;
    }

    .clim-header__brand {
        gap: 6px;
    }

    .clim-header__brand-icon {
        width: 43px;
        height: 43px;
    }

    .clim-header__brand-text {
        font-size: 20px;
    }

    .clim-header__brand-text span {
        margin-top: 4px;
    }
}


/* ==========================================================
   TABLETTE
   768PX À 991PX
   ========================================================== */

@media screen and (min-width: 768px) and (max-width: 991.98px) {

    .clim-header__container {
        grid-template-columns:
            minmax(0, 50%)
            minmax(0, 50%);

        gap: 0 !important;

        aspect-ratio: 1920 / 410;
    }

    .clim-header__content {
        top: 44%;

        right: 10px;
        left: 10px;

        gap: 8px;
    }

    .clim-header__slogan {
        flex: 1 1 auto;
    }

    .clim-header__slogan-top {
        font-size: clamp(23px, 3vw, 30px);
    }

    .clim-header__slogan-bottom {
        margin-top: 4px;

        font-size: clamp(25px, 3.3vw, 33px);
    }

    .clim-header__separator {
        flex: 0 0 1px;

        width: 1px;
        height: 44px;
    }

    .clim-header__brand {
        gap: 5px;
    }

    .clim-header__brand-icon {
        width: clamp(32px, 4.2vw, 40px);
        height: clamp(32px, 4.2vw, 40px);
    }

    .clim-header__brand-text {
        font-size: clamp(15px, 2vw, 19px);
    }

    .clim-header__brand-text span {
        margin-top: 4px;
    }
}


/* ==========================================================
   GRAND MOBILE
   521PX À 767PX
   ========================================================== */

@media screen and (min-width: 521px) and (max-width: 767.98px) {

    .clim-header {
        overflow: visible;
    }

    .clim-header__container {
        display: flex;
        flex-direction: column;

        gap: 0 !important;
        row-gap: 0 !important;
        column-gap: 0 !important;

        width: 100%;
        max-width: 100%;

        aspect-ratio: auto;

        margin: 0;
        padding: 0;

        overflow: visible;
    }


    /* Image supérieure */

    .clim-header__image-zone {
        position: relative;

        flex: 0 0 auto;

        width: 100%;
        height: auto;

        aspect-ratio: 960 / 366;

        margin: 0 0 -1px !important;
        padding: 0 !important;

        overflow: hidden;
    }

    .clim-header__image {
        position: absolute;

        inset: 0;

        width: 100%;
        height: 100%;

        margin: 0 !important;
        padding: 0 !important;
    }

    .clim-header__image img {
        width: 100%;
        height: 100%;

        margin: 0 !important;
        padding: 0 !important;

        object-fit: cover;
        object-position: center center;
    }


    /* Zone verte */

    .clim-header__green-zone {
        position: relative;

        flex: 0 0 auto;

        width: 100%;
        height: auto;
        min-height: clamp(230px, 48vw, 285px);

        margin: -1px 0 0 !important;
        padding: 0 !important;

        overflow: hidden;
    }

    .clim-header__green-zone::before {
        top: -1px;
        bottom: 0;

        height: calc(100% + 1px);

        clip-path: polygon(
                0 0,
                100% 0,
                100% 91%,
                0 100%
        );
    }


    /* Contenu */

    .clim-header__content {
        position: absolute;

        inset: 0;

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

        gap: clamp(12px, 3vw, 22px);

        margin: 0;

        padding:
                18px
                clamp(20px, 5vw, 40px)
                35px;

        transform: none;
    }

    .clim-header__slogan-top {
        font-size: clamp(25px, 4.5vw, 33px);
    }

    .clim-header__slogan-bottom {
        margin-top: 5px;

        font-size: clamp(28px, 5vw, 36px);
    }

    .clim-header__separator {
        height: clamp(50px, 10vw, 64px);
    }

    .clim-header__brand-icon {
        width: clamp(43px, 9vw, 58px);
        height: clamp(43px, 9vw, 58px);
    }

    .clim-header__brand-text {
        font-size: clamp(19px, 4vw, 27px);
    }
}


/* ==========================================================
   MOBILE
   361PX À 520PX
   ========================================================== */

@media screen and (min-width: 361px) and (max-width: 520px) {

    .clim-header {
        overflow: visible;
    }

    .clim-header__container {
        display: flex;
        flex-direction: column;

        gap: 0 !important;
        row-gap: 0 !important;
        column-gap: 0 !important;

        width: 100%;
        max-width: 100%;

        aspect-ratio: auto;

        margin: 0;
        padding: 0;

        overflow: visible;
    }


    /* Image supérieure */

    .clim-header__image-zone {
        position: relative;

        flex: 0 0 auto;

        width: 100%;
        height: auto;

        aspect-ratio: 16 / 7;

        margin: 0 0 -1px !important;
        padding: 0 !important;

        overflow: hidden;
    }

    .clim-header__image {
        position: absolute;

        inset: 0;

        width: 100%;
        height: 100%;

        margin: 0 !important;
        padding: 0 !important;
    }

    .clim-header__image img {
        width: 100%;
        height: 100%;

        margin: 0 !important;
        padding: 0 !important;

        object-fit: cover;
        object-position: 55% center;
    }


    /* Zone verte */

    .clim-header__green-zone {
        position: relative;

        flex: 0 0 auto;

        width: 100%;
        height: 225px;
        min-height: 225px;

        margin: -1px 0 0 !important;
        padding: 0 !important;

        overflow: hidden;
    }

    .clim-header__green-zone::before {
        top: -1px;
        bottom: 0;

        height: calc(100% + 1px);

        clip-path: polygon(
                0 0,
                100% 0,
                100% 93%,
                0 100%
        );
    }


    /* Contenu vertical */

    .clim-header__content {
        position: absolute;

        inset: 0;

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

        gap: 11px;

        margin: 0;

        padding:
                15px
                18px
                31px;

        transform: none;
    }

    .clim-header__slogan {
        align-items: center;

        width: 100%;

        text-align: center;
    }

    .clim-header__slogan-top {
        font-size: clamp(23px, 6.5vw, 29px);
    }

    .clim-header__slogan-bottom {
        margin-top: 5px;

        font-size: clamp(26px, 7.3vw, 33px);
    }

    .clim-header__separator {
        flex: 0 0 2px;

        width: min(170px, 52vw);
        height: 2px;
    }

    .clim-header__brand {
        justify-content: center;
    }

    .clim-header__brand-icon {
        width: 45px;
        height: 45px;
    }

    .clim-header__brand-text {
        font-size: 22px;
    }

    .clim-header__brand-text span {
        margin-top: 5px;
    }
}


/* ==========================================================
   TRÈS PETIT MOBILE
   JUSQU’À 360PX
   ========================================================== */

@media screen and (max-width: 360px) {

    .clim-header {
        overflow: visible;
    }

    .clim-header__container {
        display: flex;
        flex-direction: column;

        gap: 0 !important;
        row-gap: 0 !important;
        column-gap: 0 !important;

        width: 100%;
        max-width: 100%;

        aspect-ratio: auto;

        margin: 0;
        padding: 0;

        overflow: visible;
    }


    /* Image supérieure */

    .clim-header__image-zone {
        position: relative;

        flex: 0 0 auto;

        width: 100%;
        height: auto;

        aspect-ratio: 16 / 7;

        margin: 0 0 -1px !important;
        padding: 0 !important;

        overflow: hidden;
    }

    .clim-header__image {
        position: absolute;

        inset: 0;

        width: 100%;
        height: 100%;

        margin: 0 !important;
        padding: 0 !important;
    }

    .clim-header__image img {
        width: 100%;
        height: 100%;

        margin: 0 !important;
        padding: 0 !important;

        object-fit: cover;
        object-position: 55% center;
    }


    /* Zone verte */

    .clim-header__green-zone {
        position: relative;

        flex: 0 0 auto;

        width: 100%;
        height: 215px;
        min-height: 215px;

        margin: -1px 0 0 !important;
        padding: 0 !important;

        overflow: hidden;
    }

    .clim-header__green-zone::before {
        top: -1px;
        bottom: 0;

        height: calc(100% + 1px);

        clip-path: polygon(
                0 0,
                100% 0,
                100% 93%,
                0 100%
        );
    }


    /* Contenu vertical */

    .clim-header__content {
        position: absolute;

        inset: 0;

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

        gap: 10px;

        margin: 0;

        padding:
                14px
                14px
                29px;

        transform: none;
    }

    .clim-header__slogan {
        align-items: center;

        width: 100%;

        text-align: center;
    }

    .clim-header__slogan-top {
        font-size: 21px;
    }

    .clim-header__slogan-bottom {
        margin-top: 4px;

        font-size: 24px;
    }

    .clim-header__separator {
        flex: 0 0 2px;

        width: min(150px, 52vw);
        height: 2px;
    }

    .clim-header__brand {
        justify-content: center;
    }

    .clim-header__brand-icon {
        width: 41px;
        height: 41px;
    }

    .clim-header__brand-text {
        font-size: 20px;
    }

    .clim-header__brand-text span {
        margin-top: 4px;
    }
}


.clim-presentation {
    position: relative;
    width: 100%;
    padding: 80px 0 100px;
    overflow-x: clip;
}

/* Titre */

.clim-presentation__title {
    margin: 0;
    padding: 0;
    line-height: 1.1;
}

/* Petit trait sous le titre */

.clim-presentation__trait {
    display: block;
    width: 265px;
    max-width: 100%;
    margin-top: 25px;
}

.clim-presentation__trait img {
    display: block;
    width: 100%;
    height: auto;
}

/* Ligne principale */

.clim-presentation__row {
    --bs-gutter-x: 64px;

    align-items: flex-start;
    margin-top: 55px;
}

/* Texte */

.clim-presentation__contenu {
    width: 100%;
    max-width: 570px;
}

.clim-presentation__contenu p {
    margin-top: 0;
    margin-bottom: 22px;
    line-height: 1.5;
}

.clim-presentation__contenu p:last-child {
    margin-bottom: 0;
}

.clim-presentation__contenu .pb {
    font-weight: 700;
}

/* Image */

.clim-presentation__image {
    display: block;
    width: 100%;
    max-width: 650px;
    margin-left: auto;
}

.clim-presentation__image img {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    object-fit: contain;
}

/* Écrans intermédiaires */

@media screen and (max-width: 1199.98px) {
    .clim-presentation {
        padding: 70px 0 90px;
    }

    .clim-presentation__row {
        --bs-gutter-x: 45px;

        margin-top: 45px;
    }

    .clim-presentation__contenu p {
        font-size: 20px;
    }
}

/* Tablette et mobile */

@media screen and (max-width: 991.98px) {
    .clim-presentation {
        padding: 55px 0 70px;
    }

    .clim-presentation__trait {
        width: 230px;
        margin-top: 20px;
    }

    .clim-presentation__row {
        --bs-gutter-x: 24px;

        margin-top: 40px;
    }

    .clim-presentation__contenu {
        max-width: none;
    }

    .clim-presentation__contenu p {
        font-size: 19px;
        line-height: 1.55;
    }

    .clim-presentation__image {
        max-width: 700px;
        margin: 45px auto 0;
    }
}

/* Mobile */

@media screen and (max-width: 575.98px) {
    .clim-presentation {
        padding: 40px 0 55px;
    }

    .clim-presentation__title {
        font-size: 38px;
    }

    .clim-presentation__trait {
        width: 190px;
        margin-top: 16px;
    }

    .clim-presentation__row {
        margin-top: 32px;
    }

    .clim-presentation__contenu p {
        margin-bottom: 18px;
        font-size: 17px;
        line-height: 1.55;
    }

    .clim-presentation__image {
        width: calc(100% + 20px);
        max-width: none;
        margin-top: 35px;
        margin-right: -10px;
        margin-left: -10px;
    }
}




/* =========================================================
   SECTION ATOUTS CLIMATISATION
   ========================================================= */

.clim-atouts {
    position: relative;

    width: 100%;
    min-height: clamp(220px, 18.6vw, 357px);

    display: flex;
    align-items: center;

    padding: clamp(65px, 7vw, 105px) 0;

    overflow: hidden;
}


/* =========================================================
   IMAGE DÉGRADÉE EN ARRIÈRE-PLAN
   ========================================================= */

.clim-atouts__background {
    position: absolute;
    z-index: 0;
    inset: 0;

    display: block;

    width: 100%;
    height: 100%;

    margin: 0;

    pointer-events: none;
}

.clim-atouts__background img {
    display: block;

    width: 100%;
/*    height: 100%; */

    object-fit: fill;
}


/* =========================================================
   CONTAINER
   ========================================================= */

.clim-atouts .container {
    position: relative;
    z-index: 1;

    width: 100%;
}


/* =========================================================
   GRILLE PRINCIPALE
   ========================================================= */

.clim-atouts__grid {
    width: 100%;

    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));

    align-items: center;

    column-gap: clamp(30px, 3.5vw, 70px);
}


/* =========================================================
   ÉLÉMENTS DE LA GRILLE
   ========================================================= */

.clim-atouts__item {
    min-width: 0;

    display: grid;
    grid-template-columns: 67px minmax(0, 1fr);

    align-items: center;

    column-gap: clamp(18px, 1.7vw, 28px);
}


/* =========================================================
   PICTOGRAMMES
   ========================================================= */

.clim-atouts__icon {
    display: block;

    width: 67px;
    height: 67px;

    margin: 0;
}

.clim-atouts__icon img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: contain;
}


/* =========================================================
   TEXTES
   ========================================================= */

.clim-atouts__text {
    min-width: 0;

    margin: 0;

    color: #0f4254;

    font-size: clamp(20px, 1.65vw, 30px);
    font-weight: 700;
    font-style: italic;
    line-height: 1.12;

    overflow-wrap: normal;
}


/* =========================================================
   ORDINATEURS INTERMÉDIAIRES
   ========================================================= */

@media screen and (max-width: 1199px) {

    .clim-atouts {
        min-height: 250px;

        padding: 75px 0;
    }

    .clim-atouts__grid {
        column-gap: 28px;
    }

    .clim-atouts__item {
        grid-template-columns: 58px minmax(0, 1fr);

        column-gap: 15px;
    }

    .clim-atouts__icon {
        width: 58px;
        height: 58px;
    }

    .clim-atouts__text {
        font-size: clamp(17px, 1.8vw, 23px);
    }
}


/* =========================================================
   TABLETTES
   2 COLONNES
   ========================================================= */

@media screen and (max-width: 991px) {

    .clim-atouts {
        min-height: 430px;

        padding: 90px 0;
    }

    .clim-atouts__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));

        column-gap: 50px;
        row-gap: 50px;
    }

    .clim-atouts__item {
        width: 100%;
        max-width: 330px;

        grid-template-columns: 67px minmax(0, 1fr);

        justify-self: center;

        column-gap: 22px;
    }

    .clim-atouts__icon {
        width: 67px;
        height: 67px;
    }

    .clim-atouts__text {
        font-size: 23px;
    }
}


/* =========================================================
   MOBILES
   1 COLONNE
   ========================================================= */

@media screen and (max-width: 650px) {

    .clim-atouts {
        min-height: 620px;

        padding: 95px 0;
    }

    .clim-atouts__grid {
        grid-template-columns: minmax(0, 1fr);

        row-gap: 32px;
    }

    .clim-atouts__item {
        width: min(100%, 290px);
        max-width: none;

        grid-template-columns: 60px minmax(0, 1fr);

        justify-self: center;

        column-gap: 22px;
    }

    .clim-atouts__icon {
        width: 60px;
        height: 60px;
    }

    .clim-atouts__text {
        font-size: 21px;
        line-height: 1.15;
    }
}


/* =========================================================
   PETITS MOBILES
   ========================================================= */

@media screen and (max-width: 420px) {

    .clim-atouts {
        min-height: 590px;

        padding: 90px 0;
    }

    .clim-atouts__grid {
        row-gap: 28px;
    }

    .clim-atouts__item {
        width: min(100%, 265px);

        grid-template-columns: 55px minmax(0, 1fr);

        column-gap: 18px;
    }

    .clim-atouts__icon {
        width: 55px;
        height: 55px;
    }

    .clim-atouts__text {
        font-size: 19px;
    }
}





/* =========================================================
   SECTION POURQUOI INSTALLER UNE CLIMATISATION
   ========================================================= */

.clim-pourquoi {
    position: relative;

    width: 100%;

    padding:
            clamp(75px, 7vw, 125px)
            0
            clamp(80px, 7vw, 125px);

    background-color: #ffffff;

    overflow: hidden;
}


/* =========================================================
   GRILLE PRINCIPALE
   ========================================================= */

.clim-pourquoi__grid {
    width: 100%;

    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        minmax(0, 1fr);

    align-items: center;

    column-gap: clamp(60px, 7vw, 130px);
}


/* =========================================================
   COLONNE IMAGE
   ========================================================= */

.clim-pourquoi__media {
    position: relative;

    width: 100%;
    min-width: 0;

    display: grid;
    place-items: center;

    isolation: isolate;
}


/* =========================================================
   SVG EN ARRIÈRE-PLAN
   ========================================================= */

.clim-pourquoi__background-logo {
    position: absolute;
    z-index: 0;

    top: 50%;
    left: clamp(-220px, -12vw, -120px);

    display: block;

    width: clamp(460px, 39vw, 617px);
    height: auto;

    margin: 0;

    transform: translateY(-50%);

    pointer-events: none;
    user-select: none;
}

.clim-pourquoi__background-logo img {
    display: block;

    width: 100%;
    height: auto;

    object-fit: contain;
}


/* =========================================================
   IMAGE PRINCIPALE
   ========================================================= */

.clim-pourquoi__image {
    position: relative;
    z-index: 1;

    display: block;

    width: min(100%, 590px);

    margin: 0;
}

.clim-pourquoi__image img {
    display: block;

    width: 100%;
    max-width: 100%;
    height: auto;

    object-fit: contain;
}


/* =========================================================
   COLONNE TEXTE
   ========================================================= */

.clim-pourquoi__contenu {
    width: 100%;
    max-width: 650px;
    min-width: 0;

    justify-self: start;
}


/* =========================================================
   TITRE
   ========================================================= */

.clim-pourquoi__title {
    margin: 0;

    color: #123f51;

    font-size: clamp(34px, 3vw, 52px);
    font-weight: 400;
    line-height: 0.95;

    text-transform: uppercase;
}

.clim-pourquoi__title-bold {
    font-weight: 700;
}

.clim-pourquoi__title-light {
    font-weight: 300;
}

.clim-pourquoi__title-line {
    display: block;
}


/* =========================================================
   TRAIT DÉGRADÉ
   ========================================================= */

.clim-pourquoi__trait {
    display: block;

    width: clamp(160px, 14vw, 263px);
    height: auto;

    margin:
            clamp(25px, 2.5vw, 38px)
            0
            clamp(28px, 2.7vw, 42px);
}

.clim-pourquoi__trait img {
    display: block;

    width: 100%;
    height: auto;
}


/* =========================================================
   TEXTES
   ========================================================= */

.clim-pourquoi__texte {
    width: 100%;

    color: #365f70;
}

.clim-pourquoi__texte p {
    margin: 0;

    font-size: clamp(16px, 1.25vw, 21px);
    line-height: 1.35;
}

.clim-pourquoi__texte p + p {
    margin-top: clamp(22px, 2.2vw, 35px);
}

.clim-pourquoi__texte .pb {
    color: #123f51;
    font-weight: 700;
}

.clim-pourquoi__texte a {
    color: inherit;
    text-decoration: none;
}

.clim-pourquoi__texte a:hover,
.clim-pourquoi__texte a:focus-visible {
    text-decoration: underline;
}


/* =========================================================
   GRANDS ÉCRANS
   ========================================================= */

@media screen and (min-width: 1400px) {
    .clim-pourquoi__grid {
        column-gap: clamp(90px, 7vw, 145px);
    }

    .clim-pourquoi__image {
        width: min(100%, 610px);
    }

    .clim-pourquoi__contenu {
        max-width: 680px;
    }
}


/* =========================================================
   ÉCRANS INTERMÉDIAIRES
   ========================================================= */

@media screen and (max-width: 1199px) {
    .clim-pourquoi {
        padding:
                85px
                0
                90px;
    }

    .clim-pourquoi__grid {
        column-gap: 55px;
    }

    .clim-pourquoi__image {
        width: min(100%, 500px);
    }

    .clim-pourquoi__background-logo {
        left: -160px;

        width: 530px;
    }

    .clim-pourquoi__title {
        font-size: clamp(31px, 3.3vw, 44px);
    }

    .clim-pourquoi__texte p {
        font-size: clamp(15px, 1.5vw, 18px);
    }
}


/* =========================================================
   TABLETTES
   ========================================================= */

@media screen and (max-width: 991px) {
    .clim-pourquoi {
        padding:
                75px
                0
                80px;
    }

    .clim-pourquoi__grid {
        grid-template-columns: minmax(0, 1fr);

        row-gap: 65px;
    }

    .clim-pourquoi__media {
        width: 100%;
    }

    .clim-pourquoi__image {
        width: min(100%, 590px);
    }

    .clim-pourquoi__background-logo {
        top: 50%;
        left: 50%;

        width: min(90vw, 617px);

        transform: translate(-72%, -50%);
    }

    .clim-pourquoi__contenu {
        max-width: 720px;

        justify-self: center;
    }

    .clim-pourquoi__title {
        font-size: clamp(35px, 6vw, 49px);
    }

    .clim-pourquoi__texte p {
        font-size: 18px;
        line-height: 1.45;
    }
}


/* =========================================================
   MOBILES
   ========================================================= */

@media screen and (max-width: 767px) {
    .clim-pourquoi {
        padding:
                60px
                0
                65px;
    }

    .clim-pourquoi__grid {
        row-gap: 45px;
    }

    .clim-pourquoi__image {
        width: min(100%, 520px);
    }

    .clim-pourquoi__background-logo {
        width: min(105vw, 540px);

        transform: translate(-68%, -50%);
    }

    .clim-pourquoi__title {
        font-size: clamp(29px, 8.5vw, 42px);
        line-height: 1;
    }

    .clim-pourquoi__title-bold,
    .clim-pourquoi__title-light {
        display: block;
    }

    .clim-pourquoi__trait {
        width: clamp(145px, 38vw, 200px);

        margin:
                24px
                0
                29px;
    }

    .clim-pourquoi__texte p {
        font-size: 16px;
        line-height: 1.5;
    }

    .clim-pourquoi__texte p + p {
        margin-top: 22px;
    }
}


/* =========================================================
   PETITS MOBILES
   ========================================================= */

@media screen and (max-width: 480px) {
    .clim-pourquoi {
        padding:
                50px
                0
                55px;
    }

    .clim-pourquoi__grid {
        row-gap: 38px;
    }

    .clim-pourquoi__background-logo {
        width: 440px;

        transform: translate(-66%, -50%);
    }

    .clim-pourquoi__title {
        font-size: clamp(27px, 9.5vw, 37px);
    }

    .clim-pourquoi__trait {
        width: 145px;

        margin:
                22px
                0
                27px;
    }
}


/* =========================================================
   SECTION POMPE À CHALEUR
   ========================================================= */

.clim-pompe {
    position: relative;

    width: 100%;

    padding:
            clamp(75px, 7vw, 125px)
            0
            clamp(80px, 7vw, 125px);

    background-color: #ffffff;

    overflow: hidden;
}


/* =========================================================
   GRILLE PRINCIPALE
   ========================================================= */

.clim-pompe__grid {
    width: 100%;

    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        minmax(0, 1fr);

    align-items: center;

    column-gap: clamp(70px, 8vw, 145px);
}


/* =========================================================
   COLONNE TEXTE
   ========================================================= */

.clim-pompe__contenu {
    width: 100%;
    max-width: 650px;
    min-width: 0;

    justify-self: end;
}


/* =========================================================
   TITRE
   ========================================================= */

.clim-pompe__title {
    margin: 0;

    color: #123f51;

    font-size: clamp(34px, 3vw, 52px);
    font-weight: 400;
    line-height: 1;

    text-transform: uppercase;
}

.clim-pompe__title-bold {
    font-weight: 700;
}

.clim-pompe__title-light {
    font-weight: 300;
}


/* =========================================================
   TRAIT DÉGRADÉ SOUS LE TITRE
   ========================================================= */

.clim-pompe__trait {
    display: block;

    width: clamp(160px, 14vw, 263px);
    height: auto;

    margin:
            clamp(25px, 2.5vw, 38px)
            0
            clamp(32px, 3vw, 50px);
}

.clim-pompe__trait img {
    display: block;

    width: 100%;
    height: auto;
}


/* =========================================================
   CONTENU TEXTE
   ========================================================= */

.clim-pompe__texte {
    width: 100%;

    color: #365f70;
}

.clim-pompe__texte p {
    margin: 0;

    line-height: 1.35;
}

.clim-pompe__texte p + p {
    margin-top: clamp(20px, 2vw, 31px);
}


/* Introduction en grandes capitales */

.clim-pompe__introduction {
    color: #174c61;

    font-size: clamp(20px, 1.65vw, 29px);
    font-weight: 400;
    line-height: 1.4;

    text-transform: uppercase;
}


/* Phrase principale en gras */

.clim-pompe__accroche {
    color: #123f51;

    font-size: clamp(17px, 1.3vw, 22px);
    font-weight: 700;
    line-height: 1.25;

    text-transform: uppercase;
}


/* Paragraphes standards */

.clim-pompe__texte .font22 {
    color: #466c7b;

    font-size: clamp(16px, 1.2vw, 21px);
    font-weight: 400;
    line-height: 1.35;
}

.clim-pompe__texte .pb {
    color: #123f51;
    font-weight: 700;
}


/* =========================================================
   COLONNE IMAGE
   ========================================================= */

.clim-pompe__media {
    position: relative;

    width: 100%;
    min-width: 0;
    min-height: clamp(350px, 35vw, 575px);

    display: grid;
    place-items: center;

    isolation: isolate;
}


/* =========================================================
   SVG DÉCORATIF EN ARRIÈRE-PLAN
   ========================================================= */

.clim-pompe__background {
    position: absolute;
    z-index: 0;

    top: 50%;
    right: clamp(-230px, -13vw, -105px);

    display: block;

    width: clamp(470px, 39vw, 583px);
    height: auto;

    margin: 0;

    transform: translateY(-50%);

    pointer-events: none;
    user-select: none;
}

.clim-pompe__background img {
    display: block;

    width: 100%;
    height: auto;

    object-fit: contain;
}


/* =========================================================
   IMAGE PRINCIPALE
   ========================================================= */

.clim-pompe__image {
    position: relative;
    z-index: 1;

    display: block;

    width: min(100%, 590px);

    margin: 0;
}

.clim-pompe__image img {
    display: block;

    width: 100%;
    max-width: 100%;
    height: auto;

    object-fit: contain;
}


/* =========================================================
   TRÈS GRANDS ÉCRANS
   ========================================================= */

@media screen and (min-width: 1400px) {

    .clim-pompe__grid {
        column-gap: clamp(100px, 8vw, 155px);
    }

    .clim-pompe__contenu {
        max-width: 680px;
    }

    .clim-pompe__image {
        width: min(100%, 620px);
    }
}


/* =========================================================
   ÉCRANS INTERMÉDIAIRES
   ========================================================= */

@media screen and (max-width: 1199px) {

    .clim-pompe {
        padding:
                85px
                0
                90px;
    }

    .clim-pompe__grid {
        column-gap: 55px;
    }

    .clim-pompe__contenu {
        max-width: 540px;
    }

    .clim-pompe__media {
        min-height: 430px;
    }

    .clim-pompe__image {
        width: min(100%, 510px);
    }

    .clim-pompe__background {
        right: -180px;

        width: 520px;
    }

    .clim-pompe__title {
        font-size: clamp(31px, 3.4vw, 44px);
    }

    .clim-pompe__introduction {
        font-size: clamp(18px, 1.9vw, 24px);
    }

    .clim-pompe__accroche {
        font-size: clamp(16px, 1.6vw, 19px);
    }

    .clim-pompe__texte .font22 {
        font-size: clamp(15px, 1.5vw, 18px);
    }
}


/* =========================================================
   TABLETTES
   PASSAGE SUR UNE SEULE COLONNE
   ========================================================= */

@media screen and (max-width: 991px) {

    .clim-pompe {
        padding:
                75px
                0
                80px;
    }

    .clim-pompe__grid {
        grid-template-columns: minmax(0, 1fr);

        row-gap: 65px;
    }

    .clim-pompe__contenu {
        max-width: 720px;

        justify-self: center;
    }

    .clim-pompe__media {
        min-height: auto;
    }

    .clim-pompe__image {
        width: min(100%, 620px);
    }

    .clim-pompe__background {
        top: 50%;
        right: 50%;

        width: min(90vw, 583px);

        transform: translate(74%, -50%);
    }

    .clim-pompe__title {
        font-size: clamp(35px, 6vw, 49px);
    }

    .clim-pompe__introduction {
        font-size: 23px;
    }

    .clim-pompe__accroche {
        font-size: 19px;
    }

    .clim-pompe__texte .font22 {
        font-size: 18px;
        line-height: 1.45;
    }
}


/* =========================================================
   MOBILES
   ========================================================= */

@media screen and (max-width: 767px) {

    .clim-pompe {
        padding:
                60px
                0
                65px;
    }

    .clim-pompe__grid {
        row-gap: 45px;
    }

    .clim-pompe__title {
        font-size: clamp(29px, 8.5vw, 42px);
    }

    .clim-pompe__title-bold,
    .clim-pompe__title-light {
        display: block;
    }

    .clim-pompe__trait {
        width: clamp(145px, 38vw, 200px);

        margin:
                24px
                0
                31px;
    }

    .clim-pompe__introduction {
        font-size: 19px;
        line-height: 1.4;
    }

    .clim-pompe__accroche {
        font-size: 16px;
        line-height: 1.35;
    }

    .clim-pompe__texte .font22 {
        font-size: 16px;
        line-height: 1.5;
    }

    .clim-pompe__texte p + p {
        margin-top: 22px;
    }

    .clim-pompe__image {
        width: min(100%, 540px);
    }

    .clim-pompe__background {
        width: min(105vw, 530px);

        transform: translate(70%, -50%);
    }
}


/* =========================================================
   PETITS MOBILES
   ========================================================= */

@media screen and (max-width: 480px) {

    .clim-pompe {
        padding:
                50px
                0
                55px;
    }

    .clim-pompe__grid {
        row-gap: 35px;
    }

    .clim-pompe__title {
        font-size: clamp(27px, 9.5vw, 37px);
    }

    .clim-pompe__trait {
        width: 145px;

        margin:
                22px
                0
                27px;
    }

    .clim-pompe__introduction {
        font-size: 17px;
    }

    .clim-pompe__accroche {
        font-size: 15px;
    }

    .clim-pompe__background {
        right: 50%;

        width: 440px;

        transform: translate(70%, -50%);
    }
}

/* =========================================================
   SECTION NOTRE PHILOSOPHIE DE TRAVAIL
   ========================================================= */

.clim-philosophie {
    position: relative;

    width: 100%;

    padding:
            clamp(75px, 7vw, 125px)
            0
            clamp(80px, 7vw, 125px);

    background-color: #ffffff;

    overflow: hidden;
}


/* =========================================================
   GRILLE PRINCIPALE
   ========================================================= */

.clim-philosophie__grid {
    width: 100%;

    display: grid;
    grid-template-columns:
        minmax(0, 0.95fr)
        minmax(0, 1.05fr);

    align-items: center;

    column-gap: clamp(70px, 8vw, 145px);
}


/* =========================================================
   COLONNE IMAGE
   ========================================================= */

.clim-philosophie__media {
    position: relative;

    width: 100%;
    min-width: 0;

    display: grid;
    place-items: center;
}


/* =========================================================
   IMAGE PRINCIPALE
   L’INCLINAISON ET LE TRAIT SONT DÉJÀ DANS L’IMAGE
   ========================================================= */

.clim-philosophie__image {
    display: block;

    width: min(100%, 590px);

    margin: 0;
}

.clim-philosophie__image img {
    display: block;

    width: 100%;
    max-width: 100%;
    height: auto;

    object-fit: contain;
}


/* =========================================================
   COLONNE TEXTE
   ========================================================= */

.clim-philosophie__contenu {
    width: 100%;
    max-width: 650px;
    min-width: 0;

    justify-self: start;
}


/* =========================================================
   TITRE
   ========================================================= */

.clim-philosophie__title {
    margin: 0;

    color: #123f51;

    font-size: clamp(34px, 3vw, 52px);
    font-weight: 400;
    line-height: 0.95;

    text-transform: uppercase;
}

.clim-philosophie__title-bold {
    font-weight: 700;
}

.clim-philosophie__title-light {
    font-weight: 300;
}

.clim-philosophie__title-line {
    display: block;

    font-weight: 300;
}


/* =========================================================
   TRAIT DÉGRADÉ SOUS LE TITRE
   ========================================================= */

.clim-philosophie__trait {
    display: block;

    width: clamp(160px, 14vw, 263px);
    height: auto;

    margin:
            clamp(25px, 2.5vw, 38px)
            0
            clamp(29px, 2.8vw, 43px);
}

.clim-philosophie__trait img {
    display: block;

    width: 100%;
    height: auto;
}


/* =========================================================
   PARAGRAPHES
   ========================================================= */

.clim-philosophie__texte {
    width: 100%;

    color: #466c7b;
}

.clim-philosophie__texte p {
    margin: 0;

    font-size: clamp(16px, 1.2vw, 21px);
    font-weight: 400;
    line-height: 1.35;
}

.clim-philosophie__texte p + p {
    margin-top: clamp(22px, 2.2vw, 35px);
}

.clim-philosophie__texte a {
    color: inherit;

    text-decoration: none;
}

.clim-philosophie__texte a:hover,
.clim-philosophie__texte a:focus-visible {
    text-decoration: underline;
}


/* =========================================================
   TRÈS GRANDS ÉCRANS
   ========================================================= */

@media screen and (min-width: 1400px) {

    .clim-philosophie__grid {
        column-gap: clamp(100px, 8vw, 155px);
    }

    .clim-philosophie__image {
        width: min(100%, 610px);
    }

    .clim-philosophie__contenu {
        max-width: 680px;
    }
}


/* =========================================================
   ÉCRANS INTERMÉDIAIRES
   ========================================================= */

@media screen and (max-width: 1199px) {

    .clim-philosophie {
        padding:
                85px
                0
                90px;
    }

    .clim-philosophie__grid {
        column-gap: 55px;
    }

    .clim-philosophie__image {
        width: min(100%, 500px);
    }

    .clim-philosophie__contenu {
        max-width: 550px;
    }

    .clim-philosophie__title {
        font-size: clamp(31px, 3.4vw, 44px);
    }

    .clim-philosophie__texte p {
        font-size: clamp(15px, 1.5vw, 18px);
    }
}


/* =========================================================
   TABLETTES
   PASSAGE SUR UNE COLONNE
   ========================================================= */

@media screen and (max-width: 991px) {

    .clim-philosophie {
        padding:
                75px
                0
                80px;
    }

    .clim-philosophie__grid {
        grid-template-columns: minmax(0, 1fr);

        row-gap: 60px;
    }

    /*
     * Sur tablette, le texte passe avant l’image pour que
     * le titre soit immédiatement visible.
     */

    .clim-philosophie__contenu {
        order: 1;

        max-width: 720px;

        justify-self: center;
    }

    .clim-philosophie__media {
        order: 2;
    }

    .clim-philosophie__image {
        width: min(100%, 620px);
    }

    .clim-philosophie__title {
        font-size: clamp(35px, 6vw, 49px);
    }

    .clim-philosophie__texte p {
        font-size: 18px;
        line-height: 1.45;
    }
}


/* =========================================================
   MOBILES
   ========================================================= */

@media screen and (max-width: 767px) {

    .clim-philosophie {
        padding:
                60px
                0
                65px;
    }

    .clim-philosophie__grid {
        row-gap: 45px;
    }

    .clim-philosophie__title {
        font-size: clamp(29px, 8.5vw, 42px);
        line-height: 1;
    }

    .clim-philosophie__title-bold,
    .clim-philosophie__title-light {
        display: block;
    }

    .clim-philosophie__trait {
        width: clamp(145px, 38vw, 200px);

        margin:
                24px
                0
                30px;
    }

    .clim-philosophie__texte p {
        font-size: 16px;
        line-height: 1.5;
    }

    .clim-philosophie__texte p + p {
        margin-top: 22px;
    }

    .clim-philosophie__image {
        width: min(100%, 540px);
    }
}


/* =========================================================
   PETITS MOBILES
   ========================================================= */

@media screen and (max-width: 480px) {

    .clim-philosophie {
        padding:
                50px
                0
                55px;
    }

    .clim-philosophie__grid {
        row-gap: 35px;
    }

    .clim-philosophie__title {
        font-size: clamp(27px, 9.5vw, 37px);
    }

    .clim-philosophie__trait {
        width: 145px;

        margin:
                22px
                0
                27px;
    }

    .clim-philosophie__texte p {
        font-size: 15px;
    }
}

/* =========================================================
   SECTION DES EXPERTS À VOTRE SERVICE
   ========================================================= */

.clim-experts {
    position: relative;

    width: 100%;

    padding:
            clamp(70px, 7vw, 120px)
            0
            clamp(75px, 7vw, 120px);

    background-color: #ffffff;

    overflow: hidden;
}


/* =========================================================
   GRILLE PRINCIPALE
   ========================================================= */

.clim-experts__grid {
    width: 100%;

    display: grid;
    grid-template-columns: minmax(0, 1fr);

    justify-items: center;
}


/* =========================================================
   BLOC CONTENU
   ========================================================= */

.clim-experts__contenu {
    width: 100%;
    max-width: 900px;

    display: grid;
    justify-items: center;

    text-align: center;
}


/* =========================================================
   TITRE
   ========================================================= */

.clim-experts__title {
    margin: 0;

    color: #123f51;

    font-size: clamp(34px, 3vw, 52px);
    font-weight: 400;
    line-height: 1;

    text-transform: uppercase;
}

.clim-experts__title-bold {
    font-weight: 700;
}

.clim-experts__title-light {
    font-weight: 300;
}


/* =========================================================
   TRAIT DÉGRADÉ
   ========================================================= */

.clim-experts__trait {
    display: block;

    width: clamp(160px, 14vw, 263px);
    height: auto;

    margin:
            clamp(22px, 2.4vw, 34px)
            auto
            clamp(34px, 3.2vw, 52px);
}

.clim-experts__trait img {
    display: block;

    width: 100%;
    height: auto;
}


/* =========================================================
   TEXTE
   ========================================================= */

.clim-experts__texte {
    width: 100%;
    max-width: 820px;

    color: #466c7b;
}

.clim-experts__texte p {
    margin: 0;

    font-size: clamp(16px, 1.2vw, 21px);
    font-weight: 400;
    line-height: 1.4;
}

.clim-experts__texte p + p {
    margin-top: clamp(20px, 2.1vw, 32px);
}

.clim-experts__texte .pb {
    color: #123f51;
    font-weight: 700;
}


/* =========================================================
   TRÈS GRANDS ÉCRANS
   ========================================================= */

@media screen and (min-width: 1400px) {
    .clim-experts__contenu {
        max-width: 940px;
    }

    .clim-experts__texte {
        max-width: 860px;
    }
}


/* =========================================================
   ÉCRANS INTERMÉDIAIRES
   ========================================================= */

@media screen and (max-width: 1199px) {
    .clim-experts {
        padding:
                85px
                0
                90px;
    }

    .clim-experts__contenu {
        max-width: 820px;
    }

    .clim-experts__texte {
        max-width: 760px;
    }

    .clim-experts__title {
        font-size: clamp(31px, 3.4vw, 44px);
    }

    .clim-experts__texte p {
        font-size: clamp(15px, 1.5vw, 18px);
    }
}


/* =========================================================
   TABLETTES
   ========================================================= */

@media screen and (max-width: 991px) {
    .clim-experts {
        padding:
                75px
                0
                80px;
    }

    .clim-experts__contenu {
        max-width: 720px;
    }

    .clim-experts__texte {
        max-width: 680px;
    }

    .clim-experts__title {
        font-size: clamp(35px, 6vw, 49px);
    }

    .clim-experts__texte p {
        font-size: 18px;
        line-height: 1.45;
    }
}


/* =========================================================
   MOBILES
   ========================================================= */

@media screen and (max-width: 767px) {
    .clim-experts {
        padding:
                60px
                0
                65px;
    }

    .clim-experts__contenu {
        max-width: 100%;
    }

    .clim-experts__title {
        font-size: clamp(29px, 8.5vw, 42px);
        line-height: 1.05;
    }

    .clim-experts__title-bold,
    .clim-experts__title-light {
        display: block;
    }

    .clim-experts__trait {
        width: clamp(145px, 38vw, 200px);

        margin:
                22px
                auto
                28px;
    }

    .clim-experts__texte {
        max-width: 100%;
    }

    .clim-experts__texte p {
        font-size: 16px;
        line-height: 1.5;
    }

    .clim-experts__texte p + p {
        margin-top: 22px;
    }
}


/* =========================================================
   PETITS MOBILES
   ========================================================= */

@media screen and (max-width: 480px) {
    .clim-experts {
        padding:
                50px
                0
                55px;
    }

    .clim-experts__title {
        font-size: clamp(27px, 9.5vw, 37px);
    }

    .clim-experts__trait {
        width: 145px;

        margin:
                20px
                auto
                26px;
    }

    .clim-experts__texte p {
        font-size: 15px;
    }
}









/*@todo dd*/

/* =========================================================
   SECTION ENGAGEMENTS ET RÉSEAUX SOCIAUX
   ========================================================= */

.clim-engagements {
    --clim-engagements-blue: #0d4358;
    --clim-engagements-yellow: #ffd500;

    position: relative;

    width: 100%;

    background-color: #ffffff;
}


/* =========================================================
   CONTAINER
   ========================================================= */

.clim-engagements__container {
    position: relative;

    width: min(calc(100% - 40px), 1200px);

    margin-inline: auto;
}


/* =========================================================
   PARTIE BLANCHE
   ========================================================= */

.clim-engagements__top {
    position: relative;
    z-index: 2;

    width: 100%;

    padding-top: clamp(25px, 3vw, 50px);

    background-color: #ffffff;
}


/* =========================================================
   GRILLE PRINCIPALE
   ========================================================= */

.clim-engagements__grid {
    width: 100%;

    display: grid;
    grid-template-columns:
        minmax(360px, 0.95fr)
        minmax(0, 1.05fr);

    align-items: center;

    column-gap: clamp(55px, 7vw, 120px);
}


/* =========================================================
   COLONNE DU PERSONNAGE
   ========================================================= */

.clim-engagements__visual {
    position: relative;

    width: 100%;
    min-width: 0;

    /*
     * La hauteur maximale correspond à l’image affichée
     * en 407 × 553 px dans la maquette.
     */
    min-height: clamp(470px, 38.4vw, 553px);

    display: grid;
    align-items: end;
    justify-items: center;

    overflow: visible;
}


/* =========================================================
   IMAGE DU PERSONNAGE
   ========================================================= */

.clim-engagements__personnage {
    position: relative;
    z-index: 2;

    display: block;

    /*
     * Ratio original :
     * 814 / 1106 = environ 0,736
     */
    width: clamp(345px, 28.3vw, 407px);
    max-width: 100%;
    aspect-ratio: 814 / 1106;

    margin: 0;

    align-self: end;

    overflow: visible;
}

.clim-engagements__personnage img {
    display: block;

    width: 100%;
    max-width: 100%;
    height: auto;

    aspect-ratio: 814 / 1106;

    object-fit: contain;
    object-position: center bottom;
}


/* =========================================================
   BOUTON DEVIS
   ========================================================= */

.clim-engagements__button {
    position: absolute;
    z-index: 4;

    top: 53%;
    left: 0;

    display: inline-grid;
    grid-template-columns: auto 22px;

    align-items: center;

    column-gap: 10px;

    min-height: 45px;

    padding: 9px 13px 9px 20px;

    color: var(--clim-engagements-blue);
    background-color: var(--clim-engagements-yellow);

    border: 2px solid var(--clim-engagements-yellow);
    border-radius: 999px;

    font-size: clamp(14px, 1vw, 17px);
    font-weight: 700;
    line-height: 1;

    text-decoration: none;

    transition:
            color 180ms ease,
            background-color 180ms ease,
            border-color 180ms ease,
            transform 180ms ease;
}

.clim-engagements__button-arrow {
    display: grid;
    place-items: center;

    width: 22px;
    height: 22px;

    font-size: 20px;
    line-height: 1;
}

.clim-engagements__button:hover,
.clim-engagements__button:focus-visible {
    color: #ffffff;
    background-color: var(--clim-engagements-blue);
    border-color: var(--clim-engagements-blue);

    transform: translateY(-2px);
}

.clim-engagements__button:focus-visible {
    outline: 3px solid rgba(13, 67, 88, 0.25);
    outline-offset: 4px;
}


/* =========================================================
   COLONNE DE LA LISTE
   ========================================================= */

.clim-engagements__liste-zone {
    position: relative;
    z-index: 3;

    width: 100%;
    min-width: 0;

    padding-bottom: clamp(55px, 5vw, 80px);
}


/* =========================================================
   LISTE
   ========================================================= */

.clim-engagements__liste {
    width: 100%;

    display: grid;
    grid-template-columns: minmax(0, 1fr);

    row-gap: clamp(20px, 1.7vw, 29px);

    margin: 0;
    padding: 0;

    list-style: none;
}


/* =========================================================
   ÉLÉMENTS DE LA LISTE
   ========================================================= */

.clim-engagements__item {
    min-width: 0;

    display: grid;
    grid-template-columns: 26px minmax(0, 1fr);

    align-items: center;

    column-gap: clamp(19px, 1.8vw, 27px);

    color: var(--clim-engagements-blue);

    font-size: clamp(17px, 1.35vw, 22px);
    font-weight: 500;
    line-height: 1.25;
}


/* =========================================================
   CHECKS JAUNES
   ========================================================= */

.clim-engagements__check {
    display: block;

    width: 25px;
    height: 20px;

    margin: 0;
}

.clim-engagements__check img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: contain;
}


/* =========================================================
   PARTIE JAUNE
   ========================================================= */

.clim-engagements__social {
    position: relative;
    z-index: 1;

    width: 100%;

    /*
     * Petit chevauchement uniquement.
     * L’ancienne valeur faisait remonter beaucoup trop
     * le jaune devant le personnage.
     */
    margin-top: -18px;

    padding:
            clamp(105px, 8vw, 145px)
            0
            clamp(55px, 5vw, 85px);

    background-color: var(--clim-engagements-yellow);
}


/* =========================================================
   PENTE JAUNE
   ========================================================= */

.clim-engagements__social::before {
    content: "";

    position: absolute;
    z-index: -1;

    right: 0;
    bottom: calc(100% - 1px);
    left: 0;

    width: 100%;
    height: clamp(42px, 4.5vw, 70px);

    background-color: var(--clim-engagements-yellow);

    clip-path: polygon(
            0 0,
            100% 62%,
            100% 100%,
            0 100%
    );

    pointer-events: none;
}


/* =========================================================
   CONTENU DES RÉSEAUX SOCIAUX
   ========================================================= */

.clim-engagements__social-content {
    width: 100%;
    max-width: 720px;

    display: grid;
    grid-template-columns: minmax(0, 1fr);

    justify-items: center;

    margin-inline: auto;

    text-align: center;
}


/* =========================================================
   TITRE DES RÉSEAUX SOCIAUX
   ========================================================= */

.clim-engagements__social-title {
    margin: 0;

    color: var(--clim-engagements-blue);

    font-size: clamp(32px, 3vw, 52px);
    font-weight: 400;
    line-height: 1;

    text-transform: uppercase;
}

.clim-engagements__social-title-bold {
    font-weight: 700;
}

.clim-engagements__social-title-light {
    font-weight: 300;
}


/* =========================================================
   TRAIT SOUS LE TITRE
   ========================================================= */

.clim-engagements__trait {
    display: block;

    width: clamp(145px, 13vw, 240px);
    height: auto;

    margin:
            clamp(20px, 2vw, 30px)
            auto
            clamp(27px, 2.7vw, 42px);
}

.clim-engagements__trait img {
    display: block;

    width: 100%;
    height: auto;
}


/* =========================================================
   TEXTE DES RÉSEAUX
   ========================================================= */

.clim-engagements__social-text {
    width: 100%;
    max-width: 530px;

    margin: 0;

    color: var(--clim-engagements-blue);

    font-size: clamp(16px, 1.2vw, 20px);
    font-weight: 400;
    line-height: 1.35;
}


/* =========================================================
   LIENS DES RÉSEAUX SOCIAUX
   ========================================================= */

.clim-engagements__social-links {
    display: grid;
    grid-template-columns: repeat(3, 28px);

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

    column-gap: 15px;

    margin-top: clamp(25px, 2.5vw, 38px);
}

.clim-engagements__social-link {
    display: grid;
    place-items: center;

    width: 32px;
    height: 32px;

    color: var(--clim-engagements-blue);

    border-radius: 50%;

    text-decoration: none;

    transition:
            color 180ms ease,
            background-color 180ms ease,
            transform 180ms ease;
}

.clim-engagements__social-link svg {
    display: block;

    width: 23px;
    height: 23px;

    fill: currentColor;
}



/* =========================================================
   ÉCRANS INTERMÉDIAIRES
   ========================================================= */

@media screen and (max-width: 1199px) {
    .clim-engagements__container {
        width: min(calc(100% - 40px), 1040px);
    }

    .clim-engagements__grid {
        grid-template-columns:
            minmax(320px, 0.9fr)
            minmax(0, 1.1fr);

        column-gap: 45px;
    }

    .clim-engagements__visual {
        min-height: 500px;
    }

    .clim-engagements__personnage {
        width: min(100%, 368px);
    }

    .clim-engagements__button {
        left: 0;
    }

    .clim-engagements__liste-zone {
        padding-bottom: 65px;
    }

    .clim-engagements__item {
        column-gap: 17px;

        font-size: clamp(16px, 1.55vw, 19px);
    }
}


/* =========================================================
   PETITS ORDINATEURS
   ========================================================= */

@media screen and (max-width: 991px) {
    .clim-engagements__grid {
        grid-template-columns:
            minmax(285px, 0.85fr)
            minmax(0, 1.15fr);

        column-gap: 30px;
    }

    .clim-engagements__visual {
        min-height: 440px;
    }

    .clim-engagements__personnage {
        width: min(100%, 324px);
    }

    .clim-engagements__button {
        top: 55%;

        min-height: 40px;

        padding: 8px 11px 8px 15px;

        font-size: 13px;
    }

    .clim-engagements__liste {
        row-gap: 17px;
    }

    .clim-engagements__item {
        grid-template-columns: 23px minmax(0, 1fr);

        column-gap: 14px;

        font-size: 16px;
    }

    .clim-engagements__check {
        width: 22px;
        height: auto;
    }
}


/* =========================================================
   TABLETTES
   ========================================================= */

@media screen and (max-width: 800px) {
    .clim-engagements__top {
        padding-top: 40px;
    }

    .clim-engagements__grid {
        grid-template-columns: minmax(0, 1fr);

        row-gap: 45px;
    }

    .clim-engagements__visual {
        min-height: auto;

        display: grid;
        justify-items: center;
    }

    .clim-engagements__personnage {
        width: min(100%, 370px);
    }

    .clim-engagements__button {
        top: 55%;
        left: max(0px, calc(50% - 275px));
    }

    .clim-engagements__liste-zone {
        width: min(100%, 620px);

        justify-self: center;

        padding-bottom: 70px;
    }

    .clim-engagements__item {
        grid-template-columns: 25px minmax(0, 1fr);

        column-gap: 20px;

        font-size: 18px;
    }

    .clim-engagements__check {
        width: 25px;
        height: 20px;
    }

    .clim-engagements__social {
        margin-top: 0;

        padding:
                100px
                0
                70px;
    }

    .clim-engagements__social::before {
        height: 50px;
    }
}


/* =========================================================
   MOBILES
   ========================================================= */

@media screen and (max-width: 650px) {
    .clim-engagements__container {
        width: min(calc(100% - 32px), 540px);
    }

    .clim-engagements__grid {
        row-gap: 38px;
    }

    .clim-engagements__visual {
        grid-template-columns: minmax(0, 1fr);

        row-gap: 20px;
    }

    .clim-engagements__personnage {
        width: min(88%, 325px);
    }

    .clim-engagements__button {
        position: relative;

        top: auto;
        left: auto;

        margin-top: -35px;
    }

    .clim-engagements__liste-zone {
        padding-bottom: 65px;
    }

    .clim-engagements__liste {
        row-gap: 17px;
    }

    .clim-engagements__item {
        grid-template-columns: 23px minmax(0, 1fr);

        align-items: start;

        column-gap: 15px;

        font-size: 16px;
        line-height: 1.35;
    }

    .clim-engagements__check {
        width: 22px;
        height: auto;

        margin-top: 2px;
    }

    .clim-engagements__social-title {
        font-size: clamp(29px, 8vw, 40px);
        line-height: 1.05;
    }

    .clim-engagements__social-title-bold,
    .clim-engagements__social-title-light {
        display: block;
    }

    .clim-engagements__trait {
        width: clamp(145px, 40vw, 190px);

        margin:
                22px
                auto
                27px;
    }

    .clim-engagements__social-text {
        max-width: 450px;

        font-size: 16px;
        line-height: 1.45;
    }
}


/* =========================================================
   PETITS MOBILES
   ========================================================= */

@media screen and (max-width: 420px) {
    .clim-engagements__container {
        width: calc(100% - 24px);
    }

    .clim-engagements__top {
        padding-top: 30px;
    }

    .clim-engagements__personnage {
        width: min(92%, 290px);
    }

    .clim-engagements__button {
        min-height: 40px;

        padding: 8px 11px 8px 15px;

        font-size: 13px;
    }

    .clim-engagements__liste-zone {
        padding-bottom: 55px;
    }

    .clim-engagements__item {
        grid-template-columns: 21px minmax(0, 1fr);

        column-gap: 12px;

        font-size: 15px;
    }

    .clim-engagements__check {
        width: 20px;
    }

    .clim-engagements__social {
        padding:
                90px
                0
                52px;
    }

    .clim-engagements__social::before {
        height: 40px;
    }

    .clim-engagements__social-title {
        font-size: clamp(27px, 8.7vw, 35px);
    }

    .clim-engagements__trait {
        width: 145px;

        margin:
                20px
                auto
                25px;
    }

    .clim-engagements__social-text {
        font-size: 15px;
    }
}


/* =========================================================
   RÉDUCTION DES ANIMATIONS
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
    .clim-engagements__button,
    .clim-engagements__social-link {
        transition: none;
    }
}

/* =========================================================
   SECTION BRAISE & CONFORT
   ========================================================= */

.clim-braise {
    --clim-braise-white: #ffffff;
    --clim-braise-dark: #151515;
    --clim-braise-red: #e30613;

    position: relative;
    isolation: isolate;

    width: 100%;
    min-height: clamp(430px, 43vw, 620px);

    display: grid;
    align-items: center;

    background-color: #17100d;

    border-top: 3px solid #ffd500;

    overflow: hidden;
}


/* =========================================================
   IMAGE DE FOND
   ========================================================= */

.clim-braise__background {
    position: absolute;
    z-index: -2;
    inset: 0;

    display: block;

    width: 100%;
    height: 100%;

    margin: 0;

    pointer-events: none;
    user-select: none;
}

.clim-braise__background img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center center;
}


/* =========================================================
   LÉGER VOILE POUR AMÉLIORER LA LISIBILITÉ
   ========================================================= */

.clim-braise::after {
    content: "";

    position: absolute;
    z-index: -1;
    inset: 0;

    background:
            linear-gradient(
                    90deg,
                    rgba(0, 0, 0, 0.08) 0%,
                    rgba(0, 0, 0, 0.02) 35%,
                    rgba(0, 0, 0, 0.08) 100%
            );

    pointer-events: none;
}


/* =========================================================
   CONTAINER
   ========================================================= */

.clim-braise .container {
    position: relative;

    width: 100%;
}


/* =========================================================
   GRILLE PRINCIPALE
   ========================================================= */

.clim-braise__grid {
    width: 100%;
    min-height: clamp(430px, 43vw, 620px);

    display: grid;
    grid-template-columns:
        minmax(200px, 0.72fr)
        minmax(0, 1.28fr);

    align-items: center;

    padding:
            clamp(38px, 4vw, 65px)
            0;
}


/* =========================================================
   BLOC DE CONTENU
   ========================================================= */

.clim-braise__contenu {
    grid-column: 2;

    width: min(100%, 690px);

    display: grid;
    grid-template-columns: minmax(0, 1fr);

    justify-items: center;

    text-align: center;
}


/* =========================================================
   TITRE
   ========================================================= */

.clim-braise__title {
    max-width: 690px;

    margin: 0;

    color: var(--clim-braise-white);

    font-size: clamp(28px, 2.65vw, 48px);
    font-weight: 400;
    line-height: 0.98;

    text-transform: uppercase;

    text-wrap: balance;
}

.clim-braise__title-bold {
    font-weight: 800;
    font-style: normal;
}

.clim-braise__title-light {
    font-weight: 300;
    font-style: italic;
}

.clim-braise__title-line {
    display: block;
}


/* =========================================================
   TRAIT DÉGRADÉ
   ========================================================= */

.clim-braise__trait {
    display: block;

    width: clamp(145px, 12vw, 230px);
    height: auto;

    margin:
            clamp(20px, 2vw, 30px)
            auto
            clamp(18px, 1.8vw, 27px);
}

.clim-braise__trait img {
    display: block;

    width: 100%;
    height: auto;
}


/* =========================================================
   TEXTE D’INTRODUCTION
   ========================================================= */

.clim-braise__introduction {
    margin: 0 0 clamp(8px, 1vw, 14px);

    color: var(--clim-braise-white);

    font-size: clamp(16px, 1.45vw, 23px);
    font-weight: 400;
    line-height: 1.3;
}


/* =========================================================
   LOGO BRAISE & CONFORT
   Le logo et les pictogrammes sont déjà dans le SVG
   ========================================================= */

.clim-braise__logo {
    display: block;

    width: clamp(270px, 27vw, 405px);
    max-width: 100%;
    height: auto;

    margin: 0;
}

.clim-braise__logo img {
    display: block;

    width: 100%;
    height: auto;

    object-fit: contain;
}


/* =========================================================
   BOUTON
   ========================================================= */

.clim-braise__button {
    display: inline-grid;
    grid-template-columns: auto 20px;

    align-items: center;

    column-gap: 10px;

    min-height: 43px;

    margin-top: clamp(17px, 1.7vw, 27px);

    padding:
            9px
            13px
            9px
            22px;

    color: var(--clim-braise-dark);
    background-color: var(--clim-braise-white);

    border: 2px solid var(--clim-braise-white);
    border-radius: 999px;

    font-size: clamp(13px, 1vw, 16px);
    font-weight: 600;
    line-height: 1;

    text-decoration: none;

    transition:
            color 180ms ease,
            background-color 180ms ease,
            border-color 180ms ease,
            transform 180ms ease;
}

.clim-braise__button-arrow {
    display: grid;
    place-items: center;

    width: 20px;
    height: 20px;

    color: var(--clim-braise-red);

    font-size: 20px;
    font-weight: 500;
    line-height: 1;
}

.clim-braise__button:hover,
.clim-braise__button:focus-visible {
    color: var(--clim-braise-white);
    background-color: var(--clim-braise-red);
    border-color: var(--clim-braise-red);

    transform: translateY(-2px);
}

.clim-braise__button:hover .clim-braise__button-arrow,
.clim-braise__button:focus-visible .clim-braise__button-arrow {
    color: var(--clim-braise-white);
}

.clim-braise__button:focus-visible {
    outline: 3px solid rgba(255, 255, 255, 0.45);
    outline-offset: 4px;
}


/* =========================================================
   TRÈS GRANDS ÉCRANS
   ========================================================= */

@media screen and (min-width: 1400px) {
    .clim-braise {
        min-height: 600px;
    }

    .clim-braise__grid {
        min-height: 600px;

        grid-template-columns:
            minmax(280px, 0.75fr)
            minmax(0, 1.25fr);
    }

    .clim-braise__contenu {
        max-width: 730px;
    }

    .clim-braise__title {
        max-width: 730px;
    }

    .clim-braise__logo {
        width: 405px;
    }
}


/* =========================================================
   ÉCRANS INTERMÉDIAIRES
   ========================================================= */

@media screen and (max-width: 1199px) {
    .clim-braise {
        min-height: 470px;
    }

    .clim-braise__grid {
        min-height: 470px;

        grid-template-columns:
            minmax(180px, 0.65fr)
            minmax(0, 1.35fr);
    }

    .clim-braise__contenu {
        width: min(100%, 620px);
    }

    .clim-braise__title {
        max-width: 620px;

        font-size: clamp(27px, 2.8vw, 39px);
    }

    .clim-braise__logo {
        width: clamp(270px, 29vw, 350px);
    }
}


/* =========================================================
   TABLETTES
   ========================================================= */

@media screen and (max-width: 991px) {
    .clim-braise {
        min-height: 520px;
    }

    .clim-braise__background img {
        object-position: 54% center;
    }

    .clim-braise::after {
        background:
                linear-gradient(
                        90deg,
                        rgba(0, 0, 0, 0.22) 0%,
                        rgba(0, 0, 0, 0.15) 45%,
                        rgba(0, 0, 0, 0.28) 100%
                );
    }

    .clim-braise__grid {
        min-height: 520px;

        grid-template-columns:
            minmax(100px, 0.38fr)
            minmax(0, 1.62fr);

        padding:
                55px
                0;
    }

    .clim-braise__contenu {
        width: min(100%, 570px);
    }

    .clim-braise__title {
        max-width: 570px;

        font-size: clamp(29px, 4vw, 39px);
    }

    .clim-braise__logo {
        width: clamp(285px, 39vw, 360px);
    }
}


/* =========================================================
   MOBILES
   ========================================================= */

@media screen and (max-width: 767px) {
    .clim-braise {
        min-height: 610px;
    }

    .clim-braise__background img {
        object-position: 58% center;
    }

    .clim-braise::after {
        background-color: rgba(0, 0, 0, 0.48);
    }

    .clim-braise__grid {
        min-height: 610px;

        grid-template-columns: minmax(0, 1fr);

        padding:
                65px
                0;
    }

    .clim-braise__contenu {
        grid-column: 1;

        width: min(100%, 560px);

        justify-self: center;
    }

    .clim-braise__title {
        max-width: 540px;

        font-size: clamp(28px, 7vw, 39px);
        line-height: 1.05;
    }

    .clim-braise__title-bold,
    .clim-braise__title-light {
        display: block;
    }

    .clim-braise__title-line {
        display: inline;
    }

    .clim-braise__trait {
        width: clamp(150px, 36vw, 200px);

        margin:
                22px
                auto
                24px;
    }

    .clim-braise__introduction {
        font-size: 17px;
    }

    .clim-braise__logo {
        width: min(100%, 350px);
    }

    .clim-braise__button {
        margin-top: 24px;
    }
}


/* =========================================================
   PETITS MOBILES
   ========================================================= */

@media screen and (max-width: 480px) {
    .clim-braise {
        min-height: 570px;
    }

    .clim-braise__background img {
        object-position: 62% center;
    }

    .clim-braise__grid {
        min-height: 570px;

        padding:
                50px
                0;
    }

    .clim-braise__contenu {
        width: 100%;
    }

    .clim-braise__title {
        max-width: 100%;

        font-size: clamp(25px, 8vw, 34px);
        line-height: 1.08;
    }

    .clim-braise__trait {
        width: 145px;

        margin:
                20px
                auto
                22px;
    }

    .clim-braise__introduction {
        margin-bottom: 12px;

        font-size: 16px;
    }

    .clim-braise__logo {
        width: min(100%, 310px);
    }

    .clim-braise__button {
        min-height: 41px;

        margin-top: 21px;

        padding:
                8px
                12px
                8px
                18px;

        font-size: 13px;
    }
}


/* =========================================================
   TRÈS PETITS MOBILES
   ========================================================= */

@media screen and (max-width: 360px) {
    .clim-braise {
        min-height: 550px;
    }

    .clim-braise__grid {
        min-height: 550px;

        padding:
                42px
                0;
    }

    .clim-braise__title {
        font-size: 24px;
    }

    .clim-braise__logo {
        width: min(100%, 280px);
    }
}


/* =========================================================
   RÉDUCTION DES ANIMATIONS
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
    .clim-braise__button {
        transition: none;
    }
}



/* =========================================================
   SECTION MA PRIME RÉNOV'
   Image à gauche — texte à droite
   ========================================================= */

.prime-renov-section {
    width: 100%;
    padding: clamp(40px, 6vw, 90px) 0;
    overflow: hidden;
}

.prime-renov-section .container {
    width: min(100% - 40px, 1200px);
    margin-inline: auto;
}

.prime-renov {
    display: grid;
    grid-template-columns: minmax(280px, 0.9fr) minmax(0, 1.4fr);
    align-items: center;
    gap: clamp(40px, 7vw, 100px);
}

/* Image */

.prime-renov__media {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    min-width: 0;
}

.prime-renov__image {
    display: block;
    width: 100%;
    max-width: 470px;
}

.prime-renov__image img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
}

/* Contenu */

.prime-renov__contenu {
    min-width: 0;
    max-width: 680px;
}

.prime-renov__contenu p {
    margin: 0;
    line-height: 1.55;
}

.prime-renov__contenu p + p {
    margin-top: clamp(16px, 2vw, 26px);
}

.prime-renov__engagement {
    font-weight: 700;
}

/* =========================================================
   TABLETTE
   ========================================================= */

@media screen and (max-width: 900px) {
    .prime-renov-section {
        padding: 50px 0;
    }

    .prime-renov {
        grid-template-columns: minmax(220px, 0.8fr) minmax(0, 1.2fr);
        gap: 40px;
    }

    .prime-renov__image {
        max-width: 360px;
    }
}

/* =========================================================
   MOBILE
   ========================================================= */

@media screen and (max-width: 700px) {
    .prime-renov-section .container {
        width: min(100% - 30px, 1200px);
    }

    .prime-renov {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .prime-renov__media {
        justify-content: center;
    }

    .prime-renov__image {
        width: min(100%, 420px);
        margin-inline: auto;
    }

    .prime-renov__contenu {
        width: 100%;
        max-width: none;
    }
}

/* =========================================================
   PETITS MOBILES
   ========================================================= */

@media screen and (max-width: 420px) {
    .prime-renov-section {
        padding: 35px 0;
    }

    .prime-renov-section .container {
        width: min(100% - 24px, 1200px);
    }

    .prime-renov {
        gap: 24px;
    }

    .prime-renov__contenu p {
        line-height: 1.5;
    }
}






.clim-realisation-slider {
    width: min(720px, calc(100% - 30px));
    margin: 55px auto 0;
    position: relative;
}

.clim-realisation-slider__viewport {
    width: 100%;
    overflow: hidden;
}

.clim-realisation-slider__track {
    display: flex;
    gap: 4px;
    transition: transform 0.45s ease;
    will-change: transform;
}

.clim-realisation-slider__slide {
    flex: 0 0 calc((100% - 8px) / 3);
    height: 170px;
    min-width: 0;
    overflow: hidden;
}

.clim-realisation-slider__slide picture {
    display: block;
    width: 100%;
    height: 100%;
}

.clim-realisation-slider__img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.clim-realisation-slider__controls {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    margin-top: 18px;
}

.clim-realisation-slider__btn {
    width: 22px;
    height: 22px;
    border: 1px solid #ffffff;
    border-radius: 50%;
    background: transparent;
    color: #ffffff;
    font-size: 22px;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    cursor: pointer;
    transition: background 0.25s ease, color 0.25s ease, opacity 0.25s ease;
}

.clim-realisation-slider__btn:hover {
    background: #ffffff;
    color: #47AECC;
}

.clim-realisation-slider__btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

.clim-realisation-slider__btn:disabled:hover {
    background: transparent;
    color: #ffffff;
}

@media (max-width: 991px) {
    .clim-realisation-slider {
        width: min(680px, calc(100% - 30px));
        margin-top: 40px;
    }

    .clim-realisation-slider__slide {
        height: 165px;
    }

}

@media (max-width: 767px) {
    .clim-realisation-slider {
        width: calc(100% - 30px);
        margin-top: 35px;
    }

    .clim-realisation-slider__slide {
        flex: 0 0 calc((100% - 4px) / 2);
        height: 180px;
    }

}

@media (max-width: 575px) {
    .clim-realisation-slider__track {
        gap: 0;
    }

    .clim-realisation-slider__slide {
        flex: 0 0 100%;
        height: 230px;
    }

    .clim-realisation-slider__controls {
        justify-content: center;
        margin-top: 15px;
    }

    .clim-realisation-slider__btn {
        width: 28px;
        height: 28px;
        font-size: 26px;
    }

}










/* =========================
   RÉALISATIONS - RESPONSIVE FIX
========================= */

@media (max-width: 575.98px) {
    .backgroundBleu.exemples {
        padding: 52px 0 44px;
        overflow: hidden;
    }

    .exemples .container {
        max-width: 100%;
        padding-left: 20px;
        padding-right: 20px;
    }

    .exemples h2 {
        font-size: 28px;
        line-height: 1.15;
    }

    .exemples .trait {
        margin-top: 18px;
    }

    .realisations-slider {
        margin-top: 32px;
    }

    .realisations-slider__viewport {
        width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        scroll-snap-type: x mandatory;
        scroll-padding-left: 0;
    }

    .realisations-slider__track {
        gap: 18px;
        align-items: flex-start;
    }

    .realisation-card {
        flex: 0 0 calc(100vw - 40px);
        max-width: 360px;
        min-width: 0;
        scroll-snap-align: start;
    }

    .realisation-card__image-wrap {
        width: 100%;
        aspect-ratio: 1 / 1;
        border-radius: 0;
    }

    .realisation-card__img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
    }

    .realisation-card__title {
        margin: 16px 0 8px;
        padding: 0;
        font-size: 23px;
        line-height: 1.1;
        white-space: normal;
        overflow: visible;
    }

    .realisation-card__tags {
        display: flex;
        flex-wrap: wrap;
        gap: 6px;
        overflow: visible;
    }

    .realisation-card__tag {
        min-height: 20px;
        padding: 3px 9px;
        font-size: 10px;
        line-height: 1;
    }

    .realisations-slider__bottom {
        margin-top: 34px;
        gap: 16px;
    }

    .realisations-slider__progress {
        min-width: 0;
    }

    .realisations-slider__arrows {
        flex: 0 0 auto;
    }
}

/* =========================
   RÉALISATIONS - TABLETTE FIX
   entre desktop et mobile
========================= */

@media (min-width: 768px) and (max-width: 991.98px) {
    .backgroundBleu.exemples {
        padding: 60px 0 42px;
        overflow: hidden;
    }

    .exemples .container {
        max-width: 100%;
        padding-left: 36px;
        padding-right: 36px;
    }

    .exemples h2 {
        font-size: 40px;
        line-height: 1.1;
    }

    .realisations-slider {
        margin-top: 44px;
    }

    .realisations-slider__viewport {
        width: 100%;
        overflow: hidden;
    }

    .realisations-slider__track {
        display: flex;
        gap: 20px;
        align-items: flex-start;
        width: 100%;
        transform: none;
    }

    .realisation-card {
        flex: 0 0 calc((100% - 40px) / 3);
        min-width: 0;
        max-width: none;
    }

    .realisation-card__image-wrap {
        width: 100%;
        aspect-ratio: 1 / 1.075;
        border-radius: 14px;
        overflow: hidden;
    }

    .realisation-card__img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .realisation-card__title {
        margin: 14px 0 7px;
        font-size: 23px;
        line-height: 1.05;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .realisation-card__tags {
        display: flex;
        flex-wrap: wrap;
        gap: 5px;
        min-width: 0;
    }

    .realisation-card__tag {
        height: 19px;
        padding: 0 8px;
        font-size: 10px;
        line-height: 1;
        white-space: nowrap;
    }

    .realisations-slider__bottom {
        margin-top: 58px;
        display: flex;
        align-items: center;
        gap: 28px;
    }

    .realisations-slider__progress {
        flex: 1;
        min-width: 0;
    }

    .realisations-slider__arrows {
        flex: 0 0 auto;
    }
}


@media (min-width: 1199px) and (max-width: 1399px) {

    .soulignerAccueil::after {
        display: none;
    }


}

.header-graphisme__rdv-form {
    position: relative;
    display: inline-flex;
}

.rdv-date-input {
    position: absolute;

    /*
     * C’est ça qui déplace le point d’ouverture du calendrier.
     * Plus la valeur est négative, plus le calendrier essaiera de s’ouvrir haut.
     */
    top: -260px;
    left: 0;

    width: 1px;
    height: 1px;

    opacity: 0;
    border: 0;
    padding: 0;

    pointer-events: none;
}
















/* ==========================================================================
   09. RÉALISATIONS / EXEMPLES
   ========================================================================== */

.exemples{
    margin-top:10rem;
}

.trait {
    width: 118px;
    height: 9px;

    margin: 18px auto 0;

    background: #6EF8AC;
    border-radius: 100px;
}

.realisations-images {
    display: flex;
    gap: 34px;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 40px 0 20px;
    scroll-snap-type: x mandatory;
}

.realisations-images__item {
    flex: 0 0 448px;
    height: 448px;
    border-radius: 24px;
    overflow: hidden;
    scroll-snap-align: start;
}

.realisations-images__img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

@media (max-width: 768px) {
    .realisations-images {
        gap: 20px;
        padding: 30px 0 15px;
    }

    .realisations-images__item {
        flex: 0 0 82vw;
        height: 82vw;
        max-height: 420px;
    }
}

.backgroundBleu.exemples {
    background: #001F55;
    padding: 70px 0 40px;
    overflow: hidden;
}

.exemples .container {
    max-width: 1284px;
    margin: 0 auto;
    padding: 0 72px;
}

.exemples h2 {
    margin: 0;
    color: #ffffff;
    font-size: 43px;
    line-height: 1.15;
    font-weight: 400;
}

.exemples h2 .gras {
    font-weight: 800;
}

.exemples .trait {
    width: 70px;
    height: 5px;
    margin: 28px auto 0;
    border-radius: 999px;
    background: #6EF8AC;
}

.realisations-slider {
    margin-top: 45px;
}

.realisations-slider__viewport {
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    scrollbar-width: none;
}

.realisations-slider__viewport::-webkit-scrollbar {
    display: none;
}

.realisations-slider__track {
    display: flex;
    gap: 22px;
    align-items: flex-start;
}

.realisation-card {
    flex: 0 0 282px;
    color: #fff;
}

.realisation-card__image-wrap {
    width: 100%;
    aspect-ratio: 1 / 1.075;
    border-radius: 14px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.08);
}

.realisation-card__img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.realisation-card__title {
    margin: 15px 0 6px;
    color: #fff;
    font-size: 24px;
    line-height: 1.15;
    font-weight: 700;
}

.realisation-card__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.realisation-card__tag {
    display: inline-flex;
    align-items: center;
    min-height: 20px;
    padding: 2px 8px;
    border: 1px solid #1ee7ad;
    border-radius: 999px;
    color: #6df5c5;
    font-size: 11px;
    line-height: 1;
    font-weight: 600;
}

.realisation-card__tag--yellow {
    border-color: #d6f400;
    color: #d6f400;
}

.realisations-slider__bottom {
    display: flex;
    align-items: center;
    gap: 28px;
    margin-top: 48px;
}

.realisations-slider__progress {
    position: relative;
    flex: 1;
    height: 2px;
    background: rgba(255, 255, 255, 0.20);
    overflow: hidden;
}

.realisations-slider__progress-bar {
    position: absolute;
    inset: 0 auto 0 0;
    width: 0;
    height: 100%;
    background: white;
    transition: width 0.2s ease;
}

.realisations-slider__arrows {
    display: flex;
    align-items: center;
    gap: 10px;
}

.realisations-slider__arrow {
    width: 31px;
    height: 31px;
    padding: 0;
    border: 1px solid white;
    border-radius: 50%;
    background: transparent;
    color: white;
    cursor: pointer;

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

    font-size: 0;
    line-height: 1;

    transition: border-color 0.2s ease, color 0.2s ease, opacity 0.2s ease;
}

.realisations-slider__arrow::before {
    content: '';
    width: 8px;
    height: 8px;
    border-left: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
}

.realisations-slider__arrow[data-slider-prev]::before {
    transform: rotate(45deg);
    margin-left: 3px;
}

.realisations-slider__arrow[data-slider-next]::before {
    transform: rotate(-135deg);
    margin-right: 3px;
}

.realisations-slider__arrow--next {
    border-color: white;
    color: white;
}

.realisations-slider__arrow:disabled {
    opacity: 0.35;
    cursor: default;
}

@media (max-width: 991px) {
    .realisation-card {
        flex-basis: 260px;
    }

    .realisation-card__title {
        font-size: 22px;
    }
}

@media (max-width: 575px) {
    .realisations-slider {
        margin-top: 30px;
    }

    .realisation-card {
        flex-basis: 78vw;
    }

    .realisations-slider__bottom {
        margin-top: 30px;
        gap: 18px;
    }
}


/*@todo */
.google-avis-section {
    background-color: #4cafc6;
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    padding: 26px 0 30px;
    overflow: hidden;
}

.google-avis-section,
.google-avis-section * {
    box-sizing: border-box;
}

.google-avis-section .container {
    width: 100%;
    max-width: 1180px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 24px;
    padding-right: 24px;
}

.google-avis-section picture img {
    max-width: 100%;
    height: auto;
}

/* TITRE */
.google-avis-section h2 {
    line-height: 1.1;
}

.google-avis-section .text-center picture img {
    display: inline-block;
    max-width: 263px;
    width: 100%;
    height: auto;
}

/* SLIDER */
.google-avis-slider {
    position: relative;
    width: 100%;
    padding-left: 42px;
    padding-right: 42px;
}

.google-avis-slider__viewport {
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    scrollbar-width: none;
    -ms-overflow-style: none;
    scroll-snap-type: x mandatory;
}

.google-avis-slider__viewport::-webkit-scrollbar {
    display: none;
}

.google-avis-slider__track {
    display: flex;
    flex-wrap: nowrap;
    gap: 18px;
    align-items: stretch;
    width: 100%;
}

.google-avis-card {
    flex: 0 0 calc((100% - 36px) / 3);
    min-width: 0;
    scroll-snap-align: start;
}

.google-avis-card__inner {
    width: 100%;
    height: 245px;
    background: #ffffff;
    border-radius: 7px;
    overflow: hidden;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
}

.google-avis-card__inner picture {
    display: block;
    width: 100%;
    height: 100%;
}

.google-avis-card__img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center center;
}

/* BOUTONS */
.google-avis-slider__button {
    position: absolute;
    top: 50%;
    z-index: 5;
    width: 30px;
    height: 30px;
    border: 0;
    border-radius: 50%;
    background: #ffffff;
    color: #4cafc6;
    display: flex;
    align-items: center;
    justify-content: center;
    transform: translateY(-50%);
    font-size: 34px;
    line-height: 1;
    font-weight: 700;
    cursor: pointer;
    padding: 0 0 5px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

.google-avis-slider__button:hover {
    background: #f4f4f4;
}

.google-avis-slider__button:disabled {
    opacity: 0.45;
    cursor: default;
}

.google-avis-slider__button--prev {
    left: 0;
}

.google-avis-slider__button--next {
    right: 0;
}

/* BARRE DE PROGRESSION */
.google-avis-slider__progress {
    display: none;
    height: 4px;
    margin: 18px auto 0;
    max-width: 220px;
    background: rgba(255, 255, 255, 0.35);
    border-radius: 20px;
    overflow: hidden;
}

.google-avis-slider__progress-bar {
    width: 12%;
    height: 100%;
    background: #ffffff;
    border-radius: 20px;
    transition: width 0.2s ease;
}

/* TABLETTE LARGE */
@media (max-width: 1199px) {
    .google-avis-section .container {
        max-width: 900px;
        padding-left: 20px;
        padding-right: 20px;
    }

    .google-avis-slider {
        padding-left: 42px;
        padding-right: 42px;
    }

    .google-avis-slider__track {
        gap: 18px;
    }

    .google-avis-card {
        flex: 0 0 calc((100% - 18px) / 2);
        max-width: none;
    }

    .google-avis-card__inner {
        height: 270px;
    }
}

/* TABLETTE / MOBILE LARGE */
@media (max-width: 900px) {
    .google-avis-section .container {
        max-width: 620px;
        padding-left: 20px;
        padding-right: 20px;
    }

    .google-avis-slider {
        padding-left: 40px;
        padding-right: 40px;
    }

    .google-avis-slider__track {
        gap: 16px;
    }

    .google-avis-card {
        flex: 0 0 100%;
        width: 100%;
        max-width: none;
        min-width: 100%;
    }

    .google-avis-card__inner {
        height: auto;
        aspect-ratio: 366 / 325;
    }
}

/* MOBILE JUSQU’À 560PX */
@media (max-width: 560px) {
    .google-avis-section {
        padding: 22px 0 26px;
        overflow: hidden;
    }

    .google-avis-section .container {
        width: 100%;
        max-width: none;
        padding-left: 12px;
        padding-right: 12px;
    }

    .google-avis-section .text-center {
        margin-top: 28px !important;
        margin-bottom: 26px !important;
    }

    .google-avis-section h2 {
        font-size: 42px;
        line-height: 1.1;
        margin-bottom: 14px;
    }

    .google-avis-section .text-center picture img {
        max-width: 260px;
        width: 75%;
        height: auto;
    }

    .google-avis-slider {
        width: 100%;
        padding-left: 34px;
        padding-right: 34px;
        margin-top: 22px;
    }

    .google-avis-slider__viewport {
        width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
    }

    .google-avis-slider__track {
        display: flex;
        flex-wrap: nowrap;
        gap: 0;
        align-items: stretch;
    }

    .google-avis-card {
        flex: 0 0 100%;
        width: 100%;
        max-width: 100%;
        min-width: 100%;
    }

    .google-avis-card__inner {
        width: 100%;
        height: auto;
        min-height: 0;
        aspect-ratio: 366 / 325;
        border-radius: 7px;
        overflow: hidden;
        background: #ffffff;
    }

    .google-avis-card__inner picture {
        display: block;
        width: 100%;
        height: 100%;
    }

    .google-avis-card__img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: contain;
        object-position: center center;
    }

    .google-avis-slider__button {
        width: 28px;
        height: 28px;
        font-size: 30px;
        z-index: 10;
    }

    .google-avis-slider__button--prev {
        left: 0;
    }

    .google-avis-slider__button--next {
        right: 0;
    }

    .google-avis-slider__progress {
        display: block;
        height: 4px;
        margin: 18px auto 0;
        max-width: 220px;
    }
}

/* PETITS MOBILES */
@media (max-width: 420px) {
    .google-avis-section h2 {
        font-size: 36px;
    }

    .google-avis-slider {
        padding-left: 30px;
        padding-right: 30px;
    }

    .google-avis-slider__button {
        width: 26px;
        height: 26px;
        font-size: 28px;
    }
}

.climatisation .logo-braise {
    display: block;
    width: 100%;
    max-width: 650px;
    margin: 0 auto;
}

.climatisation .logo-braise img {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    object-fit: contain;
}


.bouton2 {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    min-width: 241px;
    height: 48px;
    padding: 0 18px 0 24px;
    background-color: #ffffff;
    color: #0F4254;
    border-radius: 999px;
    text-decoration: none;
    font-size: 18px;
    line-height: 1;
    border: none;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.bouton2:hover {
    color: #0F4254;
    text-decoration: none;
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
}

.bouton2 span {
    display: inline-block;
}


@media screen and (min-width: 767px) and (max-width: 920px) {
    .renov-header__slogan-bottom  {
        font-size: 30px !important;
    }
    .renov-header__content{
        margin-top:1rem !important;
    }
}
/* Source: clim/mobile.css */
@media screen and (max-width: 767px) {

}
/* Source: clim/PC.css */
@media screen and (min-width: 992px) and (max-width: 1399px) {

}
/* Source: clim/PCXXL.css */
@media screen and (min-width: 1400px) {

}
/* Source: clim/tablette.css */
@media screen and (min-width: 768px) and (max-width: 991px) {
}
/* Source: renov/index.css */
/* ==========================================================
   PAGE RÉNOV LEAL’O
   ========================================================== */

.renov-page,
.renov-page *,
.renov-page *::before,
.renov-page *::after {
    box-sizing: border-box;
}

.renov-page {
    --renov-blue: #0d4053;
    --renov-blue-light: #365f70;
    --renov-orange: #f9a11b;
    --renov-yellow: #ffd500;
    --renov-cyan: #4db2c8;
    --renov-green: #a7c95a;
    --renov-white: #ffffff;
    --renov-shadow: 0 22px 55px rgba(13, 64, 83, 0.18);

    width: 100%;
    overflow: hidden;
    color: var(--renov-blue);
    background: var(--renov-white);
}

.renov-page picture,
.renov-page img {
    margin: 0;
    padding: 0;
}

.renov-page img {
    max-width: 100%;
}

.renov-container {
    position: relative;
    z-index: 2;
    width: min(100% - 48px, 1440px);
    margin-inline: auto;
}

.renov-visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.renov-title {
    margin: 0;
    color: var(--renov-blue);
    font-size: clamp(34px, 3vw, 50px);
    line-height: 1.02;
    text-transform: uppercase;
}

.renov-title__bold {
    font-weight: 700;
}

.renov-title__light {
    font-weight: 300;
}

.renov-title__line {
    display: block;
}

.renov-trait {
    display: block;
    width: clamp(150px, 13.8vw, 263px);
    margin-top: 24px;
    line-height: 0;
}

.renov-trait img {
    display: block;
    width: 100%;
    height: auto;
}

.renov-copy {
    color: var(--renov-blue-light);
}

.renov-copy p {
    margin: 0;
    font-size: clamp(16px, 1.15vw, 22px);
    line-height: 1.38;
}

.renov-copy p + p {
    margin-top: 24px;
}

.renov-copy .pb {
    color: var(--renov-blue);
    font-weight: 700;
}


/* ==========================================================
   HEADER
   ========================================================== */

.renov-header {
    position: relative;
    width: 100%;
    background: var(--renov-white);
    overflow: hidden;
}

.renov-header__container {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
  /*  max-width: 2048px;*/
    aspect-ratio: 2048 / 390;
    margin-inline: auto;
}

.renov-header__image-zone,
.renov-header__orange-zone {
    position: relative;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
}

.renov-header__image {
    position: absolute;
    inset: 0;
    display: block;
    line-height: 0;
}

.renov-header__image img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    object-position: center;
}

.renov-header__orange-zone::before {
    position: absolute;
    z-index: 0;
    inset: 0;
    background: var(--renov-orange);
    clip-path: polygon(0 0, 100% 0, 100% 90%, 0 100%);
    content: "";
}

.renov-header__content {
    position: absolute;
    z-index: 2;
    top: 45%;
    right: clamp(24px, 4vw, 86px);
    left: clamp(24px, 4vw, 86px);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(18px, 2vw, 34px);
    transform: translateY(-50%);
}

.renov-header__slogan {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    min-width: 0;
    color: var(--renov-blue);
    text-align: right;
    line-height: 1;
    white-space: nowrap;
}

.renov-header__slogan-top,
.renov-header__slogan-bottom {
    display: block;
    font-size: clamp(28px, 2.6vw, 50px);
    line-height: 1;
}

.renov-header__slogan-top {
    font-weight: 500;
}

.renov-header__slogan-bottom {
    margin-top: 8px;
    font-weight: 700;
}

.renov-header__separator {
    flex: 0 0 2px;
    width: 2px;
    height: clamp(58px, 5vw, 78px);
    background: var(--renov-white);
}

.renov-header__brand {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 10px;
    color: var(--renov-white);
}

.renov-header__brand-icon {
    display: block;
    flex: 0 0 auto;
    width: clamp(45px, 4vw, 72px);
    height: clamp(45px, 4vw, 72px);
    line-height: 0;
}

.renov-header__brand-icon img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.renov-header__brand-text {
    display: flex;
    flex-direction: column;
    color: var(--renov-white);
    font-family: "Roboto Condensed", Arial, sans-serif;
    font-size: clamp(20px, 1.7vw, 32px);
    line-height: 0.88;
    white-space: nowrap;
}

.renov-header__brand-text strong {
    font-weight: 700;
}

.renov-header__brand-text span {
    margin-top: 8px;
    font-weight: 500;
}


/* ==========================================================
   PRÉSENTATION
   ========================================================== */

.renov-presentation {
    position: relative;
    padding: clamp(70px, 7vw, 120px) 0 clamp(65px, 6vw, 100px);
    background: var(--renov-white);
}

.renov-presentation__grid {
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
    align-items: center;
    gap: clamp(60px, 8vw, 145px);
}

.renov-presentation__content {
    min-width: 0;
    max-width: 650px;
}

.renov-presentation__lead {
    margin: 36px 0 30px;
    color: var(--renov-blue);
    font-size: clamp(21px, 1.7vw, 30px);
    line-height: 1.35;
}

.renov-presentation__media {
    display: grid;
    place-items: center;
    min-width: 0;
}

.renov-presentation__image {
    display: block;
    width: min(100%, 690px);
    line-height: 0;
}

.renov-presentation__image img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
}


/* ==========================================================
   TEXTE RÉNOVATION + BULLE
   ========================================================== */

.renov-renovation {
    position: relative;
    padding: clamp(40px, 4vw, 72px) 0 clamp(80px, 7vw, 125px);
    background: var(--renov-white);
}

.renov-renovation__grid {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    align-items: center;
    gap: clamp(70px, 10vw, 180px);
}

.renov-renovation__bubble-zone {
    display: grid;
    place-items: center;
    min-width: 0;
}

.renov-renovation__bubble {
    display: block;
    width: min(100%, 590px);
    line-height: 0;
}

.renov-renovation__bubble img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
}

.renov-renovation__content {
    max-width: 650px;
}


/* ==========================================================
   BANDEAU ATOUTS
   ========================================================== */

.renov-atouts {
    position: relative;
    display: flex;
    align-items: center;
    min-height: clamp(210px, 18.6vw, 357px);
    padding: clamp(62px, 7vw, 102px) 0;
    overflow: hidden;
}

.renov-atouts__background {
    position: absolute;
    z-index: 0;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

.renov-atouts__background img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: fill;
}

.renov-atouts__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-items: center;
    gap: clamp(26px, 3.5vw, 65px);
}

.renov-atouts__item {
    display: grid;
    grid-template-columns: 67px minmax(0, 1fr);
    align-items: center;
    gap: clamp(16px, 1.6vw, 28px);
    min-width: 0;
}

.renov-atouts__icon {
    display: block;
    width: 67px;
    height: 67px;
    line-height: 0;
}

.renov-atouts__icon img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.renov-atouts__text {
    margin: 0;
    color: var(--renov-blue);
    font-size: clamp(20px, 1.65vw, 30px);
    font-weight: 700;
    font-style: italic;
    line-height: 1.12;
}


/* ==========================================================
   ASSURANCE
   ========================================================== */

.renov-assurance {
    position: relative;
    padding: clamp(85px, 8vw, 145px) 0 clamp(80px, 7vw, 130px);
    background: var(--renov-white);
    overflow: hidden;
}

.renov-assurance::before {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: clamp(22px, 2.8vw, 52px);
    background: linear-gradient(100deg, var(--renov-cyan), var(--renov-yellow));
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 10%);
    content: "";
}

.renov-assurance__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: center;
    gap: clamp(75px, 9vw, 160px);
}

.renov-assurance__media,
.renov-assurance__content {
    position: relative;
    z-index: 2;
    min-width: 0;
}

.renov-assurance__media {
    display: grid;
    place-items: center;
}

.renov-assurance__image {
    display: block;
    width: min(100%, 650px);
    line-height: 0;
}

.renov-assurance__image img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
}

.renov-assurance__content {
    max-width: 650px;
}

.renov-assurance__content .renov-copy {
    margin-top: 34px;
}

.renov-assurance__house,
.renov-neuf__house {
    position: absolute;
    z-index: 0;
    width: clamp(270px, 31vw, 560px);
    aspect-ratio: 1 / 0.72;
    opacity: 0.1;
    pointer-events: none;
}

.renov-assurance__house {
    top: 22%;
    left: -8%;
}

.renov-assurance__house::before,
.renov-assurance__house::after,
.renov-neuf__house::before,
.renov-neuf__house::after {
    position: absolute;
    top: 16%;
    width: 58%;
    height: 12px;
    background: var(--renov-orange);
    content: "";
}

.renov-assurance__house::before,
.renov-neuf__house::before {
    left: 1%;
    transform: rotate(-40deg);
    transform-origin: right center;
}

.renov-assurance__house::after,
.renov-neuf__house::after {
    right: 1%;
    transform: rotate(40deg);
    transform-origin: left center;
}


/* ==========================================================
   RÉALISATIONS
   ========================================================== */

.renov-realisations {
    position: relative;
    min-height: clamp(500px, 46vw, 760px);
    display: grid;
    align-items: center;
    padding: clamp(70px, 7vw, 120px) 0;
    overflow: hidden;
    isolation: isolate;
}

.renov-realisations__background {
    position: absolute;
    z-index: -2;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    line-height: 0;
}

.renov-realisations__background img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.renov-realisations::after {
    position: absolute;
    z-index: -1;
    inset: 0;
    background: rgba(13, 64, 83, 0.08);
    content: "";
}

.renov-realisations__container {
    display: grid;
    grid-template-columns: minmax(0, 0.75fr) minmax(0, 1.25fr);
    align-items: center;
    gap: clamp(60px, 8vw, 140px);
}

.renov-realisations__container--gallery {
    grid-template-columns: minmax(0, 0.55fr) minmax(0, 1.45fr);
}

.renov-realisations__intro {
    color: var(--renov-white);
}

.renov-realisations__title {
    margin: 0;
    font-size: clamp(34px, 3.3vw, 56px);
    line-height: 1.04;
    text-transform: uppercase;
}

.renov-realisations__title-bold,
.renov-realisations__title-light {
    display: block;
}

.renov-realisations__title-bold {
    font-weight: 700;
}

.renov-realisations__title-light {
    margin-top: 6px;
    font-weight: 300;
}

.renov-realisations__text {
    max-width: 520px;
    margin: 28px 0 0;
    font-size: clamp(17px, 1.3vw, 22px);
    line-height: 1.45;
}

.renov-realisations__project {
    display: block;
    overflow: hidden;
    border: 7px solid rgba(255, 255, 255, 0.92);
    background: var(--renov-white);
    box-shadow: var(--renov-shadow);
    line-height: 0;
}

.renov-realisations__project img {
    display: block;
    width: 100%;
    aspect-ratio: 900 / 624;
    object-fit: cover;
    transition: transform 300ms ease;
}

.renov-realisations__project:hover img {
    transform: scale(1.025);
}

.renov-realisations__project--single {
    width: min(100%, 720px);
    justify-self: end;
    transform: rotate(-1.5deg);
}

.renov-realisations__gallery {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(18px, 2vw, 32px);
}

.renov-realisations__gallery .renov-realisations__project:nth-child(1) {
    transform: rotate(-1.4deg) translateY(18px);
}

.renov-realisations__gallery .renov-realisations__project:nth-child(2) {
    transform: rotate(1deg) translateY(-12px);
}

.renov-realisations__gallery .renov-realisations__project:nth-child(3) {
    transform: rotate(-0.8deg) translateY(10px);
}


/* ==========================================================
   TRAVAUX EN NEUF
   ========================================================== */

.renov-neuf {
    position: relative;
    padding: clamp(80px, 8vw, 135px) 0 clamp(85px, 8vw, 140px);
    border-top: 14px solid var(--renov-blue);
    border-bottom: 5px solid var(--renov-orange);
    background: var(--renov-white);
    overflow: hidden;
}

.renov-neuf__header {
    position: relative;
    z-index: 2;
    margin-bottom: clamp(55px, 6vw, 90px);
}

.renov-neuf__grid {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: center;
    gap: clamp(75px, 9vw, 160px);
}

.renov-neuf__grid--second {
    margin-top: clamp(65px, 7vw, 115px);
}

.renov-neuf__content {
    min-width: 0;
    max-width: 650px;
}

.renov-neuf__subtitle {
    margin: 0 0 30px;
    color: var(--renov-blue);
    font-size: clamp(21px, 1.65vw, 30px);
    font-weight: 400;
    line-height: 1.25;
    text-transform: uppercase;
}

.renov-neuf__image {
    display: block;
    width: min(100%, 650px);
    justify-self: center;
    line-height: 0;
}

.renov-neuf__image img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
}

.renov-neuf__house {
    top: 8%;
    right: -4%;
}


/* ==========================================================
   EXPERTS
   ========================================================== */

.renov-experts {
    position: relative;
    padding: clamp(75px, 7vw, 110px) 0 clamp(35px, 3vw, 55px);
    border-top: 5px solid var(--renov-orange);
    background: var(--renov-white);
}

.renov-experts__content {
    max-width: 920px;
    margin-inline: auto;
    text-align: center;
}

.renov-experts__content .renov-title {
    display: flex;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap;
}

.renov-experts__trait {
    margin: 26px auto 34px;
}

.renov-experts__text {
    max-width: 820px;
    margin-inline: auto;
}

.renov-experts__text p {
    line-height: 1.35;
}


/* ==========================================================
   ENGAGEMENTS
   ========================================================== */

.renov-engagements {
    position: relative;
    background: var(--renov-white);
}

.renov-engagements__top {
    position: relative;
    min-height: 520px;
    padding: 10px 0 0;
    overflow: hidden;
}

.renov-engagements__top::after {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 34px;
    background: var(--renov-yellow);
    clip-path: polygon(0 45%, 100% 100%, 100% 100%, 0 100%);
    content: "";
}

.renov-engagements__grid {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    align-items: end;
    gap: clamp(60px, 7vw, 125px);
    min-height: 500px;
}

.renov-engagements__visual {
    position: relative;
    width: min(100%, 520px);
    justify-self: end;
    align-self: end;
}

.renov-engagements__personnage {
    display: block;
    width: min(100%, 360px);
    margin-inline: auto;
    line-height: 0;
}

.renov-engagements__personnage img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
}

.renov-engagements__button {
    position: absolute;
    top: 54%;
    left: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    min-height: 50px;
    padding: 12px 20px;
    border-radius: 999px;
    color: var(--renov-blue);
    background: var(--renov-yellow);
    font-size: 16px;
    font-weight: 700;
    text-decoration: none;
    box-shadow: 0 12px 24px rgba(13, 64, 83, 0.12);
    transition: transform 180ms ease, box-shadow 180ms ease;
}

.renov-engagements__button:hover,
.renov-engagements__button:focus-visible {
    transform: translateY(-2px);
    box-shadow: 0 16px 30px rgba(13, 64, 83, 0.18);
}

.renov-engagements__button-arrow {
    font-size: 24px;
    line-height: 1;
}

.renov-engagements__list-zone {
    align-self: center;
    padding-bottom: 55px;
}

.renov-engagements__list {
    display: grid;
    gap: 22px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.renov-engagements__item {
    display: grid;
    grid-template-columns: 26px minmax(0, 1fr);
    align-items: center;
    gap: 18px;
    color: var(--renov-blue);
    font-size: clamp(18px, 1.35vw, 24px);
    line-height: 1.25;
}

.renov-engagements__check {
    display: block;
    width: 25px;
    line-height: 0;
}

.renov-engagements__check img {
    display: block;
    width: 100%;
    height: auto;
}


/* ==========================================================
   RÉSEAUX SOCIAUX
   ========================================================== */

.renov-engagements__social {
    position: relative;
    min-height: clamp(360px, 29vw, 510px);
    display: grid;
    align-items: center;
    padding: clamp(80px, 7vw, 120px) 0 clamp(70px, 6vw, 105px);
    background: var(--renov-yellow);
    clip-path: polygon(0 0, 100% 10%, 100% 100%, 0 100%);
}

.renov-engagements__social-content {
    max-width: 760px;
    margin-inline: auto;
    text-align: center;
}

.renov-engagements__social-title {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0;
    color: var(--renov-blue);
    font-size: clamp(34px, 3vw, 50px);
    line-height: 1;
    text-transform: uppercase;
}

.renov-engagements__social-title-bold {
    font-weight: 700;
}

.renov-engagements__social-title-light {
    font-weight: 300;
}

.renov-engagements__social-trait {
    margin: 28px auto 34px;
}

.renov-engagements__social-text {
    max-width: 610px;
    margin: 0 auto;
    color: var(--renov-blue);
    font-size: clamp(16px, 1.2vw, 21px);
    line-height: 1.35;
}

.renov-engagements__social-links {
    display: flex;
    justify-content: center;
    gap: 22px;
    margin-top: 30px;
}

.renov-engagements__social-link {
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    color: var(--renov-blue);
    text-decoration: none;
    transition: transform 180ms ease, opacity 180ms ease;
}

.renov-engagements__social-link:hover,
.renov-engagements__social-link:focus-visible {
    transform: translateY(-2px);
    opacity: 0.72;
}

.renov-engagements__social-link svg {
    display: block;
    width: 25px;
    height: 25px;
    fill: currentColor;
}


/* ==========================================================
   RESPONSIVE : 1200PX ET MOINS
   ========================================================== */

@media screen and (max-width: 1199.98px) {

    .renov-container {
        width: min(100% - 40px, 1100px);
    }

    .renov-header__content {
        right: 22px;
        left: 22px;
        gap: 14px;
    }

    .renov-header__slogan-top,
    .renov-header__slogan-bottom {
        font-size: clamp(25px, 3.1vw, 38px);
    }

    .renov-header__brand-icon {
        width: 48px;
        height: 48px;
    }

    .renov-header__brand-text {
        font-size: 22px;
    }

    .renov-presentation__grid,
    .renov-renovation__grid,
    .renov-assurance__grid,
    .renov-neuf__grid {
        gap: 55px;
    }

    .renov-atouts__grid {
        gap: 26px;
    }

    .renov-atouts__item {
        grid-template-columns: 58px minmax(0, 1fr);
        gap: 15px;
    }

    .renov-atouts__icon {
        width: 58px;
        height: 58px;
    }

    .renov-realisations__container,
    .renov-realisations__container--gallery {
        gap: 50px;
    }

    .renov-engagements__grid {
        gap: 45px;
    }
}


/* ==========================================================
   RESPONSIVE : TABLETTES
   ========================================================== */

@media screen and (max-width: 991.98px) {

    .renov-header__container {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        aspect-ratio: 1920 / 430;
    }

    .renov-header__content {
        right: 12px;
        left: 12px;
        gap: 9px;
    }

    .renov-header__slogan-top,
    .renov-header__slogan-bottom {
        font-size: clamp(22px, 3.2vw, 31px);
    }

    .renov-header__separator {
        flex-basis: 1px;
        width: 1px;
        height: 46px;
    }

    .renov-header__brand-icon {
        width: 38px;
        height: 38px;
    }

    .renov-header__brand-text {
        font-size: 18px;
    }

    .renov-presentation__grid,
    .renov-renovation__grid,
    .renov-assurance__grid,
    .renov-neuf__grid,
    .renov-realisations__container,
    .renov-realisations__container--gallery {
        grid-template-columns: minmax(0, 1fr);
    }

    .renov-presentation__content,
    .renov-renovation__content,
    .renov-assurance__content,
    .renov-neuf__content {
        max-width: 760px;
        justify-self: center;
    }

    .renov-presentation__media {
        order: 2;
    }

    .renov-presentation__image,
    .renov-assurance__image,
    .renov-neuf__image {
        width: min(100%, 650px);
    }

    .renov-renovation__bubble {
        width: min(100%, 560px);
    }

    .renov-atouts {
        min-height: 420px;
        padding: 90px 0;
    }

    .renov-atouts__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 48px;
    }

    .renov-atouts__item {
        width: min(100%, 330px);
        justify-self: center;
        grid-template-columns: 67px minmax(0, 1fr);
        gap: 22px;
    }

    .renov-atouts__icon {
        width: 67px;
        height: 67px;
    }

    .renov-assurance__grid {
        gap: 60px;
    }

    .renov-assurance__content {
        order: 1;
    }

    .renov-assurance__media {
        order: 2;
    }

    .renov-realisations {
        min-height: auto;
    }

    .renov-realisations__intro {
        max-width: 760px;
    }

    .renov-realisations__project--single {
        justify-self: center;
    }

    .renov-realisations__gallery {
        width: 100%;
        max-width: 900px;
        justify-self: center;
    }

    .renov-neuf__grid--first .renov-neuf__image {
        order: 2;
    }

    .renov-neuf__grid--second .renov-neuf__image {
        order: 2;
    }

    .renov-neuf__grid--second .renov-neuf__content {
        order: 1;
    }

    .renov-engagements__grid {
        grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
        gap: 30px;
    }

    .renov-engagements__button {
        left: -10px;
    }

    .renov-engagements__item {
        font-size: 18px;
    }
}


/* ==========================================================
   RESPONSIVE : MOBILES ET PETITES TABLETTES
   ========================================================== */

@media screen and (max-width: 767.98px) {

    .renov-container {
        width: min(100% - 32px, 680px);
    }

    .renov-title {
        font-size: clamp(30px, 8vw, 42px);
    }

    .renov-title__bold,
    .renov-title__light {
        display: block;
    }

    .renov-copy p {
        font-size: 17px;
        line-height: 1.5;
    }

    .renov-header {
        overflow: visible;
    }

    .renov-header__container {
        display: flex;
        flex-direction: column;
        aspect-ratio: auto;
        overflow: visible;
    }

    .renov-header__image-zone {
        width: 100%;
        aspect-ratio: 960 / 366;
        margin-bottom: -1px;
    }

    .renov-header__orange-zone {
        width: 100%;
        min-height: 235px;
        margin-top: -1px;
    }

    .renov-header__orange-zone::before {
        clip-path: polygon(0 0, 100% 0, 100% 92%, 0 100%);
    }

    .renov-header__content {
        inset: 0;
        top: auto;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 20px 24px 42px;
        transform: none;
    }

    .renov-header__slogan-top,
    .renov-header__slogan-bottom {
        font-size: clamp(24px, 5vw, 34px);
    }

    .renov-header__separator {
        height: 58px;
    }

    .renov-header__brand-icon {
        width: 50px;
        height: 50px;
    }

    .renov-header__brand-text {
        font-size: 23px;
    }

    .renov-presentation,
    .renov-assurance,
    .renov-neuf {
        padding-top: 68px;
        padding-bottom: 72px;
    }

    .renov-presentation__grid,
    .renov-renovation__grid,
    .renov-assurance__grid,
    .renov-neuf__grid {
        gap: 42px;
    }

    .renov-presentation__lead {
        margin: 30px 0 25px;
        font-size: 21px;
    }

    .renov-renovation {
        padding: 25px 0 72px;
    }

    .renov-atouts {
        min-height: 620px;
        padding: 94px 0;
    }

    .renov-atouts__grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 32px;
    }

    .renov-atouts__item {
        width: min(100%, 300px);
        grid-template-columns: 60px minmax(0, 1fr);
        gap: 22px;
    }

    .renov-atouts__icon {
        width: 60px;
        height: 60px;
    }

    .renov-atouts__text {
        font-size: 21px;
    }

    .renov-assurance::before {
        height: 28px;
    }

    .renov-assurance__house,
    .renov-neuf__house {
        opacity: 0.07;
    }

    .renov-realisations {
        padding: 70px 0 80px;
    }

    .renov-realisations__container,
    .renov-realisations__container--gallery {
        gap: 48px;
    }

    .renov-realisations__title {
        font-size: clamp(30px, 8vw, 43px);
    }

    .renov-realisations__gallery {
        grid-template-columns: minmax(0, 1fr);
        max-width: 560px;
        gap: 30px;
    }

    .renov-realisations__gallery .renov-realisations__project:nth-child(n) {
        transform: none;
    }

    .renov-neuf__header {
        margin-bottom: 48px;
    }

    .renov-neuf__grid--second {
        margin-top: 65px;
    }

    .renov-neuf__subtitle {
        font-size: 20px;
    }

    .renov-experts {
        padding: 65px 0 35px;
    }

    .renov-experts__content .renov-title,
    .renov-engagements__social-title {
        display: block;
    }

    .renov-experts__content .renov-title span,
    .renov-engagements__social-title span {
        display: block;
    }

    .renov-engagements__top {
        min-height: auto;
        padding-top: 20px;
    }

    .renov-engagements__grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 25px;
        min-height: auto;
    }

    .renov-engagements__visual {
        justify-self: center;
        order: 2;
        width: min(100%, 480px);
    }

    .renov-engagements__list-zone {
        order: 1;
        width: min(100%, 560px);
        justify-self: center;
        padding: 10px 0 15px;
    }

    .renov-engagements__personnage {
        width: min(80%, 320px);
    }

    .renov-engagements__button {
        top: 56%;
        left: 3%;
    }

    .renov-engagements__social {
        clip-path: polygon(0 0, 100% 5%, 100% 100%, 0 100%);
        padding-top: 90px;
    }
}


/* ==========================================================
   RESPONSIVE : PETITS MOBILES
   ========================================================== */

@media screen and (max-width: 520px) {

    .renov-container {
        width: min(100% - 24px, 480px);
    }

    .renov-header__image-zone {
        aspect-ratio: 16 / 7;
    }

    .renov-header__image img {
        object-position: 47% center;
    }

    .renov-header__orange-zone {
        min-height: 250px;
    }

    .renov-header__content {
        flex-direction: column;
        gap: 11px;
        padding: 18px 16px 38px;
    }

    .renov-header__slogan {
        align-items: center;
        width: 100%;
        text-align: center;
    }

    .renov-header__slogan-top {
        font-size: clamp(23px, 6.6vw, 29px);
    }

    .renov-header__slogan-bottom {
        font-size: clamp(26px, 7.2vw, 32px);
    }

    .renov-header__separator {
        flex: 0 0 2px;
        width: min(170px, 52vw);
        height: 2px;
    }

    .renov-header__brand-icon {
        width: 45px;
        height: 45px;
    }

    .renov-header__brand-text {
        font-size: 22px;
    }

    .renov-presentation,
    .renov-assurance,
    .renov-neuf {
        padding-top: 55px;
        padding-bottom: 58px;
    }

    .renov-trait {
        width: 150px;
        margin-top: 20px;
    }

    .renov-presentation__lead {
        margin: 26px 0 22px;
        font-size: 18px;
    }

    .renov-copy p {
        font-size: 16px;
    }

    .renov-copy p + p {
        margin-top: 20px;
    }

    .renov-renovation {
        padding-bottom: 58px;
    }

    .renov-atouts {
        min-height: 590px;
        padding: 88px 0;
    }

    .renov-atouts__item {
        width: min(100%, 275px);
        grid-template-columns: 55px minmax(0, 1fr);
        gap: 18px;
    }

    .renov-atouts__icon {
        width: 55px;
        height: 55px;
    }

    .renov-atouts__text {
        font-size: 19px;
    }

    .renov-assurance__content .renov-copy {
        margin-top: 28px;
    }

    .renov-realisations {
        padding: 58px 0 68px;
    }

    .renov-realisations__text {
        margin-top: 22px;
        font-size: 16px;
    }

    .renov-realisations__project {
        border-width: 4px;
    }

    .renov-realisations__project--single {
        transform: none;
    }

    .renov-neuf {
        border-top-width: 9px;
    }

    .renov-neuf__subtitle {
        font-size: 18px;
    }

    .renov-experts__trait {
        margin-bottom: 28px;
    }

    .renov-engagements__list {
        gap: 18px;
    }

    .renov-engagements__item {
        grid-template-columns: 22px minmax(0, 1fr);
        gap: 13px;
        font-size: 16px;
    }

    .renov-engagements__check {
        width: 22px;
    }

    .renov-engagements__button {
        left: 0;
        min-height: 44px;
        padding: 10px 16px;
        font-size: 14px;
    }

    .renov-engagements__social {
        min-height: 390px;
        padding: 82px 0 65px;
    }

    .renov-engagements__social-title {
        font-size: clamp(30px, 8.5vw, 38px);
    }

    .renov-engagements__social-text {
        font-size: 16px;
    }
}

/* Source: piscine/index.css */
/* ==========================================================
   PAGE PISCINES LEAL'O
   ========================================================== */

.piscine-page,
.piscine-page *,
.piscine-page *::before,
.piscine-page *::after {
    box-sizing: border-box;
}

.piscine-page {
    --piscine-blue: #0e4053;
    --piscine-blue-soft: #315f70;
    --piscine-cyan: #128dc1;
    --piscine-yellow: #ffd500;
    --piscine-wave: #e7f4fa;
    --piscine-white: #ffffff;
    --piscine-shadow: 0 24px 55px rgba(9, 58, 77, 0.2);

    width: 100%;
    overflow: hidden;
    color: var(--piscine-blue);
    background: var(--piscine-white);
}

.piscine-page picture {
    display: block;
    margin: 0;
    padding: 0;
    line-height: 0;
}

.piscine-page img {
    display: block;
    max-width: 100%;
}

.piscine-page a {
    color: inherit;
}

.piscine-container {
    position: relative;
    z-index: 2;
    width: min(100% - 48px, 1440px);
    margin-inline: auto;
}

.piscine-title {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0;
    color: var(--piscine-blue);
    font-family: "Roboto Condensed", Arial, sans-serif;
    font-size: clamp(34px, 3vw, 50px);
    line-height: 1;
    text-transform: uppercase;
}

.piscine-title__bold {
    font-weight: 700;
}

.piscine-title__light {
    font-weight: 300;
    font-style: italic;
}

.piscine-trait {
    width: clamp(150px, 13.8vw, 263px);
    margin-top: 22px;
}

.piscine-trait img {
    width: 100%;
    height: auto;
}

.piscine-copy {
    color: var(--piscine-blue-soft);
    font-family: "Poppins", Arial, sans-serif;
}

.piscine-copy p {
    margin: 0;
    font-size: clamp(16px, 1.13vw, 22px);
    line-height: 1.38;
}

.piscine-copy p + p {
    margin-top: 22px;
}

.piscine-copy strong {
    color: var(--piscine-blue);
    font-weight: 700;
}

.piscine-copy ul {
    margin: 20px 0;
    padding-left: 24px;
    font-size: clamp(16px, 1.13vw, 22px);
    line-height: 1.35;
}


/* ==========================================================
   HEADER
   ========================================================== */

.piscine-header {
    position: relative;
    width: 100%;
    max-width: 2048px;
    min-height: 280px;
    aspect-ratio: 2048 / 389;
    margin-inline: auto;
    overflow: hidden;
    background: var(--piscine-white);
}

.piscine-header__background {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.piscine-header__background img {
    width: 100%;
    height: 100%;
    object-fit: fill;
}

.piscine-header__mobile-image {
    display: none;
}

.piscine-header__content {
    position: absolute;
    z-index: 2;
    top: 43%;
    right: clamp(35px, 5vw, 110px);
    left: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(20px, 2.2vw, 38px);
    transform: translateY(-50%);
}

.piscine-header__slogan {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    color: var(--piscine-blue);
    text-align: right;
    white-space: nowrap;
}

.piscine-header__slogan-top {
    font-family: "Roboto Condensed", Arial, sans-serif;
    font-size: clamp(25px, 2.45vw, 50px);
    font-weight: 400;
    line-height: 1;
}

.piscine-header__slogan-bottom {
    margin-top: 8px;
    font-family: "Roboto Condensed", Arial, sans-serif;
    font-size: clamp(28px, 2.55vw, 52px);
    font-weight: 700;
    line-height: 1;
}

.piscine-header__separator {
    flex: 0 0 2px;
    width: 2px;
    height: clamp(62px, 5vw, 90px);
    background: #000;
}

.piscine-header__brand {
    display: flex;
    align-items: center;
    gap: 12px;
    color: var(--piscine-white);
}

.piscine-header__brand-icon {
    flex: 0 0 auto;
    width: clamp(50px, 4.4vw, 80px);
    height: clamp(50px, 4.4vw, 80px);
}

.piscine-header__brand-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.piscine-header__brand-text {
    display: flex;
    flex-direction: column;
    color: var(--piscine-white);
    font-family: "Roboto Condensed", Arial, sans-serif;
    font-size: clamp(23px, 2vw, 38px);
    line-height: 0.85;
    white-space: nowrap;
}

.piscine-header__brand-text strong {
    font-weight: 700;
}

.piscine-header__brand-text span {
    margin-top: 11px;
    font-weight: 500;
}


/* ==========================================================
   PRÉSENTATION
   ========================================================== */

.piscine-intro {
    position: relative;
    padding: clamp(70px, 7vw, 125px) 0 clamp(85px, 8vw, 145px);
    background: var(--piscine-white);
}

.piscine-intro__grid {
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
    gap: clamp(70px, 8vw, 145px);
}

.piscine-intro__grid--main {
    align-items: center;
}

.piscine-intro__content {
    max-width: 670px;
}

.piscine-intro__subtitle {
    margin: 38px 0 28px;
    color: var(--piscine-blue);
    font-family: "Roboto Condensed", Arial, sans-serif;
    font-size: clamp(22px, 1.75vw, 31px);
    font-weight: 400;
    line-height: 1.28;
    text-transform: uppercase;
}

.piscine-intro__media {
    display: grid;
    place-items: center;
}

.piscine-intro__image {
    width: min(100%, 700px);
}

.piscine-intro__image img {
    width: 100%;
    height: auto;
}

.piscine-intro__grid--philosophy {
    align-items: start;
    margin-top: clamp(60px, 7vw, 115px);
}

.piscine-intro__left-column,
.piscine-intro__right-column {
    min-width: 0;
    max-width: 670px;
}

.piscine-intro__bubble {
    width: min(80%, 520px);
    margin: clamp(45px, 5vw, 80px) auto 0;
}

.piscine-intro__bubble img {
    width: 100%;
    height: auto;
}


/* ==========================================================
   RÉALISATIONS
   ========================================================== */

.piscine-realisations {
    position: relative;
    min-height: 720px;
    padding: clamp(80px, 7vw, 120px) 0 clamp(95px, 8vw, 145px);
    overflow: hidden;
    isolation: isolate;
}

.piscine-realisations__background {
    position: absolute;
    z-index: -2;
    inset: 0;
    width: 100%;
    height: 100%;
}

.piscine-realisations__background img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.piscine-realisations::after {
    position: absolute;
    z-index: -1;
    inset: 0;
    background: rgba(6, 55, 74, 0.08);
    content: "";
}

.piscine-realisations__heading {
    text-align: center;
}

.piscine-realisations__title {
    display: flex;
    justify-content: center;
    gap: 12px;
    margin: 0;
    color: var(--piscine-white);
    font-family: "Roboto Condensed", Arial, sans-serif;
    font-size: clamp(36px, 3.2vw, 56px);
    line-height: 1;
    text-transform: uppercase;
}

.piscine-realisations__title span {
    font-weight: 300;
    font-style: italic;
}

.piscine-realisations__title strong {
    font-weight: 700;
}

.piscine-realisations__trait {
    width: clamp(150px, 13.8vw, 263px);
    margin: 25px auto 0;
}

.piscine-realisations__trait img {
    width: 100%;
    height: auto;
}

.piscine-realisations__gallery {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(24px, 3vw, 50px);
    margin-top: clamp(60px, 6vw, 95px);
}

.piscine-realisations__item {
    overflow: hidden;
    border: 7px solid rgba(255, 255, 255, 0.94);
    background: var(--piscine-white);
    box-shadow: var(--piscine-shadow);
}

.piscine-realisations__item:nth-child(1) {
    transform: rotate(-1.4deg) translateY(18px);
}

.piscine-realisations__item:nth-child(2) {
    transform: rotate(1deg) translateY(-10px);
}

.piscine-realisations__item:nth-child(3) {
    transform: rotate(-0.8deg) translateY(14px);
}

.piscine-realisations__item img {
    width: 100%;
    aspect-ratio: 900 / 624;
    object-fit: cover;
    transition: transform 250ms ease;
}

.piscine-realisations__item:hover img {
    transform: scale(1.025);
}


/* ==========================================================
   BANDEAU ATOUTS
   ========================================================== */

.piscine-atouts {
    position: relative;
    min-height: clamp(220px, 18vw, 350px);
    display: grid;
    align-items: center;
    padding: clamp(65px, 6vw, 100px) 0;
    overflow: hidden;
}

.piscine-atouts__background {
    position: absolute;
    z-index: 0;
    inset: 0;
    width: 100%;
    height: 100%;
}

.piscine-atouts__background img {
    width: 100%;
    height: 100%;
    object-fit: fill;
}

.piscine-atouts__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-items: center;
    gap: clamp(28px, 3.3vw, 58px);
}

.piscine-atouts__item {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    align-items: center;
    gap: clamp(16px, 1.7vw, 28px);
    min-width: 0;
}

.piscine-atouts__icon {
    display: grid;
    place-items: center;
    width: 72px;
    height: 72px;
    border-radius: 50%;
    color: var(--piscine-blue);
    background: var(--piscine-white);
}

.piscine-atouts__icon svg {
    width: 42px;
    height: 42px;
    fill: none;
    stroke: currentColor;
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.piscine-atouts__icon svg circle,
.piscine-atouts__icon svg path:not(:first-child) {
    fill: none;
}

.piscine-atouts__item p {
    margin: 0;
    color: var(--piscine-blue);
    font-family: "Roboto Condensed", Arial, sans-serif;
    font-size: clamp(21px, 1.7vw, 31px);
    font-weight: 700;
    font-style: italic;
    line-height: 1.12;
}


/* ==========================================================
   PRODUITS ET ACCESSOIRES
   ========================================================== */

.piscine-produits {
    position: relative;
    padding: clamp(90px, 9vw, 165px) 0 clamp(80px, 8vw, 140px);
    background: var(--piscine-white);
    overflow: hidden;
}

.piscine-produits__waves {
    position: absolute;
    z-index: 0;
    top: 55px;
    left: -80px;
    width: min(44vw, 650px);
    height: auto;
    opacity: 0.9;
}

.piscine-produits__waves path {
    fill: none;
    stroke: var(--piscine-wave);
    stroke-width: 38;
    stroke-linecap: round;
}

.piscine-produits__grid {
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
    align-items: center;
    gap: clamp(75px, 9vw, 155px);
}

.piscine-produits__media {
    position: relative;
    z-index: 2;
    display: grid;
    place-items: center;
}

.piscine-produits__image {
    width: min(100%, 690px);
}

.piscine-produits__image img {
    width: 100%;
    height: auto;
}

.piscine-produits__content {
    position: relative;
    z-index: 2;
    max-width: 680px;
}

.piscine-produits__content .piscine-copy {
    margin-top: 38px;
}


/* ==========================================================
   SERVICE APRÈS-VENTE
   ========================================================== */

.piscine-sav {
    position: relative;
    padding: clamp(45px, 5vw, 80px) 0 clamp(90px, 8vw, 145px);
    background: var(--piscine-white);
}

.piscine-sav__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: center;
    gap: clamp(75px, 9vw, 155px);
}

.piscine-sav__content {
    max-width: 680px;
}

.piscine-sav__content .piscine-copy {
    margin-top: 38px;
}

.piscine-sav__media {
    display: grid;
    place-items: center;
}

.piscine-sav__image {
    width: min(100%, 690px);
}

.piscine-sav__image img {
    width: 100%;
    height: auto;
}


/* ==========================================================
   EXPERTS
   ========================================================== */

.piscine-experts {
    position: relative;
    padding: clamp(80px, 7vw, 115px) 0 clamp(40px, 4vw, 65px);
    border-top: 7px solid var(--piscine-blue);
    background: var(--piscine-white);
}

.piscine-experts__content {
    max-width: 980px;
    margin-inline: auto;
    text-align: center;
}

.piscine-experts__title {
    justify-content: center;
}

.piscine-experts__trait {
    margin-inline: auto;
}

.piscine-experts__copy {
    max-width: 850px;
    margin: 35px auto 0;
}

.piscine-experts__copy p {
    line-height: 1.42;
}


/* ==========================================================
   ENGAGEMENTS
   ========================================================== */

.piscine-engagements {
    background: var(--piscine-white);
}

.piscine-engagements__top {
    position: relative;
    min-height: 520px;
    overflow: hidden;
}

.piscine-engagements__top::after {
    position: absolute;
    right: 0;
    bottom: -1px;
    left: 0;
    height: 38px;
    background: var(--piscine-yellow);
    clip-path: polygon(0 45%, 100% 100%, 100% 100%, 0 100%);
    content: "";
}

.piscine-engagements__grid {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    align-items: end;
    gap: clamp(60px, 7vw, 120px);
    min-height: 520px;
}

.piscine-engagements__visual {
    position: relative;
    width: min(100%, 520px);
    justify-self: end;
    align-self: end;
}

.piscine-engagements__personnage {
    width: min(100%, 365px);
    margin-inline: auto;
}

.piscine-engagements__personnage img {
    width: 100%;
    height: auto;
}

.piscine-engagements__button {
    position: absolute;
    top: 55%;
    left: 0;
    display: inline-flex;
    align-items: center;
    gap: 16px;
    min-height: 48px;
    padding: 11px 20px;
    border-radius: 999px;
    color: var(--piscine-blue);
    background: var(--piscine-yellow);
    font-family: "Poppins", Arial, sans-serif;
    font-size: 16px;
    font-weight: 700;
    text-decoration: none;
    box-shadow: 0 12px 25px rgba(9, 58, 77, 0.16);
    transition: transform 180ms ease, box-shadow 180ms ease;
}

.piscine-engagements__button:hover,
.piscine-engagements__button:focus-visible {
    transform: translateY(-2px);
    box-shadow: 0 17px 32px rgba(9, 58, 77, 0.22);
}

.piscine-engagements__list-zone {
    align-self: center;
    padding-bottom: 60px;
}

.piscine-engagements__list {
    display: grid;
    gap: 22px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.piscine-engagements__list li {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    align-items: center;
    gap: 18px;
    color: var(--piscine-blue);
    font-family: "Poppins", Arial, sans-serif;
    font-size: clamp(18px, 1.35vw, 24px);
    line-height: 1.25;
}

.piscine-engagements__list picture {
    width: 25px;
}

.piscine-engagements__list img {
    width: 100%;
    height: auto;
}


/* ==========================================================
   RÉSEAUX SOCIAUX
   ========================================================== */

.piscine-social {
    position: relative;
    min-height: clamp(360px, 29vw, 510px);
    display: grid;
    align-items: center;
    padding: clamp(85px, 8vw, 125px) 0 clamp(75px, 7vw, 110px);
    background: var(--piscine-yellow);
    clip-path: polygon(0 0, 100% 10%, 100% 100%, 0 100%);
}

.piscine-social__content {
    max-width: 760px;
    margin-inline: auto;
    text-align: center;
}

.piscine-social__title {
    justify-content: center;
}

.piscine-social__trait {
    margin-inline: auto;
}

.piscine-social__content p {
    max-width: 620px;
    margin: 34px auto 0;
    color: var(--piscine-blue);
    font-family: "Poppins", Arial, sans-serif;
    font-size: clamp(16px, 1.15vw, 21px);
    line-height: 1.38;
}

.piscine-social__links {
    display: flex;
    justify-content: center;
    gap: 22px;
    margin-top: 28px;
}

.piscine-social__links a {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    color: var(--piscine-blue);
    text-decoration: none;
    transition: transform 180ms ease, opacity 180ms ease;
}

.piscine-social__links a:hover,
.piscine-social__links a:focus-visible {
    transform: translateY(-2px);
    opacity: 0.72;
}

.piscine-social__links svg {
    width: 25px;
    height: 25px;
    fill: currentColor;
}


/* ==========================================================
   LABELS
   ========================================================== */

.piscine-labels {
    padding: clamp(70px, 7vw, 120px) 0 clamp(65px, 6vw, 110px);
    background: var(--piscine-white);
}

.piscine-labels__heading {
    text-align: center;
}

.piscine-labels__heading .piscine-title {
    justify-content: center;
}

.piscine-labels__trait {
    margin-inline: auto;
}

.piscine-labels__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-items: center;
    gap: clamp(40px, 6vw, 100px);
    margin-top: clamp(55px, 6vw, 90px);
}

.piscine-labels__logo {
    display: grid;
    place-items: center;
    min-height: 100px;
}

.piscine-labels__logo img {
    width: auto;
    max-width: 100%;
    max-height: 95px;
    object-fit: contain;
}


/* ==========================================================
   RESPONSIVE : 1200 PX
   ========================================================== */

@media screen and (max-width: 1199.98px) {

    .piscine-container {
        width: min(100% - 40px, 1100px);
    }

    .piscine-header__content {
        right: 25px;
        gap: 16px;
    }

    .piscine-header__brand-icon {
        width: 52px;
        height: 52px;
    }

    .piscine-intro__grid,
    .piscine-produits__grid,
    .piscine-sav__grid {
        gap: 65px;
    }

    .piscine-atouts__grid {
        gap: 25px;
    }

    .piscine-atouts__item {
        grid-template-columns: 62px minmax(0, 1fr);
        gap: 15px;
    }

    .piscine-atouts__icon {
        width: 62px;
        height: 62px;
    }

    .piscine-atouts__icon svg {
        width: 36px;
        height: 36px;
    }
}


/* ==========================================================
   RESPONSIVE : TABLETTES
   ========================================================== */

@media screen and (max-width: 991.98px) {

    .piscine-header {
        min-height: 220px;
    }

    .piscine-header__content {
        right: 14px;
        gap: 10px;
    }

    .piscine-header__separator {
        height: 52px;
    }

    .piscine-header__brand-icon {
        width: 42px;
        height: 42px;
    }

    .piscine-intro__grid,
    .piscine-produits__grid,
    .piscine-sav__grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .piscine-intro__content,
    .piscine-intro__left-column,
    .piscine-intro__right-column,
    .piscine-produits__content,
    .piscine-sav__content {
        max-width: 760px;
        justify-self: center;
    }

    .piscine-intro__media {
        order: 2;
    }

    .piscine-intro__grid--philosophy {
        gap: 55px;
    }

    .piscine-intro__bubble {
        width: min(72%, 520px);
    }

    .piscine-realisations__gallery {
        gap: 20px;
    }

    .piscine-atouts {
        min-height: 430px;
        padding: 90px 0;
    }

    .piscine-atouts__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 48px;
    }

    .piscine-atouts__item {
        width: min(100%, 335px);
        justify-self: center;
        grid-template-columns: 70px minmax(0, 1fr);
        gap: 22px;
    }

    .piscine-atouts__icon {
        width: 70px;
        height: 70px;
    }

    .piscine-produits__media {
        order: 2;
    }

    .piscine-produits__waves {
        width: 70vw;
    }

    .piscine-engagements__grid {
        gap: 35px;
    }

    .piscine-engagements__button {
        left: -10px;
    }

    .piscine-labels__grid {
        gap: 45px;
    }
}


/* ==========================================================
   RESPONSIVE : MOBILES
   ========================================================== */

@media screen and (max-width: 767.98px) {

    .piscine-container {
        width: min(100% - 32px, 680px);
    }

    .piscine-title {
        display: block;
        font-size: clamp(30px, 8vw, 42px);
    }

    .piscine-title span {
        display: block;
    }

    .piscine-title span + span {
        margin-top: 5px;
    }

    .piscine-copy p,
    .piscine-copy ul {
        font-size: 17px;
        line-height: 1.5;
    }

    .piscine-header {
        display: flex;
        flex-direction: column;
        min-height: 0;
        aspect-ratio: auto;
        overflow: visible;
    }

    .piscine-header__background {
        display: none;
    }

    .piscine-header__mobile-image {
        display: block;
        width: 100%;
        aspect-ratio: 960 / 366;
    }

    .piscine-header__mobile-image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .piscine-header__content {
        position: relative;
        inset: auto;
        display: flex;
        min-height: 220px;
        padding: 35px 24px 48px;
        background: #128DC1FF;
        transform: none;
    }

    .piscine-header__content::after {
        position: absolute;
        right: 0;
        bottom: -1px;
        left: 0;
        height: 32px;
        background: var(--piscine-white);
        clip-path: polygon(0 100%, 100% 35%, 100% 100%, 0 100%);
        content: "";
    }

    .piscine-header__slogan-top {
        font-size: clamp(23px, 5.5vw, 33px);
    }

    .piscine-header__slogan-bottom {
        font-size: clamp(27px, 6vw, 36px);
    }

    .piscine-header__separator {
        height: 60px;
    }

    .piscine-header__brand-icon {
        width: 52px;
        height: 52px;
    }

    .piscine-header__brand-text {
        font-size: 24px;
    }

    .piscine-intro {
        padding: 68px 0 78px;
    }

    .piscine-intro__grid {
        gap: 45px;
    }

    .piscine-intro__subtitle {
        margin: 30px 0 24px;
        font-size: 21px;
    }

    .piscine-intro__grid--philosophy {
        margin-top: 60px;
    }

    .piscine-intro__bubble {
        width: min(88%, 520px);
        margin-top: 42px;
    }

    .piscine-realisations {
        min-height: auto;
        padding: 70px 0 85px;
    }

    .piscine-realisations__title {
        display: block;
        font-size: clamp(31px, 8vw, 44px);
    }

    .piscine-realisations__title span,
    .piscine-realisations__title strong {
        display: block;
    }

    .piscine-realisations__gallery {
        grid-template-columns: minmax(0, 1fr);
        max-width: 560px;
        margin-inline: auto;
        gap: 30px;
    }

    .piscine-realisations__item:nth-child(n) {
        transform: none;
    }

    .piscine-atouts {
        min-height: 625px;
        padding: 95px 0;
    }

    .piscine-atouts__grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 32px;
    }

    .piscine-atouts__item {
        width: min(100%, 310px);
        grid-template-columns: 62px minmax(0, 1fr);
        gap: 22px;
    }

    .piscine-atouts__icon {
        width: 62px;
        height: 62px;
    }

    .piscine-atouts__item p {
        font-size: 22px;
    }

    .piscine-produits,
    .piscine-sav {
        padding: 72px 0 80px;
    }

    .piscine-produits__waves {
        top: 20px;
        left: -160px;
        width: 120vw;
        opacity: 0.62;
    }

    .piscine-produits__grid,
    .piscine-sav__grid {
        gap: 45px;
    }

    .piscine-experts {
        padding: 65px 0 40px;
    }

    .piscine-experts__title {
        display: block;
    }

    .piscine-engagements__top {
        min-height: auto;
        padding-top: 20px;
    }

    .piscine-engagements__grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 25px;
        min-height: auto;
    }

    .piscine-engagements__visual {
        order: 2;
        width: min(100%, 470px);
        justify-self: center;
    }

    .piscine-engagements__list-zone {
        order: 1;
        width: min(100%, 560px);
        justify-self: center;
        padding: 10px 0 20px;
    }

    .piscine-engagements__personnage {
        width: min(80%, 320px);
    }

    .piscine-engagements__button {
        left: 3%;
    }

    .piscine-social {
        clip-path: polygon(0 0, 100% 5%, 100% 100%, 0 100%);
        padding-top: 95px;
    }

    .piscine-social__title {
        display: block;
    }

    .piscine-labels__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 45px 35px;
    }
}


/* ==========================================================
   RESPONSIVE : PETITS MOBILES
   ========================================================== */

@media screen and (max-width: 520px) {

    .piscine-container {
        width: min(100% - 24px, 480px);
    }

    .piscine-header__mobile-image {
        aspect-ratio: 16 / 7;
    }

    .piscine-header__mobile-image img {
        object-position: center;
    }

    .piscine-header__content {
        flex-direction: column;
        gap: 14px;
        min-height: 260px;
        padding: 28px 16px 50px;
        background: #128DC1FF;
    }

    .piscine-header__slogan {
        align-items: center;
        text-align: center;
    }

    .piscine-header__separator {
        width: min(180px, 55vw);
        height: 2px;
    }

    .piscine-header__brand-icon {
        width: 48px;
        height: 48px;
    }

    .piscine-header__brand-text {
        font-size: 23px;
    }

    .piscine-intro {
        padding: 55px 0 62px;
    }

    .piscine-trait {
        width: 150px;
        margin-top: 19px;
    }

    .piscine-intro__subtitle {
        font-size: 18px;
    }

    .piscine-copy p,
    .piscine-copy ul {
        font-size: 16px;
    }

    .piscine-copy p + p {
        margin-top: 20px;
    }

    .piscine-realisations {
        padding: 60px 0 70px;
    }

    .piscine-realisations__item {
        border-width: 4px;
    }

    .piscine-atouts {
        min-height: 600px;
        padding: 88px 0;
    }

    .piscine-atouts__item {
        width: min(100%, 280px);
        grid-template-columns: 56px minmax(0, 1fr);
        gap: 18px;
    }

    .piscine-atouts__icon {
        width: 56px;
        height: 56px;
    }

    .piscine-atouts__icon svg {
        width: 32px;
        height: 32px;
    }

    .piscine-atouts__item p {
        font-size: 20px;
    }

    .piscine-produits,
    .piscine-sav {
        padding: 58px 0 65px;
    }

    .piscine-engagements__list {
        gap: 18px;
    }

    .piscine-engagements__list li {
        grid-template-columns: 22px minmax(0, 1fr);
        gap: 13px;
        font-size: 16px;
    }

    .piscine-engagements__button {
        left: 0;
        min-height: 44px;
        padding: 10px 16px;
        font-size: 14px;
    }

    .piscine-social {
        min-height: 390px;
        padding: 85px 0 68px;
    }

    .piscine-social__content p {
        font-size: 16px;
    }

    .piscine-labels {
        padding: 60px 0 70px;
    }

    .piscine-labels__grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 36px;
        margin-top: 48px;
    }

    .piscine-labels__logo {
        min-height: 70px;
    }

    .piscine-labels__logo img {
        max-height: 80px;
    }
}

/* Source: pointDeVente/index.css */
.renov-header {
    position: relative;
    width: 100%;
    overflow: hidden;
    background: #ffffff;
}

.renov-header,
.renov-header *,
.renov-header *::before,
.renov-header *::after {
    box-sizing: border-box;
}

.renov-header__container {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    max-width: 2048px;
    aspect-ratio: 2048 / 390;
    margin-inline: auto;
}

.renov-header__image-zone,
.renov-header__yellow-zone {
    position: relative;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
}

.renov-header__image {
    position: absolute;
    inset: 0;
    display: block;
    margin: 0;
    line-height: 0;
}

.renov-header__image img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    object-position: center;
}

.renov-header__yellow-zone::before {
    position: absolute;
    z-index: 0;
    inset: 0;
    background: #FFD500;
    clip-path: polygon(0 0, 100% 0, 100% 90%, 0 100%);
    content: "";
}

.renov-header__content {
    position: absolute;
    z-index: 2;
    top: 45%;
    right: clamp(24px, 4vw, 86px);
    left: clamp(24px, 4vw, 86px);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(18px, 2vw, 34px);
    transform: translateY(-50%);
}

.renov-header__slogan {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    min-width: 0;
    color: #0d4053;
    text-align: right;
    line-height: 1;
    white-space: nowrap;
}

.renov-header__slogan-top,
.renov-header__slogan-bottom {
    display: block;
    font-size: clamp(28px, 2.6vw, 50px);
    line-height: 1;
}

.renov-header__slogan-top {
    font-weight: 500;
}

.renov-header__slogan-bottom {
    margin-top: 8px;
    font-weight: 700;
}

.renov-header__separator {
    flex: 0 0 2px;
    width: 2px;
    height: clamp(58px, 5vw, 78px);
    background: #ffffff;
}

.renov-header__brand {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 10px;
    color: #ffffff;
}

.renov-header__brand-icon {
    display: block;
    flex: 0 0 auto;
    width: clamp(45px, 4vw, 72px);
    height: clamp(45px, 4vw, 72px);
    margin: 0;
    line-height: 0;
}

.renov-header__brand-icon img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.renov-header__brand-text {
    display: flex;
    flex-direction: column;
    color: #ffffff;
    font-family: "Roboto Condensed", Arial, sans-serif;
    font-size: clamp(20px, 1.7vw, 32px);
    line-height: 0.88;
    white-space: nowrap;
}

.renov-header__brand-text strong {
    font-weight: 700;
}

.renov-header__brand-text span {
    margin-top: 8px;
    font-weight: 500;
}

@media screen and (max-width: 1199.98px) {
    .renov-header__content {
        right: 22px;
        left: 22px;
        gap: 14px;
    }


    .renov-header__slogan-top,
    .renov-header__slogan-bottom {
    font-size: clamp(25px, 3.1vw, 38px);
}

    .renov-header__brand-icon {
        width: 48px;
        height: 48px;
    }

    .renov-header__brand-text {
        font-size: 22px;
    }


}

@media screen and (max-width: 991.98px) {
    .renov-header__container {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        aspect-ratio: 1920 / 430;
    }

    .renov-header__content {
    right: 12px;
    left: 12px;
    gap: 9px;
}

    .renov-header__slogan-top,
    .renov-header__slogan-bottom {
        font-size: clamp(22px, 3.2vw, 31px);
    }

    .renov-header__separator {
        flex-basis: 1px;
        width: 1px;
        height: 46px;
    }

    .renov-header__brand-icon {
        width: 38px;
        height: 38px;
    }

    .renov-header__brand-text {
        font-size: 18px;
    }

}

@media screen and (max-width: 767.98px) {
    .renov-header {
        overflow: visible;
    }


    .renov-header__container {
    display: flex;
    flex-direction: column;
    aspect-ratio: auto;
    overflow: visible;
}

    .renov-header__image-zone {
        width: 100%;
        aspect-ratio: 960 / 366;
        margin-bottom: -1px;
    }

    .renov-header__yellow-zone {
        width: 100%;
        min-height: 235px;
        margin-top: -1px;
    }

    .renov-header__yellow-zone::before {
        clip-path: polygon(0 0, 100% 0, 100% 92%, 0 100%);
    }

    .renov-header__content {
        inset: 0;
        top: auto;
        padding: 20px 24px 42px;
        transform: none;
    }

    .renov-header__slogan-top,
    .renov-header__slogan-bottom {
        font-size: clamp(24px, 5vw, 34px);
    }

    .renov-header__separator {
        height: 58px;
    }

    .renov-header__brand-icon {
        width: 50px;
        height: 50px;
    }

    .renov-header__brand-text {
        font-size: 23px;
    }

}

@media screen and (max-width: 520px) {
    .renov-header__image-zone {
        aspect-ratio: 16 / 7;
    }


    .renov-header__image img {
    object-position: 47% center;
}

    .renov-header__yellow-zone {
        min-height: 250px;
    }

    .renov-header__content {
        flex-direction: column;
        gap: 11px;
        padding: 18px 16px 38px;
    }

    .renov-header__slogan {
        align-items: center;
        width: 100%;
        text-align: center;
    }

    .renov-header__slogan-top {
        font-size: clamp(23px, 6.6vw, 29px);
    }

    .renov-header__slogan-bottom {
        font-size: clamp(26px, 7.2vw, 32px);
    }

    .renov-header__separator {
        flex: 0 0 2px;
        width: min(170px, 52vw);
        height: 2px;
    }

    .renov-header__brand-icon {
        width: 45px;
        height: 45px;
    }

    .renov-header__brand-text {
        font-size: 22px;
    }


}


.image-fixe {
    display: block;
    width: 100%;
    overflow: hidden;
}

.image-fixe img {
    display: block;
    width: 100%;
    height: auto;
    max-width: none;
    object-fit: contain;
}


.image-fixe {
    display: block;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    overflow: hidden;
}

.image-fixe img {
    display: block;
    width: 100%;
    height: auto;
    max-width: none;
    object-fit: contain;
}

/* Source: construction/index.css */
/* ==========================================================
   HEADER BÂTI / RENOV
   Même comportement que le header CLIM
   ========================================================== */

.renov-header,
.renov-header *,
.renov-header *::before,
.renov-header *::after {
    box-sizing: border-box;
}

.renov-header {
    --renov-header-blue: #0d4053;
    --renov-header-red: #e30613;
    --renov-header-white: #ffffff;

    position: relative;

    width: 100%;
    margin: 0;
    padding: 0;

    overflow: hidden;

    background-color: var(--renov-header-white);
}

.renov-header__container {
    position: relative;

    display: grid;
    grid-template-columns:
        minmax(0, 50%)
        minmax(0, 50%);

    align-items: stretch;

    gap: 0 !important;
    row-gap: 0 !important;
    column-gap: 0 !important;

    width: 100%;

    aspect-ratio: 1920 / 366;

    margin: 0 auto;
    padding: 0;

    overflow: hidden;
}


/* ==========================================================
   IMAGE DE GAUCHE
   ========================================================== */

.renov-header__image-zone {
    position: relative;

    align-self: stretch;

    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden;
}

.renov-header__image {
    position: absolute;

    inset: 0;

    display: block;

    width: 100%;
    height: 100%;

    margin: 0 !important;
    padding: 0 !important;

    line-height: 0;
}

.renov-header__image img {
    display: block;

    width: 100%;
    height: 100%;
    max-width: none;

    margin: 0 !important;
    padding: 0 !important;

    vertical-align: top;

    object-fit: cover;
    object-position: center center;
}


/* ==========================================================
   ZONE ROUGE
   ========================================================== */

.renov-header__red-zone {
    position: relative;

    align-self: stretch;

    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden;
}

.renov-header__red-zone::before {
    position: absolute;
    z-index: 0;

    inset: 0;

    display: block;

    width: 100%;
    height: 100%;

    background-color: var(--renov-header-red);

    clip-path: polygon(
            0 0,
            100% 0,
            100% 90%,
            0 100%
    );

    content: "";
}


/* ==========================================================
   CONTENU DE LA ZONE ROUGE
   ========================================================== */

.renov-header__content {
    position: absolute;
    z-index: 2;

    top: 44%;
    right: clamp(20px, 3.5vw, 85px);
    left: clamp(20px, 3.5vw, 85px);

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

    gap: clamp(14px, 1.6vw, 30px);

    min-width: 0;

    margin: 0;
    padding: 0;

    transform: translateY(-50%);
}


/* ==========================================================
   SLOGAN
   ========================================================== */

.renov-header__slogan {
    display: flex;
    flex: 0 1 auto;
    flex-direction: column;
    align-items: flex-end;

    min-width: 0;

    margin: 0;
    padding: 0;

    color: var(--renov-header-blue);

    line-height: 1;
    text-align: right;

    white-space: nowrap;
}

.renov-header__slogan-top {
    display: block;

    margin: 0;
    padding: 0;

    font-size: 50px;
    font-weight: 500;
    line-height: 1;
    letter-spacing: 0;

    white-space: nowrap;
}

.renov-header__slogan-bottom {
    display: block;

    margin: 7px 0 0;
    padding: 0;

    font-size: 50px;
    font-weight: 700;
    line-height: 1;

    white-space: nowrap;
}


/* ==========================================================
   SÉPARATEUR BLANC
   ========================================================== */

.renov-header__separator {
    display: block;
    flex: 0 0 2px;

    width: 2px;
    height: 76px;

    margin: 0;
    padding: 0;

    background-color: var(--renov-header-white);
}


/* ==========================================================
   LOGO BÂTI LEAL’O
   ========================================================== */

.renov-header__brand {
    display: flex;
    flex: 0 0 auto;
    align-items: center;

    gap: clamp(7px, 0.8vw, 12px);

    min-width: 0;

    margin: 0;
    padding: 0;

    color: var(--renov-header-white);
}

.renov-header__brand-icon {
    display: block;
    flex: 0 0 auto;

    width: 66px;
    height: 66px;

    margin: 0;
    padding: 0;

    line-height: 0;
}

.renov-header__brand-icon img {
    display: block;

    width: 100%;
    height: 100%;
    max-width: none;

    margin: 0;
    padding: 0;

    vertical-align: top;

    object-fit: contain;
}

.renov-header__brand-text {
    display: flex;
    flex-direction: column;

    margin: 0;
    padding: 0;

    color: var(--renov-header-white);

    font-family:
            "Roboto Condensed",
            Arial,
            sans-serif;

    font-size: 30px;
    line-height: 0.9;

    white-space: nowrap;
}

.renov-header__brand-text strong {
    display: block;

    margin: 0;
    padding: 0;

    font-weight: 700;
}

.renov-header__brand-text span {
    display: block;

    margin: 8px 0 0;
    padding: 0;

    font-weight: 500;
}


/* ==========================================================
   PC XXL
   1400PX ET PLUS
   ========================================================== */

@media screen and (min-width: 1400px) {

    .renov-header__container {
        grid-template-columns:minmax(0, 50%)minmax(0, 50%);
    }
    .renov-header__content {
        top: 44%;
        right: clamp(45px, 5vw, 100px);
        left: clamp(45px, 5vw, 100px);
        gap: clamp(18px, 2vw, 35px);
    }

    .renov-header__slogan-top,
    .renov-header__slogan-bottom {
        font-size: 50px;
    }

    .renov-header__separator {
        height: 76px;
    }

    .renov-header__brand-icon {
        width: 66px;
        height: 66px;
    }

    .renov-header__brand-text {
        font-size: 30px;
    }
}


/* ==========================================================
   PC LARGE
   1200PX À 1399PX
   ========================================================== */

@media screen and (min-width: 1200px) and (max-width: 1399.98px) {

    .renov-header__container {
        grid-template-columns:
            minmax(0, 50%)
            minmax(0, 50%);
    }

    .renov-header__content {
        top: 44%;

        right: clamp(18px, 2vw, 28px);
        left: clamp(18px, 2vw, 28px);

        gap: clamp(10px, 1.2vw, 17px);
    }

    .renov-header__slogan-top,
    .renov-header__slogan-bottom {
        font-size: 50px;
    }

    .renov-header__slogan-bottom {
        margin-top: 5px;
    }

    .renov-header__separator {
        height: 66px;
    }

    .renov-header__brand {
        gap: 7px;
    }

    .renov-header__brand-icon {
        width: 50px;
        height: 50px;
    }

    .renov-header__brand-text {
        font-size: 23px;
    }

    .renov-header__brand-text span {
        margin-top: 5px;
    }
}


/* ==========================================================
   PETIT PC
   992PX À 1199PX
   ========================================================== */

@media screen and (min-width: 992px) and (max-width: 1199.98px) {

    .renov-header__container {
        grid-template-columns:
            minmax(0, 44%)
            minmax(0, 56%);
    }

    .renov-header__content {
        top: 44%;

        right: 14px;
        left: 14px;

        gap: 10px;
    }

    .renov-header__slogan-top,
    .renov-header__slogan-bottom {
        font-size: 50px;
    }

    .renov-header__slogan-bottom {
        margin-top: 5px;
    }

    .renov-header__separator {
        height: 62px;
    }

    .renov-header__brand {
        gap: 6px;
    }

    .renov-header__brand-icon {
        width: 43px;
        height: 43px;
    }

    .renov-header__brand-text {
        font-size: 20px;
    }

    .renov-header__brand-text span {
        margin-top: 4px;
    }
}


/* ==========================================================
   TABLETTE
   768PX À 991PX
   ========================================================== */

@media screen and (min-width: 768px) and (max-width: 991.98px) {

    .renov-header__container {
        grid-template-columns:
            minmax(0, 50%)
            minmax(0, 50%);

        aspect-ratio: 1920 / 410;
    }

    .renov-header__content {
        top: 44%;

        right: 10px;
        left: 10px;

        gap: 8px;
    }

    .renov-header__slogan {
        flex: 1 1 auto;
    }

    .renov-header__slogan-top {
        font-size: clamp(23px, 3vw, 30px);
    }

    .renov-header__slogan-bottom {
        margin-top: 4px;

        font-size: clamp(25px, 3.3vw, 33px);
    }

    .renov-header__separator {
        flex: 0 0 1px;

        width: 1px;
        height: 44px;
    }

    .renov-header__brand {
        gap: 5px;
    }

    .renov-header__brand-icon {
        width: clamp(32px, 4.2vw, 40px);
        height: clamp(32px, 4.2vw, 40px);
    }

    .renov-header__brand-text {
        font-size: clamp(15px, 2vw, 19px);
    }

    .renov-header__brand-text span {
        margin-top: 4px;
    }
}


/* ==========================================================
   GRAND MOBILE
   521PX À 767PX
   On garde une composition horizontale propre
   ========================================================== */

@media screen and (min-width: 521px) and (max-width: 767.98px) {

    .renov-header {
        overflow: visible;
    }

    .renov-header__container {
        display: flex;
        flex-direction: column;

        gap: 0 !important;
        row-gap: 0 !important;
        column-gap: 0 !important;

        width: 100%;
        max-width: 100%;

        aspect-ratio: auto;

        margin: 0;
        padding: 0;

        overflow: visible;
    }

    .renov-header__image-zone {
        position: relative;

        flex: 0 0 auto;

        width: 100%;
        height: auto;

        aspect-ratio: 960 / 366;

        margin: 0 0 -1px !important;
        padding: 0 !important;

        overflow: hidden;
    }

    .renov-header__image {
        position: absolute;

        inset: 0;

        width: 100%;
        height: 100%;

        margin: 0 !important;
        padding: 0 !important;
    }

    .renov-header__image img {
        width: 100%;
        height: 100%;

        margin: 0 !important;
        padding: 0 !important;

        object-fit: cover;
        object-position: center center;
    }

    .renov-header__red-zone {
        position: relative;

        flex: 0 0 auto;

        width: 100%;
        height: auto;
        min-height: clamp(190px, 34vw, 225px);

        margin: -1px 0 0 !important;
        padding: 0 !important;

        overflow: hidden;
    }

    .renov-header__red-zone::before {
        top: -1px;
        bottom: 0;

        height: calc(100% + 1px);

        clip-path: polygon(
                0 0,
                100% 0,
                100% 91%,
                0 100%
        );
    }

    .renov-header__content {
        position: absolute;

        inset: 0;

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

        gap: clamp(12px, 2.5vw, 18px);

        margin: 0;

        padding: 15px 22px 30px;

        transform: none;
    }

    .renov-header__slogan {
        align-items: flex-end;

        width: auto;

        text-align: right;
    }

    .renov-header__slogan-top {
        font-size: clamp(24px, 4.2vw, 30px);
        text-align: right;
    }

    .renov-header__slogan-bottom {
        margin-top: 5px;

        font-size: clamp(27px, 4.8vw, 36px);
        text-align: right;
    }

    .renov-header__separator {
        flex: 0 0 2px;

        width: 2px;
        height: clamp(52px, 9vw, 66px);
    }

    .renov-header__brand {
        justify-content: flex-start;
    }

    .renov-header__brand-icon {
        width: clamp(42px, 8vw, 54px);
        height: clamp(42px, 8vw, 54px);
    }

    .renov-header__brand-text {
        font-size: clamp(19px, 3.7vw, 25px);
    }

    .renov-header__brand-text span {
        margin-top: 5px;
    }
}


/* ==========================================================
   MOBILE
   361PX À 520PX
   Là on passe en colonne
   ========================================================== */

@media screen and (min-width: 361px) and (max-width: 520px) {

    .renov-header {
        overflow: visible;
    }

    .renov-header__container {
        display: flex;
        flex-direction: column;

        gap: 0 !important;
        row-gap: 0 !important;
        column-gap: 0 !important;

        width: 100%;
        max-width: 100%;

        aspect-ratio: auto;

        margin: 0;
        padding: 0;

        overflow: visible;
    }

    .renov-header__image-zone {
        position: relative;

        flex: 0 0 auto;

        width: 100%;
        height: auto;

        aspect-ratio: 16 / 7;

        margin: 0 0 -1px !important;
        padding: 0 !important;

        overflow: hidden;
    }

    .renov-header__image {
        position: absolute;

        inset: 0;

        width: 100%;
        height: 100%;

        margin: 0 !important;
        padding: 0 !important;
    }

    .renov-header__image img {
        width: 100%;
        height: 100%;

        margin: 0 !important;
        padding: 0 !important;

        object-fit: cover;
        object-position: center center;
    }

    .renov-header__red-zone {
        position: relative;

        flex: 0 0 auto;

        width: 100%;
        height: 225px;
        min-height: 225px;

        margin: -1px 0 0 !important;
        padding: 0 !important;

        overflow: hidden;
    }

    .renov-header__red-zone::before {
        top: -1px;
        bottom: 0;

        height: calc(100% + 1px);

        clip-path: polygon(
                0 0,
                100% 0,
                100% 93%,
                0 100%
        );
    }

    .renov-header__content {
        position: absolute;

        inset: 0;

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

        gap: 11px;

        margin: 0;

        padding:
                15px
                18px
                31px;

        transform: none;
    }

    .renov-header__slogan {
        align-items: center;

        width: 100%;

        text-align: center;
    }

    .renov-header__slogan-top {
        font-size: clamp(23px, 6.5vw, 29px);
        text-align: center;
    }

    .renov-header__slogan-bottom {
        margin-top: 5px;

        font-size: clamp(26px, 7.3vw, 33px);
        text-align: center;
    }

    .renov-header__separator {
        flex: 0 0 2px;

        width: min(170px, 52vw);
        height: 2px;
    }

    .renov-header__brand {
        justify-content: center;
    }

    .renov-header__brand-icon {
        width: 45px;
        height: 45px;
    }

    .renov-header__brand-text {
        font-size: 22px;
    }

    .renov-header__brand-text span {
        margin-top: 5px;
    }
}


/* ==========================================================
   TRÈS PETIT MOBILE
   JUSQU’À 360PX
   ========================================================== */

@media screen and (max-width: 360px) {

    .renov-header {
        overflow: visible;
    }

    .renov-header__container {
        display: flex;
        flex-direction: column;

        gap: 0 !important;
        row-gap: 0 !important;
        column-gap: 0 !important;

        width: 100%;
        max-width: 100%;

        aspect-ratio: auto;

        margin: 0;
        padding: 0;

        overflow: visible;
    }

    .renov-header__image-zone {
        position: relative;

        flex: 0 0 auto;

        width: 100%;
        height: auto;

        aspect-ratio: 16 / 7;

        margin: 0 0 -1px !important;
        padding: 0 !important;

        overflow: hidden;
    }

    .renov-header__image {
        position: absolute;

        inset: 0;

        width: 100%;
        height: 100%;

        margin: 0 !important;
        padding: 0 !important;
    }

    .renov-header__image img {
        width: 100%;
        height: 100%;

        margin: 0 !important;
        padding: 0 !important;

        object-fit: cover;
        object-position: center center;
    }

    .renov-header__red-zone {
        position: relative;

        flex: 0 0 auto;

        width: 100%;
        height: 215px;
        min-height: 215px;

        margin: -1px 0 0 !important;
        padding: 0 !important;

        overflow: hidden;
    }

    .renov-header__red-zone::before {
        top: -1px;
        bottom: 0;

        height: calc(100% + 1px);

        clip-path: polygon(
                0 0,
                100% 0,
                100% 93%,
                0 100%
        );
    }

    .renov-header__content {
        position: absolute;

        inset: 0;

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

        gap: 10px;

        margin: 0;

        padding:
                14px
                14px
                29px;

        transform: none;
    }

    .renov-header__slogan {
        align-items: center;

        width: 100%;

        text-align: center;
    }

    .renov-header__slogan-top {
        font-size: 21px;
        text-align: center;
    }

    .renov-header__slogan-bottom {
        margin-top: 4px;

        font-size: 24px;
        text-align: center;
    }

    .renov-header__separator {
        flex: 0 0 2px;

        width: min(150px, 52vw);
        height: 2px;
    }

    .renov-header__brand {
        justify-content: center;
    }

    .renov-header__brand-icon {
        width: 41px;
        height: 41px;
    }

    .renov-header__brand-text {
        font-size: 20px;
    }

    .renov-header__brand-text span {
        margin-top: 4px;
    }
}

.depliant-bati-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;

    padding: 10px 18px;
    border: 1.5px solid #E30613;
    border-radius: 999px;
    background-color: #ffffff;

    color: #17445c;
    text-decoration: none;
    line-height: 1;
    cursor: pointer;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.depliant-bati-button__text {
    display: inline-block;
    color: #17445c;
    font-family: inherit;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none;
    white-space: nowrap;
}

.depliant-bati-button__arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    color: #17445c;
    font-size: 20px;
    font-weight: 400;
    line-height: 1;
    transform: translateY(-1px);
}

.depliant-bati-button:hover,
.depliant-bati-button:focus-visible {
    background-color: #E30613;
    border-color: #E30613;
    text-decoration: none;
}

.depliant-bati-button:hover .depliant-bati-button__text,
.depliant-bati-button:hover .depliant-bati-button__arrow,
.depliant-bati-button:focus-visible .depliant-bati-button__text,
.depliant-bati-button:focus-visible .depliant-bati-button__arrow {
    color: #ffffff;
}

.depliant-bati-button:focus-visible {
    outline: 2px solid rgba(227, 6, 19, 0.25);
    outline-offset: 3px;
}



/* Source: contact/index.css */
.contact-renov-header {
    position: relative;
    width: 100%;
    overflow: hidden;
    background: #ffffff;
}

.contact-renov-header,
.contact-renov-header *,
.contact-renov-header *::before,
.contact-renov-header *::after {
    box-sizing: border-box;
}

.contact-renov-header__container {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    aspect-ratio: 2048 / 390;
    margin-inline: auto;
}

.contact-renov-header__image-zone,
.contact-renov-header__blue-zone {
    position: relative;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
}

.contact-renov-header__image {
    position: absolute;
    inset: 0;
    display: block;
    margin: 0;
    line-height: 0;
}

.contact-renov-header__image img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    object-position: center;
}

.contact-renov-header__blue-zone::before {
    position: absolute;
    z-index: 0;
    inset: 0;
    background: #47AECC;
    clip-path: polygon(0 0, 100% 0, 100% 90%, 0 100%);
    content: "";
}

.contact-renov-header__content {
    position: absolute;
    z-index: 2;
    top: 45%;
    right: clamp(24px, 4vw, 86px);
    left: clamp(24px, 4vw, 86px);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(18px, 2vw, 34px);
    transform: translateY(-50%);
}

.contact-renov-header__slogan {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    min-width: 0;
    color: #0d4053;
    text-align: right;
    line-height: 1;
    white-space: nowrap;
}

.contact-renov-header__slogan-top,
.contact-renov-header__slogan-bottom {
    display: block;
    font-size: clamp(28px, 2.6vw, 50px);
    line-height: 1;
}

.contact-renov-header__slogan-top {
    font-weight: 400;
}

.contact-renov-header__slogan-bottom {
    margin-top: 8px;
    font-weight: 700;
}

.contact-renov-header__separator {
    flex: 0 0 2px;
    width: 2px;
    height: clamp(58px, 5vw, 78px);
    background: #ffffff;
}

.contact-renov-header__brand {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 10px;
    color: #ffffff;
}

.contact-renov-header__brand-icon {
    display: block;
    flex: 0 0 auto;
    width: clamp(45px, 4vw, 72px);
    height: clamp(45px, 4vw, 72px);
    margin: 0;
    line-height: 0;
}

.contact-renov-header__brand-icon img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.contact-renov-header__brand-text {
    display: flex;
    flex-direction: column;
    color: #ffffff;
    font-family: "Roboto Condensed", Arial, sans-serif;
    font-size: clamp(20px, 1.7vw, 32px);
    line-height: 0.88;
    white-space: nowrap;
}

.contact-renov-header__brand-text strong {
    font-size: 1.25em;
    font-weight: 700;
}

.contact-renov-header__brand-text span {
    margin-top: 8px;
    font-size: 0.62em;
    font-weight: 400;
    letter-spacing: 0.14em;
}

@media screen and (max-width: 1199.98px) {
    .contact-renov-header__content {
        right: 22px;
        left: 22px;
        gap: 14px;
    }

    .contact-renov-header__slogan-top,
    .contact-renov-header__slogan-bottom {
        font-size: clamp(25px, 3.1vw, 38px);
    }

    .contact-renov-header__brand-icon {
        width: 48px;
        height: 48px;
    }

    .contact-renov-header__brand-text {
        font-size: 22px;
    }
}

@media screen and (max-width: 991.98px) {
    .contact-renov-header__container {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        aspect-ratio: 1920 / 430;
    }

    .contact-renov-header__content {
        right: 12px;
        left: 12px;
        gap: 9px;
    }

    .contact-renov-header__slogan-top,
    .contact-renov-header__slogan-bottom {
        font-size: clamp(22px, 3.2vw, 31px);
    }

    .contact-renov-header__separator {
        flex-basis: 1px;
        width: 1px;
        height: 46px;
    }

    .contact-renov-header__brand-icon {
        width: 38px;
        height: 38px;
    }

    .contact-renov-header__brand-text {
        font-size: 18px;
    }
}

@media screen and (max-width: 767.98px) {
    .contact-renov-header {
        overflow: visible;
    }

    .contact-renov-header__container {
        display: flex;
        flex-direction: column;
        aspect-ratio: auto;
        overflow: visible;
    }

    .contact-renov-header__image-zone {
        width: 100%;
        aspect-ratio: 960 / 366;
        margin-bottom: -1px;
    }

    .contact-renov-header__blue-zone {
        width: 100%;
        min-height: 235px;
        margin-top: -1px;
    }

    .contact-renov-header__blue-zone::before {
        clip-path: polygon(0 0, 100% 0, 100% 92%, 0 100%);
    }

    .contact-renov-header__content {
        position: relative;
        inset: auto;
        display: flex;
        min-height: 220px;
        padding: 35px 24px 48px;
        background: #47AECC;
        transform: none;
    }

    .contact-renov-header__slogan-top,
    .contact-renov-header__slogan-bottom {
        font-size: clamp(24px, 5vw, 34px);
    }

    .contact-renov-header__separator {
        height: 58px;
    }

    .contact-renov-header__brand-icon {
        width: 50px;
        height: 50px;
    }

    .contact-renov-header__brand-text {
        font-size: 23px;
    }
}

@media screen and (max-width: 520px) {
    .contact-renov-header__image-zone {
        aspect-ratio: 16 / 7;
    }

    .contact-renov-header__image img {
        object-position: 47% center;
    }

    .contact-renov-header__blue-zone {
        min-height: 250px;
    }

    .contact-renov-header__content {
        flex-direction: column;
        gap: 11px;
        padding: 18px 16px 38px;
    }

    .contact-renov-header__slogan {
        align-items: center;
        width: 100%;
        text-align: center;
    }

    .contact-renov-header__slogan-top {
        font-size: clamp(23px, 6.6vw, 29px);
    }

    .contact-renov-header__slogan-bottom {
        font-size: clamp(26px, 7.2vw, 32px);
    }

    .contact-renov-header__separator {
        flex: 0 0 2px;
        width: min(170px, 52vw);
        height: 2px;
    }

    .contact-renov-header__brand-icon {
        width: 45px;
        height: 45px;
    }

    .contact-renov-header__brand-text {
        font-size: 22px;
    }
}

/*
|--------------------------------------------------------------------------
| BLOC CONTACT LATÉRAL
|--------------------------------------------------------------------------
*/

.contact-formulaireContactSide {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 430px;
}

.contact-formulaireContactSide,
.contact-formulaireContactSide *,
.contact-formulaireContactSide *::before,
.contact-formulaireContactSide *::after {
    box-sizing: border-box;
}

.contact-formulaireContactSide__contenu {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    max-width: 310px;
    margin-right: auto;
    margin-left: auto;
    color: #0d455d;
}

.contact-formulaireContactSide__logo {
    display: block;
    width: 150px;
    margin: 0 auto 35px;
    padding: 0;
    line-height: 0;
    text-decoration: none;
}

.contact-formulaireContactSide__logo img {
    display: block;
    width: 100%;
    height: auto;
    margin: 0;
}

.contact-formulaireContactSide__coordonnees {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
    max-width: 260px;
    margin-right: auto;
    margin-left: auto;
}

.contact-formulaireContactSide__ligne {
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr);
    align-items: center;
    gap: 13px;
    width: 100%;
    margin: 0;
    padding: 0;
    color: #0d455d;
    font-family: "Montserrat", Arial, sans-serif;
    font-size: 17px;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: 0.5px;
    text-decoration: none;
}

.contact-formulaireContactSide__ligne i {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    margin: 0;
    padding: 0;
    color: #0d455d;
    font-size: 20px;
    line-height: 1;
}

.contact-formulaireContactSide__ligne--adresse {
    align-items: flex-start;
}

.contact-formulaireContactSide__ligne--adresse i {
    margin-top: 2px;
}

a.contact-formulaireContactSide__ligne:hover,
a.contact-formulaireContactSide__ligne:focus-visible {
    color: #0d455d;
    text-decoration: underline;
}

.contact-formulaireContactSide__reseaux {
    display: grid;
    grid-template-columns: repeat(3, 28px);
    align-items: center;
    justify-content: start; /* remplace par center pour centrer les 3 icônes */
    gap: 15px;

    width: 100%;
    max-width: 260px;
    margin: 35px auto 0;
    padding: 0;
}

.contact-formulaireContactSide__reseaux a {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 30px;
    height: 30px;
    margin: 0;
    padding: 0;

    color: #0d455d;
    line-height: 0;
    text-decoration: none;

    transition:
            opacity 0.2s ease,
            transform 0.2s ease;
}

.contact-formulaireContactSide__reseaux img {
    display: block;
    object-fit: contain;
}

/* Facebook */
.contact-formulaireContactSide__reseaux a:nth-child(1) img {
    width: 11px;
    height: 21px;
}

/* Instagram */
.contact-formulaireContactSide__reseaux a:nth-child(2) img {
    width: 20px;
    height: 20px;
}

/* LinkedIn */
.contact-formulaireContactSide__reseaux a:nth-child(3) img {
    width: 20px;
    height: 20px;
}

.contact-formulaireContactSide__reseaux a:hover {
    opacity: 0.7;
    transform: translateY(-2px);
}

.contact-formulaireContactSide__reseaux a:focus-visible {
    outline: 2px solid rgba(13, 69, 93, 0.35);
    outline-offset: 2px;
}
/*
|--------------------------------------------------------------------------
| BOUTON FORMULAIRE CONTACT
|--------------------------------------------------------------------------
*/

.contact-btn-form {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 148px;
    min-width: 148px;
    height: 48px;
    padding: 0 18px;
    border: 1px solid #0d455d;
    border-radius: 24px;
    background-color: transparent;
    color: #0d455d;
    font-family: "Montserrat", Arial, sans-serif;
    font-size: 20px;
    font-weight: 600;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
    box-shadow: none;
    transition:
            background-color 0.2s ease,
            color 0.2s ease,
            border-color 0.2s ease,
            transform 0.2s ease;
}

.contact-btn-form:hover,
.contact-btn-form:focus-visible {
    background-color: #0d455d;
    border-color: #0d455d;
    color: #ffffff;
    text-decoration: none;
}

.contact-btn-form:active {
    transform: translateY(1px);
}

.contact-btn-form:focus-visible {
    outline: 2px solid rgba(13, 69, 93, 0.25);
    outline-offset: 3px;
}

.contact-btn-form span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.contact-btn-form-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    line-height: 0;
}

.contact-btn-form-icon img {
    display: block;
    width: 14px;
    height: 14px;
    object-fit: contain;
    object-position: center;
    transition: filter 0.2s ease;
}

.contact-btn-form:hover .contact-btn-form-icon img,
.contact-btn-form:focus-visible .contact-btn-form-icon img {
    filter: brightness(0) invert(1);
}

@media (max-width: 991.98px) {
    .contact-formulaireContactSide {
        min-height: 400px;
    }

    .contact-formulaireContactSide__ligne {
        gap: 10px;
        font-size: 15px;
    }

    .contact-formulaireContactSide__ligne i {
        font-size: 18px;
    }

    .contact-btn-form {
        width: 148px;
        min-width: 148px;
        height: 48px;
        font-size: 18px;
    }
}

@media (max-width: 767.98px) {
    .contact-formulaireContactSide {
        min-height: auto;
        margin-bottom: 45px !important;
        padding: 30px 15px 35px;
    }

    .contact-formulaireContactSide__contenu {
        max-width: 320px;
    }

    .contact-formulaireContactSide__logo {
        width: 140px;
        margin-bottom: 28px;
    }

    .contact-formulaireContactSide__coordonnees,
    .contact-formulaireContactSide__reseaux {
        max-width: 245px;
    }

    .contact-formulaireContactSide__ligne {
        font-size: 16px;
    }

    .contact-formulaireContactSide__reseaux {
        margin-top: 30px;
    }

    .contact-btn-form {
        width: 148px;
        min-width: 148px;
        height: 48px;
        font-size: 18px;
    }
}

@media (max-width: 575.98px) {
    .contact-formulaireContactSide {
        padding-right: 10px;
        padding-left: 10px;
    }

    .contact-formulaireContactSide__logo {
        width: 130px;
    }

    .contact-formulaireContactSide__ligne {
        grid-template-columns: 20px minmax(0, 1fr);
        gap: 11px;
        font-size: 15px;
    }

    .contact-formulaireContactSide__ligne i {
        width: 20px;
        height: 20px;
        font-size: 18px;
    }

    .contact-formulaireContactSide__reseaux {
        grid-template-columns: repeat(3, 28px);
        column-gap: 14px;
    }

    .contact-formulaireContactSide__reseaux a {
        width: 28px;
        height: 28px;
    }

    .contact-formulaireContactSide__reseaux a:first-child img {
        width: 10px;
        height: 20px;
    }

    .contact-formulaireContactSide__reseaux a:last-child img {
        width: 19px;
        height: 19px;
    }

    .contact-btn-form {
        width: 140px;
        min-width: 140px;
        height: 46px;
        padding: 0 16px;
        border-radius: 23px;
        font-size: 17px;
        gap: 8px;
    }

    .contact-btn-form-icon {
        width: 18px;
        height: 18px;
        flex-basis: 18px;
    }

    .contact-btn-form-icon img {
        width: 13px;
        height: 13px;
    }
}
/* Source: footer.css */
.footer-pbc {
    background-color: #0F4254;
    color: #ffffff;
    width: 100%;
    padding: 18px 0;
    font-size: 12px;
    line-height: 1.4;
    overflow: hidden;
}

.footer-pbc,
.footer-pbc * {
    box-sizing: border-box;
}

.footer-pbc .container {
    max-width: 1180px;
}

.footer-pbc__row {
    min-height: 48px;
}

/* Liens */
.footer-pbc a {
    color: #ffffff;
    text-decoration: none;
}

.footer-pbc a:hover {
    text-decoration: underline;
}

/* Colonne gauche */
.footer-pbc__left {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 5px;
    color: #ffffff;
    font-size: 12px;
    white-space: nowrap;
}

.footer-pbc__bold {
    font-weight: 700;
}

.footer-pbc__sep {
    opacity: 0.85;
}

/* Logo centre */
.footer-pbc__logo {
    display: flex;
    align-items: center;
    justify-content: center;
}

.footer-pbc__logo picture {
    display: block;
}

.footer-pbc__logo img {
    display: block;
    width: 112px;
    max-width: 100%;
    height: auto;
}

/* Colonne droite */
.footer-pbc__right {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.footer-pbc__nav {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 5px;
    color: #ffffff;
    font-size: 12px;
    line-height: 1.4;
    text-align: right;
}

.footer-pbc__nav span {
    color: #ffffff;
    opacity: 0.9;
}

/* Tablette */
@media (max-width: 991px) {
    .footer-pbc {
        padding: 22px 0;
    }

    .footer-pbc__row {
        min-height: auto;
        row-gap: 14px;
    }

    .footer-pbc__left,
    .footer-pbc__logo,
    .footer-pbc__right {
        justify-content: center;
        text-align: center;
    }

    .footer-pbc__logo {
        order: 1;
    }

    .footer-pbc__left {
        order: 2;
        white-space: normal;
    }

    .footer-pbc__right {
        order: 3;
    }

    .footer-pbc__logo img {
        width: 120px;
    }

    .footer-pbc__nav {
        justify-content: center;
        text-align: center;
        max-width: 620px;
        margin: 0 auto;
    }
}

/* Mobile */
@media (max-width: 575px) {
    .footer-pbc {
        padding: 12px 0;
    }

    .footer-pbc .container {
        padding-left: 14px;
        padding-right: 14px;
    }

    .footer-pbc__row {
        row-gap: 10px;
    }

    .footer-pbc__logo img {
        width: 105px;
    }

    .footer-pbc__left {
        font-size: 10px;
        line-height: 1.4;
        justify-content: center;
        white-space: normal;
    }

    .footer-pbc__nav {
        font-size: 10px;
        line-height: 1.5;
        gap: 4px;
    }
}

/* Très petit mobile : évite que tout soit écrasé */
@media (max-width: 380px) {
    .footer-pbc__left {
        flex-direction: column;
        gap: 2px;
    }

    .footer-pbc__left .footer-pbc__sep {
        display: none;
    }

    .footer-pbc__nav {
        max-width: 320px;
    }
}
/* Source: nav/mobile.css */

/* Source: nav/PC.css */
/* ==========================================================
   HEADER — PC
   Fichier : PC.css
   Breakpoint : 992px à 1399.98px
   ========================================================== */

@media screen and (min-width: 992px) and (max-width: 1399.98px) {
    /* ==============================
       Variables
       ============================== */

    .main-header {
        --header-max-width: 1320px;
        --header-horizontal-padding: clamp(24px, 3vw, 40px);

        --header-dark-blue: #063f52;
        --header-light-blue: #e2f3f7;
        --header-yellow: #ffd500;
        --header-border: #edf0f1;
        --header-white: #ffffff;

        --header-topbar-height: 40px;
        --header-navigation-height: 96px;
        --header-logo-column: clamp(140px, 14vw, 180px);
        --header-actions-column: clamp(320px, 29vw, 400px);

        width: 100%;
        color: var(--header-dark-blue);
        background-color: var(--header-white);
    }

    .main-header *,
    .main-header *::before,
    .main-header *::after {
        box-sizing: border-box;
    }

    /* ==============================
       Barre supérieure
       ============================== */

    .main-header__topbar {
        width: 100%;
        height: var(--header-topbar-height);
        background-color: var(--header-yellow);
    }

    .main-header__topbar-container {
        width: min(100%, var(--header-max-width));
        height: 100%;
        margin: 0 auto;
        padding-inline: var(--header-horizontal-padding);

        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    /* ==============================
       Horaires
       ============================== */

    .main-header__schedule {
        display: flex;
        align-items: center;
        gap: 12px;

        color: var(--header-dark-blue);
        line-height: 1;
        white-space: nowrap;
    }

    .main-header__schedule img {
        display: block;
        flex: 0 0 auto;

        width: 17px;
        height: 17px;
        object-fit: contain;
    }

    /* ==============================
       Réseaux sociaux
       ============================== */

    .main-header__socials {
        display: flex;
        align-items: center;
        gap: 14px;
        white-space: nowrap;
    }

    .main-header__socials a {
        display: flex;
        align-items: center;
        justify-content: center;

        color: inherit;
        text-decoration: none;
    }

    .main-header__socials img {
        display: block;

        width: 18px;
        max-width: 18px;
        height: 18px;
        max-height: 18px;
        object-fit: contain;
    }

    /* ==============================
       Conteneur principal
       ============================== */

    .main-header__navigation-container {
        width: min(100%, var(--header-max-width));
        min-height: var(--header-navigation-height);
        margin: 0 auto;
        padding-left: var(--header-horizontal-padding);

        display: grid;
        grid-template-columns: var(--header-logo-column) minmax(0, 1fr) var(--header-actions-column);
        align-items: stretch;
    }

    /* ==============================
       Logo
       ============================== */

    .main-header__logo {
        min-width: 0;

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

        color: inherit;
        text-decoration: none;
    }

    .main-header__logo img {
        display: block;

        width: clamp(125px, 12vw, 150px);
        max-width: 100%;
        height: auto;
    }

    /* ==============================
       Navigation
       ============================== */

    .main-navigation {
        min-width: 0;

        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        align-items: stretch;
    }

    .main-navigation__link {
        position: relative;
        min-width: 0;

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

        padding: 18px clamp(4px, 0.7vw, 10px);

        color: var(--header-dark-blue);

        font-size: clamp(11px, 0.95vw, 14px);
        line-height: 1.25;
        text-align: center;
        text-decoration: none;
        white-space: nowrap;

        transition:
            color 180ms ease,
            background-color 180ms ease;
    }

    .main-navigation__link::after {
        content: "";

        position: absolute;
        right: 18%;
        bottom: 18px;
        left: 18%;

        height: 3px;
        background-color: currentColor;

        transform: scaleX(0);
        transform-origin: center;

        transition: transform 180ms ease;
    }

    .main-navigation__link:hover::after,
    .main-navigation__link:focus-visible::after {
        transform: scaleX(1);
    }

    .main-navigation__link--clim:hover,
    .main-navigation__link--clim:focus-visible {
        color: #79b29a;
    }

    .main-navigation__link--renov:hover,
    .main-navigation__link--renov:focus-visible {
        color: #f39a18;
    }

    .main-navigation__link--pool:hover,
    .main-navigation__link--pool:focus-visible {
        color: #078ccb;
    }

    .main-navigation__link--building:hover,
    .main-navigation__link--building:focus-visible {
        color: #ed3d2e;
    }

    /* ==============================
       Actions
       ============================== */

    .main-header__actions {
        min-width: 0;

        display: grid;
        grid-template-columns: minmax(145px, 1.4fr) minmax(100px, 1fr) 64px;
    }

    .header-action {
        min-width: 0;
        min-height: var(--header-navigation-height);

        display: flex;
        align-items: center;
        justify-content: center;
        gap: clamp(6px, 0.7vw, 10px);

        padding: 18px clamp(8px, 1vw, 14px);

        color: var(--header-dark-blue);
        background-color: var(--header-white);
        border-left: 1px solid var(--header-border);

        font-size: clamp(11px, 0.9vw, 13px);
        line-height: 1;
        text-decoration: none;
        white-space: nowrap;

        transition:
            color 180ms ease,
            background-color 180ms ease;
    }

    .header-action:hover,
    .header-action:focus-visible {
        background-color: #f3f8fa;
    }

    .header-action__icon {
        display: block;
        flex: 0 0 auto;

        width: 17px;
        height: 17px;
        object-fit: contain;
    }

    .header-action--contact {
        padding: 0;
        background-color: var(--header-light-blue);
    }

    .header-action--contact:hover,
    .header-action--contact:focus-visible {
        background-color: #d4edf3;
    }
}

/* Source: nav/PCXXL.css */
/* ==========================================================
   HEADER — PC XXL
   Fichier : PCXXL.css
   Breakpoint : à partir de 1400px
   ========================================================== */

@media screen and (min-width: 1400px) {
    /* ==============================
       Variables
       ============================== */

    .main-header {
        --header-max-width: 1640px;
        --header-horizontal-margin: 80px;

        --header-dark-blue: #063f52;
        --header-light-blue: #e2f3f7;
        --header-yellow: #ffd500;
        --header-border: #edf0f1;
        --header-white: #ffffff;

        --header-topbar-height: 40px;
        --header-navigation-height: 106px;
        --header-logo-column: 190px;
        --header-actions-column: 430px;
        --header-store-width: 200px;
        --header-quote-width: 145px;
        --header-contact-width: 85px;
        --header-navigation-padding: 8px;
        --header-action-padding: 12px;
        --header-action-gap: 10px;

        width: 100%;
        color: var(--header-dark-blue);
        background-color: var(--header-white);
    }

    .main-header *,
    .main-header *::before,
    .main-header *::after {
        box-sizing: border-box;
    }

    /* ==============================
       Barre supérieure
       ============================== */

    .main-header__topbar {
        width: 100%;
        height: var(--header-topbar-height);
        background-color: var(--header-yellow);
    }

    .main-header__topbar-container {
        width: min(calc(100% - var(--header-horizontal-margin)), var(--header-max-width));
        height: 100%;
        margin: 0 auto;

        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    /* ==============================
       Horaires
       ============================== */

    .main-header__schedule {
        display: flex;
        align-items: center;
        gap: 16px;

        color: var(--header-dark-blue);
        line-height: 1;
        white-space: nowrap;
    }

    .main-header__schedule img {
        display: block;
        flex: 0 0 auto;

        width: 18px;
        height: 18px;
        object-fit: contain;
    }

    /* ==============================
       Réseaux sociaux
       ============================== */

    .main-header__socials {
        display: flex;
        align-items: center;
        gap: 18px;
        white-space: nowrap;
    }

    .main-header__socials a {
        display: flex;
        align-items: center;
        justify-content: center;

        color: inherit;
        text-decoration: none;
    }

    .main-header__socials img {
        display: block;

        width: 18px;
        height: 18px;
        object-fit: contain;
    }

    /* ==============================
       Conteneur principal
       ============================== */

    .main-header__navigation-container {
        width: min(calc(100% - var(--header-horizontal-margin)), var(--header-max-width));
        min-height: var(--header-navigation-height);
        margin: 0 auto;

        display: grid;
        grid-template-columns: var(--header-logo-column) minmax(0, 1fr) var(--header-actions-column);
        align-items: stretch;
    }

    /* ==============================
       Logo
       ============================== */

    .main-header__logo {
        min-width: 0;

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

        color: inherit;
        text-decoration: none;
    }

    .main-header__logo img {
        display: block;

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

    /* ==============================
       Navigation
       ============================== */

    .main-navigation {
        min-width: 0;

        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        align-items: stretch;
    }

    .main-navigation__link {
        position: relative;
        min-width: 0;

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

        padding: 20px var(--header-navigation-padding);

        color: var(--header-dark-blue);

        font-size: 14px;
        line-height: 1.25;
        text-align: center;
        text-decoration: none;
        white-space: nowrap;

        transition:
            color 180ms ease,
            background-color 180ms ease;
    }

    .main-navigation__link::after {
        content: "";

        position: absolute;
        right: 20%;
        bottom: 22px;
        left: 20%;

        height: 3px;
        background-color: currentColor;

        transform: scaleX(0);
        transform-origin: center;

        transition: transform 180ms ease;
    }

    .main-navigation__link:hover::after,
    .main-navigation__link:focus-visible::after {
        transform: scaleX(1);
    }

    .main-navigation__link--clim:hover,
    .main-navigation__link--clim:focus-visible {
        color: #79b29a;
    }

    .main-navigation__link--renov:hover,
    .main-navigation__link--renov:focus-visible {
        color: #f39a18;
    }

    .main-navigation__link--pool:hover,
    .main-navigation__link--pool:focus-visible {
        color: #078ccb;
    }

    .main-navigation__link--building:hover,
    .main-navigation__link--building:focus-visible {
        color: #ed3d2e;
    }

    /* ==============================
       Actions
       ============================== */

    .main-header__actions {
        min-width: 0;

        display: grid;
        grid-template-columns: var(--header-store-width) var(--header-quote-width) var(--header-contact-width);
    }

    .header-action {
        min-width: 0;
        min-height: var(--header-navigation-height);

        display: flex;
        align-items: center;
        justify-content: center;
        gap: var(--header-action-gap);

        padding: 20px var(--header-action-padding);

        color: var(--header-dark-blue);
        background-color: var(--header-white);
        border-left: 1px solid var(--header-border);

        line-height: 1;
        text-decoration: none;
        white-space: nowrap;

        transition:
            color 180ms ease,
            background-color 180ms ease;
    }

    .header-action:hover,
    .header-action:focus-visible {
        background-color: #f3f8fa;
    }

    .header-action__icon {
        display: block;
        flex: 0 0 auto;

        width: 18px;
        height: 18px;
        object-fit: contain;
    }

    .header-action--contact {
        padding: 0;
        background-color: var(--header-light-blue);
    }

    .header-action--contact:hover,
    .header-action--contact:focus-visible {
        background-color: #d4edf3;
    }
}

@media screen and (min-width: 1600px) {
    .main-header {
        --header-logo-column: 210px;
        --header-actions-column: 515px;
        --header-store-width: 240px;
        --header-quote-width: 170px;
        --header-contact-width: 105px;
        --header-navigation-padding: 14px;
        --header-action-padding: 20px;
        --header-action-gap: 14px;
    }

    .main-navigation__link {
        font-size: 15px;
    }
}

/* Source: nav/tablette.css */
/* ==========================================================
   HEADER — TABLETTE
   Fichier : tablette.css
   Breakpoint : 768px à 991.98px
   ========================================================== */

@media screen and (min-width: 850.01px) and (max-width: 991.98px) {

    .main-header {
        --header-horizontal-padding: clamp(20px, 3vw, 32px);

        --header-dark-blue: #063f52;
        --header-light-blue: #e2f3f7;
        --header-yellow: #ffd500;
        --header-border: #edf0f1;
        --header-white: #ffffff;

        --header-topbar-height: 40px;
        --header-main-row-height: 82px;
        --header-navigation-row-height: 64px;

        width: 100%;
        color: var(--header-dark-blue);
        background-color: var(--header-white);
    }

    .main-header *,
    .main-header *::before,
    .main-header *::after {
        box-sizing: border-box;
    }

    /* ==============================
       Barre supérieure
       ============================== */

    .main-header__topbar {
        width: 100%;
        height: var(--header-topbar-height);
        background-color: var(--header-yellow);
    }

    .main-header__topbar-container {
        width: 100%;
        height: 100%;
        margin: 0 auto;
        padding-inline: var(--header-horizontal-padding);

        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 20px;
    }

    /* ==============================
       Horaires
       ============================== */

    .main-header__schedule {
        min-width: 0;

        display: flex;
        align-items: center;
        gap: 10px;

        color: var(--header-dark-blue);
        line-height: 1;
        white-space: nowrap;
    }

    .main-header__schedule img {
        display: block;
        flex: 0 0 auto;

        width: 16px;
        height: 16px;
        object-fit: contain;
    }

    .main-header__schedule span {
        overflow: hidden;

        font-size: 12px !important;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    /* ==============================
       Réseaux sociaux
       ============================== */

    .main-header__socials {
        flex: 0 0 auto;

        display: flex;
        align-items: center;
        gap: 12px;

        font-size: 12px;
        white-space: nowrap;
    }

    .main-header__socials a {
        display: flex;
        align-items: center;
        justify-content: center;

        color: inherit;
        text-decoration: none;
    }

    .main-header__socials img {
        display: block;

        width: 17px;
        height: 17px;
        object-fit: contain;
    }

    /* ==============================
       Conteneur principal
       ============================== */

    .main-header__navigation-container {
        width: 100%;
        margin: 0 auto;
        padding-inline: var(--header-horizontal-padding);

        display: grid;
        grid-template-columns: minmax(140px, 1fr) auto;
        grid-template-areas:
            "logo actions"
            "navigation navigation";

        align-items: stretch;
        background-color: var(--header-white);
    }

    /* ==============================
       Logo
       ============================== */

    .main-header__logo {
        grid-area: logo;

        min-width: 0;
        min-height: var(--header-main-row-height);

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

        color: inherit;
        text-decoration: none;
    }

    .main-header__logo img {
        display: block;

        width: clamp(120px, 16vw, 140px);
        max-width: 100%;
        height: auto;
    }

    /* ==============================
       Actions
       ============================== */

    .main-header__actions {
        grid-area: actions;

        min-width: 0;
        min-height: var(--header-main-row-height);

        display: grid;
        grid-template-columns: minmax(135px, 1.35fr) minmax(95px, 1fr) 58px;
    }

    .header-action {
        min-width: 0;
        min-height: var(--header-main-row-height);

        display: flex;
        align-items: center;
        justify-content: center;
        gap: 7px;

        padding: 14px 9px;

        color: var(--header-dark-blue);
        background-color: var(--header-white);
        border-left: 1px solid var(--header-border);

        font-size: clamp(11px, 1.35vw, 13px);
        line-height: 1;
        text-decoration: none;
        white-space: nowrap;

        transition:
            color 180ms ease,
            background-color 180ms ease;
    }

    .header-action:hover,
    .header-action:focus-visible {
        background-color: #f3f8fa;
    }

    .header-action__icon {
        display: block;
        flex: 0 0 auto;

        width: 16px;
        height: 16px;
        object-fit: contain;
    }

    .header-action--contact {
        padding: 0;
        background-color: var(--header-light-blue);
    }

    .header-action--contact:hover,
    .header-action--contact:focus-visible {
        background-color: #d4edf3;
    }

    /* ==============================
       Navigation
       ============================== */

    .main-navigation {
        grid-area: navigation;

        min-width: 0;
        min-height: var(--header-navigation-row-height);

        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        align-items: stretch;

        border-top: 1px solid var(--header-border);
    }

    .main-navigation__link {
        position: relative;
        min-width: 0;

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

        padding: 14px 5px;

        color: var(--header-dark-blue);

        font-size: clamp(11px, 1.45vw, 13px);
        line-height: 1.2;
        text-align: center;
        text-decoration: none;
        white-space: nowrap;

        transition:
            color 180ms ease,
            background-color 180ms ease;
    }

    .main-navigation__link::after {
        content: "";

        position: absolute;
        right: 18%;
        bottom: 8px;
        left: 18%;

        height: 3px;
        background-color: currentColor;

        transform: scaleX(0);
        transform-origin: center;

        transition: transform 180ms ease;
    }

    .main-navigation__link:hover::after,
    .main-navigation__link:focus-visible::after {
        transform: scaleX(1);
    }

    .main-navigation__link--clim:hover,
    .main-navigation__link--clim:focus-visible {
        color: #79b29a;
    }

    .main-navigation__link--renov:hover,
    .main-navigation__link--renov:focus-visible {
        color: #f39a18;
    }

    .main-navigation__link--pool:hover,
    .main-navigation__link--pool:focus-visible {
        color: #078ccb;
    }

    .main-navigation__link--building:hover,
    .main-navigation__link--building:focus-visible {
        color: #ed3d2e;
    }
}

/* Source: header.css */
/* ==========================================================
   HEADER MOBILE SEPARE
   ========================================================== */

.header-mobile {
    display: none;
}

/* Desktop/tablette : on garde ton header.tpl */
@media screen and (min-width: 850px) {
    .header-mobile {
        display: none !important;
    }
}

/* Mobile : on cache le header PC et on affiche le header mobile */
@media screen and (max-width: 849.98px) {
    .main-header {
        display: none !important;
    }

    .header-mobile {
        display: block;
    }

    body {
        padding-top: 78px;
    }

    .header-mobile {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 9999;

        width: 100%;
        background: #ffffff;
        color: #063f52;
    }

    .header-mobile *,
    .header-mobile *::before,
    .header-mobile *::after {
        box-sizing: border-box;
    }

    .header-mobile a {
        color: inherit;
        text-decoration: none;
    }

    .header-mobile__topbar {
        height: 24px;
        padding: 0 10px;

        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;

        background: #ffd500;
    }

    .header-mobile__schedule {
        min-width: 0;

        display: flex;
        align-items: center;
        gap: 5px;

        overflow: hidden;
        white-space: nowrap;
        line-height: 1;
    }

    .header-mobile__schedule img {
        width: 13px;
        height: 13px;
        flex: 0 0 auto;
        display: block;
    }

    .header-mobile__schedule span {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;

        font-size: 11px;
        line-height: 1;
    }

    .header-mobile__social {
        width: 22px;
        height: 22px;
        flex: 0 0 auto;

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

    .header-mobile__social img {
        width: 14px;
        height: 14px;
        display: block;
    }

    .header-mobile__main {
        height: 54px;

        display: grid;
        grid-template-columns: 56px 1fr 56px;
        align-items: center;

        background: #ffffff;
        border-bottom: 1px solid #edf0f1;
    }

    .header-mobile__topbar {
        display: flex;
        align-items: center;
        width: 100%;
    }

    .header-mobile__schedule {
        display: flex;
        align-items: center;
        gap: 4px;
    }

    .header-mobile__socials {
        margin-left: auto;
        display: flex;
        align-items: center;
        gap: 6px;
    }

    .header-mobile__social {
        width: 22px;
        height: 22px;
        flex: 0 0 22px;

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

    .header-mobile__social img {
        display: block;
        width: 14px;
        height: 14px;
    }

    .header-mobile__burger {
        width: 56px;
        height: 54px;
        padding: 0;

        position: relative;

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

        border: 0;
        border-right: 1px solid #edf0f1;
        background: #faf7df;
        cursor: pointer;
    }

    .header-mobile__burger span {
        position: absolute;

        width: 18px;
        height: 2px;

        background: #063f52;
        transition: transform 180ms ease;
    }

    .header-mobile__burger span:first-child {
        transform: translateY(-5px);
    }

    .header-mobile__burger span:last-child {
        transform: translateY(5px);
    }

    .header-mobile.is-open .header-mobile__burger span:first-child {
        transform: rotate(45deg);
    }

    .header-mobile.is-open .header-mobile__burger span:last-child {
        transform: rotate(-45deg);
    }

    .header-mobile__logo {
        height: 54px;

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

    .header-mobile__logo img {
        width: 105px;
        height: auto;
        display: block;
    }

    .header-mobile__mail {
        width: 56px;
        height: 54px;

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

        background: #e2f3f7;
        border-left: 1px solid #edf0f1;
    }

    .header-mobile__mail img {
        width: 18px;
        height: 18px;
        display: block;
    }

    .header-mobile__nav {
        display: none;

        position: absolute;
        top: 78px;
        left: 0;
        right: 0;

        width: 100%;
        background: #ffffff;
        box-shadow: 0 8px 18px rgba(0, 0, 0, 0.08);
    }

    .header-mobile.is-open .header-mobile__nav {
        display: block;
    }

    .header-mobile__link {
        min-height: 48px;
        padding: 0 16px;

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

        border-bottom: 1px solid #edf0f1;
        background: #ffffff;
        color: #063f52;

        font-size: 13px;
        font-weight: 700;
        line-height: 1.2;
        text-align: center;
        white-space: nowrap;

        transition: background-color 180ms ease, color 180ms ease;
    }

    .header-mobile__link--home {
        min-height: 34px;

        background: #063f52;
        color: #ffffff;

        font-size: 12px;
        font-weight: 800;
        text-transform: uppercase;
    }

    .header-mobile__link--clim:hover,
    .header-mobile__link--clim:focus-visible {
        background: #74AE93;
        color: #ffffff;
    }

    .header-mobile__link--renov:hover,
    .header-mobile__link--renov:focus-visible {
        background: #F59C1E;
        color: #ffffff;
    }

    .header-mobile__link--pool:hover,
    .header-mobile__link--pool:focus-visible {
        background: #0787C5;
        color: #ffffff;
    }

    .header-mobile__link--building:hover,
    .header-mobile__link--building:focus-visible {
        background: #E30613;
        color: #ffffff;
    }

    .header-mobile__link--store:hover,
    .header-mobile__link--store:focus-visible {
        background: #FFD500;
        color: #063f52;
    }

    .header-mobile__link--quote:hover,
    .header-mobile__link--quote:focus-visible,
    .header-mobile__link--contact:hover,
    .header-mobile__link--contact:focus-visible {
        background: #47AECC;
        color: #ffffff;
    }
}

/* Header desktop fixé au scroll */
.main-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 9999;

    width: 100%;
    background: #ffffff;
}

/* Hauteur du header desktop pour éviter que le contenu passe dessous */
body {
    padding-top: 153px;
}

/* Mobile : tu gardes ton header mobile déjà fixed */
@media screen and (max-width: 849.98px) {
    body {
        padding-top: 78px;
    }
}
/* Source: cookie.css */
/*@todo cookie*/
#trackModal {
    --cookie-navy: #062a61;
    --cookie-blue: #246bfe;
    --cookie-green: #45eba5;
    --cookie-yellow: #ffd900;
    --cookie-grey: #6f7783;
    --cookie-light: #f5f8ff;
    --cookie-border: #e3e9f3;
}

#trackModal.modal {
    padding: 20px;
}

#trackModal .modal-dialog {
    width: 100%;
    max-width: 620px;
    margin: 40px auto;
}

#trackModal .modal-content {
    position: relative;
    overflow: hidden;
    border: 0;
    border-radius: 24px;
    background: #ffffff;
    box-shadow:
            0 24px 70px rgba(6, 42, 97, 0.22),
            0 8px 24px rgba(6, 42, 97, 0.10);
}

#trackModal .modal-content::before {
    content: "";
    display: block;
    width: 100%;
    height: 7px;
    background: linear-gradient(
            90deg,
            var(--cookie-green) 0 33%,
            var(--cookie-blue) 33% 66%,
            var(--cookie-yellow) 66% 100%
    );
}

#trackModal .modal-header {
    display: block;
    padding: 30px 32px 18px;
    border: 0;
    background:
            radial-gradient(
                    circle at top right,
                    rgba(69, 235, 165, 0.16),
                    transparent 42%
            ),
            #ffffff;
}

#trackModal #trackModalLabel {
    margin: 0;
    color: var(--cookie-navy);
    font-size: clamp(1.55rem, 3vw, 2rem);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.035em;
}

#trackModal .modal-body {
    padding: 8px 32px 30px;
}

#trackModal .modal-body > .row:first-child {
    margin: 0 0 22px;
}

#trackModal .modal-body > .row:first-child p {
    margin: 0;
    padding: 0;
    color: #53647c;
    font-size: 1rem;
    line-height: 1.65;
}

#trackModal .cookie-preference {
    margin-bottom: 24px;
    padding: 8px;
    border: 1px solid var(--cookie-border);
    border-radius: 18px;
    background: var(--cookie-light);
}

#trackModal .accordion {
    --bs-accordion-border-width: 0;
    --bs-accordion-border-radius: 14px;
    --bs-accordion-inner-border-radius: 14px;
    --bs-accordion-btn-focus-box-shadow: none;
    --bs-accordion-active-bg: #ffffff;
    --bs-accordion-active-color: var(--cookie-navy);
}

#trackModal .accordion-item {
    overflow: hidden;
    margin-bottom: 8px;
    border: 1px solid transparent;
    border-radius: 14px;
    background: #ffffff;
    transition:
            border-color 0.2s ease,
            box-shadow 0.2s ease,
            transform 0.2s ease;
}

#trackModal .accordion-item:last-child {
    margin-bottom: 0;
}

#trackModal .accordion-item:hover {
    border-color: #d7e2f4;
    box-shadow: 0 8px 20px rgba(6, 42, 97, 0.07);
    transform: translateY(-1px);
}

#trackModal .accordion-header {
    margin: 0;
}

#trackModal .accordion-button {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    width: 100%;
    min-height: 68px;
    padding: 16px 18px;
    border-radius: 14px;
    color: var(--cookie-navy);
    background: #ffffff;
    font-weight: 700;
    box-shadow: none;
}

#trackModal .accordion-button:not(.collapsed) {
    color: var(--cookie-navy);
    background: #ffffff;
    box-shadow: none;
}

#trackModal .accordion-button::after {
    display: none;
}

#trackModal .accordion-button > span:first-child {
    flex: 1;
}

#trackModal .accordion-button > span:last-child {
    display: flex !important;
    align-items: center;
    justify-content: flex-end;
    float: none !important;
}

#trackModal .accordion-button .fa-angle-down {
    color: var(--cookie-navy);
    transition: transform 0.25s ease;
}

#trackModal .accordion-button:not(.collapsed) .fa-angle-down {
    transform: rotate(180deg);
}

#trackModal .accordion-body {
    padding: 0 18px 20px;
    color: #5d6b7f;
    font-size: 0.9rem;
    line-height: 1.65;
}

#trackModal .accordion-body p {
    margin-bottom: 16px;
}

#trackModal .badge {
    min-width: 100px;
    border-radius: 999px !important;
    font-size: 0.75rem;
    font-weight: 700 !important;
    letter-spacing: 0.01em;
}

#trackModal .badge.bg-success {
    color: #087143;
    background: rgba(69, 235, 165, 0.22) !important;
}

#trackModal .badge.bg-danger {
    color: #a52637;
    background: rgba(255, 99, 119, 0.16) !important;
}

#trackModal .form-check {
    display: flex !important;
    align-items: center;
    gap: 10px;
    margin: 0;
}

#trackModal .form-switch {
    padding-left: 0;
}

#trackModal .form-switch .form-check-input {
    width: 48px;
    height: 26px;
    margin: 0;
    border: 0;
    background-color: #cbd3df;
    box-shadow: none;
    cursor: pointer;
}

#trackModal .form-switch .form-check-input:checked {
    background-color: var(--cookie-green);
}

#trackModal .form-switch .form-check-input:focus {
    box-shadow: 0 0 0 4px rgba(69, 235, 165, 0.2);
}

#trackModal .form-check-label {
    color: var(--cookie-navy);
    font-weight: 600;
    cursor: pointer;
}

#trackModal .modal-body > .row:last-child {
    margin: 0 -6px;
}

#trackModal .modal-body > .row:last-child > div {
    padding: 6px;
}

#trackModal .btn {
    min-height: 52px;
    border: 0;
    border-radius: 14px;
    font-size: 0.95rem;
    font-weight: 700;
    transition:
            transform 0.2s ease,
            box-shadow 0.2s ease,
            background-color 0.2s ease;
}

#trackModal .btn:hover {
    transform: translateY(-2px);
}

#trackModal .btn:active {
    transform: translateY(0);
}

#trackModal .btn-cookie-accepter {
    color: #06315e;
    background: #ffd500;
    box-shadow: 0 10px 22px rgba(69, 235, 165, 0.28);
}

#trackModal .btn-cookie-accepter:hover,
#trackModal .btn-cookie-accepter:focus {
    color: #06315e;
    background: #5cf0b2;
    box-shadow: 0 12px 26px rgba(69, 235, 165, 0.35);
}

#trackModal .btn-cookie-refuser {
    color: #ffffff;
    background: var(--cookie-navy);
    box-shadow: 0 10px 22px rgba(6, 42, 97, 0.2);
}

#trackModal .btn-cookie-refuser:hover,
#trackModal .btn-cookie-refuser:focus {
    color: #ffffff;
    background: #0b3b7d;
    box-shadow: 0 12px 26px rgba(6, 42, 97, 0.28);
}

#trackModal .btn-cookie-preference {
    color: var(--cookie-navy);
    border: 1px solid #dce4f0;
    background: #f4f7fb;
}

#trackModal .btn-cookie-preference:hover,
#trackModal .btn-cookie-preference:focus {
    color: var(--cookie-navy);
    border-color: #c9d6e8;
    background: #eaf0f8;
    box-shadow: 0 10px 22px rgba(6, 42, 97, 0.1);
}

#trackModal .btn:disabled {
    opacity: 0.65;
    transform: none;
    box-shadow: none;
}

.modal-backdrop.show {
    opacity: 0.68;
    background: #061d3c;
}

@media (max-width: 767.98px) {
    #trackModal.modal {
        padding: 10px;
    }

    #trackModal .modal-dialog {
        margin: 10px auto;
    }

    #trackModal .modal-content {
        max-height: calc(100vh - 20px);
        border-radius: 20px;
    }

    #trackModal .modal-header {
        padding: 24px 20px 14px;
    }

    #trackModal .modal-body {
        overflow-y: auto;
        padding: 6px 20px 22px;
    }

    #trackModal #trackModalLabel {
        font-size: 1.55rem;
    }

    #trackModal .accordion-button {
        gap: 8px;
        padding: 14px;
    }

    #trackModal .badge {
        min-width: auto;
        margin-right: 8px !important;
        padding: 7px 10px !important;
        font-size: 0.68rem;
    }

    #trackModal .btn {
        min-height: 50px;
    }
}

/* Source: Slider/slider.css */
/* ==========================================================
   SLIDER — IMAGE ENTIÈRE, NON COUPÉE
   ========================================================== */

html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

#slider-container {
    display: grid;
    position: relative;

    width: 100%;
    max-width: 100%;
    margin: 0;

    overflow: hidden;
}

/* Slides superposées */
#slider-container .slide {
    grid-column: 1;
    grid-row: 1;

    width: 100%;

    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    transition: opacity 800ms ease-in-out, visibility 0s linear 800ms;
}

#slider-container .slide.slide--active {
    z-index: 1;

    opacity: 1;
    visibility: visible;
    pointer-events: auto;

    transition-delay: 0s;
}

#slider-container picture {
    display: block;
    width: 100%;
}

/* IMPORTANT : pas de height: 100%, pas de object-fit: cover */
#slider-container img {
    display: block;

    width: 100%;
    height: auto;

    max-width: 100%;
}