@charset "UTF-8";
/* ============================================================
   ODEVA IMMOBILIER — v2 · Charte de marque "Navy & Or"
   Couleurs agence : bleu marine + or champagne · Montserrat / Inter
   Patterns : affiche · diagonales · liste décalée · cartes incrustées
   ============================================================ */

/* ── Tokens ───────────────────────────────────────────────── */
:root{
  --navy:#0F1E38;          /* marine principal      */
  --navy-2:#17294A;        /* panneau               */
  --navy-deep:#0A1426;     /* plus profond          */
  --ink:#14213A;           /* texte sur clair       */
  --ink-2:#46506A;         /* texte secondaire      */
  --mute:#7E879A;          /* atténué               */
  --err:#B3261E;           /* champ en erreur       */

  --clay:#C7A24C;          /* OR (accent principal) */
  --clay-dk:#9C7A33;       /* or foncé              */
  --clay-soft:#E2C77E;     /* or clair              */
  --gold:#C7A24C;

  --paper:#FBF9F4;         /* fond clair            */
  --paper-2:#F1ECE0;       /* panneau clair         */
  --cream:#F7F3EA;         /* cartes claires        */
  --white:#FFFFFF;
  --line:#E7E0D0;          /* filets clairs         */
  --line-2:#D7CDB6;

  --serif:'Montserrat',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; /* display */
  --sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;       /* body    */
  --script:'Pinyon Script',cursive;                                           /* slogan  */
  --hand:'Pinyon Script',cursive;

  --r:4px; --r-md:12px; --r-lg:20px; --r-xl:32px;
  --shadow:0 30px 70px -34px rgba(15,30,56,.5);
  --shadow-sm:0 16px 36px -20px rgba(15,30,56,.4);
  --ease:cubic-bezier(.22,1,.36,1);
  --maxw:1300px; --maxw-wide:1500px;
}

/* ── Reset ────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:var(--sans);background:var(--paper);color:var(--ink);
  line-height:1.65;font-size:16px;overflow-x:hidden;font-weight:400;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
ul{list-style:none}
::selection{background:var(--clay);color:var(--navy)}

/* ── Layout helpers ───────────────────────────────────────── */
.container{max-width:var(--maxw);margin:0 auto;padding:0 32px;width:100%}
.container-wide{max-width:var(--maxw-wide);margin:0 auto;padding:0 32px;width:100%}
.center{text-align:center}
.eyebrow{
  font-family:var(--serif);font-size:.72rem;font-weight:600;letter-spacing:.26em;
  text-transform:uppercase;color:var(--clay-dk);display:inline-flex;align-items:center;gap:14px;
  margin-bottom:20px;
}
.eyebrow::before{content:"";width:32px;height:2px;background:var(--clay);display:inline-block}
.eyebrow.centered{justify-content:center}
.eyebrow.light{color:var(--clay-soft)}
.eyebrow.light::before{background:var(--clay)}

/* ── Typography ───────────────────────────────────────────── */
.section-title{
  font-family:var(--serif);font-weight:700;line-height:1.07;letter-spacing:-.01em;
  font-size:clamp(2rem,4.4vw,3.5rem);color:var(--ink);text-transform:uppercase;
}
.section-title em{font-style:normal;color:var(--clay-dk)}
.section-sub{font-size:1.04rem;color:var(--ink-2);max-width:56ch;line-height:1.75;margin-top:20px}

