/* All Design Concept : feuille de style principale.
   Palette : blanc, noir, touche dorée #B8960C (boutons et accents). Montserrat 400 et 600.
   Mobile d'abord. */

@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/montserrat-latin.woff2') format('woff2');
    font-weight: 400 600;
    font-style: normal;
    font-display: swap;
}

:root {
    --noir: #111111;
    --noir-2: #1c1c1c;
    --blanc: #ffffff;
    --gris: #f5f4f1;
    --creme: #faf8f4;
    --sable: #f1ebe0;
    --ligne: #e4e2dc;
    --texte: #1d1d1d;
    --texte-2: #5d5b57;
    --or: #B8960C;
    --or-fonce: #96790a;
    --entete: 76px;
    --rayon: 2px;
    --largeur: 1240px;
    --ease: cubic-bezier(.2, .7, .2, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--entete) + 16px); }
body {
    margin: 0;
    font-family: 'Montserrat', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
    font-weight: 400;
    font-size: 1rem;
    line-height: 1.7;
    color: var(--texte);
    background: var(--blanc);
    padding-top: var(--entete);
    padding-bottom: 64px; /* barre mobile */
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration-color: var(--or); text-underline-offset: 3px; }
a:hover { color: var(--or-fonce); }
h1, h2, h3 { font-weight: 600; line-height: 1.2; margin: 0 0 .6em; letter-spacing: -.01em; }
p { margin: 0 0 1em; }
strong { font-weight: 600; }
button { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--or); outline-offset: 3px; }

[hidden] { display: none !important; }
.sr, .hp { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.evitement { position: absolute; left: -9999px; top: 0; z-index: 2000; background: var(--noir); color: #fff; padding: 10px 16px; }
.evitement:focus { left: 10px; top: 10px; }

.container { width: 100%; max-width: var(--largeur); margin: 0 auto; padding: 0 20px; }
.container--etroit { max-width: 820px; }
.container--moyen { max-width: 1000px; }
.sans-marge { padding: 0; margin: 0 0 32px; }
.center { text-align: center; }

/* ------------------------------------------------------------ Boutons */
.btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 10px;
    min-height: 50px; padding: 14px 28px;
    font-size: .8125rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; text-decoration: none;
    border: 1px solid transparent; border-radius: var(--rayon); cursor: pointer;
    transition: background-color .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease), transform .25s var(--ease);
}
.btn--gold { background: var(--or); color: var(--noir); border-color: var(--or); }
.btn--gold:hover { background: var(--noir); color: var(--blanc); border-color: var(--noir); }
.btn--noir { background: var(--noir); color: var(--blanc); }
.btn--noir:hover { background: var(--or); color: var(--noir); }
.btn--ligne { background: transparent; color: var(--noir); border-color: var(--noir); }
.btn--ligne:hover { background: var(--noir); color: var(--blanc); }
.btn--ghost-light { background: transparent; color: var(--blanc); border-color: rgba(255,255,255,.7); }
.btn--ghost-light:hover { background: var(--blanc); color: var(--noir); border-color: var(--blanc); }
.btn--plein { width: 100%; }
.lien-fleche { display: inline-block; font-size: .8125rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; text-decoration: none; padding-bottom: 4px; border-bottom: 1px solid var(--or); }
.lien-fleche::after { content: ' \2192'; }
.lien-bouton { background: none; border: 0; padding: 0; cursor: pointer; text-decoration: underline; text-decoration-color: var(--or); text-underline-offset: 3px; }

/* ------------------------------------------------------------ En-tête */
.entete {
    position: fixed; inset: 0 0 auto 0; z-index: 900; height: var(--entete);
    background: rgba(255,255,255,.97); border-bottom: 1px solid var(--ligne);
    backdrop-filter: saturate(1.2) blur(8px);
}
.entete__barre { height: 100%; max-width: 1400px; margin: 0 auto; padding: 0 20px; display: flex; align-items: center; gap: 24px; }
.entete__logo { display: block; flex: 0 0 auto; }
.entete__logo img { height: 46px; width: auto; }
@media (min-width: 1080px) { .entete__logo img { height: 56px; } }
.entete__cta { display: none; margin-left: auto; min-height: 44px; padding: 10px 20px; }
.entete__tel { margin-left: auto; font-weight: 600; text-decoration: none; white-space: nowrap; }

.nav { display: none; }
.burger { margin-left: auto; width: 48px; height: 48px; border: 0; background: none; cursor: pointer; position: relative; }
.burger__ligne, .burger__ligne::before, .burger__ligne::after {
    position: absolute; left: 12px; width: 24px; height: 2px; background: var(--noir); content: ''; transition: transform .3s var(--ease), opacity .2s;
}
.burger__ligne { top: 23px; }
.burger__ligne::before { left: 0; top: -7px; }
.burger__ligne::after { left: 0; top: 7px; }
.burger[aria-expanded="true"] .burger__ligne { background: transparent; }
.burger[aria-expanded="true"] .burger__ligne::before { transform: translateY(7px) rotate(45deg); }
.burger[aria-expanded="true"] .burger__ligne::after { transform: translateY(-7px) rotate(-45deg); }

/* Menu mobile (panneau) */
.nav.is-ouvert {
    display: block; position: fixed; top: var(--entete); left: 0; right: 0; bottom: 0;
    background: var(--blanc); overflow-y: auto; padding: 16px 20px 100px;
}
.nav__liste, .sous-menu { list-style: none; margin: 0; padding: 0; }
.nav__lien {
    display: flex; align-items: center; justify-content: space-between; width: 100%;
    padding: 16px 0; border: 0; border-bottom: 1px solid var(--ligne); background: none;
    font-size: 1.125rem; font-weight: 600; text-decoration: none; text-align: left; cursor: pointer;
}
.nav__fleche { width: 8px; height: 8px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); margin: 0 6px 4px 10px; transition: transform .25s; }
.nav__bouton[aria-expanded="true"] .nav__fleche { transform: rotate(-135deg); margin-bottom: -4px; }
.sous-menu { display: none; padding: 6px 0 10px 14px; }
.nav__bouton[aria-expanded="true"] + .sous-menu { display: block; }
.sous-menu a { display: block; padding: 10px 0; text-decoration: none; color: var(--texte-2); }
.sous-menu a[aria-current="page"], .nav__lien[aria-current="page"] { color: var(--or-fonce); }
.nav__item--tel .nav__lien { color: var(--or-fonce); }

