/* Agence de la Juline — identité d'origine revisitée : fond anthracite, bleu ardoise, logo manuscrit. Thème unique (sombre, comme l'original). */

:root {
  --noir: #1e1e1e;          /* bandeau, pied de page */
  --fond: #363636;          /* fond général du site d'origine */
  --fond-2: #2e2e2e;        /* bandes alternées */
  --surface: #2b2b2b;       /* cartes, encarts */
  --surface-2: #404040;     /* survols, champs actifs */
  --champ: #262626;

  --ardoise: #486e81;       /* couleur de marque */
  --ardoise-fonce: #3a5a6b;
  --ardoise-clair: #a9c6d4; /* texte d'accent sur fond sombre */

  --texte: #f1f1f1;
  --texte-2: #c9ced4;
  --texte-3: #a3a9b0;
  --bordure: rgba(255, 255, 255, .08);
  --bordure-champ: #94a3b8;

  --offre: #a85a00;
  --compromis: #3a5a6b;
  --vendu: #a3192b;
  --erreur: #f28b82;
  --ok: #7fd1a0;

  --rayon: 6px;
  --rayon-s: 4px;
  --rayon-l: 8px;
  --ombre: 0 1px 2px rgba(0, 0, 0, .25);
  --ombre-survol: 0 10px 28px rgba(0, 0, 0, .45);

  --police: "Avenir Next", Avenir, "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;

  color-scheme: dark;
}

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

html { -webkit-text-size-adjust: 100%; scroll-padding-top: 1rem; }

