/* ==========================================================================
   B2V - Hero des pages outils (favoris, comparateur, profil)
   Reecrit le 31/08/2026.

   CORRECTION DE DIRECTION : la premiere version copiait le hero sombre des
   pages de listing. Mais ce hero ne fonctionne qu'avec une photo derriere ;
   sans photo, le fondu blanc sur fond sombre donne un gris sale.

   Dans le Figma, les pages secondaires (Nos courtiers, Academie) sont CLAIRES :
   fond blanc, grand titre sombre, pastille en surtitre. C'est ce langage-la
   qu'on applique ici.
   ========================================================================== */

/* Pleine largeur : la mise en page contrainte de WordPress impose max-width
   et des marges auto sur les enfants directs. On la neutralise explicitement. */
.entry-content .b2v-hero,
.b2v-hero{
  position:relative;
  overflow:hidden;
  background:#fff;
  border-bottom:1px solid #F3ECDC;
  width:100vw !important;
  max-width:100vw !important;
  margin-left:calc(50% - 50vw) !important;
  margin-right:calc(50% - 50vw) !important;
}

/* Voile creme tres doux + accent dore diffus : de la matiere, pas de la boue. */
.b2v-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(760px 340px at 50% -12%, rgba(224,194,106,.22) 0%, rgba(224,194,106,0) 68%),
    radial-gradient(620px 300px at 88% 110%, rgba(96,34,45,.07) 0%, rgba(96,34,45,0) 70%),
    linear-gradient(180deg,#FFFBF2 0%,#ffffff 72%);
  pointer-events:none;
}

.b2v-hero-in{
  position:relative;
  z-index:2;
  max-width:880px;
  margin:0 auto;
  /* Compact : le hero respire sans occuper un ecran entier. */
  padding:clamp(40px,5.5vw,68px) 24px clamp(34px,4.5vw,50px);
  text-align:center;
}