@media (min-width: 1080px) {
    .burger { display: none; }
    .entete__cta { display: inline-flex; margin-left: 0; }
    .nav { display: block; margin-left: auto; }
    .nav__liste { display: flex; align-items: center; gap: 4px; }
    .nav__lien { width: auto; padding: 10px 14px; border: 0; font-size: .8125rem; letter-spacing: .1em; text-transform: uppercase; }
    .nav__lien:hover, .nav__item.is-actif > .nav__lien { color: var(--or-fonce); }
    .nav__item--deroulant { position: relative; }
    .sous-menu {
        display: block; position: absolute; top: calc(100% + 18px); left: 0; min-width: 260px;
        background: var(--blanc); border: 1px solid var(--ligne); padding: 10px 0;
        box-shadow: 0 18px 40px rgba(0,0,0,.08);
        opacity: 0; visibility: hidden; transform: translateY(-6px); transition: opacity .2s, transform .2s, visibility .2s;
    }
    .sous-menu::before { content: ''; position: absolute; top: -19px; left: 0; right: 0; height: 19px; }
    .nav__item--deroulant:hover .sous-menu,
    .nav__item--deroulant:focus-within .sous-menu,
    .nav__bouton[aria-expanded="true"] + .sous-menu { opacity: 1; visibility: visible; transform: none; }
    .sous-menu a { padding: 10px 22px; font-size: .9375rem; color: var(--texte); border-left: 2px solid transparent; }
    .sous-menu a:hover { color: var(--or-fonce); border-left-color: var(--or); background: var(--gris); }
    .nav__item--tel .nav__lien { letter-spacing: .04em; }
}
@media (min-width: 1080px) and (max-width: 1240px) { .nav__item--tel { display: none; } }

/* ------------------------------------------------------------ Bandeau (hero) */
.hero { position: relative; color: var(--blanc); display: flex; align-items: flex-end; overflow: hidden; background: var(--noir); }
.hero--full { min-height: min(calc(100svh - var(--entete) - 64px), 760px); }
.hero--mid { min-height: 420px; }
.hero__media, .hero__media img { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero__media img { object-fit: cover; }
.hero__media::after {
    content: ''; position: absolute; inset: 0;
    background: linear-gradient(180deg, rgba(0,0,0,.15) 0%, rgba(0,0,0,.25) 40%, rgba(0,0,0,.72) 100%);
}
.hero__content { position: relative; z-index: 1; padding-top: 64px; padding-bottom: 48px; }
.hero__kicker { font-size: .75rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--blanc); margin-bottom: 14px; display: flex; align-items: center; gap: 12px; text-shadow: 0 1px 8px rgba(0,0,0,.4); }
.hero__kicker::before { content: ""; width: 32px; height: 2px; background: var(--or); }
.hero__title { font-size: clamp(1.9rem, 5vw, 3.6rem); max-width: 18em; margin-bottom: 18px; }
.hero__lead { font-size: clamp(1rem, 1.6vw, 1.1875rem); max-width: 40em; opacity: .92; margin-bottom: 28px; }
.hero__actions { display: flex; flex-wrap: wrap; gap: 12px; }
@media (min-width: 900px) {
    .hero--full { min-height: min(calc(100svh - var(--entete)), 980px); }
    .hero--mid { min-height: 52vh; }
    .hero__content { padding-bottom: 80px; }
}

/* ------------------------------------------------------------ Sections */
.section { padding: 72px 0; }
.section--serre { padding: 48px 0; }
.section--gris { background: var(--gris); }
.section--noir { background: var(--noir); color: var(--blanc); }
.section--intro { padding-bottom: 24px; }
@media (min-width: 900px) {
    .section { padding: 112px 0; }
    .section--serre { padding: 72px 0; }
    .section--intro { padding-bottom: 32px; }
}
.surtitre { font-size: .75rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--or-fonce); margin-bottom: 14px; }
.section--noir .surtitre { color: var(--or); }
.titre-section { font-size: clamp(1.6rem, 3.2vw, 2.5rem); max-width: 22em; margin-bottom: 28px; }
.center .titre-section, .titre-section.center { margin-left: auto; margin-right: auto; }
.titre-section--grand { font-size: clamp(2rem, 4.4vw, 3.4rem); }
.titre-bloc { font-size: clamp(1.25rem, 2vw, 1.5rem); margin-bottom: 18px; }
.intro { font-size: 1.125rem; color: var(--texte-2); }
.chapeau { font-size: clamp(1.125rem, 1.8vw, 1.375rem); line-height: 1.65; }
.petit { font-size: .875rem; color: var(--texte-2); }

.liste { list-style: none; padding: 0; margin: 0 0 1em; }
.liste li { position: relative; padding: 0 0 12px 26px; }
.liste li::before { content: ''; position: absolute; left: 0; top: .75em; width: 12px; height: 1px; background: var(--or); }
.liste--num { counter-reset: n; }
.liste--num li { counter-increment: n; padding-left: 38px; }
.liste--num li::before { content: counter(n, decimal-leading-zero); width: auto; height: auto; background: none; top: 0; font-weight: 600; color: var(--or-fonce); font-size: .875rem; }
.liste--petite li { padding-bottom: 6px; }

.deux-col { display: grid; gap: 40px; }
@media (min-width: 900px) { .deux-col { grid-template-columns: 1fr 1fr; gap: 80px; } }