/* ── Buttons ──────────────────────────────────────────────── */
.btn{
  display:inline-flex;align-items:center;gap:11px;
  font-family:var(--serif);font-size:.76rem;font-weight:600;letter-spacing:.12em;
  padding:16px 30px;border-radius:2px;cursor:pointer;text-transform:uppercase;
  transition:transform .35s var(--ease),background .3s,color .3s,box-shadow .3s,border-color .3s;
  position:relative;
}
.btn svg{width:16px;height:16px}
.btn-clay{background:var(--clay);color:var(--navy)}
.btn-clay:hover{background:var(--clay-dk);color:#fff;transform:translateY(-3px);box-shadow:0 16px 32px -14px rgba(199,162,76,.7)}
.btn-ink{background:var(--navy);color:#fff}
.btn-ink:hover{background:var(--navy-deep);transform:translateY(-3px)}
.btn-outline{border:1.5px solid var(--navy);color:var(--navy)}
.btn-outline:hover{background:var(--navy);color:#fff;transform:translateY(-3px)}
.btn-outline-light{border:1.5px solid rgba(255,255,255,.5);color:#fff}
.btn-outline-light:hover{background:#fff;color:var(--navy);transform:translateY(-3px)}
.btn-dark{background:var(--navy);color:#fff;border-radius:2px;padding:15px;font-weight:600;
  font-family:var(--serif);font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;
  display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:background .3s}
.btn-dark:hover{background:var(--navy-deep)}
.btn-ghost{padding:0;color:var(--navy);text-transform:uppercase;font-family:var(--serif);
  font-size:.78rem;font-weight:600;letter-spacing:.12em;display:inline-flex;align-items:center;gap:10px}
.btn-ghost svg{transition:transform .35s var(--ease)}
.btn-ghost:hover svg{transform:translateX(6px)}
.btn-ghost::after{content:"";position:absolute}

/* ── Scroll progress ──────────────────────────────────────── */
.scroll-progress{position:fixed;top:0;left:0;height:3px;width:0;background:var(--clay);z-index:10001;transition:width .1s linear}
.cursor-dot,.cursor-ring{display:none!important}

/* ── Navbar ───────────────────────────────────────────────── */
.nav-wrap{position:fixed;top:0;left:0;right:0;z-index:900;background:var(--navy);
  transition:background .5s var(--ease),box-shadow .5s,padding .4s,border-color .5s;
  border-bottom:1px solid rgba(199,162,76,.16)}
.navbar{max-width:var(--maxw-wide);margin:0 auto;padding:6px 32px;
  display:flex;align-items:center;justify-content:space-between;gap:24px}
.nav-wrap.scrolled{background:rgba(10,18,34,.97);backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);border-bottom-color:rgba(199,162,76,.28);
  box-shadow:0 12px 34px -22px rgba(0,0,0,.7)}
.nav-wrap.scrolled .navbar{padding-top:4px;padding-bottom:4px}
.nav-logo{display:block;flex-shrink:0}
.nav-logo-img{height:114px;width:auto;display:block;transition:height .4s var(--ease)}
.nav-wrap.scrolled .nav-logo-img{height:82px}
.nav-links{display:flex;gap:4px;align-items:center}
.nav-links a{font-family:var(--serif);font-size:.78rem;font-weight:500;letter-spacing:.08em;
  text-transform:uppercase;color:rgba(255,255,255,.85);padding:10px 16px;position:relative;transition:color .3s}
.nav-links a::after{content:"";position:absolute;left:16px;right:16px;bottom:4px;height:2px;
  background:var(--clay);transform:scaleX(0);transform-origin:center;transition:transform .35s var(--ease)}
.nav-links a:hover::after,.nav-links a.active::after{transform:scaleX(1)}
.nav-links a:hover,.nav-links a.active{color:var(--clay)}
.nav-home{display:flex;align-items:center;justify-content:center}
.nav-home svg{width:20px;height:20px}
.nav-home::after{left:10px!important;right:10px!important}
.nav-right{display:flex;align-items:center;gap:14px}
.nav-tel{display:inline-flex;align-items:center;gap:8px;font-family:var(--serif);font-size:.8rem;font-weight:600;color:#fff}
.nav-tel svg{width:15px;height:15px;color:var(--clay)}
.nav-social{display:inline-flex;align-items:center;gap:8px}
.nav-social a{width:34px;height:34px;border-radius:50%;border:1px solid rgba(255,255,255,.22);
  display:grid;place-items:center;transition:background .3s,border-color .3s}
.nav-social a:hover{background:var(--clay);border-color:var(--clay)}
.nav-social svg{width:15px;height:15px;stroke:#fff;fill:none}
.nav-social a:hover svg{stroke:var(--navy);fill:none}
.nav-social a:last-child svg{fill:#fff;stroke:none}
.nav-social a:last-child:hover svg{fill:var(--navy)}
.nav-fav{position:relative;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;
  border:1.5px solid rgba(255,255,255,.25);transition:border-color .3s,background .3s}
.nav-fav:hover{border-color:var(--clay)}
.nav-fav svg{width:18px;height:18px;fill:none;stroke:#fff;stroke-width:2}
.nav-fav-count{position:absolute;top:-4px;right:-4px;background:var(--clay);color:var(--navy);
  font-size:.62rem;font-weight:800;min-width:18px;height:18px;border-radius:50%;display:grid;place-items:center;padding:0 4px}
.nav-cta{background:var(--clay);color:var(--navy);padding:15px 28px;border-radius:2px;
  font-family:var(--serif);font-size:.95rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  transition:background .3s,transform .35s var(--ease)}
.nav-cta:hover{background:#fff;transform:translateY(-2px)}
.nav-cta-num{font-family:'Space Grotesk',var(--sans);font-size:1.1rem;font-weight:600;
  letter-spacing:.01em;text-transform:none;font-variant-numeric:tabular-nums}
/* 44px : seuil tactile recommandé. Les trois barres restent à 24px, seule la
   zone cliquable grandit — c'est le seul contrôle de navigation en portrait. */
.nav-burger{display:none;flex-direction:column;gap:5px;width:44px;height:44px;justify-content:center;align-items:center;margin-right:-7px}
.nav-burger span{width:24px;height:2px;background:#fff;border-radius:2px;transition:transform .35s var(--ease),opacity .25s}
.nav-burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-burger.open span:nth-child(2){opacity:0}
.nav-burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* Mobile overlay */
.nav-overlay{position:fixed;inset:0;z-index:950;background:var(--navy);
  display:flex;flex-direction:column;justify-content:center;align-items:flex-start;
  padding:0 36px;gap:6px;opacity:0;visibility:hidden;transform:scale(1.04);
  transition:opacity .5s var(--ease),transform .5s var(--ease),visibility .5s}
.nav-overlay.open{opacity:1;visibility:visible;transform:scale(1)}
.nav-overlay nav{display:flex;flex-direction:column;gap:2px;width:100%}
.nav-overlay nav a{display:flex;align-items:center;gap:16px;
  font-family:var(--serif);font-size:clamp(1.5rem,6.5vw,2.4rem);font-weight:700;
  text-transform:uppercase;color:#fff;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.1);
  transition:color .3s,padding-left .35s var(--ease)}
.nav-overlay nav a svg{width:clamp(26px,6vw,34px);height:clamp(26px,6vw,34px);flex-shrink:0;
  stroke:var(--clay);fill:none}
.nav-overlay nav a:hover,.nav-overlay nav a.active{color:var(--clay);padding-left:14px}
/* Téléphone mis en avant : bouton doré */
.nav-overlay .ov-tel{margin-top:26px;border-bottom:none;background:var(--clay);color:var(--navy);
  font-size:1.35rem;letter-spacing:.01em;padding:15px 26px;border-radius:4px;width:max-content;
  box-shadow:0 12px 28px -12px rgba(199,162,76,.7)}
.nav-overlay .ov-tel svg{stroke:var(--navy);width:24px;height:24px}
.nav-overlay .ov-tel:hover{background:#fff;color:var(--navy);padding-left:26px}
/* Estimation moins en avant : lien discret souligné */
.nav-overlay .ov-cta{display:inline-flex;margin-top:16px;border-bottom:none;background:none;
  font-family:var(--sans);font-size:.95rem;font-weight:600;text-transform:none;letter-spacing:0;
  color:rgba(255,255,255,.65);padding:6px 0;width:max-content;text-decoration:underline;text-underline-offset:5px}
.nav-overlay .ov-cta:hover{color:var(--clay);padding-left:0}
.nav-overlay-close{position:absolute;top:26px;right:30px;font-size:2rem;color:#fff;width:48px;height:48px;line-height:1}

/* ── HERO (diagonale navy + photo + carte incrustée) ──────── */
.hero{position:relative;min-height:84svh;display:flex;align-items:center;background:var(--navy);overflow:hidden}
.hero-media{position:absolute;inset:0;width:100%;height:100%;overflow:hidden;z-index:1}
.hero-media img{width:100%;height:100%;object-fit:cover}
.hero-media::after{content:"";position:absolute;inset:0;
  background:linear-gradient(108deg,rgba(7,13,24,.55) 0%,transparent 46%)}
.hero-mask{position:absolute;inset:0;z-index:2;
  background:var(--navy);clip-path:polygon(0 0,53% 0,31% 100%,0 100%)}
/* liseré doré fin sur la diagonale */
.hero-edge{position:absolute;inset:0;z-index:3;pointer-events:none;background:var(--clay);
  clip-path:polygon(53% 0,53.7% 0,31.7% 100%,31% 100%)}
.hero-arcs{position:absolute;left:-120px;bottom:-120px;width:520px;height:520px;z-index:2;opacity:.5;pointer-events:none}
.hero-inner{position:relative;z-index:5;max-width:var(--maxw-wide);margin:0 auto;padding:120px 32px 60px;width:100%}
.hero-content{max-width:620px}
.hero-eyebrow{font-family:var(--serif);font-size:.74rem;font-weight:600;letter-spacing:.28em;
  text-transform:uppercase;color:var(--clay-soft);display:inline-flex;align-items:center;gap:14px;margin-bottom:26px}
.hero-eyebrow::before{content:"";width:40px;height:2px;background:var(--clay)}
.hero-title{font-family:var(--serif);font-weight:800;line-height:.98;letter-spacing:-.01em;
  text-transform:uppercase;color:#fff;font-size:clamp(2.6rem,6vw,5.4rem)}
.hero-title em{font-style:normal;color:var(--clay);display:inline-block}
.hero-title .thin{font-weight:300}
/* slogan en script doré (signature de marque) */
.hero-script{font-family:var(--script);color:var(--clay);font-weight:400;
  font-size:clamp(3rem,7vw,6rem);line-height:1.02;letter-spacing:.01em;margin-bottom:6px}
.hero-kicker{font-family:var(--serif);font-weight:800;text-transform:uppercase;letter-spacing:-.005em;
  color:#fff;font-size:clamp(1.9rem,3.8vw,3.2rem);line-height:1.08;margin-bottom:2px}
.hero-kicker em{font-style:normal;color:var(--clay)}
.hero-sub{color:rgba(255,255,255,.74);font-size:1.1rem;line-height:1.7;margin:26px 0 34px;max-width:46ch}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:36px}
.hero-search{display:flex;background:#fff;border-radius:3px;padding:7px;box-shadow:var(--shadow);max-width:560px;gap:4px}
.hs-field{flex:1;position:relative;border-right:1px solid var(--line)}
.hs-field:last-of-type{border-right:none}
.hs-field select{width:100%;border:none;background:transparent;padding:13px 14px;font-family:var(--sans);
  font-size:.86rem;color:var(--ink);font-weight:500;appearance:none;cursor:pointer;padding-right:28px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23C7A24C' stroke-width='2.5'%3E%3Cpolyline points='2 4 6 8 10 4'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 8px center}
.hs-field select:focus{outline:none}
.hs-submit{background:var(--clay);color:var(--navy);border-radius:2px;padding:0 24px;
  font-family:var(--serif);font-size:.74rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  transition:background .3s;white-space:nowrap}
.hs-submit:hover{background:var(--clay-dk);color:#fff}

/* carte incrustée hero (pattern : éléments sur image) */
/* Carte incrustée — charte ODEVA (marine + or, façon flyer) */
/* Bien à la une — carte photo pleine, texte superposé (style premium) */
.hero-card{position:absolute;right:5%;bottom:9%;z-index:6;display:block;
  width:530px;max-width:42vw;aspect-ratio:6/4;overflow:hidden;border-radius:16px;
  border:4px solid rgba(255,255,255,.50);
  box-shadow:0 32px 72px -18px rgba(5,12,28,.6),0 8px 22px rgba(5,12,28,.28);
  transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.hero-card-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .8s var(--ease)}
.hero-card::after{content:'';position:absolute;inset:0;z-index:1;
  background:linear-gradient(to top,rgba(8,14,26,.94) 0%,rgba(8,14,26,.66) 30%,rgba(8,14,26,.06) 58%,transparent 100%)}
.hero-card:hover{transform:translateY(-8px);box-shadow:0 40px 84px -16px rgba(5,12,28,.65),0 12px 28px rgba(5,12,28,.3)}
.hero-card:hover .hero-card-photo{transform:scale(1.06)}
.hero-card-tag{position:absolute;top:14px;left:14px;z-index:2;
  font-family:var(--serif);font-size:.62rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--navy);background:linear-gradient(135deg,var(--clay-soft),var(--clay));
  padding:6px 12px;border-radius:999px;box-shadow:0 4px 14px rgba(199,162,76,.45)}
.hero-card-info{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:22px 20px 20px}
.hero-card-title{font-family:var(--serif);font-size:1.3rem;font-weight:800;color:#fff;
  text-transform:uppercase;letter-spacing:.01em;line-height:1.12;text-shadow:0 2px 14px rgba(5,12,28,.5)}
.hero-card-meta{font-size:.85rem;font-weight:500;color:rgba(255,255,255,.82);margin-top:4px}
.hero-card-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;
  margin-top:15px;padding-top:15px;border-top:1px solid rgba(255,255,255,.18)}
.hero-card-price{font-family:var(--serif);font-size:1.5rem;font-weight:800;color:var(--clay-soft);
  text-shadow:0 2px 14px rgba(5,12,28,.5)}
.hero-card-arrow{width:44px;height:44px;border-radius:50%;flex-shrink:0;
  background:var(--clay);display:grid;place-items:center;transition:background .3s,transform .3s}
.hero-card:hover .hero-card-arrow{background:var(--clay-soft);transform:translateX(3px)}
.hero-card-arrow svg{width:18px;height:18px;stroke:var(--navy);fill:none;stroke-width:2.5}

/* hero stats */
.hero-stats{position:relative;z-index:5;background:var(--navy-deep);
  display:grid;grid-template-columns:repeat(3,1fr);width:100%;
  padding-inline:max(0px,calc((100% - var(--maxw-wide)) / 2));
  border-top:1px solid rgba(255,255,255,.08)}
.hs-stat{padding:24px 32px;border-right:1px solid rgba(255,255,255,.08);
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.hs-stat:last-child{border-right:none}
.hs-stat--row{flex-direction:row;justify-content:center;gap:18px;text-align:left}
.hs-stat--row .hs-ico{margin-bottom:0;flex-shrink:0}
.hs-stat--row .hs-l{margin-top:6px}
.hs-ico{width:34px;height:34px;margin-bottom:13px;color:var(--clay)}
.hs-ico svg{width:100%;height:100%;display:block;stroke:currentColor;fill:none;stroke-width:1.7}
.hs-n{font-family:var(--serif);font-size:clamp(1.7rem,2.8vw,2.4rem);font-weight:800;color:var(--clay);line-height:1}
.hs-l{font-size:.74rem;color:rgba(255,255,255,.55);text-transform:uppercase;letter-spacing:.12em;margin-top:8px}
.hs-google-top{display:flex;align-items:center;gap:7px;margin-bottom:4px}
.hs-google .g-logo{flex-shrink:0}
.hs-stars{color:#FBBC05;letter-spacing:1px;font-size:.82rem;line-height:1}
.hs-n-sub{font-size:.5em;font-weight:600;color:rgba(255,255,255,.5);margin-left:1px}

/* ── Sections ─────────────────────────────────────────────── */
section{position:relative}
.sec{padding:clamp(40px,6vw,60px) 0}
.sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:54px;flex-wrap:wrap}
.sec-head .section-title{flex:1;min-width:280px}

/* ── FEATURED : photos immersives, infos incrustées ───────── */
.feature{background:var(--navy);color:#fff}
.feature .eyebrow{color:var(--clay-soft)}
.feature .eyebrow::before{background:var(--clay)}
.feature .section-title{color:#fff}
.feature .section-title em{color:var(--clay)}
.feature .btn-ghost{color:#fff}
.feature-list{display:flex;flex-direction:column;gap:clamp(24px,3.4vw,46px)}
.feature-row{position:relative;border-radius:8px;overflow:hidden;box-shadow:var(--shadow);
  min-height:clamp(440px,56vw,600px);display:flex;align-items:flex-end}
.feature-media{position:absolute;inset:0;z-index:0;display:block}
.feature-media img{width:100%;height:100%;object-fit:cover;transition:transform 1.3s var(--ease)}
.feature-row:hover .feature-media img{transform:scale(1.06)}
.feature-media::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(100deg,rgba(8,16,30,.9) 0%,rgba(8,16,30,.55) 38%,rgba(8,16,30,.05) 66%)}
.feature-row.alt{justify-content:flex-end}
.feature-row.alt .feature-media::after{background:linear-gradient(260deg,rgba(8,16,30,.9) 0%,rgba(8,16,30,.55) 38%,rgba(8,16,30,.05) 66%)}
/* Prix en bas, à l'opposé du panneau texte (panel bas-gauche → prix bas-droite ; alt inversé) */
.feature-pricebadge{position:absolute;top:auto;bottom:34px;left:auto;right:0;z-index:2;background:var(--clay);color:var(--navy);
  font-family:var(--serif);font-weight:800;font-size:clamp(1.35rem,2vw,1.85rem);padding:12px 22px 12px 26px;
  letter-spacing:-.01em;border-radius:5px 0 0 5px;box-shadow:0 12px 28px -12px rgba(0,0,0,.55)}
.feature-pricebadge .prix-hai{font-size:.42em;opacity:.8}
.feature-row.alt .feature-pricebadge{right:auto;left:0;border-radius:0 5px 5px 0;padding:14px 30px 14px 24px}
.feature-panel{position:relative;z-index:2;margin:clamp(24px,3vw,48px);max-width:460px}
.feature-num{font-family:var(--serif);font-size:.74rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--clay);margin-bottom:14px}
.feature-title{font-family:var(--serif);font-size:clamp(1.6rem,3vw,2.4rem);font-weight:800;
  text-transform:uppercase;color:#fff;line-height:1.06;letter-spacing:-.01em}
.feature-loc{display:flex;align-items:center;gap:7px;font-size:.92rem;color:rgba(255,255,255,.8);margin-top:12px}
.feature-loc svg{width:15px;height:15px;stroke:var(--clay);fill:none;stroke-width:2}
.feature-desc{color:rgba(255,255,255,.74);line-height:1.7;margin:16px 0;font-size:.96rem;max-width:42ch}
.feature-facts{display:flex;flex-wrap:wrap;gap:10px 22px;margin:18px 0 26px}
.feature-fact{display:flex;align-items:center;gap:9px;font-size:.9rem;color:#fff}
.feature-fact svg{width:17px;height:17px;stroke:var(--clay);fill:none;stroke-width:2.6;flex-shrink:0}
.feature-actions{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.feature-actions .btn-ink{background:var(--clay);color:var(--navy)}
.feature-actions .btn-ink:hover{background:#fff;color:var(--navy)}

/* ── Bien card (grille + incrustation) ────────────────────── */
.listings-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:26px}
/* Tablette en paysage : auto-fill s'arrête à 2 colonnes de 459px (il manque 11px
   pour en tenir 3). On force 3 colonnes sur cette plage — plus de biens visibles
   sans défiler, sans toucher au rendu desktop. */
@media (min-width:941px) and (max-width:1180px){
  .listings-grid{grid-template-columns:repeat(3,1fr)}
}
.bien-card{position:relative;background:var(--white);border:1px solid var(--line);border-radius:5px;
  overflow:hidden;transition:transform .5s var(--ease),box-shadow .5s,border-color .4s;
  display:flex;flex-direction:column;min-height:340px}
.bien-card:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:var(--line-2)}
.bc-link{display:flex;flex-direction:column;height:100%}
.bc-img{position:relative;overflow:hidden;aspect-ratio:4/3;background:var(--paper-2);flex-shrink:0;
  margin:12px;border:1.5px solid var(--clay);border-radius:8px;
  box-shadow:0 10px 24px -10px rgba(15,30,56,.45)}
.bien-card:hover .bc-img{box-shadow:0 16px 32px -10px rgba(15,30,56,.55)}
.bc-img img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.bien-card:hover .bc-img img{transform:scale(1.06)}
/* Carousel photos */
.bc-slider{display:flex;width:100%;height:100%;transition:transform .45s var(--ease)}
.bc-slider img{flex:0 0 100%}
.bc-arrow{position:absolute;top:50%;transform:translateY(-50%);width:34px;height:34px;border-radius:50%;
  background:rgba(255,255,255,.82);backdrop-filter:blur(4px);display:grid;place-items:center;z-index:5;
  color:var(--navy);font-size:1.35rem;line-height:0;padding-bottom:3px;cursor:pointer;opacity:0;
  transition:opacity .25s,background .25s}
.bien-card:hover .bc-arrow{opacity:1}
.bc-arrow:hover{background:#fff}
.bc-prev{left:10px}.bc-next{right:10px}
.bc-dots{position:absolute;left:0;right:0;bottom:10px;z-index:5;display:flex;justify-content:center;gap:5px;pointer-events:none}
.bc-dots span{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.65);box-shadow:0 1px 3px rgba(0,0,0,.4);transition:background .25s,transform .25s}
.bc-dots span.active{background:var(--clay);transform:scale(1.25)}
/* ── Appareils tactiles : le carrousel se pilote au doigt ──────────
   La condition est le pointeur, pas la largeur : un iPad de 1024px est aussi
   tactile qu'un téléphone. Les flèches restent visibles (pas de survol pour
   les révéler) et passent au seuil de 44px ; les points deviennent des cibles
   atteignables plutôt que de simples témoins. */
@media (hover:none){
  .bc-arrow{opacity:.92;width:44px;height:44px}
  .bc-dots{padding:6px 0}
  .bc-dots span{width:9px;height:9px;margin:0 4px}
  .bc-slider{touch-action:pan-y}      /* le glissé horizontal nous revient */
  .bien-card:hover{transform:none}    /* pas de lévitation figée après un appui */
  .bien-card:hover .bc-img img{transform:none}
}
.bc-no-img{width:100%;height:100%;display:grid;place-items:center;background:var(--navy);padding:12%}
.bc-no-img img{max-width:80%;max-height:64%;width:auto;height:auto;object-fit:contain;display:block}
.bc-no-img svg{width:48px;height:48px}
/* Image cassée (URL photo absente) → logo ODEVA sur fond marine */
.bc-img img.bc-fallback-logo{object-fit:contain;background:var(--navy);padding:14%}
.bc-img-overlay{position:absolute;top:14px;left:14px;right:14px;display:flex;justify-content:space-between;align-items:flex-start;pointer-events:none}
.bc-type-tag{background:rgba(15,30,56,.88);color:#fff;backdrop-filter:blur(6px);
  font-family:var(--serif);font-size:.62rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:7px 14px}
.bc-dpe{width:28px;height:28px;border-radius:3px;display:grid;place-items:center;font-family:var(--serif);font-weight:700;color:#fff;font-size:.86rem}
.bc-price-tag{position:absolute;left:0;bottom:16px;z-index:4;background:rgba(255,255,255,.8);backdrop-filter:blur(5px);
  border-left:3px solid var(--clay);padding:8px 15px;font-family:var(--serif);font-size:1.02rem;font-weight:800;color:var(--navy);box-shadow:var(--shadow-sm)}
.prix-hai{font-size:.58em;font-weight:700;letter-spacing:.04em;opacity:.75;margin-left:3px;white-space:nowrap}
/* Carte « Vendu par l'agence » */
.bien-card--sold .bc-img img{filter:grayscale(.35) brightness(.93)}
.bien-card--sold .bc-link{cursor:default}
.bien-card--sold:hover{transform:translateY(-4px)}
/* Ruban d'angle oblique doré « VENDU PAR L'AGENCE » (dans le coin haut-gauche de la photo) */
.bc-sold-ribbon{position:absolute;top:26px;left:-46px;z-index:6;
  background:var(--clay);color:var(--navy);
  font-family:var(--serif);font-size:.82rem;font-weight:800;letter-spacing:.03em;text-transform:uppercase;
  padding:8px 46px;text-align:center;white-space:nowrap;
  transform:rotate(-45deg);transform-origin:center;
  box-shadow:0 7px 16px -6px rgba(0,0,0,.5)}
/* Bandeaux diagonaux (Nouveauté / Sous offre / Sous compromis / Vendu).
   Technique « coin » (wrapper qui masque + bande centrée) : texte grand,
   centré, et libellés longs entièrement lisibles. */
.bc-ribbon{position:absolute;inset:0;overflow:hidden;z-index:6;pointer-events:none}
.bc-ribbon span{position:absolute;display:block;width:260px;left:-66px;top:40px;
  padding:11px 0;transform:rotate(-45deg);text-align:center;
  font-family:var(--serif);font-weight:800;font-size:.94rem;letter-spacing:.03em;text-transform:uppercase;white-space:nowrap;color:#fff;
  box-shadow:0 6px 14px -5px rgba(0,0,0,.55)}
.bc-ribbon .r-gold{background:var(--clay);color:var(--navy)}
.bc-ribbon .r-new{background:var(--navy);color:#fff}
/* Bandeau "Vendu par l'agence" : texte plus long → bande élargie (recentrée sur le coin) */
.bc-ribbon .r-vendu{background:#5a9c3f;color:#fff;width:350px;top:50px;left:-101px;letter-spacing:.02em}

/* Badge « ▶ Vidéo » sur les cartes */
.bc-video-badge{position:absolute;right:12px;bottom:12px;z-index:5;display:inline-flex;align-items:center;gap:5px;
  background:rgba(15,30,56,.82);color:#fff;font-size:.72rem;font-weight:700;letter-spacing:.02em;
  padding:4px 11px;border-radius:999px;pointer-events:none;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}

/* Section vidéos (fiche bien) */
.bien-videos{display:flex;flex-direction:column;gap:16px}
.bien-video-mp4{width:100%;max-height:520px;border-radius:10px;background:#000;display:block}
.bien-video-social{display:flex;align-items:center;gap:14px;text-decoration:none;
  background:var(--navy);color:#fff;border-radius:10px;padding:16px 18px;transition:transform .2s,box-shadow .2s}
.bien-video-social:hover{transform:translateY(-2px);box-shadow:0 12px 26px -12px rgba(15,30,56,.5)}
.bien-video-social .bvs-play{flex:none;width:40px;height:40px;border-radius:50%;background:var(--clay);color:var(--navy);
  display:grid;place-items:center;font-size:15px;font-weight:800;padding-left:2px}
.bien-video-social .bvs-label{flex:1;font-weight:700;font-size:1rem}
.bien-video-social .bvs-ext{opacity:.7;font-size:1.1rem}
.bien-video-social.bvs-youtube .bvs-play{background:#ff0033;color:#fff}
.bien-video-social.bvs-instagram .bvs-play{background:linear-gradient(45deg,#f9ce34,#ee2a7b,#6228d7);color:#fff}
.bien-video-social.bvs-facebook .bvs-play{background:#1877f2;color:#fff}

/* Embed social : façade (bouton) → iframe chargée au clic */
.bien-video-embed{position:relative;width:100%;background:#0b1524;border-radius:12px;overflow:hidden;
  aspect-ratio:16/9;max-width:900px}
.bien-video-embed.bvs-facebook,.bien-video-embed.bvs-instagram{aspect-ratio:9/16;max-width:360px}
.bien-video-embed .bve-play{position:absolute;inset:0;width:100%;height:100%;border:0;cursor:pointer;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;
  background:linear-gradient(160deg,#16233a,#0b1524);color:#fff;font-family:inherit;padding:22px}
.bien-video-embed .bve-play:hover{background:linear-gradient(160deg,#1c2c48,#0d1a2e)}
.bien-video-embed .bve-ic{width:62px;height:62px;border-radius:50%;background:var(--clay);color:var(--navy);
  display:grid;place-items:center;font-size:24px;font-weight:800;padding-left:4px;transition:transform .2s}
.bien-video-embed .bve-play:hover .bve-ic{transform:scale(1.08)}
.bien-video-embed .bve-txt{font-weight:800;font-size:1.05rem}
.bien-video-embed .bve-note{font-size:.75rem;color:rgba(255,255,255,.6);max-width:280px;line-height:1.4}
.bien-video-embed .bve-open{position:absolute;right:10px;bottom:8px;z-index:2;font-size:.72rem;font-weight:700;
  color:rgba(255,255,255,.75);text-decoration:none;background:rgba(0,0,0,.35);padding:4px 8px;border-radius:6px}
.bien-video-embed .bve-open:hover{color:#fff}
.bien-video-embed.loaded{aspect-ratio:16/9}
.bien-video-embed.bvs-facebook.loaded,.bien-video-embed.bvs-instagram.loaded{aspect-ratio:9/16}
.bien-video-embed .bve-iframe{width:100%;height:100%;border:0;display:block}
.bc-price-vendu{background:var(--navy)!important;color:#fff;border-left-color:var(--clay);
  font-size:.92rem;letter-spacing:.1em;text-transform:uppercase}
.bc-cta-vendu{color:var(--clay-dk)}
.bc-body{padding:22px 22px 20px;display:flex;flex-direction:column;flex:1}
.bc-price{display:none}
.bc-title{font-family:var(--serif);font-size:1.05rem;font-weight:700;text-transform:uppercase;
  letter-spacing:-.005em;line-height:1.22;color:var(--navy)}
.bc-loc{display:flex;align-items:center;gap:6px;font-size:.84rem;color:var(--mute);margin-top:8px}
.bc-loc svg{width:14px;height:14px;stroke:var(--clay-dk);fill:none;stroke-width:2}
.bc-feats{display:flex;flex-wrap:wrap;gap:8px 14px;margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}
.bc-feat{display:inline-flex;align-items:center;gap:6px;font-size:.78rem;color:var(--ink-2);font-weight:500}
.bc-feat svg{width:15px;height:15px;stroke:var(--mute);fill:none;stroke-width:1.8}
.bc-footer{margin-top:auto;padding-top:18px}
.bc-cta{display:inline-flex;align-items:center;gap:8px;font-family:var(--serif);font-size:.72rem;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;color:var(--navy)}
.bc-cta svg{width:14px;height:14px;stroke:var(--clay-dk);fill:none;stroke-width:2.5;transition:transform .4s var(--ease)}
.bien-card:hover .bc-cta svg{transform:translateX(5px)}
.bc-fav{position:absolute;top:14px;right:14px;z-index:5;width:40px;height:40px;border-radius:50%;
  background:rgba(255,255,255,.92);backdrop-filter:blur(6px);display:grid;place-items:center;transition:transform .3s,background .3s}
.bc-fav svg{width:19px;height:19px;fill:none;stroke:var(--navy);stroke-width:1.8;transition:fill .3s,stroke .3s}
.bc-fav:hover{background:#fff;transform:scale(1.1)}
.bc-fav.is-fav svg{fill:var(--clay);stroke:var(--clay)}
.bc-fav.pop{animation:favpop .4s var(--ease)}
@keyframes favpop{0%{transform:scale(1)}40%{transform:scale(1.3)}100%{transform:scale(1)}}

/* grille 3 colonnes (acheter) */
@media (min-width:760px){
  #bien-grid:not(.list-view){grid-template-columns:repeat(2,1fr);gap:28px}
}
/* 941px et non 1080 : une tablette en paysage (1024) restait à 2 colonnes de
   459px alors qu'elle tient trois annonces sans serrer. Seuil aligné sur celui
   du menu, pour que la bascule « tablette → desktop » soit d'un seul tenant. */
@media (min-width:941px){
  #bien-grid:not(.list-view){grid-template-columns:repeat(3,1fr);gap:28px}
}
/* Vue liste : 2 annonces par ligne, image plein-cadre + dégradé héro vers les infos */
#bien-grid.list-view{grid-template-columns:repeat(2,1fr);gap:24px}
#bien-grid.list-view .bien-card,#bien-grid.list-view .bc-link{flex-direction:row}
/* Hauteur fixe basse → l'image (étirée) devient panoramique, corps compact au centre */
#bien-grid.list-view .bc-link{height:180px}
#bien-grid.list-view .bc-img{width:54%;flex-shrink:0;aspect-ratio:auto;align-self:stretch;
  margin:0;border:none;border-radius:0}
/* Plus de dégradé de fusion vers la zone d'infos : la photo garde ses couleurs
   jusqu'au bord droit. Le ::after est conservé (vide) — il reste le calque de
   superposition sur lequel s'appuient les éléments posés sur l'image. */
#bien-grid.list-view .bc-img::after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none}
#bien-grid.list-view .bc-price-tag{display:none}          /* le prix passe dans le corps */
/* Corps compact → carte basse → photo panoramique (on retire le plancher de hauteur) */
#bien-grid.list-view .bien-card{min-height:0}
#bien-grid.list-view .bc-body{flex:1;justify-content:center;padding:12px 22px 12px 24px;overflow:hidden}
#bien-grid.list-view .bc-price{display:inline-flex;align-items:center;gap:7px;
  font-family:var(--serif);font-size:1.3rem;font-weight:800;color:var(--navy);margin-bottom:0}
#bien-grid.list-view .bc-price svg{width:19px;height:19px;stroke:var(--clay-dk);fill:none;stroke-width:2;flex:none}
#bien-grid.list-view .bc-title{font-size:1.05rem;line-height:1.18;margin-top:3px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
#bien-grid.list-view .bc-loc{font-size:.86rem;margin-top:4px}
#bien-grid.list-view .bc-loc svg{width:15px;height:15px}
#bien-grid.list-view .bc-feats{margin-top:9px;padding-top:9px;gap:5px 16px}
#bien-grid.list-view .bc-feat{font-size:.86rem}
#bien-grid.list-view .bc-feat svg{width:16px;height:16px}
#bien-grid.list-view .bc-footer{display:none}   /* CTA redondant : la carte entière est cliquable */
@media (max-width:900px){#bien-grid.list-view{grid-template-columns:1fr}}
@media (max-width:680px){#bien-grid.list-view .bien-card,#bien-grid.list-view .bc-link{flex-direction:column;height:auto}
  #bien-grid.list-view .bc-img{width:100%;aspect-ratio:3/2}
  #bien-grid.list-view .bc-img::after{background:none}
  #bien-grid.list-view .bc-footer{display:inline-flex}}

/* Vue grille : image plein-cadre (sans marge/bordure/ombre), infos + icônes agrandies, sans CTA */
#bien-grid:not(.list-view):not(.masonry-view) .bc-img{margin:0;border:none;border-radius:0;box-shadow:none}
#bien-grid:not(.list-view):not(.masonry-view) .bien-card:hover .bc-img{box-shadow:none}
#bien-grid:not(.list-view):not(.masonry-view) .bc-title{font-size:1.18rem}
#bien-grid:not(.list-view):not(.masonry-view) .bc-loc{font-size:.94rem}
#bien-grid:not(.list-view):not(.masonry-view) .bc-loc svg{width:17px;height:17px}
#bien-grid:not(.list-view):not(.masonry-view) .bc-feats{gap:9px 16px}
#bien-grid:not(.list-view):not(.masonry-view) .bc-feat{font-size:.9rem}
#bien-grid:not(.list-view):not(.masonry-view) .bc-feat svg{width:18px;height:18px}
#bien-grid:not(.list-view):not(.masonry-view) .bc-footer{display:none}

/* Vue mosaïque (masonry façon Pinterest, colonnes CSS) */
#bien-grid.masonry-view{display:block;column-count:1;column-gap:26px}
@media (min-width:560px){#bien-grid.masonry-view{column-count:2}}
@media (min-width:1080px){#bien-grid.masonry-view{column-count:3}}
#bien-grid.masonry-view .bien-card{display:block;width:100%;min-height:0;margin:0 0 26px;
  break-inside:avoid;-webkit-column-break-inside:avoid;page-break-inside:avoid}
#bien-grid.masonry-view .empty-state{break-inside:avoid}
/* hauteurs d'images variées → effet mosaïque échelonné */
#bien-grid.masonry-view .bc-img{aspect-ratio:4/3}
#bien-grid.masonry-view .bien-card:nth-child(4n+1) .bc-img{aspect-ratio:3/4}
#bien-grid.masonry-view .bien-card:nth-child(4n+2) .bc-img{aspect-ratio:1/1}
#bien-grid.masonry-view .bien-card:nth-child(4n+3) .bc-img{aspect-ratio:4/3}
#bien-grid.masonry-view .bien-card:nth-child(4n)   .bc-img{aspect-ratio:5/6}
/* mosaïque = uniquement la photo, infos incrustées dessus */
#bien-grid.masonry-view .bien-card{border:none;border-radius:9px;box-shadow:var(--shadow-sm)}
#bien-grid.masonry-view .bc-link{height:auto}
#bien-grid.masonry-view .bc-img{margin:0;border:none;border-radius:0;box-shadow:none}
#bien-grid.masonry-view .bc-feats,
#bien-grid.masonry-view .bc-footer,
#bien-grid.masonry-view .bc-img-overlay,
#bien-grid.masonry-view .bc-dots{display:none}
#bien-grid.masonry-view .bc-body{position:absolute;left:0;right:0;bottom:0;z-index:4;
  padding:48px 18px 16px;
  background:linear-gradient(to top,rgba(11,20,38,.93) 0%,rgba(11,20,38,.62) 48%,transparent 100%)}
#bien-grid.masonry-view .bc-title{color:#fff;font-size:1rem}
#bien-grid.masonry-view .bc-loc{color:rgba(255,255,255,.85);margin-top:5px}
#bien-grid.masonry-view .bc-loc svg{stroke:var(--clay-soft)}
/* prix juste au-dessus du titre, dans le bandeau bas (on masque la pastille sur l'image) */
#bien-grid.masonry-view .bc-price-tag{display:none}
#bien-grid.masonry-view .bc-price{display:flex;align-items:center;gap:7px;margin-bottom:7px;
  font-family:var(--serif);font-weight:800;font-size:1.1rem;color:var(--clay-soft)}
#bien-grid.masonry-view .bc-price svg{width:18px;height:18px;stroke:var(--clay-soft);fill:none;stroke-width:2;flex:none}

/* ── TYPES ────────────────────────────────────────────────── */
.types{background:var(--paper-2)}
.types-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.type-card{position:relative;border-radius:5px;overflow:hidden;aspect-ratio:3/4;cursor:pointer}
.type-card img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.type-card:hover img{transform:scale(1.08)}
.type-card-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(10,20,38,.9) 0%,rgba(10,20,38,.15) 55%,transparent 100%)}
.type-card-body{position:absolute;left:0;right:0;bottom:0;padding:24px;color:#fff}
.type-name{font-family:var(--serif);font-size:1.3rem;font-weight:700;text-transform:uppercase;letter-spacing:.01em}
.type-count{font-size:.8rem;opacity:.82;margin-top:2px}
.type-arrow{position:absolute;top:16px;right:16px;width:38px;height:38px;border-radius:50%;
  background:rgba(255,255,255,.16);backdrop-filter:blur(4px);display:grid;place-items:center;transition:background .35s,transform .4s var(--ease)}
.type-arrow svg{width:18px;height:18px;stroke:#fff;fill:none;stroke-width:2}
.type-card:hover .type-arrow{background:var(--clay);transform:rotate(-45deg)}
.type-card:hover .type-arrow svg{stroke:var(--navy)}
.type-card-empty{background:linear-gradient(160deg,var(--navy) 0%,var(--navy-deep) 100%)}
.type-card-empty .type-card-overlay{background:none}
.type-card-empty::before{content:"";position:absolute;inset:0;opacity:.18;
  background:radial-gradient(circle at 70% 20%,var(--clay) 0,transparent 42%)}

/* ── SERVICES (navy, diagonale) ───────────────────────────── */
.services{background:var(--navy);color:#fff;position:relative;overflow:hidden}
.services::before{content:"";position:absolute;top:0;right:0;width:40%;height:100%;
  background:var(--navy-2);clip-path:polygon(30% 0,100% 0,100% 100%,0 100%);opacity:.5}
.services .container{position:relative;z-index:1}
.services .section-title{color:#fff}
.services .section-title em{color:var(--clay)}
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid rgba(255,255,255,.14)}
.srv-card{padding:42px 32px;border-right:1px solid rgba(255,255,255,.14);transition:background .4s}
.srv-card:last-child{border-right:none}
.srv-card:hover{background:rgba(255,255,255,.04)}
.srv-num{font-family:var(--serif);font-size:2.6rem;font-weight:800;color:var(--clay);line-height:1;margin-bottom:18px}
.srv-title{font-family:var(--serif);font-size:1.2rem;font-weight:700;text-transform:uppercase;letter-spacing:.01em;margin-bottom:12px}
.srv-desc{font-size:.94rem;color:rgba(255,255,255,.66);line-height:1.75}
.srv-line{display:block;width:0;height:2px;background:var(--clay);margin-top:22px;transition:width .6s var(--ease)}
.srv-card:hover .srv-line{width:56px}

/* ── ZONES ────────────────────────────────────────────────── */
.zones{background:var(--paper)}
.zones-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}
.zone-card{position:relative;background:var(--cream);border:1px solid var(--line);border-radius:4px;
  padding:26px 24px;cursor:pointer;overflow:hidden;transition:transform .45s var(--ease),border-color .35s}
.zone-card:hover{transform:translateY(-4px);border-color:var(--clay)}
.zone-overlay{position:absolute;inset:0;background:var(--navy);transform:translateY(101%);transition:transform .5s var(--ease);z-index:0}
.zone-card:hover .zone-overlay{transform:translateY(0)}
.zone-body{position:relative;z-index:1}
.zone-name{display:block;font-family:var(--serif);font-size:1.2rem;font-weight:700;text-transform:uppercase;color:var(--navy);transition:color .4s}
.zone-card:hover .zone-name{color:#fff}
.zone-count{font-size:.82rem;color:var(--mute);transition:color .4s}
.zone-card:hover .zone-count{color:rgba(255,255,255,.75)}
.zone-badge{position:relative;z-index:1;display:inline-flex;align-items:center;gap:6px;margin-top:14px;
  font-family:var(--serif);font-size:.68rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--clay-dk);transition:color .4s}
.zone-card:hover .zone-badge{color:var(--clay)}

/* ── AGENT ────────────────────────────────────────────────── */
.agent{display:grid;grid-template-columns:0.68fr 1.32fr;background:var(--navy);color:#fff;overflow:hidden;position:relative}
.agent>.sec-fx{z-index:0}
.agent .agent-image,.agent .agent-body{position:relative;z-index:1}
.agent-image{position:relative;min-height:clamp(330px,32vw,420px)}
.agent-image img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top center}
/* Accueil : photo d'Océane plus discrète */
.home .agent{grid-template-columns:0.58fr 1.42fr}
.home .agent-image{min-height:clamp(280px,28vw,380px)}
.agent-body{padding:clamp(48px,7vw,96px) clamp(34px,6vw,84px);display:flex;flex-direction:column;justify-content:center}
.agent-body .eyebrow{color:var(--clay-soft)}.agent-body .eyebrow::before{background:var(--clay)}
.agent-name{font-family:var(--serif);font-size:clamp(1.9rem,3.6vw,2.9rem);font-weight:800;text-transform:uppercase;line-height:1.05;color:#fff}
.agent-role{font-family:var(--serif);font-size:.82rem;color:var(--clay);font-weight:600;letter-spacing:.12em;text-transform:uppercase;margin:12px 0 24px}
.agent-bio{font-size:1.02rem;color:rgba(255,255,255,.72);line-height:1.85;margin-bottom:20px}
.agent-contacts{display:flex;flex-direction:column;gap:12px;margin:8px 0 30px}
.agent-contact{display:flex;align-items:center;gap:12px;font-size:1rem;color:rgba(255,255,255,.9)}
.agent-contact svg{width:20px;height:20px;stroke:var(--clay);fill:none;stroke-width:2}
/* bouton « Prendre contact » : largeur au contenu, aligné à gauche */
.agent-body>.btn{align-self:flex-start}

/* ── PROCESS ──────────────────────────────────────────────── */
.process{background:var(--paper-2)}
.process-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.process-step{background:var(--white);border:1px solid var(--line);border-radius:5px;padding:32px 28px;
  transition:transform .45s var(--ease),box-shadow .45s;border-top:3px solid transparent}
.process-step:hover{transform:translateY(-5px);box-shadow:var(--shadow-sm);border-top-color:var(--clay)}
.ps-num{font-family:var(--serif);font-size:2.2rem;font-weight:800;color:var(--clay);line-height:1}
.ps-title{font-family:var(--serif);font-size:1.12rem;font-weight:700;text-transform:uppercase;letter-spacing:.005em;margin:14px 0 8px;color:var(--navy)}
.ps-desc{font-size:.92rem;color:var(--ink-2);line-height:1.7}

/* ── TESTIMONIALS ─────────────────────────────────────────── */
.testi{background:var(--navy);color:#fff}
.testi .section-title{color:#fff}.testi .section-title em{color:var(--clay)}
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.testi-card{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:5px;
  padding:32px 28px;transition:transform .45s var(--ease),background .4s}
.testi-card:hover{transform:translateY(-5px);background:rgba(255,255,255,.07)}
.testi-stars{color:var(--clay);letter-spacing:3px;font-size:1rem;margin-bottom:16px}
.testi-quote{font-size:1.04rem;line-height:1.7;color:rgba(255,255,255,.9);margin-bottom:20px}
.testi-name{font-family:var(--serif);font-weight:700;font-size:.92rem;text-transform:uppercase;letter-spacing:.04em}
.testi-city{font-size:.82rem;color:var(--clay-soft)}

/* ── CTA ──────────────────────────────────────────────────── */
.cta{background:var(--navy);color:#fff;overflow:hidden;position:relative}
.cta::before{content:"";position:absolute;top:0;right:0;width:40%;height:100%;
  background:var(--navy-2);clip-path:polygon(30% 0,100% 0,100% 100%,0 100%);opacity:.5}
.cta-inner{display:flex;justify-content:space-between;align-items:center;gap:48px;flex-wrap:wrap;position:relative;z-index:1}
.cta h2{font-family:var(--serif);font-size:clamp(1.9rem,3.6vw,3rem);font-weight:800;text-transform:uppercase;line-height:1.08}
.cta h2 em{font-style:normal;color:var(--clay)}
.cta p{font-size:1.04rem;margin-top:16px;max-width:46ch;color:rgba(255,255,255,.78)}
.cta-actions{display:flex;gap:14px;flex-wrap:wrap}

/* ── FOOTER ───────────────────────────────────────────────── */
.site-footer{background:var(--navy-deep);color:#fff;padding:78px 0 0}
.footer-top{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.4fr;gap:40px;padding-bottom:52px;
  max-width:var(--maxw-wide);margin:0 auto;padding-left:32px;padding-right:32px}
.footer-logo-link img{height:78px;width:auto}
.footer-tagline{font-size:1.05rem;color:rgba(255,255,255,.72);margin:18px 0 22px;line-height:1.5}
.footer-socials{display:flex;gap:12px}
.footer-socials a{width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,.2);display:grid;place-items:center;transition:background .3s,border-color .3s}
.footer-socials a:hover{background:var(--clay);border-color:var(--clay)}
.footer-socials a:hover svg{stroke:var(--navy);fill:var(--navy)}
.footer-socials svg{width:18px;height:18px}
.footer-nav h4,.footer-contact h4{font-family:var(--serif);font-size:.74rem;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;color:var(--clay);margin-bottom:18px}
.footer-nav ul{display:flex;flex-direction:column;gap:11px}
.footer-nav a{font-size:.92rem;color:rgba(255,255,255,.66);transition:color .3s,padding-left .3s}
.footer-nav a:hover{color:#fff;padding-left:5px}
.footer-contact address{font-style:normal}
.footer-contact p{display:flex;gap:11px;font-size:.92rem;color:rgba(255,255,255,.66);margin-bottom:14px;align-items:flex-start}
.footer-contact svg{width:17px;height:17px;stroke:var(--clay);fill:none;stroke-width:1.8;flex-shrink:0;margin-top:3px}
.footer-contact a:hover{color:#fff}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;
  padding:22px 32px;border-top:1px solid rgba(255,255,255,.1);font-size:.82rem;color:rgba(255,255,255,.5);
  max-width:var(--maxw-wide);margin:0 auto}
.footer-bottom-links{display:flex;gap:22px}
.footer-bottom-links a:hover{color:#fff}

/* Haut de la fiche bien : le décalage compense l'en-tête fixe, dont la hauteur
   n'est PAS la même partout — 126px en desktop, 78px en mobile. Une valeur
   unique de 140px laissait 62px de vide au-dessus du fil d'Ariane sur téléphone. */
.bien-top{background:var(--paper);padding-top:140px}
/* Calé sur la hauteur réelle de l'en-tête fixe, qui change à chaque palier :
   127px sous 941 (burger), 101px entre 941 et 1180, 126px au-delà. Le palier
   941-1180 était traité comme le burger — d'où le vide au-dessus du fil
   d'Ariane sur tablette. */
@media (min-width:941px) and (max-width:1180px){ .bien-top{padding-top:105px} }
@media (min-width:761px) and (max-width:940px){  .bien-top{padding-top:131px} }
@media (max-width:760px){ .bien-top{padding-top:88px} }

/* ── Scroll-top & mobile bar ──────────────────────────────── */
.scroll-top{position:fixed;bottom:28px;right:28px;width:50px;height:50px;border-radius:50%;background:var(--navy);
  color:#fff;display:grid;place-items:center;z-index:800;opacity:0;transform:translateY(20px);
  transition:opacity .4s,transform .4s,background .3s}
.scroll-top.show{opacity:1;transform:translateY(0)}
.scroll-top:hover{background:var(--clay)}
.scroll-top svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2.5}

/* Widget « Être rappelé » (toutes pages) */
.rappel{position:fixed;right:0;top:62%;z-index:840;display:flex;align-items:center;
  transform:translateY(-50%) translateX(340px);transition:transform .45s var(--ease)}
.rappel.open{transform:translateY(-50%) translateX(0)}
.rappel-tab{position:relative;z-index:2;flex-shrink:0;display:flex;flex-direction:column;align-items:center;gap:9px;cursor:pointer;
  background:var(--clay);color:var(--navy);padding:15px 8px;border-radius:10px 0 0 10px;
  box-shadow:-5px 6px 22px -8px rgba(15,30,56,.45);transition:background .25s,color .25s}
.rappel-tab:hover{background:var(--clay-dk);color:#fff}
.rappel.open .rappel-tab{background:var(--clay-dk);color:#fff}
.rappel-tab svg{width:21px;height:21px;stroke:currentColor;fill:none}
.rappel-tab-txt{writing-mode:vertical-rl;transform:rotate(180deg);font-family:var(--serif);
  font-weight:700;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase}
/* Tiroir : l'onglet (bouton) reste collé à GAUCHE du panneau ; l'ensemble
   glisse de droite à gauche à l'ouverture (translateX sur .rappel). */
.rappel-panel{position:relative;flex-shrink:0;box-sizing:border-box;
  width:340px;max-width:calc(100vw - 56px);background:#fff;border:1px solid var(--line);border-radius:12px 0 0 12px;
  box-shadow:0 26px 64px -16px rgba(15,30,56,.5);padding:22px 20px;
  opacity:0;visibility:hidden;pointer-events:none;transition:opacity .35s,visibility .45s}
.rappel.open .rappel-panel{opacity:1;visibility:visible;pointer-events:auto}
.rappel-close{position:absolute;top:10px;right:12px;font-size:1.3rem;line-height:1;color:var(--mute);
  width:30px;height:30px;border-radius:50%;display:grid;place-items:center;cursor:pointer;transition:background .25s,color .25s}
.rappel-close:hover{background:var(--paper-2,#f3efe6);color:var(--navy)}
.rappel-panel-head{display:flex;align-items:center;gap:12px;margin-bottom:16px;padding-right:22px}
.rappel-ico{width:42px;height:42px;flex-shrink:0;display:grid;place-items:center;border-radius:50%;background:rgba(199,162,76,.14)}
.rappel-ico svg{width:20px;height:20px;stroke:var(--clay-dk);fill:none}
.rappel-panel-titles{display:flex;flex-direction:column;gap:2px}
.rappel-panel-titles strong{font-family:var(--serif);font-size:1rem;color:var(--navy);line-height:1.2}
.rappel-panel-titles span{font-size:.78rem;color:var(--mute)}
.rappel-form{display:flex;flex-direction:column;gap:9px}
.rappel-form input{padding:12px 14px;border:1px solid var(--line-2);border-radius:4px;font-size:.92rem;
  font-family:var(--sans);color:var(--ink)}
.rappel-form input:focus{outline:none;border-color:var(--clay)}
.rappel-form .btn{justify-content:center;margin-top:2px}
.rappel-feedback{margin-top:12px;font-size:.86rem;font-weight:600;text-align:center}
.rappel-feedback.ok{color:#1c7c4a}
.rappel-feedback.error{color:#c0392b}
.rappel-hours{display:block;margin-top:14px;font-size:.72rem;color:var(--mute);text-align:center;line-height:1.4}
@media(max-width:560px){
  .rappel{top:auto;bottom:150px;transform:none;display:block}
  .rappel.open{transform:none}
  .rappel-tab{padding:12px 7px}
  .rappel-panel{position:fixed;right:12px;left:12px;bottom:74px;top:auto;width:auto;max-width:none;
    border-radius:12px;transform:translateY(18px);transition:transform .42s var(--ease),opacity .35s,visibility .45s}
  .rappel.open .rappel-panel{transform:translateY(0)}
}
.mobile-bar{display:none}

/* ── Reveal ───────────────────────────────────────────────── */
.reveal{opacity:0;transform:translateY(30px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.reveal.visible{opacity:1;transform:none}
.reveal-scale{opacity:0;transform:scale(.95);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.reveal-scale.visible{opacity:1;transform:none}
.reveal-d1{transition-delay:.1s}.reveal-d2{transition-delay:.2s}.reveal-d3{transition-delay:.3s}.reveal-d4{transition-delay:.4s}

/* ── Breadcrumb ───────────────────────────────────────────── */
.breadcrumb{display:flex;gap:10px;font-size:.8rem;color:var(--mute);align-items:center;flex-wrap:wrap;font-family:var(--serif);letter-spacing:.04em}
.breadcrumb li{display:flex;align-items:center;gap:10px}
.breadcrumb li:not(:last-child)::after{content:"›";color:var(--line-2)}
.breadcrumb a:hover{color:var(--clay-dk)}

/* ── Page head ────────────────────────────────────────────── */
.page-head{padding:140px 0 40px;background:var(--paper)}
/* ── Liste des biens : hauteur d'en-tête resserrée ──────────────────
   470px séparaient le haut de page de la première annonce, dont ~110px de
   marges creuses autour de la barre de résultats et du bas d'en-tête. Sur cette
   page, ce sont les biens qui doivent accrocher l'œil, pas le titre : on garde
   le H1 (il porte le référencement de la page) mais on comprime tout l'espace
   qui l'entoure. Le padding haut reste calé sur l'en-tête fixe (126px). */
/* padding-top = hauteur exacte de l'en-tête fixe : le bloc de recherche vient
   se coller dessous, sans bande de vide entre les deux. */
.page-acheter .page-head{padding:126px 0 14px}
/* Fil d'Ariane masqué : « Accueil › Nos biens » double l'onglet actif du menu
   et coûtait 39px de haut de page. Le balisage BreadcrumbList reste dans le
   JSON-LD, donc Google garde le fil dans ses résultats. Le mobile le masquait
   déjà — on aligne simplement toutes les largeurs. */
.page-acheter .page-head .breadcrumb{display:none}
/* Le H1 vit sur la ligne « N biens disponibles », en surtitre : il reste le
   titre que Google lit sur la page la plus stratégique du site, mais il ne
   consomme plus de ligne au-dessus des annonces. Il s'efface avant les outils
   de droite quand la place manque (min-width:0 + ellipse). */
.page-acheter .results-bar .acheter-h1{
  font-size:.72rem;font-weight:600;letter-spacing:.22em;line-height:1.4;
  color:var(--navy);display:inline-flex;align-items:center;gap:12px;
  margin:0;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.page-acheter .results-bar .acheter-h1::before{content:"";width:26px;height:2px;background:var(--clay);flex:none}
.page-acheter .results-bar .acheter-h1 span{color:var(--clay-dk)}
.page-acheter .results-bar #results-count{flex:none}
.page-acheter .results-tools{margin-left:auto}
.page-acheter .page-head-search{padding-bottom:0}
.page-acheter .results-bar{margin:16px 0 16px}

/* Barre de recherche collante sur tablette : en paysage le budget vertical est
   de 768px seulement. Plutôt que d'immobiliser la recherche en haut de page et
   d'obliger à remonter pour affiner, elle suit le défilement sous l'en-tête. */
@media (min-width:761px) and (max-width:1180px){
  /* Le décalage haut doit valoir la hauteur RÉELLE de l'en-tête fixe, qui n'est
     pas la même de part et d'autre de la bascule burger : 101px avec la nav
     complète (941-1180), 127px avec le burger (761-940). Une valeur unique de
     100px laissait la barre de recherche passer 27px derrière le menu.
     Pas de position:sticky ici : l'élément porte lui-même le décalage, or un
     sticky dont la position naturelle est au-dessus de son `top` se DÉPLACE
     vers le bas au repos — la barre se retrouvait 130px trop basse. */
  .page-acheter .page-head{padding-top:131px}
  .page-acheter .page-head-search .search-zone{margin-bottom:0}
}
@media (min-width:941px) and (max-width:1180px){
  .page-acheter .page-head{padding-top:105px}
}

/* En-tête avec photo + dégradé (pages L'agence, Vendre…) */
.page-head.page-head--photo{position:relative;background-color:var(--navy);background-size:cover;background-position:center 38%;
  padding-top:clamp(130px,15vw,168px);padding-bottom:clamp(44px,6vw,64px);color:#fff}
.page-head--photo .breadcrumb a,.page-head--photo .breadcrumb li{color:rgba(255,255,255,.72)}
.page-head--photo .breadcrumb a:hover{color:#fff}
.page-head--photo .eyebrow{color:var(--clay-soft)}
.page-head--photo .eyebrow::before{background:var(--clay-soft)}
.page-head.page-head--photo .ph-title{color:#fff}
.page-head--photo .ph-title em{color:var(--clay-soft)}
.page-head.page-head--photo .ph-sub{color:rgba(255,255,255,.82)}
.page-head--photo .btn-clay{box-shadow:0 12px 30px -12px rgba(199,162,76,.7)}
.page-head .ph-title{font-family:var(--serif);font-size:clamp(2.2rem,5vw,3.8rem);font-weight:800;
  text-transform:uppercase;line-height:1.05;letter-spacing:-.01em;color:var(--navy)}
.page-head .ph-title em{font-style:normal;color:var(--clay-dk)}
.page-head .ph-sub{font-size:1.04rem;color:var(--ink-2);margin-top:16px;max-width:58ch}

/* ── Search panel ─────────────────────────────────────────── */
.search-panel{background:var(--white);border:1px solid var(--line);border-radius:6px;padding:22px;margin-top:36px;box-shadow:var(--shadow-sm)}
.search-row{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.search-field{position:relative;flex:1;min-width:180px}
.search-field svg{position:absolute;left:16px;top:50%;transform:translateY(-50%);width:18px;height:18px;stroke:var(--mute);fill:none;stroke-width:2;pointer-events:none}
.search-field input,.search-field select{width:100%;border:1px solid var(--line);background:var(--paper);border-radius:3px;
  padding:14px 18px 14px 46px;font-family:var(--sans);font-size:.9rem;color:var(--ink);transition:border-color .3s}
.search-field select{appearance:none;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23C7A24C' stroke-width='2.5'%3E%3Cpolyline points='2 4 6 8 10 4'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 16px center}
.search-field input:focus,.search-field select:focus{outline:none;border-color:var(--clay)}
.adv-btn{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);background:var(--paper);border-radius:3px;
  padding:14px 22px;font-family:var(--serif);font-size:.76rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--navy);transition:border-color .3s,color .3s}
.adv-btn svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;transition:transform .3s}
.adv-btn.active{border-color:var(--clay);color:var(--clay-dk)}
.adv-btn.active svg{transform:rotate(180deg)}
.search-adv{max-height:0;overflow:hidden;transition:max-height .5s var(--ease),margin .4s,opacity .4s;opacity:0}
.search-adv.open{max-height:340px;margin-top:20px;opacity:1}
.search-adv-inner{display:flex;gap:26px;flex-wrap:wrap;padding-top:20px;border-top:1px solid var(--line)}
.adv-group{display:flex;flex-direction:column;gap:10px}
.adv-group label{font-family:var(--serif);font-size:.72rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--mute)}
.adv-group input,.adv-group select{border:1px solid var(--line);background:var(--paper);border-radius:3px;padding:11px 18px;font-family:var(--sans);font-size:.88rem;min-width:170px}
.seg{display:flex;gap:8px;flex-wrap:wrap}
.seg-btn{border:1px solid var(--line);background:var(--paper);border-radius:3px;padding:10px 18px;font-size:.84rem;font-weight:500;transition:all .3s}
.seg-btn:hover{border-color:var(--clay)}
.seg-btn.active{background:var(--clay);color:var(--navy);border-color:var(--clay)}

/* results bar */
.results-bar{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;margin:34px 0 30px}
#results-count{font-size:1rem;color:var(--ink-2)}
#results-count strong{font-family:var(--serif);font-size:1.4rem;font-weight:800;color:var(--clay-dk)}
.results-tools{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.fav-filter{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);background:var(--white);border-radius:3px;
  padding:11px 18px;font-family:var(--serif);font-size:.74rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;transition:all .3s}
.fav-filter svg{width:16px;height:16px;fill:none;stroke:var(--navy);stroke-width:2}
.fav-filter.active{background:var(--clay);color:var(--navy);border-color:var(--clay)}
.fav-filter.active svg{fill:var(--navy);stroke:var(--navy)}
.view-toggle{display:flex;border:1px solid var(--line);border-radius:3px;overflow:hidden;background:var(--white)}
.view-btn{padding:11px 14px;display:grid;place-items:center;transition:background .3s}
.view-btn svg{width:18px;height:18px;stroke:var(--navy);fill:none;stroke-width:2}
.view-btn.active{background:var(--navy)}
.view-btn.active svg{stroke:#fff}
.active-chips{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:24px}
.chip{display:inline-flex;align-items:center;gap:8px;background:var(--cream);border:1px solid var(--line);border-radius:3px;
  padding:8px 14px;font-size:.82rem;text-transform:capitalize;transition:border-color .3s}
.chip:hover{border-color:var(--clay)}
.chip span{color:var(--clay-dk);font-weight:700}
.empty-state{grid-column:1/-1;text-align:center;padding:80px 20px;color:var(--mute)}
.empty-state svg{width:60px;height:60px;stroke:var(--line-2);fill:none;stroke-width:1.5;margin:0 auto 18px}
.empty-state h3{font-family:var(--serif);font-size:1.4rem;font-weight:700;text-transform:uppercase;color:var(--navy);margin-bottom:8px}

/* Alerte « Être prévenu » + « Appelez-nous » (0 résultat) */
.alerte-wrap{grid-column:1/-1;max-width:920px;margin:0 auto;text-align:center}
.alerte-empty-ico{width:56px;height:56px;stroke:var(--line-2);fill:none;stroke-width:1.5;margin:0 auto 16px}
.alerte-empty-title{font-family:var(--serif);font-size:1.5rem;font-weight:700;color:var(--navy);margin-bottom:16px}
.alerte-criteres{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-bottom:30px}
.alerte-crit{font-size:.8rem;font-weight:600;color:var(--navy);background:var(--paper-2,#f3efe6);
  border:1px solid var(--line);border-radius:999px;padding:6px 13px}
.alerte-crit--all{color:var(--mute)}
.alerte-cols{display:grid;grid-template-columns:1fr 1fr;gap:24px;text-align:center}
@media(max-width:760px){.alerte-cols{grid-template-columns:1fr}}
.alerte-box{display:flex;flex-direction:column;align-items:center;padding:34px 28px;
  background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow-sm)}
.alerte-box--call{background:var(--navy);border-color:var(--navy);color:#fff}
.alerte-ico{width:52px;height:52px;margin:0 auto 16px;display:grid;place-items:center;border-radius:50%;
  background:rgba(199,162,76,.14)}
.alerte-ico svg{width:25px;height:25px;stroke:var(--clay-dk);fill:none;stroke-width:1.7}
.alerte-box--call .alerte-ico{background:rgba(255,255,255,.1)}
.alerte-box--call .alerte-ico svg{stroke:var(--clay-soft)}
.alerte-box h4{font-family:var(--serif);font-size:1.12rem;font-weight:700;color:var(--navy);line-height:1.3;margin-bottom:10px}
.alerte-box--call h4{color:#fff}
.alerte-box>p{color:var(--mute);font-size:.92rem;line-height:1.6;margin:0 0 20px}
.alerte-box--call>p{color:rgba(255,255,255,.78)}
.alerte-form{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;width:100%}
.alerte-form input[type=email]{flex:1;min-width:180px;padding:13px 16px;border:1px solid var(--line-2);
  border-radius:4px;font-size:.95rem;font-family:var(--sans);color:var(--ink)}
.alerte-form input[type=email]:focus{outline:none;border-color:var(--clay)}
.alerte-form .btn{white-space:nowrap}
.alerte-rgpd{display:flex;align-items:flex-start;gap:8px;margin:12px 0 0;font-size:.76rem;color:var(--mute);text-align:left;line-height:1.4}
.alerte-rgpd input{width:15px;height:15px;margin-top:2px;accent-color:var(--clay);flex-shrink:0}
.alerte-feedback{margin-top:16px;font-size:.92rem;font-weight:600}
.alerte-feedback.ok{color:#1c7c4a}
.alerte-box--call .alerte-feedback.ok{color:var(--clay-soft)}
.alerte-feedback.error{color:#c0392b}
/* Boutons identiques : icône + libellé centrés en un seul groupe.
   Même typo que le bouton téléphone du header (.nav-cta-num). */
.alerte-call-btn,.alerte-rappel-btn{display:flex;align-items:center;justify-content:center;gap:12px;
  width:min(280px,100%);padding:15px 24px;
  font-family:'Space Grotesk',var(--sans);font-size:1.05rem;font-weight:600;
  letter-spacing:.01em;text-transform:none}
.alerte-rappel-btn{margin-top:10px}
.alerte-call-btn svg,.alerte-rappel-btn svg{width:22px;height:22px;margin:0;stroke:currentColor;fill:none;flex-shrink:0}
.alerte-call-num{margin-top:auto;margin-bottom:14px;font-family:var(--serif);font-weight:700;font-size:1.15rem;color:var(--clay-soft)}

/* ── Carte des zones (Leaflet) ────────────────────────────── */
/* Carte des zones — panneau dépliable déclenché par le bouton « Carte » */
.map-btn svg{transition:transform .3s}
.map-btn.active{border-color:var(--clay);color:var(--clay-dk)}
/* Carte des zones — popup (modal) */
.zmap-modal{position:fixed;inset:0;z-index:9998;display:none;align-items:center;justify-content:center;padding:24px}
.zmap-modal.open{display:flex}
.zmap-backdrop{position:absolute;inset:0;background:rgba(10,20,38,.62);backdrop-filter:blur(3px)}
.zmap-dialog{position:relative;z-index:1;width:min(880px,96vw);max-height:92vh;display:flex;flex-direction:column;
  background:var(--paper);border-radius:10px;overflow:hidden;box-shadow:0 30px 80px -20px rgba(10,20,38,.6);
  animation:zmapIn .35s var(--ease)}
@keyframes zmapIn{from{opacity:0;transform:translateY(16px) scale(.985)}to{opacity:1;transform:none}}
.zmap-dialog-head{display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:15px 20px;border-bottom:1px solid var(--line);background:#fff}
.zmap-dialog-head span{font-family:var(--serif);font-weight:600;font-size:.95rem;color:var(--navy)}
.zmap-close{font-size:1.25rem;line-height:1;color:var(--navy);width:38px;height:38px;border-radius:50%;
  display:grid;place-items:center;flex-shrink:0;transition:background .3s}
.zmap-close:hover{background:rgba(15,30,56,.08)}
#zone-map-canvas{width:100%;flex:1;min-height:clamp(360px,62vh,600px);
  background:linear-gradient(160deg,#eef1ee,#e3e8e3)}
body.no-scroll{overflow:hidden}
/* Pastille de confirmation après clic d'une zone (la carte a zoomé dessus) */
.zmap-confirm{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);z-index:1000;
  display:flex;align-items:center;gap:10px;max-width:calc(100% - 28px);
  background:#fff;border:1px solid var(--line);border-radius:30px;padding:8px;
  box-shadow:0 12px 32px -10px rgba(14,42,71,.32);animation:zmapIn .25s var(--ease)}
.zmap-confirm[hidden]{display:none}
.zmap-confirm-cp{font-weight:700;color:#fff;background:var(--navy);border-radius:20px;padding:5px 12px;font-size:.8rem;white-space:nowrap}
.zmap-confirm-nm{font-size:.9rem;color:var(--navy);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-left:2px}
.zmap-confirm-go{background:var(--clay);color:var(--navy);font-weight:700;font-size:.82rem;border-radius:20px;padding:8px 16px;white-space:nowrap;transition:background .25s,color .25s}
.zmap-confirm-go:hover{background:var(--navy);color:#fff}
.zmap-confirm-x{appearance:none;border:none;background:#f1f0ec;color:var(--mute);width:30px;height:30px;border-radius:50%;cursor:pointer;font-size:15px;line-height:1;flex:none;transition:background .25s}
.zmap-confirm-x:hover{background:#e6e4df;color:var(--navy)}

/* Bandeau « zone sélectionnée » dans le listing */
.zone-active{display:flex;align-items:stretch;gap:18px;margin:0 0 24px;padding:14px;
  background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 10px 28px -18px rgba(10,20,38,.4)}
.zone-active[hidden]{display:none}
.zone-mini-map{width:170px;height:124px;flex-shrink:0;border-radius:7px;overflow:hidden;
  background:linear-gradient(160deg,#eef1ee,#e3e8e3);border:1px solid var(--line)}
.zone-active-body{display:flex;flex-direction:column;justify-content:center;gap:5px;min-width:0}
.zone-active-eyebrow{font-size:.72rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--clay-dk)}
.zone-active-name{font-family:var(--serif);font-size:1.3rem;font-weight:700;color:var(--navy);line-height:1.1}
.zone-active-cp{font-size:.82rem;font-weight:600;letter-spacing:.04em;color:var(--mute);margin-top:1px}
.zone-active-cp:empty{display:none}
.zone-active-clear{align-self:flex-start;margin-top:5px;font-size:.82rem;font-weight:600;color:var(--navy);
  border:1px solid var(--line);border-radius:999px;padding:7px 15px;transition:background .25s,border-color .25s,color .25s}
.zone-active-clear:hover{background:var(--navy);color:#fff;border-color:var(--navy)}
@media(max-width:560px){.zone-active{gap:14px}.zone-mini-map{width:108px;height:96px}.zone-active-name{font-size:1.08rem}}

/* Zone active à gauche du bloc de recherche → la recherche rétrécit quand le bloc est présent */
.search-zone{display:flex;gap:18px;align-items:stretch}
.search-zone .search-panel{flex:1;min-width:0;margin-top:0}
.search-zone .zone-active{flex:0 0 350px;margin:0;padding:12px;align-items:center}
.search-zone .zone-mini-map{width:150px;height:124px}
.search-zone .zone-active-body{gap:3px}
.search-zone .zone-active-name{font-size:1.1rem}
.search-zone .zone-active-clear{margin-top:3px;padding:5px 12px;font-size:.76rem}
@media(max-width:900px){
  .search-zone{flex-direction:column-reverse;gap:14px}
  .search-zone .zone-active{flex:1 1 auto}
}
.leaflet-container{font-family:var(--sans)}
/* étiquettes des communes (divIcons Leaflet) */
.zlab-ico{overflow:visible;background:none;border:none}
.zlab{position:absolute;transform:translate(-50%,-50%);white-space:nowrap;text-align:center;pointer-events:none;
  display:flex;flex-direction:column;align-items:center;gap:1px;line-height:1;
  text-shadow:0 1px 2px rgba(255,255,255,.85),0 0 3px rgba(255,255,255,.7)}
.zlab b{font-size:12px;font-weight:700;color:#0F1E38;letter-spacing:.2px}
.zlab .nm{font-size:10.5px;font-weight:600;color:#33414f}
.zlab.sec b{color:#54606c}
.lbl-hide .zlab{display:none}
.lbl-compact .zlab .nm{display:none}
.zone-map-bien{height:340px;border:1px solid var(--line);border-radius:6px;overflow:hidden;
  background:linear-gradient(160deg,#eef1ee,#e3e8e3)}
#zone-map-bien-canvas{width:100%;height:100%}

/* ── BIEN : page affiche ──────────────────────────────────── */
.page-bien{background:var(--paper)}
.bien-section{padding:6px 0 90px;background:var(--paper)}
.poster-head{text-align:center;padding:0 0 8px}
.poster-label{font-family:var(--serif);font-size:.68rem;font-weight:600;letter-spacing:.26em;text-transform:uppercase;color:var(--clay-dk);margin-bottom:2px}
.poster-title{font-family:var(--serif);font-size:clamp(1.2rem,2.2vw,1.7rem);font-weight:800;text-transform:uppercase;line-height:1.05;letter-spacing:-.01em;color:var(--navy);margin:0}
.poster-sub{font-size:.86rem;color:var(--ink-2);margin-top:3px}
.poster-divider{width:48px;height:3px;background:var(--clay);margin:6px auto 0}

.pv-gallery{display:grid;grid-template-columns:minmax(0,1fr) clamp(120px,15vw,184px);gap:14px;margin-bottom:42px;align-items:stretch}
.pv-main{position:relative;overflow:hidden;cursor:pointer;background:var(--paper-2);width:100%;min-height:280px;max-height:calc(100vh - 140px);border-radius:10px}
.pv-main-img{display:block;width:100%;height:auto;max-height:calc(100vh - 140px);object-fit:contain;transition:opacity .3s,transform 1.3s var(--ease)}
.pv-main:hover .pv-main-img{transform:scale(1.05)}
/* Prix en incrustation sur la photo — mobile uniquement (règle d'affichage
   plus bas). Sur desktop c'est la carte prix de la colonne de droite qui joue
   ce rôle, à hauteur d'œil ; en mobile elle tombe à ~660px du haut de page. */
.pv-price-badge{display:none;position:absolute;left:0;bottom:0;z-index:4;
  background:var(--clay);color:var(--navy);
  font-family:var(--serif);font-size:1.35rem;font-weight:800;letter-spacing:-.01em;
  padding:11px 22px;border-radius:0 5px 0 12px;
  box-shadow:0 -6px 18px -8px rgba(5,12,28,.5)}

/* Vidéo intégrée comme slide du carousel (remplit le cadre 16/9 de .pv-main) */
.pv-main-video{position:absolute;inset:0;background:#000;display:flex;align-items:center;justify-content:center;overflow:hidden;cursor:default}
.pv-main-video[hidden]{display:none}
.pv-main:hover .pv-main-video{cursor:default}
.pv-video{width:100%;height:100%;object-fit:contain;background:#000;display:block}
/* Sur une slide vidéo : masquer les overlays qui recouvrent les contrôles du lecteur */
.pv-gallery.pv-showing-video .pv-counter,
.pv-gallery.pv-showing-video .pv-expand{display:none}
.pv-gallery.pv-showing-video .pv-main{cursor:default}
.pv-main-video .bien-video-embed{position:relative;inset:auto;height:100%;width:100%;max-width:100%;aspect-ratio:auto;border-radius:0;margin:0}
.pv-main-video .bien-video-embed.bvs-facebook,.pv-main-video .bien-video-embed.bvs-instagram{width:auto;aspect-ratio:9/16}
.pv-main-video .pv-embed-link{color:#fff;font-weight:700;text-decoration:underline}
/* Façade Facebook (le Reel n'est pas embarquable → on ouvre le post) */
.pv-social-facade{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-decoration:none;color:#fff;background-size:cover;background-position:center}
.pv-social-facade::before{content:"";position:absolute;inset:0;background:rgba(11,21,36,.55)}
.pv-social-facade .psf-play{position:relative;width:62px;height:62px;border-radius:50%;background:#1877f2;color:#fff;display:grid;place-items:center;font-size:24px;padding-left:4px}
.pv-social-facade .psf-txt{position:relative;font-weight:800;font-size:1rem;text-align:center;padding:0 16px}
/* Vignette « vidéo » dans la bande latérale */
.pv-thumb-video .pv-vid-badge{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(11,21,36,.4)}
.pv-thumb-video .pv-vid-badge::after{content:"▶";font-size:13px;color:var(--navy);background:rgba(255,255,255,.92);width:30px;height:30px;border-radius:50%;display:grid;place-items:center;padding-left:2px}
.pv-nav{position:absolute;top:50%;transform:translateY(-50%);width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.92);display:grid;place-items:center;z-index:3;transition:background .3s,transform .3s}
.pv-nav:hover{background:#fff;transform:translateY(-50%) scale(1.08)}
.pv-prev{left:18px}.pv-next{right:18px}
.pv-nav svg{width:20px;height:20px;stroke:var(--navy);fill:none;stroke-width:2.5}
.pv-counter{position:absolute;bottom:18px;left:18px;background:rgba(15,30,56,.85);color:#fff;padding:7px 16px;font-size:.82rem;font-weight:500;z-index:3}
.pv-expand{position:absolute;bottom:18px;right:18px;background:rgba(15,30,56,.85);color:#fff;padding:9px 16px;font-family:var(--serif);font-size:.72rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;display:flex;align-items:center;gap:8px;z-index:3;transition:background .3s}
.pv-expand:hover{background:var(--clay);color:var(--navy)}
.pv-expand svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2}
.pv-strip{display:flex;flex-direction:column;gap:12px;overflow-y:auto;max-height:72vh;padding-right:4px;scrollbar-width:thin;scrollbar-color:var(--line-2) transparent}
.pv-strip::-webkit-scrollbar{width:6px}
.pv-strip::-webkit-scrollbar-thumb{background:var(--line-2);border-radius:3px}
.pv-thumb{position:relative;flex:0 0 auto;width:100%;aspect-ratio:4/3;overflow:hidden;cursor:pointer;background:var(--paper-2);border-radius:8px;opacity:.7;transition:opacity .3s}
.pv-thumb:hover,.pv-thumb.active{opacity:1}
.pv-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.pv-thumb:hover img{transform:scale(1.07)}
.pv-thumb.active{outline:2px solid var(--clay);outline-offset:-2px;border-radius:8px}
.pv-more-overlay{position:absolute;inset:0;background:rgba(10,20,38,.66);color:#fff;display:grid;place-items:center;font-family:var(--serif);font-size:1.4rem;font-weight:800}
@media (max-width:680px){
  .pv-gallery{grid-template-columns:1fr}
  .pv-main{min-height:0;max-height:none}
  .pv-strip{flex-direction:row;overflow-x:auto;overflow-y:hidden;max-height:none;padding-right:0;padding-bottom:4px}
  .pv-thumb{flex:0 0 108px;width:auto}
}

.lightbox{position:fixed;inset:0;z-index:10060;background:#070D18;display:none;flex-direction:column}
.lightbox.open{display:flex}
.lightbox-bar{display:flex;align-items:center;justify-content:space-between;padding:18px 26px;flex-shrink:0}
.lightbox-counter{font-family:var(--serif);color:#fff;font-size:.84rem;font-weight:600;letter-spacing:.12em;background:rgba(255,255,255,.1);padding:7px 16px;border-radius:2px}
.lightbox-counter .lb-cur{color:var(--clay)}
.lightbox-close{font-size:1.7rem;color:#fff;width:44px;height:44px;display:grid;place-items:center;border-radius:50%;transition:background .3s}
.lightbox-close:hover{background:rgba(255,255,255,.14)}
.lightbox-stage{position:relative;flex:1;display:flex;align-items:center;justify-content:center;min-height:0;padding:0 80px}
.lightbox-img{max-width:100%;max-height:100%;object-fit:contain;border-radius:4px}
.lightbox-prev,.lightbox-next{position:absolute;top:50%;transform:translateY(-50%);width:52px;height:52px;border-radius:50%;background:rgba(255,255,255,.12);display:grid;place-items:center;transition:background .3s;z-index:2}
.lightbox-prev:hover,.lightbox-next:hover{background:var(--clay)}
.lightbox-prev{left:24px}.lightbox-next{right:24px}
.lightbox-prev svg,.lightbox-next svg{width:24px;height:24px;stroke:#fff;fill:none;stroke-width:2.5}
.lightbox-prev:hover svg,.lightbox-next:hover svg{stroke:var(--navy)}
.lightbox-thumbs{display:flex;gap:8px;overflow-x:auto;padding:14px 26px 22px;flex-shrink:0;justify-content:center;scrollbar-width:thin}
.lightbox-thumbs img{width:88px;height:62px;object-fit:cover;border-radius:4px;opacity:.45;cursor:pointer;border:2px solid transparent;transition:opacity .3s,border-color .3s;flex-shrink:0}
.lightbox-thumbs img:hover{opacity:.85}
.lightbox-thumbs img.active{opacity:1;border-color:var(--clay)}
/* ── Visionneuse en tactile : la photo d'abord ─────────────────────
   Le cadre mangeait l'écran — 54px de marge de chaque côté pour loger les
   flèches (29% de la largeur d'un téléphone), plus 160px de barres haute et
   basse. Sur un site immobilier, la photo EST le contenu : on la laisse aller
   bord à bord et on fait flotter les commandes par-dessus. Le glissé du doigt
   est déjà géré par le script, les flèches ne sont qu'un appoint. */
@media (max-width:940px) and (hover:none){
  .lightbox-stage{padding:0}
  .lightbox-img{max-width:100%;max-height:100%;border-radius:0}

  /* Barre du haut posée SUR la photo plutôt qu'au-dessus */
  .lightbox-bar{position:absolute;top:0;left:0;right:0;z-index:3;padding:12px 14px;
    background:linear-gradient(to bottom,rgba(7,13,24,.62),transparent);pointer-events:none}
  .lightbox-bar > *{pointer-events:auto}
  .lightbox-counter{font-size:.78rem;padding:5px 12px}

  /* Flèches en incrustation, translucides : elles ne prennent plus de place */
  .lightbox-prev,.lightbox-next{width:44px;height:44px;background:rgba(7,13,24,.42);
    backdrop-filter:blur(2px)}
  .lightbox-prev{left:8px}.lightbox-next{right:8px}
  .lightbox-prev svg,.lightbox-next svg{width:20px;height:20px}

  /* Pellicule allégée, alignée à gauche pour rester défilable au doigt */
  .lightbox-thumbs{padding:8px 12px 12px;gap:6px;justify-content:flex-start;
    scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch}
  .lightbox-thumbs img{width:56px;height:40px;scroll-snap-align:center}
}

/* Téléphone à l'horizontale : la hauteur devient la ressource rare (~375px).
   La pellicule et la barre y coûtaient 160px, soit 43% de l'écran, pour une
   photo réduite à une bande. On efface tout sauf la photo. */
@media (orientation:landscape) and (max-height:560px) and (hover:none){
  .lightbox-thumbs{display:none}
  .lightbox-bar{padding:8px 12px;background:linear-gradient(to bottom,rgba(7,13,24,.55),transparent)}
  .lightbox-stage{padding:0}
  .lightbox-img{max-height:100vh;border-radius:0}
  .lightbox-prev,.lightbox-next{width:40px;height:40px}
}

@media(max-width:680px){.lightbox-thumbs img{width:56px;height:40px}}

/* specs bar (affiche) */
.bien-specs{display:flex;gap:0;flex-wrap:wrap;margin-bottom:34px;background:var(--white);border:1px solid var(--line);border-radius:5px;overflow:hidden}
.spec-box{padding:22px 28px;text-align:center;flex:1;min-width:120px;border-right:1px solid var(--line);display:flex;flex-direction:column;align-items:center;gap:4px}
.spec-box:last-child{border-right:none}
.spec-val{font-family:var(--serif);font-size:1.5rem;font-weight:800;color:var(--navy);line-height:1}
.spec-lbl{font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:var(--mute)}
.bien-layout{display:grid;grid-template-columns:1fr 360px;gap:40px;align-items:start}
.detail-card{background:var(--white);border:1px solid var(--line);border-radius:5px;padding:34px;margin-bottom:24px}
/* Carte Google de localisation (page contact) */
.contact-map-card{padding:0;overflow:hidden}
#contact-map{width:100%;height:300px;background:linear-gradient(160deg,#eef1ee,#e3e8e3)}
.contact-pin span{display:block;width:22px;height:22px;border-radius:50% 50% 50% 0;
  background:var(--clay);border:2px solid #fff;transform:rotate(-45deg);box-shadow:0 4px 10px -2px rgba(15,30,56,.5)}
#contact-map.contact-map-off{display:flex;align-items:center;justify-content:center;text-align:center}
.contact-map-fallback{display:flex;flex-direction:column;gap:6px;padding:28px}
.contact-map-fallback strong{font-family:var(--serif);font-size:1.1rem;color:var(--navy)}
.contact-map-fallback span{font-size:.88rem;color:var(--mute)}
.contact-map-fallback a{margin-top:6px;font-weight:600;font-size:.9rem;color:var(--clay-dk)}
.contact-map-dir{display:flex;align-items:center;justify-content:center;gap:9px;
  padding:15px;font-family:var(--serif);font-weight:600;font-size:.92rem;letter-spacing:.02em;
  color:var(--navy);background:#fff;border-top:1px solid var(--line);transition:background .25s,color .25s}
.contact-map-dir svg{width:18px;height:18px;flex-shrink:0}
.contact-map-dir:hover{background:var(--navy);color:#fff}
.detail-card-title{font-family:var(--serif);font-size:1.3rem;font-weight:700;text-transform:uppercase;letter-spacing:.01em;margin-bottom:20px;padding-bottom:16px;border-bottom:2px solid var(--clay);color:var(--navy);display:inline-block}
.bien-desc{font-size:1.02rem;color:var(--ink-2);line-height:1.85}
.detail-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.detail-item{display:flex;align-items:center;gap:14px}
.detail-ic{width:46px;height:46px;border-radius:50%;background:var(--paper-2);display:grid;place-items:center;flex-shrink:0}
.detail-ic svg{width:22px;height:22px;stroke:var(--clay-dk);fill:none;stroke-width:1.6}
.detail-val{display:block;font-weight:600;font-size:.98rem;color:var(--navy)}
.detail-lbl{font-size:.8rem;color:var(--mute)}
.bien-sidebar{position:sticky;top:100px;display:flex;flex-direction:column;gap:20px}
.price-card{background:var(--navy);color:#fff;border-radius:5px;padding:32px;border-top:3px solid var(--clay)}
.price-label{font-family:var(--serif);font-size:.72rem;text-transform:uppercase;letter-spacing:.14em;color:var(--clay-soft)}
.price-value{font-family:var(--serif);font-size:2.4rem;font-weight:800;margin:8px 0 4px;line-height:1}
.price-note{font-size:.82rem;color:rgba(255,255,255,.6);display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.price-hono-btn{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;
  background:transparent;border:1px solid rgba(233,196,106,.4);color:var(--clay-soft);
  font-family:inherit;font-size:.76rem;font-weight:600;letter-spacing:.02em;cursor:pointer;transition:all .2s}
.price-hono-btn:hover{background:rgba(233,196,106,.14);border-color:rgba(233,196,106,.7);color:#fff}
.price-hono-btn svg{width:14px;height:14px;flex-shrink:0}
.price-ref{margin-top:14px;font-size:.8rem;color:rgba(255,255,255,.5);padding-top:14px;border-top:1px solid rgba(255,255,255,.14)}

/* Modale honoraires */
.hono-modal{position:fixed;inset:0;z-index:2000;display:flex;align-items:center;justify-content:center;padding:20px}
.hono-modal[hidden]{display:none}
.hono-modal-backdrop{position:absolute;inset:0;background:rgba(10,15,30,.6);backdrop-filter:blur(3px);animation:honoFade .25s ease}
.hono-modal-card{position:relative;background:var(--white);border-radius:8px;padding:clamp(26px,4vw,40px);
  max-width:640px;width:100%;max-height:88vh;overflow-y:auto;box-shadow:0 30px 80px rgba(10,15,30,.4);
  border-top:3px solid var(--clay);animation:honoRise .3s cubic-bezier(.2,.7,.3,1)}
.hono-modal-close{position:absolute;top:14px;right:16px;width:36px;height:36px;border:none;background:transparent;
  font-size:1.8rem;line-height:1;color:var(--mute);cursor:pointer;border-radius:50%;transition:all .2s}
.hono-modal-close:hover{background:var(--paper-2);color:var(--ink)}
.hono-modal-title{font-family:var(--serif);font-size:clamp(1.5rem,4vw,1.9rem);font-weight:500;color:var(--ink);margin:6px 0 12px}
.hono-modal-intro{color:var(--ink-2);font-size:.92rem;line-height:1.6;margin-bottom:22px}
.hono-modal .data-table td{color:var(--ink)}
.hono-modal .data-table th,.hono-modal .data-table td{padding:11px 16px;font-size:.86rem}
@keyframes honoFade{from{opacity:0}to{opacity:1}}
@keyframes honoRise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* Bouton « Simuler mon prêt » dans la carte prix */
.price-sim-btn{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;margin-top:16px;
  padding:12px 16px;border-radius:6px;cursor:pointer;font-family:inherit;font-size:.92rem;font-weight:700;
  letter-spacing:.01em;color:var(--navy);background:var(--clay-soft);border:1px solid var(--clay-soft);transition:all .2s}
.price-sim-btn:hover{background:#fff;border-color:#fff}
.price-sim-btn svg{width:18px;height:18px;flex-shrink:0}

/* ── Simulateur de prêt (modale) ─────────────────────── */
.sim-modal .hono-modal-card,.sim-card{max-width:720px}
.sim-form{display:grid;grid-template-columns:1fr 1fr;gap:20px 26px;margin-bottom:26px}
.sim-field-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.sim-field label{font-size:.9rem;font-weight:600;color:var(--ink)}
.sim-field label small{font-weight:500;color:var(--mute);font-size:.76rem}
.sim-num{display:inline-flex;align-items:center;gap:4px;background:var(--paper);border:1px solid var(--line);
  border-radius:6px;padding:6px 10px;min-width:0}
.sim-num input{width:82px;border:none;background:transparent;font-family:inherit;font-size:.98rem;font-weight:700;
  color:var(--navy);text-align:right;outline:none;padding:0}
.sim-num span{font-size:.82rem;font-weight:600;color:var(--mute)}
/* Sliders */
.sim-field input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:5px;border-radius:5px;
  background:var(--line-2);outline:none;cursor:pointer}
.sim-field input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;
  border-radius:50%;background:var(--clay);border:3px solid #fff;box-shadow:0 1px 5px rgba(10,20,38,.35);cursor:pointer}
.sim-field input[type=range]::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:var(--clay);
  border:3px solid #fff;box-shadow:0 1px 5px rgba(10,20,38,.35);cursor:pointer}
.sim-note{display:block;margin-top:7px;font-size:.74rem;color:var(--mute)}
.sim-note-reset{background:none;border:none;padding:0;font:inherit;font-size:.74rem;color:var(--clay-dk);
  text-decoration:underline;cursor:pointer}
.sim-note-reset:hover{color:var(--clay)}
/* Résultats */
.sim-results{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:8px;overflow:hidden;margin-bottom:26px}
.sim-result{background:var(--paper);padding:16px 18px;display:flex;flex-direction:column;gap:3px;justify-content:center}
.sim-result-main{background:var(--navy);color:#fff}
.sim-result-lbl{font-size:.76rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--mute)}
.sim-result-main .sim-result-lbl{color:var(--clay-soft)}
.sim-result-val{font-family:var(--serif);font-size:1.35rem;font-weight:700;color:var(--navy);line-height:1.1}
.sim-result-main .sim-result-val{color:#fff;font-size:1.7rem}
.sim-result-val small{font-size:.72rem;font-weight:600;color:inherit;opacity:.7}
.sim-result-sub{font-size:.76rem;color:rgba(255,255,255,.72);margin-top:2px}
.sim-disclaimer{font-size:.76rem;color:var(--mute);line-height:1.55;margin:22px 0 0}
.sim-cta{margin-top:18px}
.sim-cta .btn{width:100%;justify-content:center}
@media(max-width:560px){
  .sim-form{grid-template-columns:1fr;gap:16px}
  .sim-results{grid-template-columns:1fr}
}

.contact-card{background:var(--white);border:1px solid var(--line);border-radius:5px;overflow:hidden}
.cc-head{padding:28px;text-align:center;border-bottom:1px solid var(--line)}
.cc-head img{width:84px;height:84px;border-radius:50%;object-fit:cover;margin:0 auto 14px;border:2px solid var(--clay)}
.cc-name{font-family:var(--serif);font-size:1.15rem;font-weight:700;text-transform:uppercase;color:var(--navy)}
.cc-role{font-size:.82rem;color:var(--clay-dk);font-weight:600}
.cc-body{padding:24px;display:flex;flex-direction:column;gap:12px}
.cc-tel{display:flex;align-items:center;justify-content:center;gap:10px;background:var(--clay);color:var(--navy);border-radius:2px;padding:14px;font-family:var(--serif);font-weight:700;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;transition:background .3s}
.cc-tel:hover{background:var(--clay-dk);color:#fff}
.cc-tel svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2}
.sidebar-fav{width:100%;border:1.5px solid var(--line-2);background:var(--white);border-radius:2px;padding:13px;
  font-family:var(--serif);font-size:.74rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2);
  display:flex;align-items:center;justify-content:center;gap:9px;transition:border-color .3s,color .3s}
.sidebar-fav svg{stroke:var(--ink-2);transition:fill .3s,stroke .3s}
.sidebar-fav:hover,.sidebar-fav.is-fav{border-color:var(--clay);color:var(--clay-dk)}
.sidebar-fav.is-fav svg{fill:var(--clay);stroke:var(--clay)}
@media (max-width:920px){.bien-layout{grid-template-columns:1fr}.bien-sidebar{position:static}}

/* facts list (affiche : FAITS IMPORTANTS) */
.facts-list{display:grid;grid-template-columns:1fr 1fr;gap:12px 24px}
.fact{display:flex;align-items:center;gap:11px;font-size:.96rem;color:var(--ink)}
.fact svg{width:18px;height:18px;stroke:var(--clay-dk);fill:none;stroke-width:2.6;flex-shrink:0}

/* ── DPE ──────────────────────────────────────────────────── */
.dpe-A{background:#319a4f}.dpe-B{background:#52b153}.dpe-C{background:#a8d24f}
.dpe-D{background:#f3d000}.dpe-E{background:#f5b000}.dpe-F{background:#ec7c2c}.dpe-G{background:#d8332a}
.dpe-none{background:#9aa3b2}

/* ── Icône dans la barre de specs (fiche bien) ── */
.spec-ic{width:26px;height:26px;color:var(--clay-dk);margin-bottom:2px}

/* ── Carte DPE / GES ── */
.dpe-bands{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:560px){.dpe-bands{grid-template-columns:1fr}}
.dpe-band{display:flex;align-items:center;gap:12px;background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:12px 14px}
.dpe-band-cat{display:flex;flex-direction:column;flex:none;font-family:var(--serif);font-weight:800;font-size:.98rem;color:var(--navy);line-height:1}
.dpe-band-cat small{font-weight:600;font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;color:var(--mute);margin-top:3px}
.dpe-band-letter{flex:none;width:46px;height:46px;border-radius:8px;display:grid;place-items:center;font-family:var(--serif);font-weight:800;font-size:1.5rem;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.35)}
.dpe-band-val{font-size:.98rem;color:var(--ink-2);line-height:1.2}
.dpe-band-val b{display:inline-block;font-size:1.35rem;font-weight:800;color:var(--navy)}
.dpe-band-val small{color:var(--mute);font-size:.78rem}
.dpe-cost-line{margin-top:14px;font-size:.95rem;color:var(--ink-2)}
.dpe-cost-line b{color:var(--navy)}
.dpe-ref{color:var(--mute);font-size:.82rem}
.dpe-more-btn{margin-top:16px;display:inline-flex;align-items:center;gap:8px;background:var(--navy);color:#fff;border:0;border-radius:10px;padding:11px 18px;font-family:var(--serif);font-weight:700;font-size:.9rem;letter-spacing:.02em;cursor:pointer;transition:background .2s}
.dpe-more-btn:hover{background:var(--clay-dk)}
.dpe-more-btn svg{width:15px;height:15px}

/* ── Modal étiquette DPE ── */
.dpe-modal{position:fixed;inset:0;z-index:10050;display:none;align-items:flex-start;justify-content:center;background:rgba(11,21,36,.6);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);overflow-y:auto;padding:24px 14px}
.dpe-modal.open{display:flex}
.dpe-modal-box{background:#fff;border-radius:14px;max-width:720px;width:100%;margin:auto;overflow:hidden;box-shadow:0 30px 80px -20px rgba(0,0,0,.5)}
.dpe-modal-head{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#16a06a;color:#fff;padding:16px 20px}
.dpe-modal-head h3{margin:0;font-family:var(--serif);font-size:1.12rem;font-weight:800}
.dpe-modal-close{flex:none;background:rgba(255,255,255,.2);border:0;color:#fff;width:34px;height:34px;border-radius:50%;font-size:15px;cursor:pointer}
.dpe-modal-close:hover{background:rgba(255,255,255,.35)}
.dpe-modal-body{padding:22px}

.dpe-modal-box{max-width:760px}
.dpe-grid{display:grid;grid-template-columns:1fr .82fr;gap:22px;align-items:start}
.dpe-cap{font-size:.72rem;color:var(--mute);font-style:italic;line-height:1.3}
.dpe-cap-top{margin-bottom:6px}.dpe-cap-bot{margin-top:6px}

/* Colonne énergie : encadré valeurs + flèches A→G */
.dpe-energy-row{display:flex;gap:14px;align-items:center}
/* Encadré aligné verticalement sur la flèche de la classe active + trait de liaison */
.dpe-energy-row.has-active{display:block;position:relative;min-height:252px}
.dpe-energy-row.has-active .dpe-valbox{position:absolute;left:0}
.dpe-energy-row.has-active .dpe-arrows{padding-left:172px}
.dpe-connector{position:absolute;left:150px;width:22px;height:0;border-top:2px solid #1c2733;z-index:4}
.dpe-connector::after{content:'';position:absolute;right:-3px;top:-6px;border:6px solid transparent;border-left-color:#1c2733}
.dpe-valbox{flex:none;width:148px;border:2px solid #1c2733;border-radius:5px;padding:8px 9px;background:#fff}
.dpe-valbox-heads{display:flex;justify-content:space-between;gap:8px;font-size:.6rem;color:var(--ink-2);line-height:1.12}
.dpe-valbox-heads em{font-style:normal;color:var(--mute)}
.dpe-valbox-vals{display:flex;justify-content:space-between;gap:8px;border-top:1px solid #d7dbe2;margin-top:5px;padding-top:5px}
.dpe-valbox-vals span{display:flex;flex-direction:column;min-width:0}
.dpe-valbox-vals b{font-family:var(--serif);font-size:1.45rem;font-weight:800;color:var(--navy);line-height:1}
.dpe-valbox-vals sup{font-size:.7rem}
.dpe-valbox-vals small{font-size:.55rem;color:var(--mute);margin-top:2px}
.dpe-valbox-final{margin-top:6px;font-size:.6rem;color:var(--mute)}
.dpe-arrows{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px}
.dpe-arrow-line{position:relative;display:flex;align-items:center}
.dpe-arrow{position:relative;height:26px;flex:none;display:flex;align-items:center;padding:0 16px 0 13px;color:#fff;clip-path:polygon(0 0,calc(100% - 15px) 0,100% 50%,calc(100% - 15px) 100%,0 100%)}
.dpe-arrow.active{height:56px;box-shadow:0 5px 14px rgba(0,0,0,.28)}
.dpe-arrow-letter{font-family:var(--serif);font-weight:800;font-size:1.05rem;text-shadow:0 1px 2px rgba(0,0,0,.3)}
.dpe-arrow.active .dpe-arrow-letter{font-size:2.6rem}   /* lettre du logement bien plus grosse */
/* Bulle valeur ancrée à droite de la ligne active (comme le GES) */
.dpe-arrow-tag{position:absolute;right:2px;top:50%;transform:translateY(-50%);background:#fff;color:var(--navy);border:1px solid #e2e6ee;border-radius:7px;padding:5px 11px;font-size:.78rem;font-weight:600;white-space:nowrap;box-shadow:0 3px 10px rgba(0,0,0,.18)}
.dpe-arrow-tag b{font-size:1.3rem;font-family:var(--serif);margin-right:2px}
.dpe-passoire{font-size:.66rem;color:var(--mute);font-style:italic;margin-top:3px}
.dpe-final-note{font-size:.68rem;color:var(--ink-2);margin-top:4px}

/* Colonne GES : échelle BLEUE */
.dpe-gesbox{border:1px solid #bcd4ea;border-radius:10px;padding:14px;background:#f4f9fd}
.dpe-gesbox-title{font-weight:700;color:var(--navy);font-size:.86rem;margin-bottom:8px;line-height:1.25}
.dpe-ges-bars{display:flex;flex-direction:column;gap:5px;margin:4px 0}
.dpe-ges-bar{height:26px;display:flex;align-items:center;padding:0 12px;border-radius:0 13px 13px 0}
.dpe-ges-bar.active{height:46px;border-radius:0 23px 23px 0;box-shadow:0 4px 12px rgba(20,41,63,.3)}
.dpe-ges-letter{font-family:var(--serif);font-weight:800;font-size:1.02rem}
.dpe-ges-bar.active .dpe-ges-letter{font-size:2rem}
.dpe-ges-tag{margin-left:12px;background:#fff;color:var(--navy);border-radius:6px;padding:3px 9px;font-size:.76rem;font-weight:600;white-space:nowrap;box-shadow:0 2px 6px rgba(0,0,0,.15)}
.dpe-ges-tag b{font-size:1rem}
.ges-A{background:#c3ddef;color:#14293f}.ges-B{background:#9cc4e2;color:#14293f}.ges-C{background:#7aa8d0;color:#14293f}
.ges-D{background:#5885b3;color:#fff}.ges-E{background:#3d6491;color:#fff}.ges-F{background:#294a70;color:#fff}.ges-G{background:#152f4c;color:#fff}

/* Encarts explicatifs (verts) */
.dpe-notes{display:grid;grid-template-columns:1fr .82fr;gap:22px;margin-top:16px}
.dpe-note{background:#1f9c6e;color:#fff;border-radius:10px;padding:12px 14px;font-size:.8rem;line-height:1.42}
.dpe-note b{font-weight:800}

/* Estimation des coûts */
.dpe-cost-section{margin-top:24px;border-top:1px solid var(--line);padding-top:18px}
.dpe-cost-header{background:#e5327f;color:#fff;font-family:var(--serif);font-weight:800;font-size:1.02rem;padding:9px 16px;border-radius:8px}
.dpe-cost-intro{font-size:.79rem;color:var(--ink-2);margin:12px 2px;line-height:1.45}
.dpe-cost-body{display:flex;align-items:center;gap:18px;justify-content:center;flex-wrap:wrap}
.dpe-piggy{flex:none;width:54px;height:54px;border-radius:50%;background:#e5327f;color:#fff;display:grid;place-items:center;font-size:24px;font-weight:800}
.dpe-cost-range{font-size:1.08rem;color:var(--ink-2)}
.dpe-cost-range b{font-family:var(--serif);font-size:1.65rem;color:var(--navy)}
.dpe-cost-note{margin-top:14px;font-size:.72rem;color:var(--mute);text-align:center;line-height:1.45}
.dpe-modal-legal{margin-top:16px;font-size:.72rem;color:var(--mute);font-style:italic;text-align:center}
@media(max-width:640px){
  .dpe-grid,.dpe-notes{grid-template-columns:1fr}
  .dpe-energy-row{flex-direction:column;align-items:stretch}
  .dpe-valbox{width:auto}
}

/* ── Forms ────────────────────────────────────────────────── */
.form-section{background:var(--paper)}
.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.field{display:flex;flex-direction:column;gap:8px}
/* Champ piège anti-robot (honeypot) : hors écran, jamais visible ni focusable pour un humain */
.hp-field{position:absolute!important;left:-9999px!important;top:auto;width:1px;height:1px;overflow:hidden}
.field.full{grid-column:1/-1}
.field label{font-family:var(--serif);font-size:.74rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2)}
.field input,.field select,.field textarea{border:1px solid var(--line);background:var(--paper);border-radius:3px;
  padding:14px 18px;font-family:var(--sans);font-size:.94rem;color:var(--ink);transition:border-color .3s}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--clay)}
.field textarea{resize:vertical;min-height:130px}

/* ── Case à cocher d'accord (RGPD) ───────────────────────────
   Un .field-check se comporte comme un .field : il peut donc porter l'état
   d'erreur et recevoir un message en dessous. flex-wrap est ce qui permet au
   message de passer à la ligne sous la case plutôt que de la comprimer. */
.field-check{display:flex;flex-wrap:wrap;align-items:flex-start;gap:10px;margin:18px 0}
.field-check input[type=checkbox]{width:22px;height:22px;flex-shrink:0;margin-top:1px;accent-color:var(--clay)}
.field-check label{font-size:.8rem;color:var(--mute);flex:1;min-width:0}
.field-check .field-error{flex-basis:100%}

/* ── Champ en erreur ─────────────────────────────────────────
   Le contour rouge SEUL ne suffit pas : environ 8 % des hommes distinguent
   mal le rouge du gris. On double donc le signal par un liseré épais à
   gauche et par une phrase explicite sous le champ. */
.field.is-error input,
.field.is-error select,
.field.is-error textarea{
  border-color:var(--err,#b3261e);
  box-shadow:0 0 0 3px rgba(179,38,30,.12);
  background:rgba(179,38,30,.025);
}
.field.is-error label{color:var(--err,#b3261e)}
.field-check.is-error input[type=checkbox]{outline:2px solid var(--err,#b3261e);outline-offset:3px}
.field-check.is-error label{color:var(--err,#b3261e)}

.field-error{
  display:flex;align-items:flex-start;gap:6px;
  margin:0;font-size:.82rem;line-height:1.45;color:var(--err,#b3261e);font-weight:500;
}
.field-error::before{
  content:'!';flex:none;width:15px;height:15px;margin-top:1px;
  display:grid;place-items:center;border-radius:50%;
  background:var(--err,#b3261e);color:#fff;font-size:.66rem;font-weight:700;
}
@media (prefers-reduced-motion:no-preference){
  .field.is-error input,.field.is-error select,.field.is-error textarea{transition:border-color .25s,box-shadow .25s}
}

/* margin-bottom aligne sur le gap de .form-grid (18px) : le bandeau se pose
   dans le rythme du formulaire au lieu de coller au premier champ. */
.form-feedback{padding:16px 20px;border-radius:3px;font-size:.92rem;font-weight:500;margin-top:8px;margin-bottom:18px}
.form-feedback.ok{background:#e8f3ea;color:#236b38;border:1px solid #aacfb3}
.form-feedback.error{background:#f7e7e3;color:var(--clay-dk);border:1px solid #e3b4a8}

/* ── Table ────────────────────────────────────────────────── */
.data-table{width:100%;border-collapse:collapse;background:var(--white);border-radius:5px;overflow:hidden;border:1px solid var(--line)}
.data-table th,.data-table td{padding:16px 22px;text-align:left;border-bottom:1px solid var(--line);font-size:.95rem}
.data-table td{color:var(--ink)}
.data-table th{background:var(--navy);color:#fff;font-family:var(--serif);font-weight:600;font-size:.74rem;text-transform:uppercase;letter-spacing:.1em}
.data-table tr:last-child td{border-bottom:none}
.data-table td:last-child{font-family:var(--serif);font-weight:700;color:var(--clay-dk)}

/* ── FAQ ──────────────────────────────────────────────────── */
.faq-item{border-bottom:1px solid var(--line)}
.faq-q{width:100%;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:24px 0;text-align:left;
  font-family:var(--serif);font-size:1.05rem;font-weight:700;text-transform:uppercase;letter-spacing:.005em;color:var(--navy)}
.faq-q span{flex-shrink:0;width:32px;height:32px;border-radius:50%;border:1.5px solid var(--line-2);display:grid;place-items:center;font-size:1.2rem;color:var(--clay-dk);transition:transform .4s var(--ease),background .3s,border-color .3s,color .3s}
.faq-item.open .faq-q span{transform:rotate(45deg);background:var(--clay);color:var(--navy);border-color:var(--clay)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .5s var(--ease),padding .4s;color:var(--ink-2);line-height:1.75}
.faq-item.open .faq-a{max-height:320px;padding-bottom:24px}

/* ── Values ───────────────────────────────────────────────── */
.values-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.value-card{background:var(--white);border:1px solid var(--line);border-radius:5px;padding:34px 30px;
  transition:transform .45s var(--ease),box-shadow .45s;border-top:3px solid transparent}
.value-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-sm);border-top-color:var(--clay)}
.value-ic{width:54px;height:54px;border-radius:4px;background:var(--navy);display:grid;place-items:center;margin-bottom:20px}
.value-ic svg{width:26px;height:26px;stroke:var(--clay);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
/* Page L'agence : les 4 valeurs sur une seule ligne */
.page-agence .values-grid{grid-template-columns:repeat(4,1fr);gap:18px}
@media(max-width:1000px){.page-agence .values-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.page-agence .values-grid{grid-template-columns:1fr}}
.value-card h3{font-family:var(--serif);font-size:1.15rem;font-weight:700;text-transform:uppercase;letter-spacing:.01em;margin-bottom:10px;color:var(--navy)}
.value-card p{font-size:.94rem;color:var(--ink-2);line-height:1.7}
/* Variante « Pourquoi nous choisir » (vendre) : 2 colonnes, icône à gauche, accent latéral */
.pourquoi-grid{grid-template-columns:repeat(2,1fr);gap:24px}
.pourquoi-card{display:flex;align-items:flex-start;gap:22px;padding:30px 32px;
  border-top:1px solid var(--line);border-left:3px solid transparent}
.pourquoi-card:hover{border-top-color:var(--line);border-left-color:var(--clay)}
.pourquoi-card .value-ic{margin-bottom:0;flex-shrink:0;width:58px;height:58px;border-radius:50%}
.pourquoi-card .value-text h3{margin-bottom:8px}
@media(max-width:680px){.pourquoi-grid{grid-template-columns:1fr}.pourquoi-card{padding:26px 24px;gap:18px}}

/* ── 404 ──────────────────────────────────────────────────── */
.error-page{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:130px 24px 60px}
.error-page .container{display:flex;flex-direction:column;align-items:center}
/* Le 404 sert de support au tampon VENDU : conteneur positionné, pas de rognage */
.error-page .err-num{position:relative;display:inline-block;font-family:var(--serif);
  font-size:clamp(5.5rem,18vw,12rem);font-weight:800;color:var(--clay);line-height:.9}
.error-page h1{font-family:var(--serif);font-size:1.8rem;font-weight:700;text-transform:uppercase;margin:10px 0 16px;color:var(--navy)}
.error-page p{color:var(--ink-2);max-width:52ch;margin-bottom:26px}

/* ── Clin d'œil : tampon « Vendu » en travers du 404 ─────────
   Encre légèrement transparente et bord double, comme un tampon encreur
   posé de travers sur un mandat. */
.err-stamp{
  position:absolute;left:50%;top:52%;
  transform:translate(-50%,-50%) rotate(-13deg);
  font-family:var(--sans);font-size:clamp(1.5rem,4.4vw,2.6rem);font-weight:800;
  letter-spacing:.16em;text-transform:uppercase;line-height:1;
  color:#B0281A;opacity:.9;
  border:3px double #B0281A;border-radius:6px;
  padding:.28em .6em .3em;white-space:nowrap;
  background:rgba(255,255,255,.30);
  box-shadow:0 1px 0 rgba(176,40,26,.18);
  pointer-events:none;
}

.err-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.err-suggest{padding-top:clamp(40px,6vw,60px)}

@media (max-width:640px){
  .error-page{padding:100px 20px 44px}
}

/* ── Prose ────────────────────────────────────────────────── */
.prose{max-width:760px;margin:0 auto}
.prose h2{font-family:var(--serif);font-size:1.4rem;font-weight:700;text-transform:uppercase;letter-spacing:.01em;margin:36px 0 14px;color:var(--navy)}
.prose p{color:var(--ink-2);line-height:1.8;margin-bottom:14px}
.prose strong{color:var(--navy);font-weight:600}
.prose a{color:var(--clay-dk);font-weight:600}

/* ── Reduced motion ───────────────────────────────────────── */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}

/* ══════════ Frise SERVICES (3 étapes, fil du temps) ══════════ */
.services-intro{color:rgba(255,255,255,.7);font-size:1.05rem;max-width:62ch;margin:-28px 0 44px;position:relative;z-index:1}
.services-timeline{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,1fr);gap:30px;padding-top:6px}
.stl-line{position:absolute;top:28px;left:16%;right:16%;height:2px;background:linear-gradient(90deg,var(--clay-soft),var(--clay));z-index:0}
.stl-step{position:relative;z-index:1;text-align:center}
.stl-node{width:58px;height:58px;border-radius:50%;background:var(--clay);color:var(--navy);font-family:var(--serif);
  font-weight:800;font-size:1.3rem;display:grid;place-items:center;margin:0 auto 22px;
  box-shadow:0 0 0 8px var(--paper-2),0 8px 18px -6px rgba(199,162,76,.5)}
.stl-title{font-family:var(--serif);font-size:1.3rem;font-weight:700;text-transform:uppercase;color:#fff;margin-bottom:10px}
.stl-desc{font-size:.95rem;color:rgba(255,255,255,.66);line-height:1.7;max-width:36ch;margin:0 auto}

/* ══════════ Frise PROCESS (6 étapes) ══════════ */
.timeline{position:relative;display:grid;grid-template-columns:repeat(6,1fr);gap:14px;padding-top:8px}
.tl-line{position:absolute;top:32px;left:7%;right:7%;height:2px;background:linear-gradient(90deg,var(--clay-soft),var(--clay));z-index:0}
.tl-step{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;text-align:center}
.tl-node{width:50px;height:50px;border-radius:50%;background:var(--clay);color:var(--navy);font-family:var(--serif);
  font-weight:800;font-size:1.05rem;display:grid;place-items:center;margin-bottom:18px;box-shadow:0 0 0 7px var(--paper-2);transition:transform .35s var(--ease)}
.tl-step:hover .tl-node{transform:scale(1.12)}
.tl-title{font-family:var(--serif);font-size:.98rem;font-weight:700;text-transform:uppercase;color:var(--navy);margin-bottom:6px;letter-spacing:.01em}
.tl-desc{font-size:.84rem;color:var(--ink-2);line-height:1.55}

/* ══════════ Zones avec photo ══════════ */
.zone-card--photo{background-size:cover;background-position:center;border-color:transparent;min-height:180px;
  display:flex;flex-direction:column;justify-content:flex-end}
.zone-card--photo::before{content:"";position:absolute;inset:0;z-index:0;
  background:linear-gradient(to top,rgba(8,16,30,.92) 0%,rgba(8,16,30,.35) 55%,rgba(8,16,30,.1) 100%)}
.zone-card--photo .zone-overlay{display:none}
.zone-card--photo .zone-body,.zone-card--photo .zone-badge{position:relative;z-index:2}
.zone-card--photo .zone-name{color:#fff}
.zone-card--photo .zone-count{color:rgba(255,255,255,.82)}
.zone-card--photo .zone-badge{color:var(--clay-soft)}
.zone-card--photo:hover{transform:translateY(-5px);border-color:var(--clay)}

/* ══════════ Photo d'Océane (accueil + page agence, même bloc) — réduite ══════════ */
.home .agent,.page-agence .agent{align-items:center;grid-template-columns:.78fr 1.22fr;
  padding-inline:max(0px,calc((100% - var(--maxw-wide)) / 2))}
/* Photo de l'interlocutrice : collée en bas du bloc bleu et décalée à droite (proche du texte) */
.home .agent-image,.page-agence .agent-image{position:relative;min-height:0;width:min(97%,500px);height:clamp(400px,46vw,580px);
  margin:0 0 0 auto;border-radius:0;overflow:hidden;align-self:end;justify-self:end}
.home .agent-image img,.page-agence .agent-image img{object-position:center bottom}

/* ══════════ Avis Google (témoignages) ══════════ */
.testi-stars{color:#FBBC05}
.testi-google{display:flex;align-items:center;gap:14px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);
  border-radius:8px;padding:13px 20px;align-self:center}
.tg-rating{font-family:var(--serif);font-size:1.02rem;color:#fff;display:flex;align-items:center;gap:8px}
.tg-rating strong{font-size:1.7rem;color:var(--clay);font-weight:800;line-height:1}
.tg-stars{color:#FBBC05;letter-spacing:1px;font-size:.9rem}
.tg-sub{font-size:.78rem;color:rgba(255,255,255,.6);margin-top:3px}
.testi-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.g-badge{flex-shrink:0}

/* ══════════ Formes animées de fond (dynamisme) ══════════ */
.sec-fx{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
/* Disques lumineux plats (bokeh discret) : teinte uniforme, bord fondu, à peine visibles,
   positionnés en grappes pour se superposer (les alphas s'additionnent aux croisements). */
.sec-fx span{position:absolute;border-radius:50%;will-change:transform;
  background:radial-gradient(circle,rgba(236,214,156,.11) 0%,rgba(236,214,156,.11) 58%,transparent 76%)}
.sec-fx span:nth-child(1){width:280px;height:280px;top:4%;right:5%;animation:fxFloatA 15s ease-in-out infinite,fxGlow 8s ease-in-out infinite}
.sec-fx span:nth-child(2){width:170px;height:170px;top:18%;right:14%;animation:fxFloatB 19s ease-in-out infinite,fxGlow 11s ease-in-out infinite 2s}
.sec-fx span:nth-child(3){width:110px;height:110px;bottom:12%;left:5%;animation:fxFloatC 23s ease-in-out infinite,fxGlow 7s ease-in-out infinite 4s}
section > .container{position:relative;z-index:1}
@keyframes fxFloatA{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-90px,70px) scale(1.22)}}
@keyframes fxFloatB{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(85px,-58px) scale(1.2)}}
@keyframes fxFloatC{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(95px,-66px) scale(1.25)}66%{transform:translate(-55px,78px) scale(.88)}}
@keyframes fxGlow{0%,100%{opacity:.5}50%{opacity:1}}

/* Disques plats dans le hero (côté navy, derrière le contenu) — en grappes qui se chevauchent */
.hero-fx{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:4;opacity:0.5}
.hero-fx span{position:absolute;border-radius:50%;will-change:transform;
  background:radial-gradient(circle,rgba(240,220,166,.10) 0%,rgba(240,220,166,.10) 58%,transparent 76%)}
.hero-fx span:nth-child(1){width:300px;height:300px;top:2%;left:-60px;animation:fxFloatA 15s ease-in-out infinite,fxGlow 9s ease-in-out infinite}
.hero-fx span:nth-child(2){width:180px;height:180px;top:14%;left:8%;animation:fxFloatB 19s ease-in-out infinite,fxGlow 7s ease-in-out infinite 2s}
.hero-fx span:nth-child(3){width:110px;height:110px;top:30%;left:3%;background:radial-gradient(circle,rgba(255,250,238,.09) 0%,rgba(255,250,238,.09) 58%,transparent 76%);animation:fxFloatC 23s ease-in-out infinite,fxGlow 10s ease-in-out infinite 4s}
.hero-fx span:nth-child(4){width:220px;height:220px;bottom:4%;left:16%;animation:fxFloatB 25s ease-in-out infinite reverse,fxGlow 8s ease-in-out infinite 1s}
.hero-fx span:nth-child(5){width:130px;height:130px;bottom:14%;left:26%;background:radial-gradient(circle,rgba(255,250,238,.08) 0%,rgba(255,250,238,.08) 58%,transparent 76%);animation:fxFloatC 20s ease-in-out infinite reverse,fxGlow 9s ease-in-out infinite 3s}
/* Tout écran tactile : iOS zoome sur un champ dont la police est < 16px. Le
   garde-fou existant s'arrêtait à 760px — un iPad (768 portrait, 1024 paysage)
   passait donc au travers et zoomait à chaque focus. La bonne condition n'est
   pas la largeur mais le type de pointeur. */
@media (pointer:coarse){
  input,select,textarea{font-size:16px}
}

/* Tablette en paysage (941–1180) : la nav complète tient, mais tout juste —
   897px d'éléments pour 1009px. Sans resserrage, le bouton téléphone passait sur
   deux lignes et l'en-tête montait à 126px, soit 16% d'un écran de 768px de haut.
   On resserre les marges et on interdit le retour à la ligne du CTA. */
@media (min-width:941px) and (max-width:1180px){
  .nav-logo-img{height:88px}
  .nav-links a{padding:10px 11px;font-size:.72rem;letter-spacing:.06em}
  .nav-links a::after{left:11px;right:11px}
  .nav-cta{padding:12px 18px;font-size:.82rem;white-space:nowrap}
  .nav-social{gap:6px}
}

/* Menu : bascule en burger à 940px et non 1080. La nav complète réclame 806px
   (logo 204 + liens 374 + CTA 152 + réseaux 76) — elle tient donc sans peine sur
   une tablette en paysage, qui n'a aucune raison d'ouvrir un tiroir mobile. */
@media (max-width:940px){
  .nav-links,.nav-tel,.nav-cta,.nav-social{display:none}
  .nav-burger{display:flex}
}

@media (prefers-reduced-motion:reduce){.sec-fx span,.hero-fx span{animation:none}}

/* ── Responsive ───────────────────────────────────────────── */
@media (max-width:1080px){
  .services-timeline{grid-template-columns:1fr;gap:34px}
  .stl-line{display:none}
  .timeline{grid-template-columns:1fr;gap:0;padding-left:30px}
  .tl-line{top:0;bottom:0;left:24px;right:auto;width:2px;height:auto;background:linear-gradient(180deg,var(--clay-soft),var(--clay))}
  .tl-step{flex-direction:row;align-items:flex-start;text-align:left;gap:18px;padding-bottom:28px}
  .tl-node{margin-bottom:0;flex-shrink:0}
  .home .agent,.page-agence .agent{grid-template-columns:1fr}
  .home .agent-image,.page-agence .agent-image{width:auto;height:clamp(300px,55vw,420px);min-height:0}
  .hero-media{width:100%}
  .hero-mask{clip-path:none;background:linear-gradient(105deg,var(--navy) 38%,rgba(15,30,56,.82) 66%,rgba(15,30,56,.5) 100%)}
  .hero-edge{display:none}
  .hero-card{display:none}
  .agent{grid-template-columns:1fr}.agent-image{min-height:380px}
  .services-grid{grid-template-columns:1fr}
  .srv-card{border-right:none;border-bottom:1px solid rgba(255,255,255,.14)}
  .process-steps,.testi-grid,.values-grid{grid-template-columns:1fr}
  .types-grid{grid-template-columns:repeat(2,1fr)}
  .footer-top{grid-template-columns:1fr 1fr}
  .hero-stats{grid-template-columns:repeat(2,1fr)}
  .hs-stat:nth-child(2){border-right:none}
  .hs-stat{border-bottom:1px solid rgba(255,255,255,.08)}
  .feature-panel{max-width:none}
}
@media (max-width:680px){
  .container,.container-wide{padding:0 20px}
  .navbar{padding:6px 20px}
  .nav-logo-img{height:66px}
  .nav-wrap.scrolled .nav-logo-img{height:54px}
  .listings-grid,.types-grid,.form-grid,.detail-grid,.facts-list,.feature-facts{grid-template-columns:1fr}
  .sec-head{flex-direction:column;align-items:flex-start}
  .footer-top{grid-template-columns:1fr}
  .footer-bottom{flex-direction:column;text-align:center}
  .bien-specs{flex-direction:column}.spec-box{border-right:none;border-bottom:1px solid var(--line)}
  .mobile-bar{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:850;background:var(--white);
    border-top:1px solid var(--line);padding:10px 14px;gap:10px;box-shadow:0 -8px 24px -16px rgba(0,0,0,.3)}
  .mbar-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:14px;border-radius:2px;
    font-family:var(--serif);font-size:.74rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
  .mbar-tel{background:var(--cream);border:1px solid var(--line);color:var(--navy)}
  .mbar-tel svg{width:16px;height:16px;stroke:var(--clay-dk);fill:none;stroke-width:2}
  .mbar-cta{background:var(--clay);color:var(--navy)}
  .scroll-top{bottom:78px}

  /* 1) Le prix passe SUR la photo, en bas à gauche ; la ligne de prix de la
        carte disparaît pour ne pas l'annoncer deux fois. Le reste de la carte
        (honoraires, simulateur, référence) est conservé. */
  .pv-price-badge{display:block}
  .price-card .price-label,
  .price-card .price-value{display:none}
  .price-card{padding:20px 22px}

  /* 2) Liens du pied de page : le padding tactile (7px) s'ajoutait au gap de
        11px, ce qui creusait l'équivalent d'une ligne vide entre chaque lien.
        On supprime le gap — le padding suffit à séparer ET reste tactile. */
  .footer-nav ul{gap:0}

  /* 4) La barre d'action fixe (71px) masquait la dernière ligne du pied de page
        — mentions légales, barème, gestion des cookies devenaient inatteignables.
        On réserve la hauteur de la barre, marge de sécurité incluse. */
  .site-footer{padding-bottom:calc(84px + env(safe-area-inset-bottom, 0px))}
}

/* 3) Fiche légale de l'agence : l'étiquette était figée à 140px et le SIRET ou
      le numéro de carte pro (17 chiffres insécables) poussaient le cadre hors
      de l'écran. En mobile on empile étiquette et valeur, et on autorise la
      coupure des longs numéros. */
@media (max-width:560px){
  .ag-legal{padding:22px 18px!important}
  .ag-legal-row{flex-direction:column;gap:3px!important}
  .ag-legal-k{min-width:0!important}
  .ag-legal-v{overflow-wrap:anywhere}
}

/* ════════════════════════════════════════════════════════════
   PAGES COMMUNES (SEO local) — commune.php
   ════════════════════════════════════════════════════════════ */
.page-head .ph-eyebrow{font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--clay-dk);margin-bottom:14px}
.page-head .ph-lede{max-width:680px;margin-top:18px;color:var(--ink-2);font-size:1.08rem;line-height:1.75}
.container-narrow{max-width:820px;margin-inline:auto}

/* Bandeau photo d'illustration d'un secteur (page commune) */
.page-commune .page-head{padding-bottom:28px}
.commune-hero{position:relative;width:calc(100% - 64px);max-width:var(--maxw);margin:28px auto 0;
  height:clamp(240px,32vw,440px);overflow:hidden;border-radius:14px;background:var(--paper-2);
  box-shadow:0 24px 60px -32px rgba(10,20,38,.5)}
.commune-hero img{width:100%;height:100%;object-fit:cover;display:block}
.commune-hero::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(15,30,56,0) 42%,rgba(15,30,56,.62) 100%)}
.commune-hero-cap{position:absolute;left:0;bottom:0;z-index:1;
  padding:clamp(18px,3vw,34px) clamp(22px,4vw,46px);
  font-family:var(--serif);font-size:clamp(1.6rem,4vw,2.6rem);font-weight:700;color:#fff;
  text-shadow:0 2px 22px rgba(10,20,38,.6);max-width:80%}
.commune-hero-credit{position:absolute;right:12px;bottom:10px;z-index:1;
  font-size:.66rem;color:rgba(255,255,255,.85);background:rgba(10,20,38,.42);
  padding:3px 9px;border-radius:5px;backdrop-filter:blur(2px)}
@media(max-width:640px){.commune-hero{width:calc(100% - 40px);border-radius:10px}}

.commune-grid{display:grid;grid-template-columns:1.7fr .9fr;gap:48px;align-items:start}
.commune-text p{color:var(--ink-2);line-height:1.85;margin-top:16px;font-size:1.02rem}
.commune-text .section-title{margin-top:6px}
.commune-cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}

.commune-aside{position:sticky;top:100px}
.commune-card{background:var(--white);border:1px solid var(--line);border-radius:14px;padding:26px;box-shadow:var(--shadow-sm)}
.commune-card-rate{display:flex;align-items:baseline;gap:10px;padding-bottom:16px;border-bottom:1px solid var(--line);margin-bottom:16px}
.commune-card-rate strong{font-family:var(--serif);font-size:1.9rem;font-weight:800;color:var(--navy)}
.commune-card-rate span{font-size:.82rem;color:var(--mute);line-height:1.3}
.commune-card-list{list-style:none;margin:0 0 20px;padding:0;display:flex;flex-direction:column;gap:11px}
.commune-card-list li{position:relative;padding-left:26px;font-size:.95rem;color:var(--ink-2);line-height:1.5}
.commune-card-list li::before{content:"";position:absolute;left:0;top:3px;width:16px;height:16px;border-radius:50%;background:var(--clay);box-shadow:inset 0 0 0 2px var(--white)}
.commune-card-tel{display:inline-flex;align-items:center;gap:10px;font-family:var(--serif);font-weight:700;font-size:1.15rem;color:var(--navy);text-decoration:none}
.commune-card-tel svg{width:18px;height:18px;color:var(--clay-dk)}

.sec-head-link{align-self:center;white-space:nowrap;font-weight:600;color:var(--navy);text-decoration:none;border-bottom:2px solid var(--clay);padding-bottom:3px;transition:color .25s}
.sec-head-link:hover{color:var(--clay-dk)}

.commune-empty{background:var(--white);border:1px dashed var(--line-2);border-radius:14px;padding:36px;text-align:center}
.commune-empty p{color:var(--ink-2);line-height:1.7;max-width:560px;margin:0 auto}
.commune-empty .commune-cta{justify-content:center}

/* FAQ native <details> */
.commune-faq .faq-list{margin-top:28px}
.commune-faq .faq-item{border-bottom:1px solid var(--line)}
.commune-faq .faq-item summary{cursor:pointer;list-style:none;padding:22px 40px 22px 0;position:relative;font-family:var(--serif);font-weight:700;font-size:1.08rem;color:var(--navy)}
.commune-faq .faq-item summary::-webkit-details-marker{display:none}
.commune-faq .faq-item summary::after{content:"+";position:absolute;right:0;top:50%;transform:translateY(-50%);width:32px;height:32px;border-radius:50%;border:1.5px solid var(--line-2);display:grid;place-items:center;font-size:1.2rem;color:var(--clay-dk);transition:transform .35s var(--ease),background .3s,color .3s,border-color .3s}
.commune-faq .faq-item[open] summary::after{content:"+";transform:translateY(-50%) rotate(45deg);background:var(--clay);color:var(--navy);border-color:var(--clay)}
.commune-faq .faq-answer{padding:0 0 24px;color:var(--ink-2);line-height:1.75}

.commune-links-title{font-family:var(--serif);font-size:1.15rem;font-weight:700;color:var(--navy);margin-bottom:18px}
.commune-links-grid{display:flex;flex-wrap:wrap;gap:12px}
.commune-links-grid a{display:inline-block;padding:10px 18px;border:1px solid var(--line);border-radius:50px;background:var(--white);color:var(--navy);text-decoration:none;font-size:.92rem;font-weight:500;transition:border-color .25s,color .25s,background .25s}
.commune-links-grid a:hover{border-color:var(--clay);color:var(--clay-dk);background:var(--paper)}

@media(max-width:860px){
  .commune-grid{grid-template-columns:1fr;gap:32px}
  .commune-aside{position:static}
}

/* ── Bannière de consentement cookies (RGPD/CNIL) ──────────── */
.cookie-consent{position:fixed;right:24px;bottom:24px;z-index:3000;width:min(440px,calc(100vw - 32px));
  background:#fff;border:1px solid var(--line);border-radius:14px;
  box-shadow:0 24px 70px -18px rgba(10,20,38,.5);border-top:3px solid var(--clay);
  opacity:0;transform:translateY(16px);transition:opacity .28s ease,transform .28s ease}
.cookie-consent[hidden]{display:none}
.cookie-consent.is-open{opacity:1;transform:none}
.cc-inner{padding:22px 24px}
.cc-title{font-family:var(--serif);font-size:1.18rem;font-weight:600;color:var(--ink);margin:0 0 8px}
.cc-text{font-size:.86rem;line-height:1.6;color:var(--ink-2);margin:0}
.cc-text a{color:var(--clay-dk);text-decoration:underline;font-weight:600}
.cc-prefs{margin-top:16px;border-top:1px solid var(--line);padding-top:6px}
.cc-cat{display:flex;align-items:center;gap:14px;padding:12px 0;border-bottom:1px solid var(--line)}
.cc-cat:last-child{border-bottom:none}
.cc-cat-txt{min-width:0}
.cc-cat-txt strong{display:block;font-size:.9rem;color:var(--ink)}
.cc-cat-txt span{display:block;font-size:.76rem;color:var(--mute);line-height:1.45;margin-top:2px}
.cc-always{flex-shrink:0;font-size:.72rem;font-weight:700;color:var(--clay-dk);
  background:var(--paper-2);border-radius:999px;padding:5px 11px;white-space:nowrap}
/* Interrupteur */
.cc-switch{position:relative;flex-shrink:0;display:inline-flex;cursor:pointer}
.cc-switch input{position:absolute;opacity:0;width:0;height:0}
.cc-slider{width:44px;height:24px;border-radius:999px;background:var(--line-2);transition:background .2s;display:block}
.cc-slider::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;
  background:#fff;box-shadow:0 1px 3px rgba(10,20,38,.35);transition:transform .2s}
.cc-switch input:checked + .cc-slider{background:var(--clay)}
.cc-switch input:checked + .cc-slider::after{transform:translateX(20px)}
.cc-switch input:focus-visible + .cc-slider{outline:2px solid var(--navy);outline-offset:2px}
.cc-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* Actions */
.cc-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:18px}
.cc-actions .cc-btn{flex:1 1 auto;justify-content:center;padding:11px 16px;font-size:.86rem}
.cc-actions .cc-btn[hidden]{display:none}
.cc-link{background:none;border:none;cursor:pointer;font-family:inherit;font-size:.82rem;font-weight:600;
  color:var(--ink-2);text-decoration:underline;padding:6px 8px;flex-basis:100%;text-align:center}
.cc-link:hover{color:var(--ink)}
.cookie-consent.show-prefs .cc-save{flex-basis:100%}
.footer-bottom-links .cc-manage{cursor:pointer}
@media(max-width:720px){
  .cookie-consent{left:12px;right:12px;bottom:84px;width:auto}
  .cc-actions .cc-btn{flex-basis:calc(50% - 5px)}
}
@media(prefers-reduced-motion:reduce){.cookie-consent{transition:none}}

/* ── Alerte email par secteur (commune.php) ───────────────── */
.commune-alerte .secteur-alerte{background:var(--navy);color:#fff;border-radius:16px;padding:40px 36px;text-align:center;position:relative;overflow:hidden}
.secteur-alerte-ico{width:54px;height:54px;margin:0 auto 16px;border-radius:50%;display:grid;place-items:center;background:rgba(199,162,76,.18)}
.secteur-alerte-ico svg{width:26px;height:26px;stroke:var(--clay-soft)}
.secteur-alerte-title{font-family:var(--serif);font-size:clamp(1.3rem,3vw,1.8rem);font-weight:800;color:#fff}
.secteur-alerte-title em{font-style:normal;color:var(--clay-soft)}
.secteur-alerte-sub{max-width:560px;margin:12px auto 22px;color:rgba(255,255,255,.75);line-height:1.7;font-size:.98rem}
.secteur-alerte-row{display:flex;gap:12px;max-width:520px;margin:0 auto;flex-wrap:wrap}
.secteur-alerte-row input{flex:1;min-width:200px;padding:14px 16px;border:1px solid rgba(255,255,255,.2);border-radius:6px;background:rgba(255,255,255,.06);color:#fff;font-size:.95rem;font-family:var(--sans)}
.secteur-alerte-row input::placeholder{color:rgba(255,255,255,.5)}
.secteur-alerte-row input:focus{outline:none;border-color:var(--clay);background:rgba(255,255,255,.1)}
.secteur-alerte-row .btn{white-space:nowrap}
.secteur-alerte-rgpd{display:flex;align-items:flex-start;gap:9px;max-width:520px;margin:14px auto 0;font-size:.8rem;color:rgba(255,255,255,.6);text-align:left;line-height:1.45;cursor:pointer}
.secteur-alerte-rgpd input{margin-top:2px;flex-shrink:0;accent-color:var(--clay)}
.secteur-alerte-fb{margin-top:14px;font-weight:600;font-size:.92rem}
.secteur-alerte-fb.ok{color:var(--clay-soft)}
.secteur-alerte-fb.error{color:#ffb4a2}
@media(max-width:560px){.commune-alerte .secteur-alerte{padding:30px 20px}}

/* ── Galerie « Notre agence » (agence.php) ────────────────── */
/* Galerie « Notre agence » — mosaïque (masonry) */
.ag-gallery{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:clamp(150px,15vw,205px);
  grid-auto-flow:row dense;gap:14px;margin-top:6px}
.ag-shot{position:relative;margin:0;overflow:hidden;border-radius:12px;height:100%;
  border:1px solid var(--line);box-shadow:0 16px 38px -24px rgba(10,20,38,.55);
  transition:opacity .35s var(--ease)}
.ag-shot img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s var(--ease),opacity .35s var(--ease)}
.ag-shot:hover img{transform:scale(1.05)}
/* Vignettes (hors grande photo) : au survol elles s'estompent — leur image
   s'affiche en grand dans la tuile principale (swap géré en JS). */
.ag-shot:not(.ag-feature){cursor:pointer}
.ag-shot:not(.ag-feature):hover{opacity:.4}
@media(prefers-reduced-motion:reduce){.ag-shot,.ag-shot img{transition:none}.ag-shot:hover img{transform:none}}
.ag-shot.ag-feature{grid-column:span 2;grid-row:span 2}
.ag-shot.ag-wide{grid-column:span 2}
@media(max-width:760px){
  .ag-gallery{grid-template-columns:repeat(2,1fr);grid-auto-rows:clamp(128px,30vw,175px);gap:12px}
  .ag-shot.ag-feature{grid-column:span 2;grid-row:span 2}
  .ag-shot.ag-wide{grid-column:span 2;grid-row:span 1}
}
@media(max-width:460px){
  .ag-gallery{grid-template-columns:1fr;grid-auto-rows:180px}
  .ag-shot.ag-feature,.ag-shot.ag-wide{grid-column:auto;grid-row:auto}
}

/* ── Page Vendre : puces d'estimation, process 6 colonnes, visuels biens ── */
/* Puces « Estimation offerte » (fix : le SVG check n'avait aucune taille) */
.intro-sigs{display:flex;flex-direction:column;gap:15px;margin-top:6px}
/* La coche s'aligne sur la PREMIÈRE ligne, pas au milieu du bloc : dès qu'un
   libellé passe sur deux lignes — ce qui arrive sur mobile — un centrage
   vertical la fait flotter entre les deux, et la liste perd sa lecture.
   Le retrait négatif compense la différence entre la hauteur de l'icône
   (30 px avec son fond) et celle d'une ligne de texte. */
.intro-sig{display:flex;align-items:flex-start;gap:13px;font-size:1.02rem;color:var(--ink-2)}
.intro-sig svg{margin-top:-3px;width:18px;height:18px;padding:6px;box-sizing:content-box;flex-shrink:0;border-radius:50%;
  background:rgba(199,162,76,.16);stroke:var(--clay-dk);fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.intro-sig strong{color:var(--navy);font-weight:700}

/* « Notre méthode » : les 6 étapes sur une seule ligne */
.page-vendre .process-steps{grid-template-columns:repeat(6,1fr);gap:14px}
.page-vendre .process-step{padding:24px 18px}
.page-vendre .ps-num{font-size:1.9rem}
.page-vendre .ps-title{font-size:.98rem;margin:12px 0 7px}
.page-vendre .ps-desc{font-size:.84rem;line-height:1.55}
@media(max-width:1100px){.page-vendre .process-steps{grid-template-columns:repeat(3,1fr)}}
@media(max-width:680px){.page-vendre .process-steps{grid-template-columns:repeat(2,1fr)}}
@media(max-width:460px){.page-vendre .process-steps{grid-template-columns:1fr}}

/* Bandeau photos de biens (illustration) */
.biens-showcase{position:relative}
.biens-strip{display:grid;grid-template-columns:1.7fr 1fr;grid-auto-rows:clamp(155px,17vw,215px);gap:14px;margin-top:8px}
.biens-shot{position:relative;overflow:hidden;border-radius:14px;
  box-shadow:0 20px 46px -26px rgba(10,20,38,.6);border:1px solid var(--line)}
.biens-shot:first-child{grid-row:span 2}
.biens-shot img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s var(--ease)}
.biens-shot:hover img{transform:scale(1.06)}
.biens-shot::after{content:'';position:absolute;inset:0;
  background:linear-gradient(to top,rgba(10,18,34,.82) 0%,rgba(10,18,34,.25) 42%,transparent 70%)}
.biens-shot-cap{position:absolute;left:0;right:0;bottom:0;z-index:1;padding:20px 18px 15px;color:#fff}
.biens-shot-city{font-family:var(--serif);font-size:1.05rem;font-weight:800;text-transform:uppercase;letter-spacing:.02em;line-height:1.15;text-shadow:0 2px 12px rgba(5,12,28,.5)}
.biens-shot-price{font-size:.9rem;font-weight:700;color:var(--clay-soft);margin-top:3px}
@media(max-width:640px){
  .biens-strip{grid-template-columns:1fr;grid-auto-rows:clamp(190px,60vw,260px)}
  .biens-shot:first-child{grid-row:auto}
}

/* Illustrations « Pourquoi nous choisir » (Vendre) — flat 2 tons, conteneur clair */
.page-vendre .pourquoi-card .value-ill{background:rgba(199,162,76,.13);border:1px solid rgba(199,162,76,.28);
  width:66px;height:66px;flex-shrink:0}
.page-vendre .pourquoi-card .value-ill svg{width:42px;height:42px;stroke:none}
/* Espacements page Vendre harmonisés */
.page-vendre .pourquoi-grid{gap:22px}
.page-vendre .pourquoi-card{padding:26px 30px;gap:24px;align-items:center}
.page-vendre .pourquoi-card .value-text h3{margin-bottom:7px}
.page-vendre .sec-head{margin-bottom:34px}
.page-vendre .process-step{padding:22px 16px}
.page-vendre .estim-wrap{gap:clamp(36px,5vw,64px)}
.page-vendre .intro-sigs{margin-top:20px}

/* « Notre méthode » (Vendre) : section blanche + cartes crème,
   pour la distinguer de « Pourquoi » (section crème + cartes blanches) */
.page-vendre .process{background:var(--white)}
.page-vendre .process-step{background:var(--paper-2);border-color:var(--line-2)}

/* « Nos services » (accueil) en fond clair, pour se distinguer de « Sélection du moment » (navy) */
.home .services{background:var(--paper-2);color:var(--ink)}
.home .services::before{display:none}
.home .services .eyebrow.light{color:var(--clay-dk)}
.home .services .eyebrow.light::before{background:var(--clay)}
.home .services .section-title{color:var(--navy)}
.home .services .services-intro{color:var(--ink-2)}
.home .services .stl-title{color:var(--navy)}
.home .services .stl-desc{color:var(--ink-2)}

/* « Nos valeurs » (agence) sur cream pour se distinguer de « Notre agence » (fond clair) */
.page-agence .zones{background:var(--paper-2)}

/* Titre « Nous trouver » (contact) — accent doré */
.contact-block-title{font-family:var(--serif);font-size:1.5rem;font-weight:600;color:var(--navy);
  position:relative;margin-bottom:26px;padding-bottom:14px}
.contact-block-title::after{content:"";position:absolute;left:0;bottom:0;width:46px;height:3px;border-radius:2px;
  background:linear-gradient(90deg,var(--clay),var(--clay-soft))}

/* Bloc conseillère (accueil) : email + bouton sur une ligne, bloc plus compact, photo réduite */
.agent-contact--cta{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:6px}
.agent-contact--cta .ac-mail{display:flex;align-items:center;gap:12px;min-width:0}
.agent-contact--cta .ac-mail svg{width:20px;height:20px;stroke:var(--clay);fill:none;stroke-width:2;flex-shrink:0}
.agent-contact--cta .ac-btn{flex-shrink:0;padding:12px 26px}
.home .agent-body,.page-agence .agent-body{padding-top:clamp(34px,5vw,56px);padding-bottom:clamp(34px,5vw,56px)}
.home .agent-image,.page-agence .agent-image{height:clamp(320px,34vw,450px)}

/* « Nos valeurs » (agence) : icônes agrandies en badge, coin haut-gauche, qui ressort */
.page-agence .values-grid .value-card{position:relative;overflow:visible;padding-top:52px}
.page-agence .values-grid .value-ic{position:absolute;top:-20px;left:26px;margin:0;
  width:66px;height:66px;border-radius:16px;box-shadow:0 14px 30px -10px rgba(15,30,56,.55)}
.page-agence .values-grid .value-ic svg{width:34px;height:34px}

/* ═══════════════ OPTIMISATIONS MOBILE ═══════════════ */
@media(max-width:760px){
  /* En-têtes de page : le padding desktop (140px) créait un grand vide */
  .page-head{padding:96px 0 26px}
  .page-head.page-head--photo{padding-top:104px;padding-bottom:30px}
  .page-head .ph-title{font-size:clamp(1.75rem,7.4vw,2.3rem)}
  .page-head .ph-sub,.page-head .ph-lede{font-size:.97rem;margin-top:12px}

  /* Fiche bien : prix + contact remontés juste après la galerie (infos clés d'abord) */
  .bien-layout .bien-sidebar{order:-1}
  .bien-sidebar{gap:14px}

  /* Le widget latéral « Être rappelé » masquait le contenu : la barre du bas suffit */
  .rappel{display:none}

  /* Cibles tactiles : minimum ~44px (recommandation Google) */
  .nav-burger{width:44px;height:44px}
  .bc-arrow{width:44px!important;height:44px!important}
  .fav-btn,.scroll-top{width:46px;height:46px}
  .footer-bottom-links a,.footer-nav a{display:inline-block;padding:0}
  .agent-contact a,.odeva-mail{padding:4px 0;display:inline-block}

  /* Lisibilité : plus de texte sous 12px */
  .eyebrow,.hero-eyebrow,.hs-l,.zone-count{font-size:.76rem!important;letter-spacing:.1em}
  .hero-card-tag,.bien-badge,.listing-badge{font-size:.72rem!important}

  /* Recherche des biens : panneau plus compact, les biens remontent */
  .page-acheter .search-panel{padding:14px;margin-top:16px}
  .page-acheter .search-row{gap:10px}
  .page-acheter .breadcrumb{margin-bottom:12px!important}
}
/* Cartes de biens : photos plus grandes et mise en valeur sur mobile */
@media(max-width:560px){
  .listings-grid{gap:18px}
  .listing-card .lc-media,.bien-card-media{height:230px}
}

/* H1 de la page « Nos biens » (SEO + repère de navigation) */
.acheter-h1{font-family:var(--serif);font-size:clamp(1.35rem,3vw,1.9rem);font-weight:800;color:var(--navy);
  text-transform:uppercase;letter-spacing:-.01em;line-height:1.15;margin:0 0 16px}
.acheter-h1 span{color:var(--clay-dk)}
@media(max-width:760px){.acheter-h1{font-size:1.25rem;margin-bottom:12px}}

/* Recherche mobile compacte : les 2 filtres côte à côte (les biens remontent) */
@media(max-width:760px){
  .page-acheter .search-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .page-acheter .search-row .search-field:first-child{grid-column:1/-1}
  .page-acheter .search-row .search-field{max-width:none!important;min-width:0}
  .page-acheter .search-field input,.page-acheter .search-field select{padding-left:38px;font-size:.88rem}
  .page-acheter .search-field svg{left:12px}
  .page-acheter .adv-btn{padding:12px 10px;font-size:.8rem}
}

/* Mobile : chevron des sélecteurs sans chevauchement + espace resserré avant les biens */
@media(max-width:760px){
  .page-acheter .search-field select{padding-right:34px;text-overflow:ellipsis}
  .page-acheter .listings-head,.page-acheter .listings-toolbar{margin-top:14px}
  .page-acheter .sec:first-of-type{padding-top:18px}
}

/* Fiche bien — galerie mobile : grande photo pleine largeur + miniatures en bande horizontale */
@media(max-width:760px){
  .pv-gallery{grid-template-columns:1fr;gap:10px;margin-bottom:26px}
  .pv-main{min-height:0;aspect-ratio:4/3;max-height:none;border-radius:12px}
  .pv-main-img{height:100%;max-height:none;object-fit:cover}
  .pv-strip{flex-direction:row;max-height:none;overflow-x:auto;overflow-y:hidden;gap:8px;
    padding:2px 0 6px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
  .pv-strip > *{flex:0 0 92px;height:70px;scroll-snap-align:start}
  .pv-strip img{width:100%;height:100%;object-fit:cover;border-radius:8px}
  .bien-section{padding-bottom:40px}
  .poster-title{font-size:clamp(1.5rem,6.6vw,2rem)}
}

/* Formulaires mobile : 16px minimum = pas de zoom automatique iOS au tap */
@media(max-width:760px){
  input:not([type=checkbox]):not([type=radio]),select,textarea,
  .field input,.field select,.field textarea,
  .search-field input,.search-field select,
  .rappel-form input,.alerte-form input[type=email],.sim-num input{font-size:16px!important}
  /* Cases à cocher plus faciles à toucher */
  .field input[type=checkbox],#rgpd,.alerte-rgpd input,.secteur-alerte-rgpd input{width:20px!important;height:20px!important}
  label[for=rgpd],.alerte-rgpd,.secteur-alerte-rgpd{padding:4px 0}
  /* Boutons de formulaire pleine largeur, confortables */
  .form-section .btn[type=submit],#contact-form .btn,#estim-form .btn{min-height:52px}
}

/* Mobile : les sélecteurs n'ont pas d'icône → récupérer la place (libellés entiers)
   + resserrer l'espace entre la recherche et la liste des biens */
@media(max-width:760px){
  .page-acheter .search-field select{padding-left:14px;padding-right:30px}
  .page-acheter .search-zone{margin-bottom:0}
  .page-acheter .page-head-search{padding-bottom:14px}
  .page-acheter .listings-section,.page-acheter .sec.listings{padding-top:14px!important}
}

/* ── Bannière cookies : barre basse compacte sur mobile (non bloquante) ── */
@media(max-width:760px){
  .cookie-consent{left:0;right:0;bottom:0;width:auto;max-width:none;
    border-radius:14px 14px 0 0;border-left:0;border-right:0;border-bottom:0;
    box-shadow:0 -12px 34px -12px rgba(10,20,38,.45);transform:translateY(100%)}
  .cookie-consent.is-open{transform:none}
  .cc-inner{padding:14px 16px calc(14px + env(safe-area-inset-bottom,0px))}
  .cc-title{font-size:.98rem;margin-bottom:4px}
  .cc-text{font-size:.79rem;line-height:1.45;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .cookie-consent.show-prefs .cc-text{-webkit-line-clamp:unset;overflow:visible}
  .cc-actions{margin-top:11px;gap:8px}
  .cc-actions .cc-btn{flex:1 1 0;min-width:0;padding:11px 8px;font-size:.8rem;letter-spacing:.04em}
  .cc-link{flex-basis:auto;order:3;padding:4px 6px;font-size:.78rem}
  .cc-prefs{margin-top:12px;max-height:42vh;overflow-y:auto}
  .cc-cat{padding:10px 0;gap:10px}
  .cc-cat-txt strong{font-size:.86rem}
  .cc-cat-txt span{font-size:.73rem}
  /* la barre de contact fixe passe au-dessus tant que le choix n'est pas fait */
  .cookie-consent:not([hidden]) ~ .mobile-bar{display:none}
}

/* Recherche du hero sur mobile : 2 sélecteurs lisibles + bouton pleine largeur */
@media(max-width:760px){
  .hero-search{display:grid!important;grid-template-columns:1fr 1fr;gap:8px;padding:10px;border-radius:10px}
  .hero-search > *{min-width:0}
  .hero-search select{width:100%;padding:12px 26px 12px 12px;font-size:16px}
  .hero-search .hs-sep,.hero-search .hs-divider{display:none}
  .hero-search .hs-submit,.hero-search button{grid-column:1/-1;width:100%;padding:14px;min-height:50px}
}

/* Bien vendu — la page reste en ligne (SEO) avec un statut clair */
.poster-label--vendu{color:var(--mute)}
.vendu-banner{background:var(--surface,var(--white));border:1px solid var(--line-2);border-left:4px solid var(--navy);
  border-radius:10px;padding:20px 24px;margin:22px 0 6px;max-width:760px}
.vendu-banner strong{display:block;font-family:var(--serif);font-size:1.08rem;color:var(--navy);margin-bottom:6px}
.vendu-banner span{display:block;font-size:.93rem;color:var(--ink-2);line-height:1.6}
.vendu-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.vendu-actions .btn{padding:12px 22px;font-size:.78rem}
@media(max-width:560px){.vendu-actions .btn{flex:1 1 100%;justify-content:center}}

/* Accueil — bandeau de réassurance : masquer le pad code postal,
   garder « 18 ans d'expérience » et la note Google sur une seule ligne */
.home .hero-stats{grid-template-columns:repeat(2,1fr)}
.home .hero-stats .hs-stat:first-child{display:none}
.home .hero-stats .hs-stat:nth-child(2){border-right:1px solid rgba(255,255,255,.08)}
.home .hero-stats .hs-stat:last-child{border-right:none}
@media(max-width:760px){
  .home .hero-stats{grid-template-columns:repeat(2,1fr)}
  .home .hero-stats .hs-stat{border-bottom:none;padding:20px 12px}
  .home .hero-stats .hs-stat--row{gap:12px}
}

/* Correctif : sur mobile la photo d'Océane disparaissait — le conteneur passait en
   width:auto alors que l'image est en position:absolute (donc largeur calculée = 0). */
@media(max-width:1080px){
  .home .agent-image,.page-agence .agent-image{
    width:100%;max-width:none;margin:0;justify-self:stretch;
    height:clamp(300px,55vw,420px);min-height:0}
  /* object-fit:contain et non cover : le cadre devient très large (100% de la
     fenêtre) pour une photo au format portrait. En « cover », l'image est mise
     à l'échelle sur la LARGEUR — elle déborde donc énormément en hauteur, et
     l'ancrage bas décapitait le sujet. « contain » montre la personne entière ;
     le fond navy du bloc comble les côtés. */
  .home .agent-image img,.page-agence .agent-image img{
    object-fit:contain;object-position:center bottom}
}

/* Cartes « Sélection du moment » — mise en page mobile empilée :
   la photo n'est plus masquée par le texte, et le prix ne passe plus sous le bouton. */
@media(max-width:760px){
  .feature-row{display:flex;flex-direction:column;min-height:0;background:var(--navy)}
  .feature-media{position:relative;inset:auto;order:1;width:100%;height:clamp(200px,52vw,260px);flex:0 0 auto}
  /* Le voile est rétabli, mais seulement en bas : le prix se pose SUR la photo
     et a besoin d'un fond assombri pour rester lisible quel que soit le cliché. */
  .feature-media::after{display:block;background:linear-gradient(to top,
    rgba(8,16,30,.55) 0%,rgba(8,16,30,.18) 26%,transparent 52%)}
  /* Prix en incrustation, coin bas-gauche de la photo — comme sur la fiche bien.
     Il était en flux (position:static) juste sous l'image : il rognait la photo
     d'une bande de 45px et se détachait du visuel qu'il qualifie. */
  .feature-pricebadge{position:absolute;top:auto;bottom:0;left:0;right:auto;z-index:3;
    order:0;align-self:auto;border-radius:0 5px 0 0;margin:0;padding:10px 20px;font-size:1.32rem}
  .feature-row.alt .feature-pricebadge{border-radius:0 5px 0 0;padding:10px 20px}
  .feature-panel{order:3;position:static;margin:0;padding:16px 20px 22px;max-width:none}
  .feature-actions{margin-top:16px;gap:12px}
  .feature-actions .btn{flex:1 1 100%;justify-content:center}
}

/* Barème des honoraires — lisibilité mobile : montants insécables, tableau compact */
.bareme-table td,.bareme-table th{font-variant-numeric:tabular-nums}
.bareme-table td:last-child{white-space:nowrap}
@media(max-width:760px){
  .bareme-table th,.bareme-table td{padding:11px 12px;font-size:.86rem}
  .bareme-table th{font-size:.66rem;letter-spacing:.06em}
  .bareme-table td:first-child{padding-right:6px}
}
@media(max-width:400px){
  .bareme-table th,.bareme-table td{padding:10px 9px;font-size:.8rem}
}

/* Respiration au-dessus de la photo d'Océane (accueil + agence), version mobile */
@media(max-width:1080px){
  .home .agent,.page-agence .agent{padding-top:clamp(26px,7vw,44px)}
}

/* Contact — correctif débordement mobile : un élément de grille a min-width:auto
   par défaut, donc la colonne s'élargissait au contenu et sortait de l'écran. */
.contact-wrap,.estim-wrap{min-width:0}
.contact-wrap > *,.estim-wrap > *{min-width:0}
.contact-wrap .detail-card,.estim-wrap .detail-card{max-width:100%}
.form-grid{min-width:0}
.form-grid .field{min-width:0}
.form-grid input,.form-grid select,.form-grid textarea{max-width:100%}
@media(max-width:560px){
  .page-contact .detail-card,.page-vendre .detail-card{padding:22px 18px}
  .form-grid{grid-template-columns:1fr;gap:14px}
}

/* Barème — libellé long en desktop, version courte (une seule ligne) sur mobile */
.bareme-table .bt-court{display:none}
@media(max-width:760px){
  .bareme-table .bt-long{display:none}
  .bareme-table .bt-court{display:inline}
  .bareme-table{table-layout:fixed;width:100%}
  .bareme-table td:first-child,.bareme-table th:first-child{width:62%;white-space:nowrap}
  .bareme-table td:last-child,.bareme-table th:last-child{width:38%}
  .bareme-table th,.bareme-table td{padding:11px 10px}
}
@media(max-width:380px){
  .bareme-table th,.bareme-table td{padding:10px 8px;font-size:.78rem}
}

/* CTA principal des en-têtes photo (page Vendre) */
.ph-cta{margin-top:30px}
.ph-cta-btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;
  padding:17px 32px;font-size:.86rem;letter-spacing:.09em;line-height:1.35;text-align:center;
  border-radius:4px;box-shadow:0 16px 34px -14px rgba(199,162,76,.75)}
.ph-cta-btn svg{width:21px;height:21px;flex-shrink:0;stroke:currentColor;fill:none}
.ph-cta-btn strong{font-weight:800}
.ph-cta-btn:hover{box-shadow:0 20px 40px -12px rgba(199,162,76,.85)}
@media(max-width:760px){
  .ph-cta{margin-top:24px}
  .ph-cta-btn{width:100%;padding:16px 18px;font-size:.9rem;letter-spacing:.05em;
    min-height:60px;gap:11px}
  .ph-cta-btn svg{width:23px;height:23px}
}

/* ── Page « Nos biens » — en-tête compact sur mobile :
   le premier bien doit être visible dès l'ouverture (référence : apps immo) ── */
@media(max-width:760px){
  .page-acheter .page-head{padding-top:76px;padding-bottom:8px}
  /* Fil d'Ariane superflu sur mobile (il reste balisé pour Google) */
  .page-acheter .page-head .breadcrumb{display:none}
  .acheter-h1{font-size:1.06rem;line-height:1.25;margin:0 0 10px}
  .page-acheter .search-panel{padding:12px;margin-top:0}
  .page-acheter .search-row{gap:8px}
  .page-acheter .search-field input,.page-acheter .search-field select{padding-top:11px;padding-bottom:11px}
  .page-acheter .adv-btn{padding:10px 8px}
  /* Compteur + favoris + vues : une seule ligne compacte */
  .page-acheter .results-bar{margin:14px 0 12px!important;display:flex;align-items:center;
    justify-content:space-between;gap:10px;flex-wrap:nowrap}
  .page-acheter .results-bar > *{margin:0}
  .page-acheter .results-count{font-size:.9rem;white-space:nowrap}
  .page-acheter .fav-filter{padding:8px 12px;font-size:.72rem;white-space:nowrap}
  .page-acheter .fav-filter span{display:none}
  .page-acheter .view-toggle button{padding:8px 10px}
}

/* Barre de résultats — tenir sur une ligne même sur très petit écran */
@media(max-width:760px){
  .page-acheter #results-count{white-space:nowrap;flex:0 0 auto;font-size:.88rem}
  .page-acheter .results-tools{flex:0 1 auto;min-width:0;gap:8px}
}
@media(max-width:400px){
  /* Le libellé « Favoris » cède la place : l'icône cœur suffit */
  .page-acheter .fav-filter{font-size:0;padding:9px 11px;gap:0}
  .page-acheter .fav-filter svg{width:18px;height:18px}
  .page-acheter .search-field input,.page-acheter .search-field select{font-size:15px}
  .page-acheter .search-field select{padding-left:11px;padding-right:26px}
  .acheter-h1{font-size:1rem}
}

/* Mobile : le H1 « Nos biens à vendre… » est masqué visuellement pour laisser
   la place aux annonces, mais reste dans le flux pour Google et les lecteurs
   d'écran (technique accessible, contrairement à display:none). */
@media(max-width:760px){
  .acheter-h1{position:absolute;width:1px;height:1px;padding:0;margin:-1px;
    overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
}