.b2v-eyebrow{
  display:inline-block;
  margin-bottom:14px;
  padding:6px 15px;
  border:1px solid rgba(96,34,45,.20);
  border-radius:30px;
  background:#fff;
  color:#60222D;
  font-family:"Hanken Grotesk",sans-serif;
  font-size:11.5px;
  font-weight:700;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.b2v-hero-in h1{
  margin:0;
  color:#111827;
  font-family:"Hanken Grotesk",sans-serif;
  font-size:clamp(1.9rem,4.4vw,3rem);
  font-weight:800;
  line-height:1.06;
  letter-spacing:-.022em;
}

/* Filet dore court sous le titre : signature discrete. */
.b2v-hero-in h1::after{
  content:"";
  display:block;
  width:56px;
  height:3px;
  margin:18px auto 0;
  border-radius:2px;
  background:linear-gradient(90deg,#E0C26A,#a87f2e);
}

.b2v-hero-in .sub{
  max-width:560px;
  margin:16px auto 0;
  color:#6f6f76;
  font-size:clamp(.9375rem,1.5vw,1.0625rem);
  line-height:1.6;
}

.b2v-hero-pills{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:.5rem;
  margin:22px 0 0;
}
.b2v-hero-pills span{
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  padding:.42rem .9rem;
  border:1px solid #ececec;
  border-radius:999px;
  background:#fff;
  color:#111827;
  font-size:.8125rem;
  font-weight:500;
  box-shadow:0 1px 2px rgba(17,24,39,.04);
}
.b2v-hero-pills span::before{
  content:"";
  width:5px; height:5px;
  border-radius:50%;
  background:#E0C26A;
}

/* Corps de page sous le hero */
.b2v-page-in{
  max-width:1200px;
  margin:0 auto;
  padding:clamp(2rem,4vw,3rem) clamp(1.25rem,5vw,4rem) clamp(3rem,7vw,5rem);
}
.b2v-page-in--lift{ margin-top:0; }

/* --- Page Mes favoris ----------------------------------------------------- */
.b2v-fav-tete{
  justify-content:flex-start !important;
  gap:.5rem !important;
}
.b2v-fav-tete .b2v-fav-vider{ margin-left:auto; }

.b2v-fav-grille{
  display:grid !important;
  grid-template-columns:repeat(auto-fill,minmax(320px,1fr)) !important;
  gap:1.6rem !important;
}
.b2v-fav-grille .ev-card{
  display:flex;
  flex-direction:column;
  background:#fff;
  border:1px solid #ececec;
  border-radius:18px;
  overflow:hidden;
}
.b2v-fav-grille .ev-card-img{
  position:relative;
  aspect-ratio:16/10;
  width:100%;
  border-radius:0 !important;
}
.b2v-fav-grille .ev-card-body{
  padding:1.15rem 1.25rem 1.35rem;
  display:flex;
  flex-direction:column;
  flex:1;
}
.b2v-fav-grille .ev-card-body h3{
  margin:0 0 .5rem;
  font-size:1.0625rem;
  font-weight:700;
  color:#111827;
  line-height:1.3;
}
.b2v-fav-grille .ev-exc{
  margin:0 0 1rem;
  color:#6f6f76;
  font-size:.875rem;
  line-height:1.55;
}
.b2v-fav-grille .ev-act{ margin-top:auto; }
.b2v-fav-grille .ev-btn{
  display:inline-block;
  padding:.8rem 1.4rem;
  background:#60222D;
  color:#fff;
  border-radius:8px;
  text-decoration:none;
  font-weight:600;
  font-size:.9375rem;
}
.b2v-fav-grille .ev-btn:hover{ background:#7a2d3a; }


/* --- Colle le hero sous l'en-tete ----------------------------------------
   Le gabarit applique margin-top:24px sur <main> (blockGap du theme), ce qui
   laissait une bande blanche entre l'en-tete et le hero. On la retire
   uniquement sur les pages qui commencent par un hero pleine largeur.
   ---------------------------------------------------------------------- */
.page-id-448 main.wp-block-group,
.page-id-453 main.wp-block-group,
.page-id-456 main.wp-block-group{
  margin-top:0 !important;
}
.page-id-448 .entry-content > *:first-child,
.page-id-453 .entry-content > *:first-child,
.page-id-456 .entry-content > *:first-child{
  margin-top:0 !important;
}


/* --- Grille de cartes hors moteur ----------------------------------------
   Le CSS .b2v-ev est injecte par le shortcode du moteur : il n'existe pas sur
   l'accueil. Cette grille est donc autonome. Alias applique aussi a la grille
   du profil investisseur.
   ---------------------------------------------------------------------- */
.b2v-cards-grid,
.b2v-profil-grille{
  display:grid !important;
  grid-template-columns:repeat(auto-fill,minmax(320px,1fr));
  gap:1.6rem;
}
.b2v-cards-grid .ev-card,
.b2v-cards-grid .im-card{
  display:flex; flex-direction:column;
  background:#fff; border:1px solid #ececec;
  border-radius:18px; overflow:hidden;
}
.b2v-cards-grid .ev-card-img,
.b2v-cards-grid .im-card-img{ position:relative; aspect-ratio:16/10; width:100%; }
.b2v-cards-grid .ev-card-body{ padding:1.15rem 1.25rem 1.35rem; display:flex; flex-direction:column; flex:1; }
.b2v-cards-grid .ev-card-body h3{ margin:0 0 .55rem; font-size:1.0625rem; font-weight:700; color:#111827; line-height:1.3; }
.b2v-cards-grid .ev-meta{ display:flex; flex-direction:column; gap:.3rem; color:#6f6f76; font-size:.875rem; margin-bottom:.7rem; }
.b2v-cards-grid .ev-meta span{ display:flex; align-items:center; gap:.4rem; }
.b2v-cards-grid .ev-meta .ic{ color:#60222D; flex:0 0 auto; }
.b2v-cards-grid .ev-hr{ height:1px; background:#ececec; margin:.7rem 0; }
.b2v-cards-grid .ev-stats{ display:flex; flex-wrap:wrap; gap:.9rem; font-size:.8125rem; color:#111827; }
.b2v-cards-grid .ev-stats i{ font-style:normal; color:#6f6f76; }
.b2v-cards-grid .ev-exc{ margin:.7rem 0 1rem; color:#6f6f76; font-size:.875rem; line-height:1.55; }
.b2v-cards-grid .ev-act{ display:flex; align-items:center; flex-wrap:wrap; gap:.5rem; margin-top:auto; }
.b2v-cards-grid .ev-btn{ display:inline-block; padding:.8rem 1.4rem; background:#60222D; color:#fff; border-radius:8px; text-decoration:none; font-weight:600; font-size:.9375rem; }
.b2v-cards-grid .ev-btn:hover{ background:#7a2d3a; }
.b2v-cards-grid .ev-badge{ position:absolute; top:12px; left:12px; display:inline-flex; align-items:center; gap:.4rem; padding:.35rem .7rem; background:rgba(255,255,255,.94); border-radius:999px; font-size:.75rem; font-weight:600; color:#111827; }
.b2v-cards-grid .ev-badge .dot{ width:7px; height:7px; border-radius:50%; background:#1f7a4d; }
.b2v-cards-grid .ev-badge.pop .dot{ background:#e2557f; }

/* Section vedettes sur l'accueil */
.hm-vedettes{ margin:70px 0 10px; }
.hm-vedettes-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; flex-wrap:wrap; margin-bottom:30px; }
.hm-vedettes-head h2{ font-size:clamp(28px,3.4vw,42px); font-weight:800; color:#111827; margin:0 0 8px; letter-spacing:-.02em; }
.hm-vedettes-head p{ color:#6f6f76; font-size:16px; margin:0; }
.hm-vedettes-head a{ color:#60222D; font-weight:700; font-size:15px; text-decoration:none; white-space:nowrap; }
.hm-vedettes-head a:hover{ text-decoration:underline; }


/* ==========================================================================
   Adaptations petits ecrans
   Ajoute le 31/08/2026 : ce fichier n'avait aucune regle mobile alors qu'il
   porte les heros, la grille de cartes et la page favoris.
   ========================================================================== */
@media (max-width:640px){

  /* Une seule colonne, et surtout minmax a 0 pour eviter tout debordement
     horizontal quand la carte est plus large que l'ecran. */
  .b2v-cards-grid,
  .b2v-profil-grille,
  .b2v-fav-grille{
    grid-template-columns:1fr !important;
    gap:1.1rem !important;
  }

  .b2v-hero-in{ padding-left:18px; padding-right:18px; }
  .b2v-hero-in h1{ font-size:clamp(1.6rem,7.5vw,2rem); }
  .b2v-hero-pills{ gap:.4rem; }
  .b2v-hero-pills span{ font-size:.75rem; padding:.35rem .7rem; }

  .b2v-page-in{ padding-left:18px; padding-right:18px; }

  /* En-tete de section vedettes : le lien passe sous le titre */
  .hm-vedettes-head{ flex-direction:column; align-items:flex-start; gap:.6rem; }

  /* Barre de comparaison fixe : elle ne doit pas masquer le bas de page */
  body{ padding-bottom:0; }

  /* Compteur favoris : evite le retour a la ligne du titre */
  .b2v-fav-tete{ font-size:.95rem; }
}

/* Securite globale : aucune image ou media ne depasse son conteneur. */
.b2v-cards-grid img,
.b2v-profil-grille img,
.b2v-fav-grille img{ max-width:100%; height:auto; }


/* ==========================================================================
   B2V - Historique du prix (fiches)
   ========================================================================== */
.b2v-ph{
  margin:0 0 40px;
  padding:24px 26px;
  background:#FFFBF2;
  border:1px solid #F3ECDC;
  border-radius:16px;
}
.b2v-ph-t{
  margin:0 0 10px;
  font-family:'Hanken Grotesk',sans-serif;
  font-size:1.15rem;
  font-weight:800;
  color:#111827;
}
.b2v-ph-r{ margin:0 0 16px; color:#6f6f76; font-size:.9375rem; }
.b2v-ph-r strong{ color:#111827; }
.b2v-ph-baisse strong{ color:#1f7a4d; }
.b2v-ph-l{ list-style:none; margin:0; padding:0; }
.b2v-ph-i{
  display:grid;
  grid-template-columns:150px 1fr auto;
  gap:12px;
  align-items:center;
  padding:11px 0;
  border-top:1px solid #eee5d2;
  font-size:.9375rem;
}
.b2v-ph-i:first-child{ border-top:0; }
.b2v-ph-d{ color:#6f6f76; font-size:.875rem; }
.b2v-ph-lab{ color:#111827; }
.b2v-ph-p{ font-weight:800; color:#111827; font-family:'Hanken Grotesk',sans-serif; }
.b2v-ph-i.is-down .b2v-ph-lab{ color:#1f7a4d; font-weight:600; }
.b2v-ph-i.is-down .b2v-ph-p{ color:#1f7a4d; }
.b2v-ph-i.is-up .b2v-ph-lab{ color:#a87f2e; font-weight:600; }
@media (max-width:560px){
  .b2v-ph-i{ grid-template-columns:1fr auto; }
  .b2v-ph-d{ grid-column:1 / -1; }
}


/* ==========================================================================
   B2V - Calculatrice de financement (remplace le bloc Go Premium verrouille)
   ========================================================================== */
.ep-locked[data-b2v-fin], .pc-locked[data-b2v-fin]{
  filter:none !important;
  pointer-events:auto !important;
  opacity:1 !important;
  height:auto !important;
  overflow:visible !important;
}
.b2v-fin{
  padding:26px 28px;
  background:#fff;
  border:1px solid #ececec;
  border-radius:18px;
  box-shadow:0 2px 8px rgba(17,24,39,.05);
}
.b2v-fin-head h3{
  margin:0 0 6px;
  font-family:'Hanken Grotesk',sans-serif;
  font-size:1.3rem; font-weight:800; color:#111827;
}
.b2v-fin-head p{ margin:0 0 22px; color:#6f6f76; font-size:.9375rem; }
.b2v-fin-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  gap:16px; margin-bottom:24px;
}
.b2v-fin-f label{
  display:block; margin:0 0 6px;
  font-size:.8125rem; font-weight:600; color:#111827;
}
.b2v-fin-in{ position:relative; display:flex; align-items:center; }
.b2v-fin-in input{
  width:100%; padding:.72rem .9rem; padding-right:2.6rem;
  border:1px solid #e3d9c4; border-radius:8px; background:#FFFBF2;
  font:inherit; font-weight:600; color:#111827;
  transition:border-color .18s ease, box-shadow .18s ease;
}
.b2v-fin-in input:focus{
  outline:none; border-color:#60222D; background:#fff;
  box-shadow:0 0 0 3px rgba(96,34,45,.10);
}
.b2v-fin-in span{
  position:absolute; right:.85rem;
  color:#6f6f76; font-size:.875rem; font-weight:600; pointer-events:none;
}
.b2v-fin-res{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:1px; background:#ececec;
  border:1px solid #ececec; border-radius:12px; overflow:hidden;
}
.b2v-fin-r{
  background:#fff; padding:16px 18px;
  display:flex; flex-direction:column; gap:5px;
}
.b2v-fin-r span{ color:#6f6f76; font-size:.8125rem; }
.b2v-fin-r strong{
  font-family:'Hanken Grotesk',sans-serif;
  font-size:1.15rem; font-weight:800; color:#111827;
}
.b2v-fin-r--main{ background:linear-gradient(135deg,#FFFBF2,#F3ECDC); }
.b2v-fin-r--main strong{ color:#60222D; font-size:1.45rem; }
.b2v-fin-note{
  margin:16px 0 0; color:#9a9aa0;
  font-size:.75rem; line-height:1.55; max-width:72ch;
}
.b2v-fin-cta{ margin-top:18px; }
@media (max-width:560px){
  .b2v-fin{ padding:20px 18px; }
  .b2v-fin-grid{ grid-template-columns:1fr; }
}

/* Bouton du bloc financement : .ev-btn n'est stylee que dans le moteur. */
.b2v-fin-cta .ev-btn,
.b2v-ph .ev-btn{
  display:inline-block;
  padding:.85rem 1.6rem;
  background:#60222D;
  color:#fff !important;
  border-radius:8px;
  text-decoration:none !important;
  font-family:'Hanken Grotesk',sans-serif;
  font-weight:700;
  font-size:.9375rem;
  transition:background-color .18s ease, transform .18s ease;
}
.b2v-fin-cta .ev-btn:hover{ background:#7a2d3a; transform:translateY(-1px); }

/* Le gabarit immobilier floute .pc-locked en grille 3 colonnes et pose
   .pc-premium-cta en calque absolu par-dessus. Quand la calculatrice prend le
   relais, on neutralise les deux. Idem cote entreprise avec .ep-locked-over. */
.pc-locked[data-b2v-fin]{
  display:block !important;
  grid-template-columns:none !important;
  filter:none !important;
  opacity:1 !important;
  padding:0 !important;
  gap:0 !important;
}
.pc-premium:has(.pc-locked[data-b2v-fin]) .pc-premium-cta,
.ep-premium:has(.ep-locked[data-b2v-fin]) .ep-locked-over{
  display:none !important;
}
/* Repli pour les navigateurs sans :has() */
.b2v-fin-actif .pc-premium-cta,
.b2v-fin-actif .ep-locked-over{ display:none !important; }
.ep-locked[data-b2v-fin]{
  display:block !important;
  filter:none !important;
  opacity:1 !important;
}