/* Fil d'Ariane */
.ariane { font-size: .8125rem; color: var(--texte-2); padding-top: 18px; padding-bottom: 0; display: flex; gap: 10px; flex-wrap: wrap; }
.ariane a { text-decoration: none; }
.ariane a:hover { text-decoration: underline; }

/* En-tête de page sans photo */
.entete-page { padding: 72px 0 24px; }
.entete-page__titre { font-size: clamp(2rem, 4.6vw, 3.4rem); }
.entete-page--merci { padding: 120px 0; }
@media (min-width: 900px) { .entete-page { padding: 120px 0 40px; } }

/* ------------------------------------------------------------ Réassurance */
.reassurance { border-bottom: 1px solid var(--ligne); }
.reassurance__liste { list-style: none; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; }
.reassurance__liste li {
    padding: 18px 12px; text-align: center; font-size: .75rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase;
    border-bottom: 1px solid var(--ligne);
}
.reassurance__liste li:nth-child(odd) { border-right: 1px solid var(--ligne); }
.reassurance__liste li:last-child { grid-column: 1 / -1; border-right: 0; border-bottom: 0; }
@media (min-width: 900px) {
    .reassurance__liste { grid-template-columns: repeat(5, 1fr); }
    .reassurance__liste li { border-bottom: 0; border-right: 1px solid var(--ligne); padding: 26px 12px; }
    .reassurance__liste li:nth-child(odd) { border-right: 1px solid var(--ligne); }
    .reassurance__liste li:last-child { grid-column: auto; border-right: 0; }
}

