/* Sable — feuille de style du site
   Palette tirée des matières : écume, sable, travertin, argile, chêne fumé.
   Polices : Cormorant Garamond (titres) + Manrope (texte).
   Note pour la mise en ligne : idéalement, héberger les polices sur le serveur (RGPD) plutôt que via Google Fonts. */

:root {
  --ecume: #F6F2EC;
  --sable: #E8DFD3;
  --travertin: #D6C8B6;
  --dune: #C4AE98;
  --argile: #8A5A3F;
  --chene: #2B231E;
  --muted: #6B5E53;
  --display: 'Cormorant Garamond', 'Times New Roman', serif;
  --body: 'Manrope', 'Helvetica Neue', Arial, sans-serif;
  --max: 1280px;
  --gutter: max(20px, env(safe-area-inset-left, 0px));
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--ecume); color: var(--chene); font-family: var(--body); font-weight: 300; font-size: 17px; line-height: 1.75; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
a:hover { color: var(--argile); }
a:focus-visible, button:focus-visible { outline: 2px solid var(--argile); outline-offset: 3px; }

.wrap { max-width: var(--max); margin: 0 auto; padding-left: var(--gutter); padding-right: max(20px, env(safe-area-inset-right, 0px)); }
.narrow { max-width: 820px; margin: 0 auto; padding-left: var(--gutter); padding-right: max(20px, env(safe-area-inset-right, 0px)); }

/* Typographie */
h1, h2, h3 { font-family: var(--display); font-weight: 300; margin: 0; text-wrap: balance; }
h1 { font-size: clamp(44px, 6.4vw, 92px); line-height: 1.03; }
h2 { font-size: clamp(34px, 4vw, 54px); line-height: 1.1; }
h3 { font-size: 30px; font-weight: 400; line-height: 1.2; }
em { font-style: italic; }
p { margin: 0; }
.eyebrow { font-family: var(--body); font-size: 12px; letter-spacing: .24em; text-transform: uppercase; font-weight: 500; color: var(--argile); }
.lead { font-family: var(--display); font-weight: 300; font-size: clamp(26px, 2.8vw, 38px); line-height: 1.38; }
.small { font-size: 13px; color: var(--muted); }
.link { font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 500; border-bottom: 1px solid currentColor; padding-bottom: 4px; align-self: flex-start; }
.center { text-align: center; }

/* En-tête */
.site-header { position: relative; z-index: 20; }
.site-header .wrap { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-top: 26px; padding-bottom: 26px; }
.brand { display: flex; align-items: center; gap: 12px; }
.brand span { font-family: var(--display); font-weight: 300; font-size: 34px; line-height: 1; letter-spacing: .03em; }
.brand img { height: 22px; width: auto; }
.brand .logo-full { height: 30px; width: auto; }
.site-footer .brand .logo-full { height: 34px; }
.nav { display: flex; align-items: center; gap: 30px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 500; }
.nav a[aria-current="page"] { color: var(--argile); }
.lang { color: var(--muted); }
.lang a[aria-current="true"] { color: var(--chene); }
.burger { display: none; background: none; border: 0; padding: 10px; margin: -10px; cursor: pointer; color: var(--chene); }
.burger svg { display: block; }

/* Menu plein écran (téléphone) */
.menu-overlay { position: fixed; inset: 0; z-index: 30; background: var(--sable); display: flex; flex-direction: column; padding: 26px var(--gutter) 40px; }
.menu-overlay[hidden] { display: none; }
.menu-overlay .top { display: flex; justify-content: space-between; align-items: center; }
.menu-overlay nav { flex: 1; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 26px; font-size: 18px; letter-spacing: .2em; text-transform: uppercase; font-weight: 400; }
.menu-overlay .lang { text-align: center; font-size: 14px; letter-spacing: .2em; }
body.menu-open { overflow: hidden; }

@media (max-width: 880px) {
  .nav { display: none; }
  .burger { display: block; }
}

/* Sections */
.section { padding-top: 130px; padding-bottom: 130px; }
.band-sable { background: var(--sable); }
.band-dark { background: var(--chene); color: var(--ecume); }
.band-dark .eyebrow { color: var(--travertin); }
.band-dark a:hover { color: var(--travertin); }
.stack { display: flex; flex-direction: column; gap: 26px; }
.split { display: flex; flex-wrap: wrap; gap: 72px; align-items: center; }
.split > * { flex: 1 1 400px; min-width: 0; }
.split.reverse { flex-wrap: wrap-reverse; }
.cover { width: 100%; object-fit: cover; }
.h-hero { height: min(72vh, 720px); }
.h-tall { height: 620px; }
.h-mid { height: 440px; }
.h-small { height: 300px; }
@media (max-width: 700px) {
  .section { padding-top: 90px; padding-bottom: 90px; }
  .h-hero { height: 420px; } .h-tall { height: 480px; } .h-mid { height: 380px; }
  body { font-size: 16px; }
}