body {
  margin: 0;
  font-family: var(--police);
  font-size: 1rem;
  line-height: 1.6;
  color: var(--texte);
  background: var(--fond);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

img { max-width: 100%; height: auto; display: block; }
h1, h2, h3 { line-height: 1.2; margin: 0 0 .5em; font-weight: 600; }
p { margin: 0 0 1em; }
a { color: var(--ardoise-clair); text-underline-offset: .18em; }
a:hover { color: var(--texte); }
address { font-style: normal; }
abbr[title] { text-decoration: none; }
button, input, select, textarea { font: inherit; color: inherit; }
button, select, [type="checkbox"], summary { cursor: pointer; }

:focus-visible { outline: 3px solid var(--ardoise-clair); outline-offset: 2px; border-radius: 2px; }

.sr {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

.evitement {
  position: absolute; left: 1rem; top: -4rem; z-index: 100;
  background: var(--texte); color: var(--noir); padding: .75rem 1rem; border-radius: var(--rayon);
}
.evitement:focus { top: 1rem; }

.conteneur { width: 100%; max-width: 1200px; margin-inline: auto; padding-inline: 16px; }
@media (min-width: 768px) { .conteneur { padding-inline: 24px; } }

.ico { flex-shrink: 0; }

/* ---------- En-tête : logo à gauche, téléphone, drapeaux et panier à droite ---------- */

.entete { background: var(--noir); color: var(--texte); border-bottom: 3px solid var(--ardoise); }
.entete__haut {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem .75rem;
  min-height: 84px; padding-block: .75rem;
}
.logo { display: block; flex-shrink: 0; }
.logo img { width: clamp(250px, 50vw, 440px); height: auto; }

.outils { display: flex; align-items: center; gap: .25rem; flex-shrink: 0; margin-left: auto; }

.entete__tel {
  display: grid; place-items: center; min-width: 44px; min-height: 44px;
  color: var(--texte); text-decoration: none; font-weight: 600; letter-spacing: .03em;
  border-radius: var(--rayon);
}
.entete__tel span { display: none; }
.entete__tel .ico { color: var(--ardoise-clair); }
.entete__tel:hover { color: var(--ardoise-clair); }

.langues { display: flex; gap: .125rem; }
.langues a {
  display: grid; place-items: center; min-width: 44px; min-height: 44px; border-radius: var(--rayon);
  opacity: .55; transition: opacity 150ms ease-out, background-color 150ms ease-out;
}
.langues a:hover { opacity: 1; background: var(--surface-2); }
.langues a[aria-current] { opacity: 1; }
.drapeau { display: block; border-radius: 3px; box-shadow: 0 0 0 1px rgba(255, 255, 255, .25); }
.langues a[aria-current] .drapeau { box-shadow: 0 0 0 2px var(--ardoise-clair); }

.panier-entete {
  position: relative; display: grid; place-items: center;
  min-width: 44px; min-height: 44px; color: var(--texte); border-radius: var(--rayon);
  transition: background-color 150ms ease-out;
}
.panier-entete:hover { background: var(--surface-2); color: var(--texte); }
.panier-entete__nb {
  position: absolute; top: 3px; right: 1px;
  min-width: 20px; height: 20px; padding: 0 5px; display: grid; place-items: center;
  background: var(--ardoise); color: #f8fafc; font-size: .6875rem; font-weight: 700; line-height: 1;
  border-radius: 999px; border: 2px solid var(--noir);
}
.panier-entete__nb[data-vide] { background: #5b5b5b; }

.burger {
  display: grid; place-items: center; min-height: 44px; min-width: 44px; margin-left: .25rem;
  background: transparent; color: var(--texte); border: 1px solid #6b7280; border-radius: var(--rayon);
}

@media (min-width: 640px) {
  .entete__tel { display: inline-flex; gap: .5rem; padding-inline: .5rem; margin-right: .5rem; }
  .entete__tel span { display: inline; }
}
@media (min-width: 1024px) {
  .entete__haut { display: grid; grid-template-columns: 1fr auto 1fr; min-height: 120px; }
  .logo { grid-column: 2; }
  .outils { grid-column: 3; justify-self: end; }
  .burger { display: none; }
}

/* Menu : même fond que le bandeau, soulignement ardoise sur la page active */
.nav { border-top: 1px solid var(--bordure); }
.nav__liste { list-style: none; margin-block: 0; margin-inline: auto; display: flex; flex-direction: column; padding-block: .5rem; }
.nav__lien {
  position: relative; display: flex; align-items: center;
  min-height: 44px; padding: .5rem .25rem;
  color: var(--texte-2); text-decoration: none;
  font-size: .9375rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase;
  transition: color 180ms ease-out;
}
.nav__lien::after {
  content: ""; position: absolute; left: .25rem; right: .25rem; bottom: 6px; height: 2px;
  background: var(--ardoise-clair); transform: scaleX(0); transform-origin: left;
  transition: transform 200ms ease-out;
}
.nav__lien:hover { color: var(--texte); }
.nav__lien:hover::after { transform: scaleX(1); }
.nav__lien[aria-current="page"] { color: var(--texte); }
.nav__lien[aria-current="page"]::after { transform: scaleX(1); background: var(--ardoise); height: 3px; }

.js .nav { display: none; }
.js .nav.est-ouvert { display: block; }
@media (min-width: 1024px) {
  .js .nav, .nav { display: block; }
  .nav__liste { flex-direction: row; flex-wrap: wrap; justify-content: center; column-gap: clamp(.5rem, 1.6vw, 1.75rem); padding-block: 0; }
  .nav__lien { min-height: 60px; font-size: .9375rem; padding-inline: .5rem; }
  .nav__lien::after { bottom: 0; }
}

/* ---------- Boutons, liens ---------- */

.bouton {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  min-height: 48px; padding: .75rem 1.5rem;
  background: var(--ardoise); color: #f8fafc;
  border: 2px solid var(--ardoise); border-radius: var(--rayon);
  font-weight: 600; letter-spacing: .02em; text-decoration: none; cursor: pointer;
  transition: background-color 180ms ease-out, border-color 180ms ease-out, color 180ms ease-out;
}
.bouton:hover { background: var(--ardoise-fonce); border-color: var(--ardoise-clair); color: #f8fafc; }
.bouton:active { transform: translateY(1px); }
.bouton--contour { background: transparent; color: var(--texte); border-color: var(--ardoise-clair); }
.bouton--contour:hover { background: var(--surface-2); color: var(--texte); }

.lien-fleche { display: inline-flex; align-items: center; gap: .4rem; min-height: 44px; font-weight: 600; text-decoration: none; }
.lien-fleche .ico { transition: transform 180ms ease-out; }
.lien-fleche:hover .ico { transform: translateX(3px); }
.lien-fleche--retour:hover .ico { transform: translateX(-3px); }

/* ---------- Accueil : bandeau ---------- */

.hero {
  position: relative; isolation: isolate;
  min-height: clamp(460px, 72vh, 640px);
  display: flex; align-items: flex-end;
  background: var(--noir); color: var(--texte);
}
.hero__img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: center 40%; }
.hero::after {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(180deg, rgba(30, 30, 30, .1) 0%, rgba(30, 30, 30, .35) 45%, rgba(30, 30, 30, .9) 100%);
}
.hero__contenu { padding-block: 3rem 2rem; }
.hero__titre { font-size: clamp(2rem, 5vw, 3.25rem); letter-spacing: -.01em; margin-bottom: .25em; text-shadow: 0 1px 12px rgba(0, 0, 0, .4); }
.hero__accroche { font-size: clamp(1rem, 2vw, 1.2rem); max-width: 55ch; color: #e5e7eb; margin-bottom: 1.5rem; }

/* ---------- Recherche ---------- */

.recherche {
  display: grid; gap: .75rem; padding: 1rem;
  background: var(--surface); border: 1px solid var(--bordure); border-radius: var(--rayon-l);
  box-shadow: var(--ombre); margin-bottom: 1.5rem;
}
.hero .recherche { background: rgba(43, 43, 43, .94); box-shadow: 0 10px 30px rgba(0, 0, 0, .4); margin-bottom: 0; }
@media (min-width: 700px) { .recherche { grid-template-columns: repeat(3, 1fr); align-items: end; } .recherche .bouton { grid-column: 1 / -1; } }
@media (min-width: 1000px) { .recherche { grid-template-columns: repeat(3, 1fr) auto; } .recherche .bouton { grid-column: auto; } }

/* ---------- Champs ---------- */

.champ { display: flex; flex-direction: column; gap: .35rem; margin-bottom: 1rem; min-width: 0; }
.recherche .champ { margin-bottom: 0; }
.champ label { font-size: .875rem; font-weight: 600; color: var(--texte); }
.requis { font-weight: 400; color: var(--texte-2); }
.champ input, .champ select, .champ textarea {
  width: 100%; min-height: 48px; padding: .625rem .75rem;
  background: var(--champ); color: var(--texte);
  border: 1px solid var(--bordure-champ); border-radius: var(--rayon);
  transition: border-color 150ms ease-out, box-shadow 150ms ease-out;
}
.champ textarea { resize: vertical; min-height: 120px; }
.champ input:hover, .champ select:hover, .champ textarea:hover { border-color: var(--texte-2); }
.champ input:focus-visible, .champ select:focus-visible, .champ textarea:focus-visible {
  outline: none; border-color: var(--ardoise-clair); box-shadow: 0 0 0 3px rgba(169, 198, 212, .45);
}
.champ--erreur input, .champ--erreur select, .champ--erreur textarea { border-color: var(--erreur); }
.champ__erreur { color: var(--erreur); font-size: .875rem; margin: 0; }

.case { display: grid; grid-template-columns: auto 1fr; gap: .25rem .75rem; align-items: start; margin-bottom: 1.25rem; font-size: .875rem; color: var(--texte-2); }
.case input { width: 22px; height: 22px; margin: .1rem 0 0; accent-color: var(--ardoise); }
.case .champ__erreur { grid-column: 2; }
.piege { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.ligne-2 { display: grid; gap: 0 1rem; }
@media (min-width: 640px) { .ligne-2 { grid-template-columns: 1fr 1fr; } }

.alerte { padding: 1rem 1.25rem; border-radius: var(--rayon); border-left: 4px solid; margin-bottom: 1rem; }
.alerte--ok { background: rgba(127, 209, 160, .12); border-color: var(--ok); color: #c8f0d6; }
.alerte--erreur { background: rgba(242, 139, 130, .12); border-color: var(--erreur); color: #fbd3cf; }

/* ---------- Sections ---------- */

.bloc { padding-block: 2.5rem; }
@media (min-width: 768px) { .bloc { padding-block: 3.5rem; } }
.bloc__entete { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem 1.5rem; margin-bottom: 1.5rem; }
.bloc__entete .titre-section, .bloc__entete .compteur { margin: 0; }

.titre-section { font-size: clamp(1.375rem, 2.6vw, 1.75rem); position: relative; padding-bottom: .5rem; margin: 2rem 0 1rem; }
.titre-section::after { content: ""; position: absolute; left: 0; bottom: 0; width: 48px; height: 3px; background: var(--ardoise); border-radius: 2px; }
.texte > .titre-section:first-child, section > .titre-section:first-child { margin-top: 0; }

.entete-page { background: var(--fond-2); border-bottom: 1px solid var(--bordure); padding-block: 2.25rem; }
.entete-page h1 { font-size: clamp(1.75rem, 4vw, 2.5rem); margin-bottom: .25em; }
.entete-page p { color: var(--texte-2); max-width: 70ch; margin: 0; }

.texte { max-width: 75ch; }
.puces { padding-left: 1.25rem; margin: 0 0 1rem; }
.puces li { margin-bottom: .4rem; }
.puces li::marker { color: var(--ardoise-clair); }
.note { font-size: .875rem; color: var(--texte-2); }
.actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.5rem; }

.deux-colonnes { display: grid; gap: 2rem; }
@media (min-width: 900px) {
  .deux-colonnes { grid-template-columns: 1.4fr 1fr; align-items: start; }
  .deux-colonnes--texte { grid-template-columns: 1.2fr 1fr; }
}

.encart { background: var(--surface); border: 1px solid var(--bordure); border-radius: var(--rayon-l); box-shadow: var(--ombre); padding: 1.5rem; }
@media (min-width: 768px) { .encart { padding: 2rem; } }
.encart h2 { font-size: 1.375rem; }

.coordonnees address p, .pied__adresse p { display: flex; gap: .75rem; align-items: flex-start; }
.coordonnees .ico { color: var(--ardoise-clair); margin-top: .2rem; }
.coordonnees a { font-weight: 600; }

.photo-agence { margin: 0; }
.photo-agence img { border-radius: var(--rayon-l); aspect-ratio: 4 / 3; object-fit: cover; width: 100%; }

.bande { background: var(--fond-2); border-block: 1px solid var(--bordure); padding-block: 3rem; }
.bande__grille { display: grid; gap: 2rem; }
@media (min-width: 900px) { .bande__grille { grid-template-columns: 1.2fr 1fr; align-items: center; gap: 4rem; } }
.atouts { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; }
.atouts li { display: flex; gap: 1rem; align-items: flex-start; padding: 1rem 1.25rem; background: var(--surface); border-radius: var(--rayon); border-left: 3px solid var(--ardoise); }
.atouts .ico { color: var(--ardoise-clair); }
.atouts strong { display: block; }
.atouts span { color: var(--texte-2); font-size: .9375rem; }

.appel-zone { padding-bottom: 3.5rem; }
.appel {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.25rem;
  padding: 2rem; background: var(--noir); border: 1px solid var(--bordure); border-left: 4px solid var(--ardoise); border-radius: var(--rayon-l);
}
.appel h2 { font-size: 1.5rem; margin-bottom: .25rem; }
.appel p { margin: 0; color: var(--texte-2); }

/* ---------- Cartes de biens ---------- */

.grille { display: grid; gap: 1.5rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }

.carte {
  position: relative;
  background: var(--surface); border: 1px solid var(--bordure); border-radius: var(--rayon-l);
  box-shadow: var(--ombre); overflow: hidden;
  transition: box-shadow 200ms ease-out, transform 200ms ease-out, border-color 200ms ease-out;
}
.carte:hover { box-shadow: var(--ombre-survol); transform: translateY(-2px); border-color: rgba(169, 198, 212, .35); }
.carte__lien { display: flex; flex-direction: column; height: 100%; color: inherit; text-decoration: none; }
.carte__lien:hover { color: inherit; }
.carte__lien:focus-visible { outline-offset: -3px; }
.carte__media { position: relative; aspect-ratio: 4 / 3; background: var(--fond-2); overflow: hidden; }
.carte__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 400ms ease-out; }
.carte:hover .carte__media img { transform: scale(1.03); }
.carte__corps { display: flex; flex-direction: column; gap: .25rem; padding: 1rem 1.25rem 1.25rem; flex: 1; border-top: 3px solid var(--ardoise); }
.carte__lieu { margin: 0; font-size: .8125rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--ardoise-clair); }
.carte__titre { font-size: 1.0625rem; margin: 0; line-height: 1.35; }
.carte__infos { margin: 0; font-size: .9375rem; color: var(--texte-2); }
.carte__prix { margin: auto 0 0; padding-top: .75rem; font-size: 1.25rem; font-weight: 700; }
.carte__prix--vendu { font-size: .9375rem; color: #f3a3ad; letter-spacing: .02em; }

/* Sticker de statut : étiquette collée en biais sur la photo */
.sticker {
  position: absolute; top: 14px; left: 12px; z-index: 2;
  display: inline-block; max-width: calc(100% - 24px);
  padding: .4rem .85rem;
  color: #f8fafc; font-size: .8125rem; font-weight: 800; letter-spacing: .1em; line-height: 1.2; text-transform: uppercase;
  border: 2px solid #f1f1f1; border-radius: var(--rayon-s);
  box-shadow: 0 3px 10px rgba(0, 0, 0, .4);
  transform: rotate(-5deg); transform-origin: left top;
}
.sticker--offre { background: var(--offre); }
.sticker--compromis { background: var(--compromis); }
.sticker--vendu { background: var(--vendu); font-size: 1rem; padding: .45rem 1.1rem; }
.sticker--plat { position: static; transform: none; box-shadow: none; border-color: transparent; margin-bottom: .5rem; }

.pastille {
  position: absolute; left: 10px; bottom: 10px; z-index: 2;
  display: inline-flex; align-items: center; gap: .35rem;
  padding: .3rem .6rem; background: rgba(30, 30, 30, .88); color: #f3a3ad;
  font-size: .75rem; font-weight: 700; border-radius: 999px;
}

/* Bouton panier sur les cartes (en haut à droite de la photo) et sur la fiche */
.panier-btn {
  position: absolute; top: 10px; right: 10px; z-index: 3;
  display: grid; place-items: center;
  width: 44px; height: 44px; padding: 0;
  background: rgba(30, 30, 30, .82); color: var(--texte);
  border: 1px solid rgba(255, 255, 255, .25); border-radius: 999px;
  transition: background-color 150ms ease-out, transform 150ms ease-out;
}
.panier-btn:hover { background: var(--ardoise); }
.panier-btn:active { transform: scale(.94); }
.panier-btn__on { display: none; }
.panier-btn[aria-pressed="true"] { background: var(--ardoise); border-color: var(--ardoise-clair); }
.panier-btn[aria-pressed="true"] .panier-btn__on { display: block; }
.panier-btn[aria-pressed="true"] .panier-btn__off { display: none; }
.panier-btn--texte {
  position: static; width: auto; height: auto; min-height: 44px;
  display: inline-flex; gap: .5rem; padding: .5rem 1rem; margin-top: .75rem;
  border-radius: var(--rayon); font-weight: 600; font-size: .9375rem;
  background: transparent; border-color: var(--ardoise-clair);
}
.panier-btn--texte:hover { background: var(--surface-2); }
.panier-btn--texte[aria-pressed="true"] { background: var(--ardoise); }

.compteur { color: var(--texte-2); font-weight: 600; margin-bottom: 1rem; }
.vide { text-align: center; padding: 3rem 1rem; background: var(--surface); border: 1px dashed var(--bordure-champ); border-radius: var(--rayon-l); display: flex; flex-direction: column; align-items: center; gap: 1rem; }
.vide p { max-width: 55ch; margin: 0; }
.bloc.vide { flex-direction: row; flex-wrap: wrap; justify-content: center; border: 0; background: none; }

.pagination { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; margin-top: 2.5rem; }
.pagination a {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 44px; min-height: 44px; padding: 0 .75rem;
  background: var(--surface); border: 1px solid var(--bordure-champ); border-radius: var(--rayon);
  color: var(--texte); text-decoration: none; font-weight: 600;
  transition: background-color 150ms ease-out;
}
.pagination a:hover { background: var(--surface-2); color: var(--texte); }
.pagination a[aria-current="page"] { background: var(--ardoise); border-color: var(--ardoise); color: #f8fafc; }

/* ---------- Fiche d'un bien ---------- */

.fiche { padding-block: 1.5rem 3.5rem; }
.fil ol { list-style: none; margin: 0 0 1.25rem; padding: 0; display: flex; flex-wrap: wrap; gap: .25rem; font-size: .875rem; color: var(--texte-2); }
.fil li + li::before { content: "/"; margin-right: .35rem; color: var(--texte-3); }
.fil a { color: var(--texte-2); }
.fil [aria-current] { color: var(--texte); }

.fiche__haut { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 1rem 2rem; margin-bottom: 1.25rem; }
.fiche__lieu { margin: 0 0 .25rem; font-size: .875rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--ardoise-clair); }
.fiche__titre { font-size: clamp(1.5rem, 3.4vw, 2.25rem); margin-bottom: .35rem; max-width: 30ch; }
.fiche__resume { margin: 0; color: var(--texte-2); }
.fiche__prix { text-align: left; }
@media (min-width: 768px) { .fiche__prix { text-align: right; } }
.prix { font-size: clamp(1.625rem, 3vw, 2.125rem); font-weight: 700; margin: 0; line-height: 1.1; }
.prix__note { font-size: .8125rem; color: var(--texte-2); margin: .25rem 0 0; }

.galerie { display: grid; gap: .5rem; margin-bottom: 2.5rem; }
@media (min-width: 900px) { .galerie { grid-template-columns: 2fr 1fr; } }
.galerie__principale { position: relative; border-radius: var(--rayon-l); overflow: hidden; background: var(--fond-2); }
.galerie__principale .sticker { top: 18px; left: 16px; font-size: .9375rem; }
.galerie__principale .sticker--vendu { font-size: 1.25rem; }
.galerie__ouvrir { display: block; width: 100%; height: 100%; padding: 0; border: 0; background: none; position: relative; }
.galerie__ouvrir img { width: 100%; height: 100%; object-fit: cover; transition: opacity 200ms ease-out; }
.galerie__ouvrir:hover img { opacity: .88; }
.galerie__principale .galerie__ouvrir img { aspect-ratio: 4 / 3; }
.galerie__compte {
  position: absolute; right: 12px; bottom: 12px;
  display: inline-flex; align-items: center; gap: .4rem;
  padding: .35rem .7rem; background: rgba(30, 30, 30, .85); color: var(--texte);
  font-size: .8125rem; font-weight: 600; border-radius: 999px; pointer-events: none;
}
.galerie__vignettes { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: .5rem; }
@media (min-width: 900px) { .galerie__vignettes { grid-template-columns: 1fr 1fr; grid-auto-rows: 1fr; } }
.galerie__vignettes li { border-radius: var(--rayon); overflow: hidden; aspect-ratio: 4 / 3; background: var(--fond-2); }
@media (min-width: 900px) { .galerie__vignettes li { aspect-ratio: auto; } }
.galerie__plus { position: absolute; inset: 0; display: grid; place-items: center; background: rgba(30, 30, 30, .62); color: var(--texte); font-size: 1.375rem; font-weight: 700; }

.fiche__corps { display: grid; gap: 2.5rem; }
@media (min-width: 1000px) { .fiche__corps { grid-template-columns: minmax(0, 1fr) 380px; align-items: start; } }
.fiche__texte > section + section { margin-top: 2.5rem; }
.description { max-width: 72ch; color: #e5e7eb; }

.carac { display: grid; gap: 1.25rem; }
@media (min-width: 700px) { .carac { grid-template-columns: 1fr 1fr; } }
.carac__groupe { background: var(--surface); border: 1px solid var(--bordure); border-radius: var(--rayon-l); padding: 1rem 1.25rem; }
.carac__groupe h3 { font-size: .8125rem; letter-spacing: .08em; text-transform: uppercase; color: var(--ardoise-clair); margin-bottom: .5rem; }
.carac dl, .liste-def { margin: 0; }
.carac dl div, .liste-def div { display: flex; justify-content: space-between; gap: 1rem; padding: .5rem 0; border-bottom: 1px solid var(--bordure); }
.carac dl div:last-child { border-bottom: 0; }
.carac dt, .liste-def dt { color: var(--texte-2); }
.carac dd, .liste-def dd { margin: 0; font-weight: 600; text-align: right; }

.dpe { display: flex; flex-wrap: wrap; gap: 1.5rem; margin-bottom: 1rem; }
.dpe img { background: #f1f1f1; border-radius: var(--rayon); padding: .75rem; max-width: min(100%, 300px); }

.fiche__contact { display: flex; flex-direction: column; gap: 1rem; }
@media (min-width: 1000px) { .fiche__contact { position: sticky; top: 1rem; } }
.tel-gros { display: inline-flex; align-items: center; gap: .5rem; min-height: 44px; font-size: 1.25rem; font-weight: 700; text-decoration: none; }

.tableau { width: 100%; max-width: 560px; border-collapse: collapse; background: var(--surface); border-radius: var(--rayon-l); overflow: hidden; box-shadow: var(--ombre); margin-bottom: 1rem; }
.tableau th, .tableau td { padding: .875rem 1.25rem; text-align: left; border-bottom: 1px solid var(--bordure); }
.tableau th { background: var(--ardoise); color: #f8fafc; font-size: .875rem; letter-spacing: .04em; }
.tableau td:last-child { font-weight: 700; text-align: right; }
.tableau tr:last-child td { border-bottom: 0; }
.liste-def { max-width: 640px; }

/* ---------- Visionneuse ---------- */

.visionneuse { width: 100vw; height: 100vh; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: rgba(18, 18, 18, .97); color: var(--texte); }
.visionneuse[open] { display: grid; grid-template-columns: auto 1fr auto; align-items: center; }
.visionneuse::backdrop { background: rgba(18, 18, 18, .9); }
.visionneuse figure { margin: 0; grid-column: 2; display: flex; flex-direction: column; align-items: center; gap: .75rem; min-width: 0; }
.visionneuse img { max-height: calc(100vh - 7rem); width: auto; max-width: 100%; object-fit: contain; }
.visionneuse figcaption { font-size: .875rem; color: var(--texte-2); }
.visionneuse button { display: grid; place-items: center; min-width: 48px; min-height: 48px; background: rgba(255, 255, 255, .1); color: var(--texte); border: 0; border-radius: 999px; transition: background-color 150ms ease-out; }
.visionneuse button:hover { background: rgba(255, 255, 255, .22); }
.visionneuse__fermer { position: absolute; top: 12px; right: 12px; }
.visionneuse__nav { margin: 0 8px; }

/* ---------- Pied de page ---------- */

.pied { background: var(--noir); color: var(--texte-2); padding-top: 3rem; border-top: 3px solid var(--ardoise); }
.pied__grille { display: grid; gap: 2rem; padding-bottom: 2rem; }
@media (min-width: 768px) { .pied__grille { grid-template-columns: repeat(3, 1fr); } }
.pied__titre { color: var(--texte); font-size: 1rem; letter-spacing: .08em; text-transform: uppercase; }
.pied a { color: var(--texte); text-decoration: none; }
.pied a:hover { color: var(--ardoise-clair); text-decoration: underline; }
.pied__adresse .ico { color: var(--ardoise-clair); }
.pied__adresse p { margin-bottom: .5rem; align-items: center; }
.pied__adresse a, .pied__liens a { display: inline-flex; align-items: center; min-height: 44px; }
.pied__liens { list-style: none; margin: 0; padding: 0; }
.pied__bas { border-top: 1px solid var(--bordure); padding-block: 1.25rem; margin-block: 0; font-size: .8125rem; color: var(--texte-3); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: 1ms !important; animation-duration: 1ms !important; }
  .carte:hover, .carte:hover .carte__media img { transform: none; }
}

/* ---------- Téléphone : tout centré ---------- */
@media (max-width: 767px) {
  .entete__haut { flex-direction: column; justify-content: center; gap: .5rem; }
  .logo { margin-inline: auto; }
  .outils { margin-left: 0; justify-content: center; }
  .nav__liste { align-items: center; text-align: center; }
  .nav__lien { justify-content: center; }

  .hero__contenu, .entete-page, .bloc__entete, .bande__grille .texte, .appel, .fiche__haut, .fil ol,
  .carte__corps, .pied__grille, .pied__bas, .vide, .compteur, .coordonnees, .encart h2 { text-align: center; }
  .hero__accroche, .entete-page p { margin-inline: auto; }
  .bloc__entete, .appel, .fiche__haut, .fil ol, .actions { justify-content: center; }
  .bloc__entete, .fiche__haut { flex-direction: column; align-items: center; }
  .fiche__titre { margin-inline: auto; }
  .fiche__prix { text-align: center; }
  .titre-section::after { left: 50%; transform: translateX(-50%); }
  .texte, .description { margin-inline: auto; text-align: center; }
  .puces { list-style-position: inside; padding-left: 0; }
  .atouts li { flex-direction: column; align-items: center; text-align: center; border-left: 0; border-top: 3px solid var(--ardoise); }
  .coordonnees address p, .pied__adresse p { justify-content: center; }
  .pied__liens a { justify-content: center; }
  .tableau { margin-inline: auto; }
  .lien-fleche { justify-content: center; }
  .fiche__contact { align-items: center; }
  .fiche__contact .encart { width: 100%; }
  .recherche .champ label, .encart form label { text-align: left; }
}

/* ---------- Accueil : diaporama (fondu + léger zoom), comme le site d'origine ---------- */
.hero__diapos { position: absolute; inset: 0; z-index: -2; overflow: hidden; }
.hero__diapos .hero__img { z-index: auto; opacity: 0; transform: scale(1); transition: opacity 1200ms ease-in-out, transform 7000ms linear; }
.hero__diapos .hero__img.est-active { opacity: 1; transform: scale(1.07); }
.hero__pause {
  position: absolute; top: 16px; right: 16px; z-index: 2;
  display: grid; place-items: center; width: 44px; height: 44px;
  background: rgba(30, 30, 30, .7); color: var(--texte);
  border: 1px solid rgba(255, 255, 255, .3); border-radius: 999px;
  transition: background-color 150ms ease-out;
}
.hero__pause:hover { background: var(--ardoise); }
.hero__ico-lecture { display: none; }
.hero__pause[aria-pressed="true"] .hero__ico-pause { display: none; }
.hero__pause[aria-pressed="true"] .hero__ico-lecture { display: block; }
@media (prefers-reduced-motion: reduce) {
  .hero__diapos .hero__img { transition: opacity 1200ms ease-in-out !important; }
  .hero__diapos .hero__img.est-active { transform: none; }
}

/* ---------- Accueil : blocs « Notre sélection de biens » ---------- */
.titre-section--centre { text-align: center; margin-bottom: 2rem; }
.titre-section--centre::after { left: 50%; transform: translateX(-50%); }
.bloc--serre { padding-top: 0; }
.blocs-selection {
  list-style: none; margin: 0; padding: 0;
  display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr));
}
.bloc-selection {
  display: flex; flex-direction: column; align-items: center; gap: .35rem; height: 100%;
  padding: 1.5rem 1rem 1.25rem; text-align: center; text-decoration: none; color: var(--texte);
  background: var(--surface); border: 1px solid var(--bordure); border-bottom: 3px solid var(--ardoise);
  border-radius: var(--rayon-l); box-shadow: var(--ombre);
  transition: transform 200ms ease-out, box-shadow 200ms ease-out, border-color 200ms ease-out;
}
.bloc-selection:hover { color: var(--texte); transform: translateY(-3px); box-shadow: var(--ombre-survol); border-color: rgba(169, 198, 212, .35); border-bottom-color: var(--ardoise-clair); }
.bloc-selection img { width: 96px; height: 96px; border-radius: 50%; margin-bottom: .5rem; box-shadow: 0 0 0 3px var(--ardoise); transition: box-shadow 200ms ease-out; }
.bloc-selection:hover img { box-shadow: 0 0 0 3px var(--ardoise-clair); }
.bloc-selection__titre { font-weight: 700; line-height: 1.3; }
.bloc-selection__ville { font-size: .8125rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--ardoise-clair); }
.bloc-selection__nb { font-size: .875rem; color: var(--texte-2); margin-top: auto; padding-top: .25rem; }
@media (prefers-reduced-motion: reduce) { .bloc-selection:hover { transform: none; } }
@media (max-width: 479px) {
  .bloc-selection { padding: 1rem .5rem; }
  .bloc-selection img { width: 72px; height: 72px; }
  .bloc-selection__titre { font-size: .9375rem; }
}

/* ---------- Menu : carré plein sur l'onglet sélectionné, carré discret au survol ---------- */
.nav__lien { padding-inline: 1rem; transition: background-color 180ms ease-out, color 180ms ease-out; }
.nav__lien::after { display: none; }
.nav__lien:hover { background: var(--surface-2); color: var(--texte); }
.nav__lien[aria-current="page"] { background: var(--ardoise); color: #f8fafc; }
@media (min-width: 1024px) {
  .nav__liste { column-gap: 0; }
  .nav__lien { padding-inline: clamp(.75rem, 1.4vw, 1.25rem); }
}
@media (max-width: 1023px) {
  .nav__liste { gap: .25rem; }
  .nav__liste li { width: 100%; display: flex; justify-content: center; }
  .nav__lien { width: 100%; max-width: 360px; justify-content: center; border-radius: 2px; }
}

/* ---------- En-tête fixe : reste en haut, se resserre au défilement ---------- */
html { scroll-padding-top: calc(var(--entete-h, 180px) + 1rem); }
.entete { position: sticky; top: 0; z-index: 50; box-shadow: 0 2px 12px rgba(0, 0, 0, .35); }
.entete__haut, .logo img { transition: min-height 200ms ease-out, padding 200ms ease-out, width 200ms ease-out; }
.entete.est-compact .entete__haut { min-height: 64px; padding-block: .35rem; }
.entete.est-compact .logo img { width: clamp(170px, 30vw, 280px); }
.entete.est-compact .nav__lien { min-height: 48px; }
@media (max-width: 767px) {
  .entete.est-compact .entete__haut { flex-direction: row; justify-content: space-between; }
  .entete.est-compact .logo { margin-inline: 0; }
  .entete.est-compact .logo img { width: 150px; }
  .entete.est-compact .entete__tel { display: none; }
  /* Menu ouvert : défile dans l'en-tête s'il dépasse l'écran */
  .nav.est-ouvert { max-height: calc(100vh - var(--entete-haut-h, 140px)); overflow-y: auto; }
}
@media (min-width: 1000px) { .fiche__contact { top: calc(var(--entete-h, 180px) + 1rem); } }

/* ---------- Carte Google Maps (chargée au clic) ---------- */
.carte-gm { display: flex; flex-direction: column; gap: .75rem; margin-top: 1.5rem; }
.carte-gm__cadre {
  position: relative; aspect-ratio: 4 / 3; width: 100%;
  background: var(--surface); border: 1px solid var(--bordure); border-radius: var(--rayon-l); overflow: hidden;
}
.carte-gm__cadre iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.carte-gm__attente {
  position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: .5rem; padding: 1rem; text-align: center;
  background: radial-gradient(circle at 50% 40%, rgba(72, 110, 129, .25), transparent 65%), var(--surface);
}
.carte-gm__attente .ico { color: var(--ardoise-clair); }
.carte-gm__adresse { margin: 0 0 .5rem; color: var(--texte-2); }
.carte-gm__adresse strong { color: var(--texte); }
.carte-gm__note { margin: 0; font-size: .8125rem; color: var(--texte-3); max-width: 32ch; }
.carte-gm__itineraire { align-self: flex-start; }
@media (max-width: 767px) { .carte-gm__itineraire { align-self: center; } }
.photo-agence + .titre-section { margin-top: 2rem; }

/* ---------- Fiche : étiquette « Vendu par nos soins » centrée, cadre blanc, clignotante ---------- */
.fiche__prix .sticker--vendu.sticker--plat {
  display: block; width: max-content; max-width: 100%; margin-inline: auto;
  padding: .6rem 1.4rem; text-align: center; white-space: normal;
  border: 3px solid #f1f1f1; box-shadow: 0 0 0 0 rgba(241, 241, 241, .7);
  animation: vendu-clignote 1.4s ease-in-out 4;
}
@media (min-width: 768px) { .fiche__prix .sticker--vendu.sticker--plat { margin-right: 0; } }
@keyframes vendu-clignote {
  0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(241, 241, 241, .7); }
  50% { opacity: .55; box-shadow: 0 0 0 8px rgba(241, 241, 241, 0); }
}
@media (prefers-reduced-motion: reduce) {
  /* Simple variation d’opacité, sans mouvement : conservée, mais limitée à 4 clignotements */
  .fiche__prix .sticker--vendu.sticker--plat { animation-duration: 1.4s !important; animation-iteration-count: 4 !important; }
}

/* ---------- Téléphone : corrections de rendu ---------- */
@media (max-width: 767px) {
  /* Accueil : la photo reste visible, la recherche chevauche seulement le bas de la photo */
  .hero { display: block; min-height: 0; background: var(--fond); }
  .hero__diapos, .hero::after { bottom: auto; height: 420px; }
  .hero__contenu { padding-block: 170px 2rem; }
  .hero__titre { font-size: 2rem; }
  .hero__accroche { margin-bottom: 1.75rem; }
  .hero .recherche { background: var(--surface); }

  /* Titres de section centrés avec leur trait */
  .titre-section { text-align: center; }

  /* Fil d'Ariane inutile sur petit écran (le lien retour est en bas de fiche) */
  .fil { display: none; }
  .fiche { padding-top: 1.25rem; }

  /* Caractéristiques : le libellé passe à la ligne, jamais la valeur */
  .carac dl div, .liste-def div { align-items: baseline; }
  .carac dt, .liste-def dt { min-width: 0; text-align: left; }
  .carac dd, .liste-def dd { max-width: 60%; }
  .carac__groupe h3 { text-align: center; }

  /* Blocs de sélection : le dernier bloc seul prend toute la largeur */
  .blocs-selection { grid-template-columns: 1fr 1fr; }
  .blocs-selection li:last-child:nth-child(odd) { grid-column: 1 / -1; }

  /* En-tête : logo un peu plus grand */
  .logo img { width: min(290px, 78vw); }
}

/* ---------- Bandeau de titre des pages : même diaporama que l'accueil ---------- */
.entete-page {
  position: relative; isolation: isolate;
  display: flex; align-items: flex-end;
  min-height: clamp(260px, 38vh, 360px);
  padding-block: 4rem 2.25rem;
  background: var(--noir); border-bottom: 0;
}
.entete-page::after {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(180deg, rgba(30, 30, 30, .15) 0%, rgba(30, 30, 30, .45) 50%, rgba(30, 30, 30, .9) 100%);
}
.entete-page > .conteneur { width: 100%; }
.entete-page h1 { text-shadow: 0 1px 12px rgba(0, 0, 0, .5); }
.entete-page p { color: #e5e7eb; text-shadow: 0 1px 8px rgba(0, 0, 0, .6); }
@media (max-width: 767px) {
  .entete-page { min-height: 240px; padding-top: 4.5rem; }
  .entete-page .hero__diapos { bottom: 0; height: auto; }
}

/* =====================================================================
   Finitions modernes — même thème (anthracite + ardoise), plus de relief
   ===================================================================== */
:root {
  --ombre: 0 1px 2px rgba(0, 0, 0, .3), 0 4px 12px rgba(0, 0, 0, .18);
  --ombre-survol: 0 14px 34px rgba(0, 0, 0, .5), 0 0 0 1px rgba(169, 198, 212, .28);
  --liseré: inset 0 1px 0 rgba(255, 255, 255, .05);
  --sortie: cubic-bezier(.2, .7, .2, 1);
}
::selection { background: var(--ardoise); color: #f8fafc; }
html { scrollbar-color: #5b5b5b var(--noir); }
h1, h2 { letter-spacing: -.012em; }

/* En-tête : verre dépoli quand il se resserre au défilement */
.entete.est-compact { background: rgba(30, 30, 30, .86); }
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .entete.est-compact { -webkit-backdrop-filter: blur(14px) saturate(140%); backdrop-filter: blur(14px) saturate(140%); }
}
.nav__lien { border-radius: 4px; }

/* Bandeaux photo : trait ardoise au-dessus du titre, recherche en verre */
.hero__titre::before, .entete-page h1::before {
  content: ""; display: block; width: 56px; height: 3px; margin-bottom: 1rem;
  background: var(--ardoise-clair); border-radius: 2px;
}
.hero__titre { font-size: clamp(2.25rem, 5.4vw, 3.75rem); font-weight: 700; }
.hero__accroche { font-size: clamp(1.0625rem, 2vw, 1.3rem); }
.hero .recherche {
  background: rgba(38, 38, 38, .78); border-color: rgba(255, 255, 255, .12);
  box-shadow: 0 18px 40px rgba(0, 0, 0, .45), var(--liseré);
}
.hero__pause { background: rgba(30, 30, 30, .55); }
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .hero .recherche, .hero__pause { -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
}

/* Boutons : léger relief au survol */
.bouton { box-shadow: var(--liseré); transition: background-color 180ms ease-out, border-color 180ms ease-out, color 180ms ease-out, box-shadow 200ms ease-out, transform 200ms var(--sortie); }
.bouton:hover { transform: translateY(-1px); box-shadow: 0 8px 20px rgba(72, 110, 129, .35); }
.bouton--contour:hover { box-shadow: 0 8px 20px rgba(0, 0, 0, .3); }

/* Titres de section : trait plus long, terminé par un point clair */
.titre-section::after { width: 56px; background: linear-gradient(90deg, var(--ardoise) 0 82%, transparent 82% 88%, var(--ardoise-clair) 88%); }

/* Cartes de biens */
.carte { box-shadow: var(--ombre), var(--liseré); transition: box-shadow 250ms ease-out, transform 250ms var(--sortie), border-color 250ms ease-out; }
.carte:hover { transform: translateY(-4px); box-shadow: var(--ombre-survol); }
.carte__media::after {
  content: ""; position: absolute; inset: auto 0 0; height: 40%; pointer-events: none;
  background: linear-gradient(180deg, transparent, rgba(20, 20, 20, .45));
}
.carte__media img { transition: transform 600ms var(--sortie); }
.carte:hover .carte__media img { transform: scale(1.06); }
.carte__corps { position: relative; border-top: 0; padding-top: 1.125rem; }
.carte__corps::before {
  content: ""; position: absolute; left: 0; top: 0; height: 3px; width: 100%;
  background: var(--ardoise); transform-origin: left;
}
.carte__corps::after {
  content: ""; position: absolute; left: 0; top: 0; height: 3px; width: 100%;
  background: var(--ardoise-clair); transform: scaleX(0); transform-origin: left;
  transition: transform 350ms var(--sortie);
}
.carte:hover .carte__corps::after { transform: scaleX(1); }
.carte__prix { font-size: 1.375rem; letter-spacing: -.01em; }
.carte__prix--vendu { font-size: .9375rem; letter-spacing: .02em; }
.panier-btn { box-shadow: 0 2px 8px rgba(0, 0, 0, .35); }
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .panier-btn:not([aria-pressed="true"]), .pastille, .galerie__compte { -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
}

/* Blocs « Notre sélection » : anneau détaché autour de la photo */
.bloc-selection { box-shadow: var(--ombre), var(--liseré); }
.bloc-selection img { box-shadow: 0 0 0 3px var(--surface), 0 0 0 5px var(--ardoise); transition: box-shadow 200ms ease-out, transform 300ms var(--sortie); }
.bloc-selection:hover img { box-shadow: 0 0 0 3px var(--surface), 0 0 0 5px var(--ardoise-clair); transform: scale(1.04); }

/* Encarts, caractéristiques, atouts : même liseré lumineux */
.encart, .carac__groupe, .recherche, .tableau { box-shadow: var(--ombre), var(--liseré); }
.atouts li { box-shadow: var(--liseré); transition: transform 200ms var(--sortie), background-color 200ms ease-out; }
.atouts li:hover { transform: translateX(3px); background: #303030; }

/* Bandes : halo ardoise très discret pour donner de la profondeur */
.bande { background: radial-gradient(ellipse 60% 80% at 100% 0%, rgba(72, 110, 129, .16), transparent 70%), var(--fond-2); }
.appel {
  background: radial-gradient(ellipse 70% 120% at 0% 50%, rgba(72, 110, 129, .28), transparent 70%), var(--noir);
  box-shadow: var(--ombre), var(--liseré);
}
.pied { background: radial-gradient(ellipse 50% 60% at 50% 0%, rgba(72, 110, 129, .12), transparent 70%), var(--noir); }

/* Galerie de la fiche */
.galerie__principale, .galerie__vignettes li { box-shadow: var(--ombre); }
.galerie__ouvrir img { transition: opacity 200ms ease-out, transform 500ms var(--sortie); }
.galerie__ouvrir:hover img { opacity: 1; transform: scale(1.03); }
.galerie__ouvrir { overflow: hidden; }

/* Apparition douce des éléments au défilement (navigateurs récents, animations autorisées) */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .grille > *, .blocs-selection > li, .atouts > li, .carac__groupe, .encart, .appel {
      animation: apparaitre linear both;
      animation-timeline: view();
      animation-range: entry 0% entry 30%;
    }
  }
}
@keyframes apparaitre { from { opacity: 0; translate: 0 24px; } to { opacity: 1; translate: 0 0; } }

@media (prefers-reduced-motion: reduce) {
  .carte:hover, .bouton:hover, .atouts li:hover, .bloc-selection:hover img, .galerie__ouvrir:hover img { transform: none; }
}
@media (max-width: 767px) {
  .hero__titre::before, .entete-page h1::before { margin-inline: auto; }
  .hero__titre { font-size: 2.125rem; }
}

/* ---------- Annonces : cadre blanc pour qu'elles ressortent sur le fond anthracite ---------- */
.carte { border: 3px solid #f1f1f1; }
.carte:hover { border-color: #f1f1f1; box-shadow: 0 14px 34px rgba(0, 0, 0, .55), 0 0 0 3px var(--ardoise-clair); }

/* ---------- Bannière cookies ---------- */
.cookies {
  position: fixed; inset: auto 0 0; z-index: 60;
  padding: 0 16px 16px; pointer-events: none;
}
.cookies[hidden] { display: none; }
.cookies__boite {
  pointer-events: auto;
  max-width: 1000px; margin-inline: auto; padding: 1.25rem 1.5rem;
  display: grid; gap: .75rem 1.5rem; align-items: center;
  background: rgba(30, 30, 30, .96); color: var(--texte);
  border: 2px solid #f1f1f1; border-radius: var(--rayon-l);
  box-shadow: 0 18px 44px rgba(0, 0, 0, .6);
  animation: cookies-entree 250ms var(--sortie, ease-out) both;
}
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .cookies__boite { background: rgba(30, 30, 30, .88); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }
}
.cookies__titre { font-size: 1.0625rem; margin: 0; }
.cookies__texte { margin: 0; font-size: .9375rem; color: var(--texte-2); max-width: 75ch; }
.cookies__actions { display: flex; flex-wrap: wrap; gap: .75rem; }
.cookies__actions .bouton { flex: 1 1 140px; min-height: 44px; padding-block: .5rem; padding-inline: 1rem; white-space: nowrap; }
@media (min-width: 900px) {
  .cookies__boite { grid-template-columns: 1fr auto; }
  .cookies__titre, .cookies__texte { grid-column: 1; }
  .cookies__actions { grid-column: 2; grid-row: 1 / span 2; flex-wrap: nowrap; }
}
@media (max-width: 767px) { .cookies__boite { text-align: center; padding: 1rem; } }
@keyframes cookies-entree { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }

.pied__cookies {
  display: inline-flex; align-items: center; min-height: 44px; padding: 0;
  background: none; border: 0; color: var(--texte); text-align: inherit;
}
.pied__cookies:hover { color: var(--ardoise-clair); text-decoration: underline; }
@media (max-width: 767px) { .pied__liens li { display: flex; justify-content: center; } }

/* ---------- Fiche : étiquette de statut sur toutes les photos (vignettes et visionneuse) ---------- */
.galerie__vignettes .sticker--mini {
  top: 8px; left: 6px; padding: .2rem .5rem;
  font-size: .625rem; letter-spacing: .08em; border-width: 1.5px;
  pointer-events: none;
}
.galerie__vignettes .sticker--vendu.sticker--mini { font-size: .6875rem; padding: .25rem .55rem; }
.visionneuse__photo { position: relative; max-width: 100%; }
.visionneuse__photo .sticker { top: 18px; left: 16px; font-size: 1rem; }
.visionneuse__photo .sticker--vendu { font-size: 1.375rem; padding: .5rem 1.25rem; }
@media (max-width: 767px) { .visionneuse__photo .sticker--vendu { font-size: 1rem; } }