/* ------------------------------------------------------------ Cartes savoir-faire (typographiques) */
.cartes { list-style: none; margin: 0; padding: 0; display: grid; gap: 1px; background: var(--ligne); border: 1px solid var(--ligne); }
@media (min-width: 640px) { .cartes { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .cartes { grid-template-columns: repeat(3, 1fr); } }
.carte { background: var(--blanc); }
.carte a { display: flex; flex-direction: column; height: 100%; padding: 32px 28px 28px; text-decoration: none; position: relative; transition: background-color .3s var(--ease); }
.carte a:hover { background: var(--noir); color: var(--blanc); }
.carte__num { font-size: .75rem; font-weight: 600; color: var(--or-fonce); letter-spacing: .12em; margin-bottom: 36px; }
.carte a:hover .carte__num { color: var(--or); }
.carte__titre { font-size: 1.25rem; margin-bottom: 10px; }
.carte p { color: var(--texte-2); margin: 0 0 28px; transition: color .3s; }
.carte a:hover p { color: rgba(255,255,255,.75); }
.carte__fleche { margin-top: auto; width: 34px; height: 1px; background: var(--or); position: relative; transition: width .3s var(--ease); }
.carte__fleche::after { content: ''; position: absolute; right: 0; top: -4px; width: 8px; height: 8px; border-top: 1px solid var(--or); border-right: 1px solid var(--or); transform: rotate(45deg); }
.carte a:hover .carte__fleche { width: 60px; }
.section--gris .carte, .section--gris .cartes { background-color: var(--blanc); }
.section--gris .cartes { background: var(--ligne); }

/* ------------------------------------------------------------ Éléments communs des sections éditoriales */
.section--creme { background: var(--creme); }
.titre-section--xl { font-size: clamp(1.85rem, 3.6vw, 3rem); letter-spacing: -.015em; }
.point-or { color: var(--or); }
.surtitre--trait, .surtitre--trait-avant, .surtitre--centre { display: inline-flex; align-items: center; gap: 18px; letter-spacing: .26em; }
.surtitre--trait::after { content: ''; width: 64px; height: 1px; background: var(--or); }
.surtitre--trait-avant::before { content: ''; width: 40px; height: 1px; background: var(--or); }
.surtitre--centre::before, .surtitre--centre::after { content: ''; width: 56px; height: 1px; background: currentColor; opacity: .7; }
@media (min-width: 900px) { .surtitre--centre::before, .surtitre--centre::after { width: 110px; } }
.surtitre--souligne { display: inline-flex; flex-direction: column; align-items: center; gap: 12px; }
.surtitre--souligne::after { content: ''; width: 44px; height: 1px; background: var(--or); }
.trait-or { display: block; width: 52px; height: 2px; background: var(--or); margin: 36px 0 28px; }

.pastille { display: inline-grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; background: var(--sable); color: var(--or-fonce); flex: 0 0 auto; }
.pastille .icone { width: 26px; height: 26px; }
.pastille--grande { width: 76px; height: 76px; }
.pastille--grande .icone { width: 30px; height: 30px; }
.pastille--or { width: 76px; height: 76px; background: transparent; border: 1px solid var(--or); color: var(--or); }
.pastille--or .icone { width: 30px; height: 30px; }
.pastille--flottante { position: absolute; left: 50%; bottom: 0; transform: translate(-50%, 50%); width: 68px; height: 68px; background: var(--creme); box-shadow: 0 6px 20px rgba(60, 45, 10, .12); }

/* ------------------------------------------------------------ Savoir-faire (cartes avec icône) */
.savoir-faire { position: relative; overflow: hidden; }
.savoir-faire::before {
    content: ''; position: absolute; inset: 0; pointer-events: none;
    background:
        radial-gradient(60% 50% at 0% 40%, rgba(120, 110, 90, .10), transparent 70%),
        radial-gradient(40% 60% at 6% 85%, rgba(120, 110, 90, .08), transparent 70%);
}
.savoir-faire .container { position: relative; }
.savoir-faire__tete { display: grid; gap: 24px; margin-bottom: 40px; align-items: center; }
.savoir-faire__tete .titre-section { margin-bottom: 0; max-width: 17em; }
.savoir-faire__aparte { color: var(--texte-2); font-size: .9375rem; line-height: 1.7; }
.savoir-faire__aparte p:first-child { margin-bottom: 18px; }
.savoir-faire__aparte .surtitre { margin: 0; font-size: .6875rem; }
@media (min-width: 1000px) {
    .savoir-faire__tete { grid-template-columns: 1fr 330px; gap: 48px; }
    .savoir-faire__aparte { border-left: 1px solid #d9d4c8; padding: 6px 0 6px 40px; }
}
.cartes-sf { list-style: none; margin: 0; padding: 0; display: grid; gap: 18px; }
@media (min-width: 640px) { .cartes-sf { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .cartes-sf { grid-template-columns: repeat(3, 1fr); gap: 20px; } }
.carte-sf a {
    position: relative; display: flex; flex-direction: column; height: 100%;
    padding: 34px 34px 30px; text-decoration: none; color: var(--texte);
    background: rgba(255, 255, 255, .55); border: 1px solid #e6e1d6;
    transition: background-color .35s var(--ease), box-shadow .35s var(--ease), transform .35s var(--ease);
}
.carte-sf a:hover { background: var(--blanc); box-shadow: 0 18px 44px rgba(60, 45, 10, .08); transform: translateY(-3px); color: var(--texte); }
.carte-sf__num { font-size: .8125rem; font-weight: 600; color: var(--or-fonce); letter-spacing: .1em; margin-bottom: 40px; }
.carte-sf__icone { position: absolute; top: 24px; right: 26px; width: 74px; height: 74px; }
.carte-sf__icone .icone { width: 30px; height: 30px; }
.carte-sf__titre { font-size: 1.3125rem; margin-bottom: 14px; }
.carte-sf p { color: var(--texte-2); margin: 0 0 28px; }
.carte-sf__lien { margin-top: auto; display: inline-flex; align-items: center; gap: 18px; font-size: .75rem; font-weight: 600; letter-spacing: .26em; text-transform: uppercase; }
.carte-sf__lien .icone { width: 46px; height: 12px; color: var(--or); transition: transform .3s var(--ease); }
.carte-sf a:hover .carte-sf__lien .icone { transform: translateX(6px); }

/* ------------------------------------------------------------ Deux façons (offres) */
.offres { background: #121110; }
.offres .surtitre { color: var(--or); }
.offres .titre-section { margin-left: auto; margin-right: auto; margin-bottom: 18px; }
.offres__sous-titre { font-size: .8125rem; letter-spacing: .3em; text-transform: uppercase; color: rgba(255, 255, 255, .62); margin-bottom: 48px; }
.offres__grille { display: grid; gap: 28px; }
@media (min-width: 900px) { .offres__grille { grid-template-columns: 1fr 1fr; gap: 32px; } }
.offre { position: relative; display: flex; flex-direction: column; border: 1px solid rgba(184, 150, 12, .55); border-radius: 4px; overflow: hidden; background: #141312; min-height: 520px; }
.offre__photo { position: relative; height: 240px; }
.offre__photo img { width: 100%; height: 100%; object-fit: cover; }
.offre__photo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(20, 19, 18, .1) 0%, #141312 100%); }
.offre__contenu { position: relative; z-index: 1; padding: 0 28px 36px; margin-top: -56px; display: flex; flex-direction: column; align-items: flex-start; }
.offre__contenu .pastille { background: #141312; }
.offre__titre { position: relative; font-size: clamp(1.5rem, 2.4vw, 2rem); font-weight: 400; margin: 40px 0 22px; padding: 0; max-width: 11em; }
.offre__titre::before { content: ''; position: absolute; left: 0; top: -22px; width: 40px; height: 1px; background: var(--or); }
.offre__titre::after { content: ''; display: block; width: 40px; height: 1px; background: var(--or); margin-top: 22px; }
.offre p { color: rgba(255, 255, 255, .82); max-width: 25em; margin-bottom: 32px; }
.offre .btn { margin-top: auto; }
.offre .btn .icone { width: 18px; height: 18px; }
@media (min-width: 900px) {
    .offre { min-height: 560px; display: block; }
    .offre__photo { position: absolute; top: 0; right: 0; bottom: 0; width: 46%; height: auto; }
    .offre__photo::after { background: linear-gradient(90deg, #141312 0%, rgba(20, 19, 18, .55) 30%, rgba(20, 19, 18, .05) 75%); }
    .offre__contenu { margin-top: 0; padding: 48px 48px 52px 56px; min-height: 560px; max-width: 62%; }
    .offre .btn { white-space: nowrap; }
}
.btn--ligne-or { background: transparent; color: var(--or); border-color: var(--or); }
.btn--ligne-or:hover { background: var(--or); color: var(--noir); }

/* ------------------------------------------------------------ Méthode (frise) */
.methode .titre-section { margin-left: auto; margin-right: auto; margin-bottom: 18px; }
.methode__intro { max-width: 34em; margin: 0 auto 56px; color: var(--texte-2); font-size: 1.0625rem; letter-spacing: .01em; }
.methode__etapes { list-style: none; margin: 0; padding: 0; display: grid; gap: 56px 32px; }
@media (min-width: 700px) { .methode__etapes { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1100px) { .methode__etapes { grid-template-columns: repeat(4, 1fr); gap: 40px; } }
.methode__tete { display: flex; align-items: center; gap: 0; margin-bottom: 18px; padding-left: 12px; }
.methode__num { font-size: 2.75rem; font-weight: 400; line-height: 1; color: var(--or-fonce); letter-spacing: -.02em; }
.methode__trait { display: none; position: relative; flex: 1; height: 1px; background: var(--or); margin: 0 -26px 0 60px; }
.methode__trait::after { content: ''; position: absolute; right: -6px; top: -5px; width: 9px; height: 9px; border: 1px solid var(--or); border-radius: 50%; background: var(--creme); }
@media (min-width: 1100px) { .methode__trait { display: block; } }
.methode__visuel { position: relative; margin-bottom: 60px; }
.methode__img { width: 100%; aspect-ratio: 5 / 3; object-fit: cover; border-radius: 6px; }
.methode__etape h3 { font-size: 1.1875rem; padding: 0 12px; }
.methode__etape p { color: var(--texte-2); margin: 0; padding: 0 12px; }

/* ------------------------------------------------------------ Pourquoi */
.pourquoi { overflow: hidden; }
.pourquoi__grille { display: grid; gap: 48px; }
@media (min-width: 1000px) { .pourquoi__grille { grid-template-columns: 1.1fr 1fr; gap: 64px; align-items: center; } }
.pourquoi__gauche { position: relative; padding-bottom: 200px; }
@media (max-width: 999px) { .pourquoi__gauche { padding-bottom: 120px; } }
.pourquoi__titre { font-size: clamp(2.3rem, 4.6vw, 4rem); line-height: 1.08; letter-spacing: -.02em; margin: 26px 0 0; }
.pourquoi__accroche { color: var(--texte-2); letter-spacing: .06em; line-height: 1.9; max-width: 30em; position: relative; z-index: 1; }
.pourquoi__monogramme {
    position: absolute; left: -70px; bottom: -150px; z-index: 0; pointer-events: none;
    font-family: 'Didot', 'Bodoni MT', 'Playfair Display', Georgia, serif; font-size: 360px; line-height: 1; font-weight: 400;
    color: #efe9df; letter-spacing: -.06em;
}
@media (max-width: 999px) { .pourquoi__monogramme { font-size: 220px; bottom: -110px; left: -30px; } }
.atouts { list-style: none; margin: 0; padding: 0; }
.atout { display: flex; gap: 28px; align-items: center; padding: 26px 0; border-bottom: 1px solid #e3ddd1; }
.atout:last-child { border-bottom: 0; }
.atout__titre { font-size: .9375rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; margin: 0 0 8px; }
.atout p { margin: 0; color: var(--texte-2); }
@media (max-width: 560px) { .atout { gap: 18px; align-items: flex-start; } .atout .pastille--grande { width: 58px; height: 58px; } }

/* ------------------------------------------------------------ Références (bandeau typographique) */
.references { background: var(--creme); overflow: hidden; }
.references.section--gris { background: var(--creme); }
.references .titre-section { margin-left: auto; margin-right: auto; margin-bottom: 20px; }
.references .surtitre { color: var(--or-fonce); }
.references__intro { max-width: 32em; margin: 0 auto 56px; }
.references__bandeau { position: relative; max-width: 1480px; margin: 0 auto; padding: 0 64px; }
.references__piste {
    list-style: none; margin: 0; padding: 0; display: grid; grid-auto-flow: column; grid-template-rows: auto auto;
    grid-auto-columns: 210px; row-gap: 44px;
    overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; scroll-behavior: smooth;
    padding: 0 48px; scroll-padding: 0 48px;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
            mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
}
.references__piste::-webkit-scrollbar { display: none; }
.ref { scroll-snap-align: start; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; min-height: 64px; padding: 0 22px; border-left: 1px solid #ddd6c9; color: #2a2826; }
.ref__nom { font-size: 1.125rem; line-height: 1.25; }
.ref__lieu { font-size: .625rem; letter-spacing: .22em; text-transform: uppercase; color: #8b867c; margin-top: 6px; }
.ref--capitales .ref__nom { text-transform: uppercase; letter-spacing: .12em; font-weight: 400; font-size: 1rem; }
.ref--gras .ref__nom { font-weight: 600; font-size: 1.3125rem; letter-spacing: -.01em; }
.ref--fin .ref__nom { font-weight: 400; font-size: 1.0625rem; letter-spacing: .02em; color: #6f6a62; }
.references__fleche {
    position: absolute; top: 50%; transform: translateY(-50%); z-index: 2;
    width: 54px; height: 54px; border-radius: 50%; border: 0; cursor: pointer;
    background: var(--blanc); color: var(--or-fonce); box-shadow: 0 8px 24px rgba(60, 45, 10, .12);
    display: grid; place-items: center; transition: background-color .25s, color .25s;
}
.references__fleche:hover { background: var(--or); color: var(--noir); }
.references__fleche[disabled] { opacity: .35; cursor: default; }
.references__fleche .icone { width: 20px; height: 20px; }
.references__fleche--g { left: 6px; }
.references__fleche--d { right: 6px; }
.references__points { display: flex; justify-content: center; align-items: center; gap: 10px; margin-top: 56px; }
.references__points::before, .references__points::after { content: ''; width: 90px; height: 1px; background: #ddd6c9; margin: 0 12px; }
.references__point { width: 8px; height: 8px; border-radius: 4px; border: 0; padding: 0; background: #d6d0c4; cursor: pointer; transition: width .3s var(--ease), background-color .3s; }
.references__point.is-actif { width: 34px; background: var(--or); }
@media (max-width: 640px) {
    .references__bandeau { padding: 0 8px; }
    .references__fleche { display: none; }
    .references__piste { grid-auto-columns: 165px; padding: 0 16px; }
}

/* ------------------------------------------------------------ Réalisations (accueil) */
.realisations__grille { display: grid; gap: 20px; margin-bottom: 20px; }
@media (min-width: 900px) { .realisations__grille { grid-template-columns: 1fr 1fr; } }
.realisation { position: relative; display: block; overflow: hidden; text-decoration: none; color: var(--blanc); aspect-ratio: 4 / 3; background: var(--noir); }
.realisation img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--ease); }
.realisation:hover img { transform: scale(1.04); }
.realisation:hover { color: var(--blanc); }
.realisation__legende { position: absolute; left: 0; right: 0; bottom: 0; padding: 48px 22px 20px; font-size: .9375rem; font-weight: 600; background: linear-gradient(180deg, transparent, rgba(0,0,0,.75)); }
.realisations__aa { display: grid; gap: 28px; align-items: center; }
@media (min-width: 900px) { .realisations__aa { grid-template-columns: 1fr 1fr; gap: 64px; } .realisations__aa .aa__cadre { max-height: 640px; } }
.realisations__aa-texte h3 { font-size: 1.5rem; }

/* ------------------------------------------------------------ Avant / après */
.aa { margin: 0; }
.aa__cadre { position: relative; overflow: hidden; background: var(--gris); user-select: none; touch-action: pan-y; max-height: 82vh; margin: 0 auto; }
.aa__img { width: 100%; height: 100%; object-fit: cover; }
.aa__img--apres { position: absolute; inset: 0; }
.aa__avant { position: absolute; inset: 0; clip-path: inset(0 calc(100% - var(--pos, 50%)) 0 0); }
.aa__avant img { position: absolute; inset: 0; }
.aa__poignee { position: absolute; top: 0; bottom: 0; left: var(--pos, 50%); width: 2px; margin-left: -1px; background: var(--blanc); pointer-events: none; }
.aa__poignee::after {
    content: '\2039\00a0\203A'; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
    width: 48px; height: 48px; border-radius: 50%; background: var(--or); color: var(--noir);
    display: grid; place-items: center; font-size: 1.25rem; font-weight: 600; box-shadow: 0 4px 18px rgba(0,0,0,.25);
}
.aa__range { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: ew-resize; -webkit-appearance: none; appearance: none; }
.aa__range:focus-visible + .aa__poignee, .aa__range:focus-visible { outline: none; }
.aa__cadre:focus-within .aa__poignee::after { outline: 2px solid var(--blanc); outline-offset: 2px; }
.aa__tag { position: absolute; top: 14px; padding: 6px 12px; font-size: .6875rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; background: rgba(17,17,17,.75); color: var(--blanc); pointer-events: none; }
.aa__tag--avant { left: 14px; }
.aa__tag--apres { right: 14px; }
.aa figcaption { font-size: .9375rem; color: var(--texte-2); padding-top: 14px; }
.aa-liste { display: grid; gap: 72px; }
.aa-liste .aa__cadre { max-height: none; }

/* ------------------------------------------------------------ Fondateur */
.fondateur__grille { display: grid; gap: 36px; align-items: center; }
@media (min-width: 900px) { .fondateur__grille { grid-template-columns: 380px 1fr; gap: 80px; } }
.fondateur__photo { max-width: 380px; }
.fondateur__photo img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: center 20%; }
.citation { margin: 0; padding: 0 0 0 24px; border-left: 2px solid var(--or); }
.citation p { font-size: clamp(1.0625rem, 1.6vw, 1.25rem); line-height: 1.7; }
.citation footer { font-weight: 600; font-size: .9375rem; }

/* ------------------------------------------------------------ Techniques (habillage mural) */
.techniques__grille { display: grid; gap: 56px; }
@media (min-width: 900px) { .techniques__grille { grid-template-columns: 1fr 1fr; gap: 64px; } }
.technique__img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; margin-bottom: 28px; }
.technique h2 { font-size: clamp(1.4rem, 2.4vw, 1.875rem); }

.trio { display: grid; gap: 1px; background: var(--ligne); border: 1px solid var(--ligne); }
@media (min-width: 900px) { .trio { grid-template-columns: repeat(3, 1fr); } }
.trio__item { background: var(--blanc); padding: 32px 28px; }
.trio__num { display: block; font-size: 1.75rem; font-weight: 600; color: var(--or); margin-bottom: 14px; }
.trio__item h3 { font-size: 1.1875rem; }
.trio__item p { color: var(--texte-2); margin: 0; }

.definitions { margin: 0; display: grid; gap: 1px; background: var(--ligne); border: 1px solid var(--ligne); }
@media (min-width: 700px) { .definitions { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1100px) { .definitions { grid-template-columns: repeat(5, 1fr); } }
.definitions > div { background: var(--blanc); padding: 28px 24px; }
.definitions dt { font-weight: 600; font-size: 1.125rem; margin-bottom: 8px; }
.definitions dt::before { content: ''; display: block; width: 24px; height: 1px; background: var(--or); margin-bottom: 18px; }
.definitions dd { margin: 0; color: var(--texte-2); }

/* Tableau comparatif */
.tableau-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.tableau { width: 100%; min-width: 560px; border-collapse: collapse; background: var(--blanc); font-size: .9375rem; }
.tableau th, .tableau td { text-align: left; vertical-align: top; padding: 16px 18px; border-bottom: 1px solid var(--ligne); }
.tableau thead th { background: var(--noir); color: var(--blanc); font-weight: 600; font-size: .8125rem; letter-spacing: .08em; text-transform: uppercase; }
.tableau tbody th { font-weight: 600; width: 26%; }

/* Encart */
.encart { border: 1px solid var(--ligne); border-left: 3px solid var(--or); padding: 32px 28px; background: var(--gris); }
.encart__titre { font-size: clamp(1.25rem, 2.2vw, 1.625rem); }
.encart p:last-child { margin-bottom: 0; }
.encart--noir { background: var(--noir); color: var(--blanc); border: 0; padding: 40px 28px; }
.encart--noir p { color: rgba(255,255,255,.82); }
.encart--noir .surtitre { color: var(--or); }
.encart--noir .btn { margin-top: 8px; }
@media (min-width: 900px) { .encart { padding: 44px 48px; } .encart--noir { padding: 64px; } }

/* ------------------------------------------------------------ Galerie */
.galerie { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; grid-template-columns: 1fr; }
@media (min-width: 640px) { .galerie { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .galerie { grid-template-columns: repeat(3, 1fr); gap: 20px; } }
.galerie--moyen { grid-template-columns: 1fr 1fr; }
@media (min-width: 1024px) { .galerie--moyen { grid-template-columns: repeat(4, 1fr); } }
.galerie__lien { display: block; position: relative; overflow: hidden; text-decoration: none; background: var(--gris); }
.galerie__lien img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .8s var(--ease), opacity .3s; }
.galerie--moyen .galerie__lien img { aspect-ratio: 3 / 4; }
.galerie__lien:hover img { transform: scale(1.04); }
.galerie__legende { display: block; padding: 12px 2px 4px; font-size: .8125rem; line-height: 1.5; color: var(--texte-2); background: var(--blanc); }
.section--gris .galerie__legende { background: var(--gris); }
.note-muzeo { font-size: .8125rem; color: var(--texte-2); margin-top: 24px; }
.coulisses__titre { margin-top: 8px; }

/* ------------------------------------------------------------ Lightbox */
.lightbox { position: fixed; inset: 0; z-index: 1500; background: rgba(10,10,10,.96); display: flex; align-items: center; justify-content: center; padding: 56px 12px; }
.lightbox[hidden] { display: none; }
.lightbox__figure { margin: 0; display: flex; flex-direction: column; align-items: center; max-width: 100%; max-height: 100%; }
.lightbox__img { max-width: min(100%, 1600px); max-height: calc(100vh - 150px); width: auto; height: auto; object-fit: contain; }
.lightbox__legende { color: rgba(255,255,255,.85); font-size: .875rem; padding-top: 14px; text-align: center; max-width: 60em; }
.lightbox__fermer, .lightbox__nav { position: absolute; background: none; border: 0; color: var(--blanc); cursor: pointer; line-height: 1; width: 56px; height: 56px; font-size: 2.5rem; }
.lightbox__fermer { top: 6px; right: 6px; font-size: 2.25rem; }
.lightbox__nav--prec { left: 4px; top: 50%; transform: translateY(-50%); }
.lightbox__nav--suiv { right: 4px; top: 50%; transform: translateY(-50%); }
.lightbox__fermer:hover, .lightbox__nav:hover { color: var(--or); }

/* ------------------------------------------------------------ FAQ */
.faq__liste { border-top: 1px solid var(--noir); }
.faq__item { border-bottom: 1px solid var(--ligne); }
.faq__item summary {
    list-style: none; cursor: pointer; padding: 22px 48px 22px 0; position: relative;
    font-weight: 600; font-size: 1.0625rem;
}
.faq__item summary::-webkit-details-marker { display: none; }
.faq__item summary::after { content: ''; position: absolute; right: 8px; top: 50%; width: 14px; height: 14px; margin-top: -7px;
    background: linear-gradient(var(--or), var(--or)) center / 14px 1.5px no-repeat, linear-gradient(var(--or), var(--or)) center / 1.5px 14px no-repeat;
    transition: transform .3s var(--ease); }
.faq__item[open] summary::after { transform: rotate(45deg); }
.faq__reponse { padding: 0 0 22px; color: var(--texte-2); }
.faq__reponse p { margin: 0; }

/* ------------------------------------------------------------ CTA final */
.cta-final { background: var(--noir); color: var(--blanc); }
.cta-final .intro { color: rgba(255,255,255,.75); }
.cta-final__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 12px; }

/* ------------------------------------------------------------ Formulaire */
.formulaire-section__grille { display: grid; gap: 40px; }
@media (min-width: 1000px) { .formulaire-section__grille { grid-template-columns: 4fr 7fr; gap: 72px; } }
.formulaire-section__tel a { font-size: 1.5rem; font-weight: 600; text-decoration: none; }
.devis-form { background: var(--blanc); padding: 28px 20px; border: 1px solid var(--ligne); }
@media (min-width: 700px) { .devis-form { padding: 40px; } }
.form-cible { font-size: .875rem; color: var(--texte-2); border-left: 2px solid var(--or); padding-left: 12px; }
.form-alerte { background: #fbeaea; border-left: 3px solid #a12a2a; color: #6b1717; padding: 12px 16px; font-size: .9375rem; }
.form-grille { display: grid; gap: 18px; margin-bottom: 24px; }
@media (min-width: 700px) { .form-grille { grid-template-columns: 1fr 1fr; } .champ--large { grid-column: 1 / -1; } }
.champ { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
fieldset.champ { border: 0; padding: 0; margin: 0; }
.champ label, .champ legend { font-size: .8125rem; font-weight: 600; letter-spacing: .02em; padding: 0; }
.req { color: var(--or-fonce); }
.aide { font-weight: 400; color: var(--texte-2); margin-left: 6px; }
.champ input[type="text"], .champ input[type="email"], .champ input[type="tel"], .champ input[type="month"], .champ select, .champ textarea {
    width: 100%; min-height: 50px; padding: 12px 14px; font: inherit; font-size: 1rem; color: var(--texte);
    background: var(--blanc); border: 1px solid #cfccc4; border-radius: var(--rayon); transition: border-color .2s, box-shadow .2s;
}
.champ textarea { resize: vertical; min-height: 110px; }
.champ input:focus, .champ select:focus, .champ textarea:focus { outline: none; border-color: var(--noir); box-shadow: 0 0 0 3px rgba(184,150,12,.25); }
.champ input[type="file"] { font-size: .875rem; padding: 10px 0; }
.champ.is-erreur input, .champ.is-erreur select { border-color: #a12a2a; }
.champ.is-erreur legend, .champ.is-erreur label { color: #a12a2a; }
.cases { display: grid; gap: 8px; margin-top: 6px; }
@media (min-width: 560px) { .cases { grid-template-columns: 1fr 1fr; } }
.case { display: flex; gap: 10px; align-items: flex-start; font-size: .9375rem; cursor: pointer; line-height: 1.45; }
.case input { width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--or-fonce); flex: 0 0 auto; }
.form-rgpd { font-size: .75rem; color: var(--texte-2); margin: 14px 0 0; }
.devis__grille { display: grid; gap: 40px; }
@media (min-width: 1000px) { .devis__grille { grid-template-columns: 8fr 3fr; gap: 56px; align-items: start; } .devis__aside { position: sticky; top: calc(var(--entete) + 24px); } }
.devis__tel a { font-size: 1.5rem; font-weight: 600; text-decoration: none; }

/* ------------------------------------------------------------ À propos */
.bases { list-style: none; margin: 0 0 24px; padding: 0; display: grid; gap: 1px; background: var(--ligne); border: 1px solid var(--ligne); }
@media (min-width: 900px) { .bases { grid-template-columns: repeat(3, 1fr); } }
.base { background: var(--blanc); padding: 28px; display: flex; flex-direction: column; gap: 4px; color: var(--texte-2); }
.base__ville { font-size: 1.375rem; font-weight: 600; color: var(--texte); }
.base__role { font-size: .75rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--or-fonce); margin-bottom: 8px; }

/* ------------------------------------------------------------ Pages légales, 404 */
.texte-legal h2 { font-size: 1.25rem; margin-top: 2em; }
.texte-legal h2:first-child { margin-top: 0; }
.liens-404 { list-style: none; padding: 0; margin: 0 0 32px; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 20px; }

/* ------------------------------------------------------------ Pied de page */
.pied { background: var(--noir-2); color: rgba(255,255,255,.75); font-size: .9375rem; padding: 72px 0 24px; }
.pied a { color: rgba(255,255,255,.88); text-decoration: none; }
.pied a:hover { color: var(--or); }
.pied__grille { display: grid; gap: 40px; }
@media (min-width: 700px) { .pied__grille { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1100px) { .pied__grille { grid-template-columns: 1.3fr 1fr 1fr 1fr; } }
.pied__logo { width: 150px; filter: invert(1); mix-blend-mode: screen; margin-bottom: 20px; }
.pied strong { color: var(--blanc); }
.pied__titre { color: var(--blanc); font-size: .75rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; margin-bottom: 18px; }
.pied__liste { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.pied__label { color: var(--or); font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; }
.pied__frere { margin-top: 10px; font-size: .8125rem; }
.pied__bas { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; border-top: 1px solid rgba(255,255,255,.12); margin-top: 56px; padding-top: 20px; font-size: .8125rem; }
.pied__bas p { margin: 0; }
.pied .lien-bouton { color: rgba(255,255,255,.88); text-decoration: none; }
.pied .lien-bouton:hover { color: var(--or); }
.pied--lp { padding-top: 8px; }
.pied--lp .pied__bas { margin-top: 0; border-top: 0; }

/* ------------------------------------------------------------ Barre mobile */
.barre-mobile { position: fixed; left: 0; right: 0; bottom: 0; z-index: 800; display: grid; grid-template-columns: 1fr 1fr; height: 64px; background: var(--blanc); border-top: 1px solid var(--ligne); padding-bottom: env(safe-area-inset-bottom); }
.barre-mobile__btn { display: flex; align-items: center; justify-content: center; font-size: .8125rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; text-decoration: none; color: var(--noir); }
.barre-mobile__btn--gold { background: var(--or); }
@media (min-width: 1080px) { .barre-mobile { display: none; } body { padding-bottom: 0; } }

/* ------------------------------------------------------------ Bandeau cookies */
.cookies { position: fixed; left: 0; right: 0; bottom: 64px; z-index: 1200; padding: 12px; }
.cookies[hidden] { display: none; }
@media (min-width: 1080px) { .cookies { bottom: 0; padding: 24px; } }
.cookies__boite { max-width: 760px; margin: 0 auto; background: var(--blanc); border: 1px solid var(--ligne); box-shadow: 0 20px 60px rgba(0,0,0,.18); padding: 22px; font-size: .875rem; max-height: calc(100vh - 100px); overflow-y: auto; }
.cookies__titre { font-weight: 600; font-size: 1rem; margin-bottom: 8px; }
.cookies__choix { display: grid; gap: 10px; margin: 6px 0 16px; }
.cookies__actions { display: flex; flex-wrap: wrap; gap: 8px; }
.cookies__actions .btn { min-height: 44px; padding: 10px 18px; font-size: .75rem; flex: 1 1 auto; }

/* ------------------------------------------------------------ Pages d'atterrissage */
.entete--lp .entete__cta { display: none; }
.entete--lp .entete__tel { display: none; }
@media (min-width: 700px) { .entete--lp .entete__tel { display: inline; margin-left: auto; } .entete--lp .entete__cta { display: inline-flex; margin-left: 20px; } }
.lp-hero { padding: 28px 0 56px; background: var(--gris); }
.lp-hero__grille { display: grid; gap: 28px; }
.lp-hero__titre { font-size: clamp(1.6rem, 3.4vw, 2.6rem); }
.lp-hero__puces { list-style: none; padding: 0; margin: 0 0 24px; display: grid; gap: 10px; }
.lp-hero__puces li { position: relative; padding-left: 30px; font-weight: 600; }
.lp-hero__puces li::before { content: ''; position: absolute; left: 0; top: .45em; width: 14px; height: 8px; border-left: 2px solid var(--or-fonce); border-bottom: 2px solid var(--or-fonce); transform: rotate(-45deg); }
.lp-hero__photo img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.lp-hero__appel { width: 100%; margin-top: 16px; }
.lp-hero__form-titre { font-size: 1.25rem; font-weight: 600; margin: 0 0 12px; }
@media (min-width: 1024px) {
    .lp-hero { padding: 48px 0 72px; }
    .lp-hero__grille { grid-template-columns: 7fr 5fr; gap: 48px; align-items: start; }
    .lp-hero__appel { display: none; }
    .lp-hero__form .devis-form { padding: 28px; }
}

/* ------------------------------------------------------------ Apparition au défilement */
.js .reveal { opacity: 0; transform: translateY(18px); transition: opacity .8s var(--ease), transform .8s var(--ease); }
.js .reveal.is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .js .reveal { opacity: 1; transform: none; transition: none; }
    * { transition-duration: 0s !important; }
}

@media print {
    .entete, .barre-mobile, .cookies, .devis-form, .pied { display: none; }
    body { padding: 0; }
}