/* Accueil */
.hero-title { padding-top: 56px; padding-bottom: 48px; display: flex; flex-direction: column; gap: 20px; align-items: center; text-align: center; }
.trio { display: flex; flex-wrap: wrap; gap: 40px; }
.trio > * { flex: 1 1 300px; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.trio .num { font-family: var(--display); font-size: 22px; color: var(--argile); }
.quote { font-family: var(--display); font-weight: 300; font-style: italic; font-size: clamp(32px, 4vw, 54px); line-height: 1.25; }

/* Projets */
.grid-projects { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 56px 32px; }
.card { display: flex; flex-direction: column; gap: 14px; }
.card .name { font-family: var(--display); font-size: 30px; line-height: 1.15; }
.card img { transition: opacity .3s; }
.card:hover img { opacity: .9; }
.span-4 { grid-column: span 4; } .span-7 { grid-column: span 7; } .span-5 { grid-column: span 5; } .span-6 { grid-column: span 6; }
.offset-down { margin-top: 120px; }
@media (max-width: 800px) {
  .grid-projects { grid-template-columns: 1fr; }
  .span-4, .span-7, .span-5, .span-6 { grid-column: auto; }
  .offset-down { margin-top: 0; }
}

/* Page projet */
.meta-line { font-size: 13px; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.tags { display: flex; flex-wrap: wrap; gap: 10px 22px; font-size: 11px; letter-spacing: .22em; text-transform: uppercase; font-weight: 600; color: var(--argile); }
.gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.gallery .full { grid-column: 1 / -1; }
.gallery img { width: 100%; height: 100%; object-fit: cover; aspect-ratio: 4 / 5; }
.gallery .full img { aspect-ratio: 16 / 9; }
@media (max-width: 700px) { .gallery { grid-template-columns: 1fr; } .gallery img, .gallery .full img { aspect-ratio: auto; } }
.next { border-top: 1px solid var(--travertin); padding-top: 40px; padding-bottom: 80px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 20px; align-items: baseline; }
.next a.big { font-family: var(--display); font-size: 32px; }

/* Valeurs */
.values { display: flex; flex-wrap: wrap; gap: 40px; }
.values > * { flex: 1 1 280px; border-top: 1px solid var(--chene); padding-top: 26px; display: flex; flex-direction: column; gap: 12px; }

/* Contact */
.contact-big { font-family: var(--display); font-weight: 300; font-size: clamp(22px, 2.4vw, 30px); line-height: 1.2; word-break: break-word; }
.btns { display: flex; flex-wrap: wrap; gap: 16px; }
.btn { display: inline-block; background: var(--chene); color: var(--ecume); padding: 18px 34px; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; font-weight: 500; }
.btn:hover { color: var(--ecume); background: var(--argile); }
.btn.ghost { background: transparent; color: var(--chene); border: 1px solid var(--chene); }
.btn.ghost:hover { background: var(--chene); color: var(--ecume); }
.band-dark .btn { background: var(--ecume); color: var(--chene); }

/* Pied de page */
.site-footer { background: var(--chene); color: var(--travertin); font-size: 14px; line-height: 1.8; }
.site-footer .wrap { padding-top: 70px; padding-bottom: 50px; display: flex; flex-wrap: wrap; gap: 48px; justify-content: space-between; }
.site-footer .col { display: flex; flex-direction: column; gap: 4px; min-width: 220px; }
.site-footer .brand span { color: var(--ecume); }
.site-footer a:hover { color: var(--ecume); }
.site-footer .legal { border-top: 1px solid #4A3F36; }
.site-footer .legal .wrap { padding-top: 20px; padding-bottom: 28px; font-size: 12px; gap: 16px; }

/* Texte légal */
.legal-text h2 { font-size: 30px; margin-top: 40px; margin-bottom: 10px; }
.legal-text p { margin-bottom: 10px; }

@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }

/* Mode comparaison (temporaire) */
.v-new { color: #2E5E7E; }
.band-dark .v-new { color: #A9CBE3; }
.v-tag { display: inline-block; font-family: var(--body); font-style: normal; font-size: 10px; line-height: 1.6; letter-spacing: .2em; text-transform: uppercase; font-weight: 600; background: #2E5E7E; color: #fff; padding: 2px 8px; margin-right: 10px; vertical-align: middle; border-radius: 2px; }
.band-dark .v-tag { background: #A9CBE3; color: #1E1915; }
.cmp-banner { background: #2E5E7E; color: #fff; font-size: 13px; text-align: center; padding: 10px 20px; }

.site-footer .insta { display: inline-flex; align-items: center; gap: 8px; }

/* Bloc pleine hauteur : photo collée aux bords du bandeau */
.bleed { display: flex; flex-wrap: wrap-reverse; align-items: stretch; }
.bleed-text { flex: 1 1 420px; min-width: 0; justify-content: center; padding: 130px max(20px, env(safe-area-inset-left, 0px)) 130px max(20px, calc((100vw - var(--max)) / 2 + 20px)); }
.bleed-img { flex: 1 1 420px; min-width: 0; min-height: 520px; position: relative; overflow: hidden; }
.bleed-img img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; }
.caps { text-transform: uppercase; letter-spacing: .08em; color: var(--argile); }
@media (max-width: 700px) { .bleed-text { padding-block: 80px; } .bleed-img { min-height: 380px; } }

.btn-contact { text-transform: none; letter-spacing: .04em; font-size: 15px; font-weight: 400; }

.trio-center { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 880px; margin: 0 auto; width: 100%; gap: 48px; }
.trio-center > * { text-align: center; align-items: center; }
.trio-center p { max-width: 24ch; }
@media (max-width: 760px) { .trio-center { grid-template-columns: 1fr; } }

@media (min-width: 760px) { .site-footer .col-offset { padding-top: 52px; } }

/* Pied de page : bloc resserré et centré, colonnes réparties */
.site-footer .wrap { max-width: 1040px; }
.site-footer .col { min-width: 0; }
@media (min-width: 760px) {
  .site-footer > .wrap { display: flex; justify-content: space-between; align-items: flex-start; }
  .site-footer > .wrap > .col:nth-child(3) { align-items: flex-end; }
}

/* Mentions légales : présentation type document */
.legal-doc { padding-top: 48px; padding-bottom: 100px; font-size: 15px; line-height: 1.7; }
.legal-doc h1 { font-family: var(--body); font-weight: 500; font-size: 26px; line-height: 1.3; margin-bottom: 12px; }
.legal-doc h2 { font-family: var(--body); font-weight: 600; font-size: 15px; margin: 32px 0 6px; }
.legal-doc p { margin: 0 0 10px; }
.legal-doc strong { font-weight: 600; }

/* Pied de page option 2 (façon Verdune) */
.footer-v { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; line-height: 1.9; color: var(--sable); }
.site-footer.footer-v > .wrap.fv-grid { max-width: 1280px; padding-top: 40px; padding-bottom: 34px; display: grid; grid-template-columns: auto 1fr auto 1fr auto; grid-template-rows: auto auto auto; gap: 0; }
.footer-v .fv-icon { grid-column: 3; grid-row: 1; justify-self: center; height: 26px; width: auto; margin-bottom: 26px; opacity: .9; }
.footer-v .fv-t { display: flex; flex-direction: column; grid-row: 2; }
.footer-v .c1 { grid-column: 1; } .footer-v .c2 { grid-column: 3; } .footer-v .c3 { grid-column: 5; }
.footer-v .fv-b { grid-row: 3; margin-top: 34px; font-size: 11px; color: #9A8C7E; justify-self: start; }
.footer-v a.fv-b { text-decoration: underline; text-underline-offset: 4px; }
.footer-v a:hover { color: var(--ecume); }
@media (max-width: 759px) {
  .site-footer.footer-v > .wrap.fv-grid { grid-template-columns: 1fr; padding-top: 44px; }
  .footer-v .fv-icon, .footer-v .fv-t, .footer-v .fv-b { grid-column: 1; grid-row: auto; justify-self: start; }
  .footer-v .fv-icon { margin-bottom: 32px; }
  .footer-v .fv-t { margin-bottom: 24px; }
  .footer-v .fv-b { margin-top: 0; margin-bottom: 10px; }
  .footer-v .fv-b.c1 { margin-top: 24px; }
}
.footer-v a.fv-insta { justify-self: center; text-decoration: none; display: inline-flex; align-self: center; }
@media (max-width: 759px) { .footer-v a.fv-insta { justify-self: start; } }
/* Pied de page plus aéré sur les côtés */
.site-footer.footer-v > .wrap.fv-grid { max-width: 1180px; padding-left: max(32px, 6vw, env(safe-area-inset-left, 0px)); padding-right: max(32px, 6vw, env(safe-area-inset-right, 0px)); padding-top: 48px; padding-bottom: 44px; }
@media (min-width: 1300px) { .site-footer.footer-v > .wrap.fv-grid { max-width: 1240px; padding-left: 80px; padding-right: 80px; } }
@media (max-width: 759px) { .site-footer.footer-v > .wrap.fv-grid { padding-top: 48px; padding-bottom: 40px; } }

/* Retours à la ligne seulement sur ordinateur */
.br-d { display: none; }
@media (min-width: 760px) { .br-d { display: inline; } }

/* Photos qui touchent le bord de la page (façon Verdune) */
:root { --edge: calc((100vw - min(100vw, var(--max))) / 2 + 20px); }
html, body { overflow-x: clip; }
.edge-full { width: calc(100% + 2 * var(--edge)); max-width: none; margin-left: calc(-1 * var(--edge)); }
.edge-l { margin-left: calc(-1 * var(--edge)); }
.edge-r { margin-right: calc(-1 * var(--edge)); }
@media (max-width: 911px) {
  .edge-l, .edge-r { margin-left: -20px; margin-right: -20px; max-width: none; }
}

/* Grille projets : deux par ligne */
.span-12 { grid-column: span 12; }
.h-card { height: 560px; }
.h-wide { height: min(70vh, 680px); }
.grid-projects { row-gap: 72px; column-gap: 40px; }
@media (max-width: 800px) {
  .span-12 { grid-column: auto; }
  .h-card, .h-wide { height: 420px; }
  .grid-projects { row-gap: 48px; }
}

img[src$="banquette.jpg"] { object-position: 50% 75%; }

/* Valeurs : trois colonnes égales sur ordinateur, une sous l'autre sur téléphone */
.values { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; }
.values > * { flex: none; }
@media (max-width: 860px) { .values { grid-template-columns: 1fr; gap: 28px; } }

/* Petite rangée d'objets (L'histoire) */
.objets { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 20px; }
.objets figure { margin: 0; display: flex; flex-direction: column; gap: 12px; }
.objets img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.objets figcaption { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; font-weight: 500; display: flex; flex-direction: column; gap: 2px; }
.objets figcaption span { font-size: 13px; letter-spacing: 0; text-transform: none; font-weight: 300; color: var(--muted); }
@media (max-width: 900px) { .objets { grid-template-columns: repeat(2, minmax(0, 1fr)); } .objets figure:last-child { grid-column: span 2; } .objets figure:last-child img { aspect-ratio: 16 / 10; } }


/* Légende discrète sous une image */
.fig-legende { margin-top: 0; margin-bottom: 0; display: flex; flex-direction: column; gap: 10px; }
.fig-legende figcaption { font-size: 12px; line-height: 1.5; color: var(--muted); padding-left: var(--edge); }
.fig-legende figcaption em { font-style: italic; }
@media (max-width: 911px) { .fig-legende figcaption { padding-left: 20px; } }

/* Protection légère des images : pas de glisser-déposer ni de menu « enregistrer » */
img { -webkit-user-drag: none; user-drag: none; -webkit-touch-callout: none; user-select: none; -webkit-user-select: none; }

.h-band { height: min(62vh, 560px); object-position: 50% 55%; display: block; }
@media (max-width: 860px) { .h-band { height: 320px; } }

/* ===== Variante B : grille fixe ===== */
.edge-l, .edge-r { margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; max-width: 100% !important; }
.split, .split.reverse { display: grid !important; grid-template-columns: 1fr 1fr; gap: 88px; align-items: center; flex-wrap: nowrap; }
.split > * { flex: none; min-width: 0; }
.split > .stack { order: 1; }
.split > img, .split > figure { order: 2; }
.split > img, .split > figure img, .split .h-tall, .split .h-mid { height: 560px !important; width: 100%; }
.band-dark:not(.site-footer) { background: var(--sable); color: inherit; }
.band-dark:not(.site-footer) .eyebrow { color: var(--argile); }
.band-dark:not(.site-footer) .btn { background: var(--chene); color: var(--ecume); }
.band-sable:has(.split) { background: transparent; }
.section { padding-top: 120px; padding-bottom: 120px; }
@media (max-width: 860px) {
  .split, .split.reverse { grid-template-columns: 1fr; gap: 40px; }
  .split > img, .split > figure img, .split .h-tall, .split .h-mid { height: 420px !important; }
  .section { padding-top: 80px; padding-bottom: 80px; }
}

/* ===== Variante C : B + tout aligné à gauche ===== */
.center, .hero-title, .trio-center > * { text-align: left !important; }
.center, .hero-title, .stack.center, .trio-center > *, [style*="align-items:center"] { align-items: flex-start !important; }
[style*="align-self:center"] { align-self: flex-start !important; }
.narrow { max-width: var(--max) !important; }
.narrow > * { max-width: 760px; }
[style*="margin:0 auto"], .trio-center { margin-left: 0 !important; margin-right: 0 !important; }
.trio-center { max-width: 100%; }
.trio-center p { max-width: 30ch; }

/* ===== Variante D : C + phrases courtes centrées ===== */
.d-center, .d-center .center, .d-center .stack { text-align: center !important; align-items: center !important; }
.d-center .narrow, .d-center.narrow { max-width: 820px !important; margin-left: auto !important; margin-right: auto !important; }
.d-center .narrow > *, .d-center.narrow > * { margin-left: auto; margin-right: auto; }
.d-center [style*="align-self"] { align-self: center !important; }

.split img[src*="becco2"] { height: 430px !important; object-position: 50% 50%; aspect-ratio: 4 / 3; height: auto !important; }
@media (max-width: 860px) { .split img[src*="becco2"] { height: auto !important; } }

/* Galerie projet : formats naturels, deux colonnes */
.gallery { display: block !important; columns: 2; column-gap: 32px; }
.gallery figure { break-inside: avoid; margin: 0 0 32px !important; }
.gallery .full { column-span: all; margin-bottom: 48px !important; }
.gallery img { height: auto !important; aspect-ratio: auto !important; object-fit: cover; display: block; }
.gallery .full img { aspect-ratio: 16 / 9 !important; height: auto !important; }
@media (max-width: 700px) { .gallery { columns: 1; } .gallery .full img { aspect-ratio: auto !important; } }

/* Règle photos : 4:5 vertical, bord perdu à droite */
.split > img, .split > figure { width: calc(100% + var(--edge)) !important; max-width: none !important; margin-right: calc(-1 * var(--edge)) !important; margin-left: 0 !important; }
.split > img, .split > figure img, .split .h-tall, .split .h-mid, .split img[src*="becco2"] { aspect-ratio: 4 / 5 !important; height: auto !important; max-height: 86vh; object-fit: cover; }
.split > img { width: calc(100% + var(--edge)) !important; }
.split img[src*="becco2"] { object-position: 52% 50%; }
.split > figure img { width: 100% !important; }
.split { grid-template-columns: 1.15fr 1fr !important; }
@media (max-width: 860px) {
  .split { grid-template-columns: 1fr !important; }
  .split > img, .split > figure { width: calc(100% + var(--edge) + var(--gutter, 20px)) !important; margin-left: calc(-1 * var(--gutter, 20px)) !important; }
}

/* BECCO détourée : sans fond, sur le fond du site */
.split img[src*="becco-detoure"] { object-fit: contain !important; object-position: 50% 50% !important; background: transparent; }
.split > img[src*="becco-detoure"] { width: 100% !important; margin-right: 0 !important; aspect-ratio: auto !important; max-height: none; }

.split > img[src*="becco-detoure"] { width: calc(100% + 80px + var(--edge) - 24px) !important; margin-left: -80px !important; margin-right: calc(-1 * (var(--edge) - 24px)) !important; max-width: none !important; }
@media (max-width: 860px) { .split > img[src*="becco-detoure"] { width: 100% !important; margin: 0 !important; } }
@media (min-width: 861px) { .split > img[src*="becco-detoure"] { width: calc(100% + var(--edge) - 24px) !important; margin-left: 0 !important; } }

/* Accueil : titre à gauche, photo verticale à droite */
.hero-split { display: grid !important; grid-template-columns: 1.15fr 1fr; gap: 88px; align-items: center; }
.hero-split > img { aspect-ratio: 4 / 5; height: auto; max-height: 84vh; object-fit: cover; object-position: 50% 60%; width: calc(100% + var(--edge)); max-width: none; margin-right: calc(-1 * var(--edge)); }
.hero-split h1 { text-align: left; }
@media (max-width: 860px) { .hero-split { grid-template-columns: 1fr; gap: 32px; } .hero-split > img { width: calc(100% + var(--edge) + var(--gutter)); margin-left: calc(-1 * var(--gutter)); } }

/* ===== Variante E : en-tête centré, accueil plein écran ===== */
.hdr-c .wrap { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; }
.hdr-c .nav-l { justify-self: start; }
.hdr-c .nav-r { justify-self: end; }
.hdr-c .brand { justify-self: center; }
.hdr-c .burger { display: none; }
@media (max-width: 960px) {
  .hdr-c .wrap { grid-template-columns: 1fr auto 1fr; }
  .hdr-c .nav-l, .hdr-c .nav-r { display: none; }
  .hdr-c .brand { grid-column: 2; }
  .hdr-c .burger { display: block; grid-column: 3; justify-self: end; }
}
.home-full .site-header { position: absolute; top: 0; left: 0; right: 0; color: #fff; }
.home-full .site-header .nav a, .home-full .site-header .lang, .home-full .site-header .lang a, .home-full .site-header .burger { color: #fff; }
.home-full .site-header .brand img { filter: brightness(0) invert(1); }
.home-full .site-header::before { content: ""; position: absolute; inset: 0 0 -60px 0; background: linear-gradient(rgba(20,16,12,.38), rgba(20,16,12,0)); z-index: -1; pointer-events: none; }
.hero-full { position: relative; height: 100vh; height: 100svh; min-height: 520px; overflow: hidden; color: #fff; }
.hero-full > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 45%; }
.hero-full::after { content: ""; position: absolute; inset: 45% 0 0 0; background: linear-gradient(rgba(20,16,12,0), rgba(20,16,12,.45)); }
.hero-full-txt { position: absolute; left: 0; right: 0; bottom: 56px; z-index: 2; display: flex; flex-direction: column; gap: 16px; }
.hero-full-txt h1 { color: #fff; margin: 0; max-width: 14ch; }
.hero-full-txt .eyebrow { color: rgba(255,255,255,.85); }
@media (max-width: 860px) { .hero-full-txt { bottom: 40px; } .hero-full > img { object-position: 42% 50%; } }

.hero-full > img[src*="accueil-marbre"] { object-position: 45% 50%; }

.detail-band { display: block; width: 100%; aspect-ratio: 3 / 1; object-fit: cover; object-position: 50% 55%; }
@media (max-width: 860px) { .detail-band { aspect-ratio: 4 / 3; } }

/* Menu téléphone : plus léger et aéré */
.menu-overlay .top { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; }
.menu-overlay .top .brand { grid-column: 2; }
.menu-overlay .top .menu-close { grid-column: 3; justify-self: end; }
.menu-overlay .menu-close:focus:not(:focus-visible) { outline: none; }
.menu-overlay .menu-close svg path, .menu-overlay .menu-close svg line { stroke-width: 1; }
.menu-overlay nav { gap: 52px; font-size: 15px; letter-spacing: .26em; font-weight: 300; }
.menu-overlay .lang { font-size: 12px; letter-spacing: .24em; font-weight: 300; margin-bottom: 24px; }

/* ===== Héros plein écran sur toutes les pages, fond unique ===== */
.band-sable, .band-dark:not(.site-footer) { background: transparent !important; color: inherit !important; }
.band-dark:not(.site-footer) .eyebrow { color: var(--argile) !important; }
.cta-dark { background: var(--chene) !important; color: var(--ecume) !important; }
.cta-dark h2, .cta-dark p { color: var(--ecume) !important; }
.cta-dark .btn { background: transparent !important; color: var(--ecume) !important; border: 1px solid var(--ecume) !important; }
.hero-full-txt .eyebrow { color: rgba(255,255,255,.85) !important; }
.home-full .site-header .nav a[aria-current="page"] { color: #fff; text-decoration: underline; text-underline-offset: 6px; }
.detail-band { width: 100vw !important; max-width: none !important; margin-left: calc(50% - 50vw) !important; aspect-ratio: 3 / 1; height: auto; object-fit: cover; }
@media (max-width: 860px) { .detail-band { aspect-ratio: 4 / 3; } }
.contact-stack { padding-top: 110px; padding-bottom: 130px; }

/* L'histoire : rythmes variés */
.objet-c { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 56px; }
.objet-c .objet-txt { max-width: 560px; align-items: center !important; text-align: center !important; }
.objet-c .objet-img { width: min(100%, 900px); height: auto; display: block; }
.heritage { padding-top: 0 !important; }
.heritage-band { display: block; width: 100%; aspect-ratio: 21 / 9; height: auto; object-fit: cover; object-position: 50% 50%; }
.heritage-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.2fr); gap: 88px; padding-top: 72px; align-items: start; }
.heritage-grid .stack { max-width: 520px; }
@media (max-width: 860px) {
  .heritage-band { aspect-ratio: 4 / 3; }
  .heritage-grid { grid-template-columns: 1fr; gap: 24px; padding-top: 44px; }
  .objet-c { gap: 36px; }
}

.split.img-left { grid-template-columns: minmax(0,1.3fr) minmax(0,.8fr) !important; }
.split.img-left > figure, .split.img-left > img { order: 1 !important; margin-left: calc(-1 * var(--edge)) !important; margin-right: 0 !important; width: calc(100% + var(--edge)) !important; }
.split.img-left > .stack { order: 2 !important; }
@media (max-width: 860px) { .split.img-left { grid-template-columns: 1fr !important; } .split.img-left > figure, .split.img-left > img { margin-left: calc(-1 * var(--gutter, 20px)) !important; width: calc(100% + var(--edge) + var(--gutter, 20px)) !important; } }

.heritage2 { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 96px; align-items: center; }
.heritage2 .stack { max-width: 460px; justify-self: end; }
.heritage2 .heritage-v { width: 100%; max-width: 480px; aspect-ratio: 4 / 5; height: auto; object-fit: cover; object-position: 50% 60%; }
@media (max-width: 860px) { .heritage2 { grid-template-columns: 1fr; gap: 36px; } .heritage2 .stack { justify-self: start; } .heritage2 .heritage-v { max-width: none; } }

.split img[src*="beckius-tableau"] { aspect-ratio: 2 / 3 !important; max-height: none !important; object-position: 50% 50%; }

.methode-line { max-width: none; margin: 8px 0 0; padding-top: 32px; border-top: 1px solid var(--travertin, #D6C8B6); }
.methode-line { border-top: 0 !important; padding-top: 8px !important; }

/* En-tête et titres sur photo : couleur sable, comme le pied de page */
.home-full .site-header .nav a, .home-full .site-header .lang, .home-full .site-header .lang a, .home-full .site-header .burger { color: var(--sable) !important; }
.home-full .site-header .nav a[aria-current="page"] { color: var(--sable) !important; }
.home-full .site-header .brand img { filter: brightness(0) invert(93%) sepia(9%) saturate(390%) hue-rotate(338deg) !important; }
.hero-full-txt h1, .hero-full-txt h1 em { color: var(--sable) !important; }
.hero-full-txt .eyebrow { color: var(--sable) !important; opacity: .9; }

/* En-tête blanc sur photo */
.home-full .site-header .nav a, .home-full .site-header .lang, .home-full .site-header .lang a, .home-full .site-header .burger, .home-full .site-header .nav a[aria-current="page"] { color: #fff !important; }
.home-full .site-header .brand img { filter: brightness(0) invert(1) !important; }
.hero-full-txt h1, .hero-full-txt h1 em { color: #fff !important; }
.hero-full-txt .eyebrow { color: rgba(255,255,255,.85) !important; opacity: 1; }

/* Couleur d'accent : sable foncé, nuance du logo (au lieu de la rouille) */
:root { --argile: #8F7E6B; }

/* Les premiers objets : mise en page éditoriale */
.objet-ed .objet-eb { margin-bottom: 40px; }
.objet-grid { display: grid; grid-template-columns: minmax(0,1.55fr) minmax(0,1fr); gap: 80px; align-items: end; }
.objet-fig { margin: 0; }
.objet-fig img { display: block; width: 100%; height: auto; }
.objet-fig figcaption { margin-top: 18px; font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--argile); }
.objet-col { display: flex; flex-direction: column; gap: 18px; max-width: 380px; padding-bottom: 46px; border-top: 1px solid var(--travertin); padding-top: 28px; }
.objet-name { font-family: var(--display); font-weight: 300; font-style: italic; font-size: clamp(56px, 7vw, 104px); line-height: .9; letter-spacing: .02em; color: var(--travertin); margin: 0 0 6px; }
.objet-col h2 { font-size: clamp(24px, 2.4vw, 32px) !important; margin: 0; }
@media (max-width: 860px) { .objet-grid { grid-template-columns: 1fr; gap: 36px; } .objet-col { max-width: none; padding-bottom: 0; } }

.split > img.objet-split-img { aspect-ratio: auto !important; object-fit: contain !important; height: auto !important; max-height: none !important; width: 100% !important; margin-right: 0 !important; }

/* Variante L'histoire : texte continu, style « About » */
.ab { max-width: 1100px; padding-top: 120px; padding-bottom: 140px; display: flex; flex-direction: column; gap: 34px; }
.ab-title { font-family: var(--body); font-weight: 300; font-size: 26px; letter-spacing: .04em; text-transform: uppercase; margin: 0 0 18px; color: var(--muted); }
.ab p { font-size: 19px; line-height: 1.75; font-weight: 300; margin: 0; color: var(--muted); max-width: 1000px; }
.ab p b { font-weight: 400; color: var(--chene); }
.ab .ab-quote { font-family: var(--display); font-style: italic; font-size: 26px; color: var(--chene); margin: 12px 0; }
.ab-fig { margin: 30px 0; }
.ab-fig img { display: block; width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.ab-fig.ab-contain img { aspect-ratio: auto; object-fit: contain; max-width: 900px; }
.ab-fig figcaption { margin-top: 12px; font-size: 12px; color: var(--muted); }
@media (max-width: 860px) { .ab { padding-top: 70px; gap: 26px; } .ab p { font-size: 16.5px; } .ab .ab-quote { font-size: 21px; } }


/* ===== Variante H : sophistiquée, une seule police, très sobre ===== */
:root { --display: 'Manrope', 'Helvetica Neue', Arial, sans-serif; --ecume: #F4F2EE; }
body { font-size: 15px; line-height: 1.85; color: #3B342E; letter-spacing: .005em; }
em { font-style: normal; }
h1 { font-weight: 300 !important; font-size: clamp(30px, 3.6vw, 50px) !important; letter-spacing: -.01em; line-height: 1.15 !important; }
h2 { font-weight: 300 !important; font-size: clamp(22px, 2.2vw, 30px) !important; letter-spacing: -.005em; line-height: 1.3 !important; }
h3 { font-family: var(--body) !important; font-weight: 400 !important; font-size: 12px !important; letter-spacing: .2em !important; text-transform: uppercase; }
.eyebrow { font-size: 10.5px !important; letter-spacing: .26em !important; font-weight: 400 !important; color: #8C8178 !important; }
.lead { font-family: var(--body) !important; font-weight: 300 !important; font-size: clamp(18px, 1.7vw, 22px) !important; line-height: 1.6 !important; }
.quote { font-family: var(--body) !important; font-style: normal !important; font-weight: 300 !important; font-size: clamp(20px, 2vw, 26px) !important; }
main p { max-width: 560px; }
.values p, .card .small { font-size: 13.5px; }
.card .name { font-family: var(--body) !important; font-size: 12px !important; letter-spacing: .2em; text-transform: uppercase; font-weight: 400; margin-top: 14px; display: block; }
.section { padding-top: 160px !important; padding-bottom: 160px !important; }
.btn { background: transparent !important; color: var(--chene) !important; border: 1px solid currentColor !important; font-size: 10.5px !important; letter-spacing: .26em !important; padding: 15px 32px !important; font-weight: 400 !important; }
.btn:hover { background: var(--chene) !important; color: var(--ecume) !important; }
.link { font-size: 10.5px !important; letter-spacing: .24em !important; font-weight: 400 !important; }
.values > div { border-top-width: 1px !important; border-top-color: #CFC6BB !important; }
.hero-full-txt h1 { font-size: clamp(32px, 4vw, 58px) !important; max-width: 16ch; }
.hero-full-txt .eyebrow { color: rgba(255,255,255,.85) !important; }
.nav { font-size: 10.5px !important; letter-spacing: .24em !important; font-weight: 400 !important; }
.meta-line, .small { letter-spacing: .06em; }
figcaption { font-size: 11px !important; letter-spacing: .04em; }
@media (max-width: 860px) { .section { padding-top: 96px !important; padding-bottom: 96px !important; } body { font-size: 14.5px; } }


/* ===== Variante J : mélange — titres EB Garamond, reste sobre ===== */
:root { --serif: 'EB Garamond', Garamond, 'Times New Roman', serif; }
h1, h2, .lead, .quote, .hero-full-txt h1 { font-family: var(--serif) !important; font-weight: 400 !important; font-style: normal !important; letter-spacing: -.005em !important; }
h1 { font-size: clamp(36px, 4.2vw, 58px) !important; line-height: 1.1 !important; }
.hero-full-txt h1 { font-size: clamp(40px, 4.8vw, 66px) !important; }
h2 { font-size: clamp(27px, 2.7vw, 38px) !important; line-height: 1.2 !important; }
.lead { font-size: clamp(21px, 2vw, 27px) !important; line-height: 1.5 !important; }
.quote { font-size: clamp(24px, 2.4vw, 32px) !important; }
.card .name { margin-top: 16px; }

/* Mélange : texte courant plus grand et plus aéré sur ordinateur */
body { font-size: 16.5px; line-height: 1.95; letter-spacing: .012em; }
main p { max-width: 600px; }
.values p, .card .small { font-size: 14.5px; }
.eyebrow { font-size: 11.5px !important; letter-spacing: .28em !important; }
h3, .card .name { font-size: 12.5px !important; letter-spacing: .22em !important; }
.nav, .link, .btn { font-size: 11.5px !important; letter-spacing: .26em !important; }
@media (max-width: 860px) { body { font-size: 15.5px; line-height: 1.85; } }

/* ===== Variante N : inspiration Vander Velpen x Obumex ===== */
html{scroll-behavior:smooth}
.mx-index{max-width:860px;margin:0 auto;padding:120px 0 40px;display:flex;flex-direction:column;align-items:center;gap:28px;text-align:center}
.mx-index .lead{text-wrap:balance}
.mx-index p{text-wrap:pretty}
.mx-links{display:flex;flex-wrap:wrap;justify-content:center;gap:14px 56px;margin-top:18px}
.mx-links a,.link-u{font-family:var(--serif,'EB Garamond',Georgia,serif);font-size:20px;color:inherit;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:3px;letter-spacing:0;text-transform:none}
.mx-links a span{font-family:inherit;color:var(--argile);margin-right:8px;font-size:15px}
.mx-links a:hover,.link-u:hover{color:var(--argile)}
.mx-ring{width:44px;height:44px;border:2px solid var(--argile);border-radius:50%;margin:90px auto 0}
.mx-sec{display:grid;grid-template-columns:48px minmax(0,5fr) minmax(0,6fr);gap:0 48px;padding-block:110px 60px;scroll-margin-top:30px;align-items:start}
.mx-lab{display:flex;flex-direction:column;align-items:center;gap:14px;padding-top:10px}
.mx-lab i{width:14px;height:14px;border:1.5px solid currentColor;border-radius:50%}
.mx-lab b{writing-mode:vertical-rl;transform:rotate(180deg);font:500 11px/1 var(--sans,'Manrope',sans-serif);letter-spacing:.2em;text-transform:uppercase;color:var(--argile)}
.mx-sec h2{margin:0;text-wrap:balance}
.mx-sec .mx-txt{display:flex;flex-direction:column;gap:18px}
.mx-sec .mx-txt .link-u{align-self:flex-start;margin-top:14px}
.mx-pair{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;margin-left:calc(48px + 48px + 18%);margin-right:calc(-1 * max(24px,(100vw - 1240px)/2));padding-bottom:40px}
.mx-pair img{width:100%;aspect-ratio:3/4;object-fit:cover;display:block}
.mx-dark{background:#2B231E;color:#F4F2EE}
.mx-dark h2,.mx-dark p{color:#F4F2EE}
.mx-dark .link-u{color:#F4F2EE}
.mx-cta{padding:130px 0;display:flex;flex-direction:column;align-items:center;gap:34px;text-align:center}
.mx-cta h2{text-transform:uppercase;letter-spacing:.04em;max-width:900px;text-wrap:balance}
.mx-cta .mx-links a{color:#F4F2EE}
.trio .card,.grid-projects .card{text-align:center}
.trio .card .name,.grid-projects .card .name{font-family:var(--serif,'EB Garamond',Georgia,serif);font-size:24px}
.trio .card .small,.grid-projects .card .small{letter-spacing:.2em;text-transform:uppercase;font-size:11px}
.btn{background:transparent!important;color:inherit!important;border:0!important;border-bottom:1px solid currentColor!important;border-radius:0!important;padding:0 0 3px!important;font-family:var(--serif,'EB Garamond',Georgia,serif)!important;font-size:20px!important;letter-spacing:0!important;text-transform:none!important}
.mx-rdv{position:fixed;right:0;bottom:calc(90px + env(safe-area-inset-bottom,0px));z-index:50;background:#2B231E;color:#F4F2EE;padding:16px 26px;font:500 11px/1 var(--sans,'Manrope',sans-serif);letter-spacing:.2em;text-transform:uppercase;text-decoration:none}
.mx-rdv:hover{background:#8F7E6B}
@media (max-width:860px){
 .mx-sec{grid-template-columns:28px minmax(0,1fr);gap:22px 20px;padding-block:80px 40px}
 .mx-sec .mx-txt{grid-column:2}
 .mx-pair{margin-left:0;margin-right:0;grid-template-columns:1fr 1fr;gap:8px}
 .mx-index{padding:80px 0 20px}
 .mx-links{gap:12px 28px}.mx-links a{font-size:18px}
 .mx-rdv{display:none}
}

@media (max-width:860px){.mx-sec{grid-template-columns:minmax(0,1fr);gap:16px}.mx-sec .mx-txt{grid-column:1}.mx-lab{flex-direction:row;padding-top:0;gap:12px;align-items:center}.mx-lab b{writing-mode:horizontal-tb;transform:none}}
.mx-lab .mx-w{color:var(--argile)}
.mx-logo{height:38px;width:auto;margin:90px auto 0;opacity:.85}
.mx-links a .mx-w{vertical-align:middle;margin-right:10px;color:var(--argile)}
.mx-pair figure{margin:0;display:flex;flex-direction:column;gap:8px}
.mx-pair figcaption{font-size:12px;color:var(--muted)}
.mx-pair .mx-obj{background:#E8DFD3;object-fit:contain;padding:8%}
.mx-vals{display:flex;flex-direction:column;gap:26px}
.mx-vals h3{margin:0 0 6px}
.mx-home3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px}
.mx-home3>div{display:flex;flex-direction:column;gap:14px;border-top:1px solid var(--line,#D6C8B6);padding-top:26px}
.mx-home3 .mx-w{color:var(--argile)}
.mx-home3 .link-u{align-self:flex-start;font-size:17px;margin-top:6px}
@media (max-width:860px){.mx-home3{grid-template-columns:1fr;gap:32px}}
@media (max-width:860px){.mx-pair{padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}}

.mx-line{display:block;width:1px;height:38px;background:var(--argile)}
.mx-vline{display:block;width:1px;height:70px;background:var(--argile);margin:80px auto 0;opacity:.7}
.mx-links a span{font-family:inherit;color:var(--argile);margin-right:8px;font-size:15px}
.mx-one{margin-left:calc(48px + 48px + 18%);margin-right:calc(-1 * max(24px,(100vw - 1240px)/2));padding-bottom:40px}
.mx-one img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block}
.mx-one.v{margin-right:0}.mx-one.v img{width:min(460px,100%);aspect-ratio:3/4}
.mx-one figure{margin:0;display:flex;flex-direction:column;gap:8px}.mx-one figcaption{font-size:12px;color:var(--muted)}
.mx-sec.mx-nolab{grid-template-columns:minmax(0,5fr) minmax(0,6fr)}
@media (max-width:860px){.mx-one{margin:0;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}.mx-sec.mx-nolab{grid-template-columns:1fr}.mx-lab{flex-direction:row}.mx-line{width:28px;height:1px}}
.mx-lab i.mx-line{border:0;border-radius:0;width:1px;height:38px;background:var(--argile)}
@media (max-width:860px){.mx-lab i.mx-line{width:28px;height:1px}}

.trio .card,.grid-projects .card{text-align:left}
.trio+.link,.trio~.link{align-self:flex-start!important}

.mx-when{font:500 11px/1.4 var(--sans,'Manrope',sans-serif);letter-spacing:.18em;text-transform:uppercase;color:var(--argile);margin:0}
.mx-home3 h3{margin:0}
.mx-cta-light{padding:130px 0;display:flex;flex-direction:column;align-items:center;gap:34px;text-align:center}
.mx-cta-light h2{max-width:900px;text-wrap:balance;margin:0}
.fv-t .fv-note{font-size:.85em;opacity:.75}
.mx-home3 h3{font-family:var(--serif,'EB Garamond',Georgia,serif);font-size:26px;font-weight:400;letter-spacing:0;text-transform:none;line-height:1.15}

@media (min-width:760px){
 .site-footer.footer-v > .wrap.fv-grid{grid-template-columns:1fr auto 1fr}
 .footer-v .c1{grid-column:1;justify-self:start} .footer-v .c2{grid-column:2} .footer-v .c3{grid-column:3;justify-self:end}
 .footer-v .fv-icon{grid-column:2}
 .footer-v .fv-t.c2{text-align:center;align-items:center}
 .footer-v .fv-b.c3{justify-self:end}
}
.fv-t .fv-note{font-size:1em;opacity:.75}
.footer-v .fv-t a.fv-insta-in{display:inline-flex;align-items:center;height:1.9em;color:inherit;text-decoration:none;align-self:flex-start}
.mx-home3>div .link-u{margin-top:auto}
.mx-home3>div p:not(.mx-when){margin-bottom:10px}
.mx-alt{color:#2F6FB3;font-size:.88em;margin-top:6px}
.mx-home3>div h3{font-family:var(--serif,'EB Garamond',Georgia,serif)!important;font-size:26px!important;font-weight:400!important;letter-spacing:0!important;text-transform:none!important;line-height:1.15}

@media (min-width:760px){.footer-v .fv-t.c3{text-align:right;align-items:flex-end}.footer-v a.fv-insta{grid-column:2;justify-self:center}}
.mx-home3+.methode-line{text-align:center;margin:24px auto 0;max-width:820px;text-wrap:balance}
/* Galerie projet : grille alignée (plus de décalage en bas des colonnes) */
.gallery{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;columns:auto!important}
.gallery figure{margin:0!important;display:flex;flex-direction:column;gap:6px}
.gallery img{width:100%;aspect-ratio:4/5!important;height:auto!important;object-fit:cover;display:block}
.gallery .full{grid-column:1/-1}
.gallery .full img{aspect-ratio:16/9!important}
@media (max-width:700px){.gallery{grid-template-columns:1fr;gap:16px}}

/* Accueil : deux projets en haut, un en large dessous */
.home-mix{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px}
.home-mix .card.wide{grid-column:1/-1}
.home-mix .h-mid{height:520px}
.home-mix .h-wide-home{width:100%;aspect-ratio:16/9;height:auto}
@media (max-width:700px){.home-mix{grid-template-columns:1fr;gap:32px}.home-mix .h-mid{height:420px}}

/* Protection légère des photos (clic droit, glisser, appui long sur téléphone) */
img{-webkit-user-drag:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}

/* Écran d'introduction : les dunes du logo se dessinent puis le voile s'efface */
.intro{position:fixed;inset:0;z-index:9999;background:var(--ecume);display:flex;align-items:center;justify-content:center;pointer-events:none;animation:introOut .7s ease 1.5s forwards}
.intro img{width:92px;height:auto;opacity:0;clip-path:inset(0 100% 0 0);animation:introDune 1.1s cubic-bezier(.4,0,.2,1) .15s forwards}
@keyframes introDune{0%{opacity:0;clip-path:inset(0 100% 0 0);transform:translateY(6px)}40%{opacity:1}100%{opacity:1;clip-path:inset(0 0 0 0);transform:none}}
@keyframes introOut{to{opacity:0;visibility:hidden}}
@media (prefers-reduced-motion:reduce){.intro{animation-duration:.01s;animation-delay:.3s}.intro img{animation:none;opacity:1;clip-path:none}}





/* Galeries : même espace partout (sous la photo de garde, entre les lignes, autour des grandes photos) */
.gallery{margin-top:32px}
.gallery .full{margin:0!important}
@media (max-width:700px){.gallery{margin-top:16px}}

/* Ne jamais afficher la description d'une photo si elle ne se charge pas */
img{color:transparent}