.elementor-kit-9{--e-global-color-primary:#171512;--e-global-color-secondary:#a09b8e;--e-global-color-text:#3a362e;--e-global-color-accent:#6d695f;--e-global-color-hvivoire:#fcfbf9;--e-global-color-hvligne:#e8e5de;--e-global-color-hvlchamp:#d6d2c8;--e-global-color-hvsvcart:#f6f4ef;--e-global-color-hvsvbtn:#f4f2ec;--e-global-color-hvresimg:#efede8;--e-global-typography-primary-font-family:"Marcellus";--e-global-typography-primary-font-size:clamp(46px, 6.8vw, 86px);--e-global-typography-primary-font-weight:400;--e-global-typography-primary-line-height:1.04em;--e-global-typography-secondary-font-family:"Marcellus";--e-global-typography-secondary-font-size:clamp(30px, 4.4vw, 54px);--e-global-typography-secondary-font-weight:400;--e-global-typography-secondary-line-height:1.12em;--e-global-typography-text-font-family:"Figtree";--e-global-typography-text-font-size:14.5px;--e-global-typography-text-font-weight:300;--e-global-typography-text-line-height:1.8em;--e-global-typography-accent-font-family:"Figtree";--e-global-typography-accent-font-size:11px;--e-global-typography-accent-font-weight:400;--e-global-typography-accent-text-transform:uppercase;--e-global-typography-accent-letter-spacing:0.18em;--e-global-typography-hvtitpag-font-family:"Marcellus";--e-global-typography-hvtitpag-font-size:clamp(34px, 4.6vw, 52px);--e-global-typography-hvtitpag-font-weight:400;--e-global-typography-hvtitpag-line-height:1.05em;--e-global-typography-hvsurtsc-font-family:"Marcellus";--e-global-typography-hvsurtsc-font-size:15px;--e-global-typography-hvsurtsc-font-weight:400;--e-global-typography-hvsurtsc-text-transform:uppercase;--e-global-typography-hvsurtsc-letter-spacing:0.26em;--e-global-typography-hvtitmoy-font-family:"Marcellus";--e-global-typography-hvtitmoy-font-size:clamp(26px, 3vw, 36px);--e-global-typography-hvtitmoy-font-weight:400;--e-global-typography-hvtitmoy-line-height:1.25em;--e-global-typography-hvtitcar-font-family:"Marcellus";--e-global-typography-hvtitcar-font-size:20px;--e-global-typography-hvtitcar-font-weight:400;--e-global-typography-hvchifcl-font-family:"Marcellus";--e-global-typography-hvchifcl-font-size:clamp(32px, 3.2vw, 42px);--e-global-typography-hvchifcl-font-weight:400;--e-global-typography-hvlogo-font-family:"Marcellus";--e-global-typography-hvlogo-font-size:17px;--e-global-typography-hvlogo-font-weight:400;--e-global-typography-hvlogo-text-transform:uppercase;--e-global-typography-hvlogo-letter-spacing:0.32em;--e-global-typography-hvmenu-font-family:"Figtree";--e-global-typography-hvmenu-font-size:11px;--e-global-typography-hvmenu-font-weight:400;--e-global-typography-hvmenu-text-transform:uppercase;--e-global-typography-hvmenu-letter-spacing:0.16em;--e-global-typography-hvetiq-font-family:"Figtree";--e-global-typography-hvetiq-font-size:10px;--e-global-typography-hvetiq-font-weight:400;--e-global-typography-hvetiq-text-transform:uppercase;--e-global-typography-hvetiq-letter-spacing:0.22em;--e-global-typography-hvmicroe-font-family:"Figtree";--e-global-typography-hvmicroe-font-size:9px;--e-global-typography-hvmicroe-font-weight:400;--e-global-typography-hvmicroe-text-transform:uppercase;--e-global-typography-hvmicroe-letter-spacing:0.24em;--e-global-typography-hvsurtcl-font-family:"Figtree";--e-global-typography-hvsurtcl-font-size:10.5px;--e-global-typography-hvsurtcl-font-weight:400;--e-global-typography-hvsurtcl-text-transform:uppercase;--e-global-typography-hvsurtcl-letter-spacing:0.34em;--e-global-typography-hvcorpcl-font-family:"Figtree";--e-global-typography-hvcorpcl-font-size:15px;--e-global-typography-hvcorpcl-font-weight:300;--e-global-typography-hvcorpcl-line-height:1.75em;--e-global-typography-hvcorppt-font-family:"Figtree";--e-global-typography-hvcorppt-font-size:13px;--e-global-typography-hvcorppt-font-weight:300;--e-global-typography-hvcorppt-line-height:1.7em;--e-global-typography-hvprix-font-family:"Figtree";--e-global-typography-hvprix-font-size:14px;--e-global-typography-hvprix-font-weight:500;background-color:#fcfbf9;}.elementor-kit-9 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1600px;}.e-con{--container-max-width:1600px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1023px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-9{--e-global-typography-hvtitcar-font-size:15px;--e-global-typography-hvetiq-font-size:9px;--e-global-typography-hvetiq-letter-spacing:0.08em;--e-global-typography-hvsurtcl-font-size:9px;--e-global-typography-hvsurtcl-letter-spacing:0.24em;--e-global-typography-hvcorppt-font-size:12px;--e-global-typography-hvprix-font-size:13px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}
/* Start custom CSS *//* ============ HAUTEVILLE — jetons de design (brief §3) ============ */
:root{
  --hv-ivoire:#fcfbf9; --hv-encre:#171512; --hv-encre-douce:#3a362e;
  --hv-ardoise:#6d695f; --hv-sable:#a09b8e; --hv-ligne:#e8e5de;
  --hv-ligne-champ:#d6d2c8; --hv-survol-carte:#f6f4ef;
  --hv-survol-bouton-clair:#f4f2ec; --hv-reserve-image:#efede8;
  --hv-i88:rgba(252,251,249,.88); --hv-i85:rgba(252,251,249,.85);
  --hv-i82:rgba(252,251,249,.82); --hv-i78:rgba(252,251,249,.78);
  --hv-i75:rgba(252,251,249,.75); --hv-i72:rgba(252,251,249,.72);
  --hv-i70:rgba(252,251,249,.7);  --hv-i65:rgba(252,251,249,.65);
  --hv-i60:rgba(252,251,249,.6);  --hv-i55:rgba(252,251,249,.55);
  --hv-i50:rgba(252,251,249,.5);  --hv-i45:rgba(252,251,249,.45);
  --hv-i40:rgba(252,251,249,.4);  --hv-i25:rgba(252,251,249,.25);
  --hv-i24:rgba(252,251,249,.24); --hv-i22:rgba(252,251,249,.22);
  --hv-i16:rgba(252,251,249,.16); --hv-i14:rgba(252,251,249,.14);
  --hv-marge:clamp(20px, 4vw, 44px);
  --hv-pad-section:clamp(40px, 6vw, 64px);
  --hv-pad-large:clamp(48px, 7vw, 84px);
  --hv-pad-cta:clamp(76px, 11vw, 140px);
}

/* §3.3 — aucun rayon d'angle nulle part */
.elementor .elementor-widget-container,
.elementor .elementor-button,
.elementor input, .elementor textarea, .elementor select,
.elementor img, .elementor .e-con, .elementor .e-con-inner{border-radius:0}

/* §3.5 — selection de texte */
::selection{background:#e8e5de;color:#171512}
::-moz-selection{background:#e8e5de;color:#171512}

/* §3.1 — fond de reserve pendant le chargement des images de contenu */
.elementor-widget-image img,
.elementor-widget-loop-grid img,
.elementor-widget-theme-post-featured-image img{background-color:#efede8}

/* §15 — focus clavier toujours visible.
   [role=button] couvre le bouton du menu mobile : Elementor le rend en DIV,
   pas en <button>, et il echappait donc a la liste. Mesure du 2026-08-07 :
   il retombait sur l'anneau par defaut du navigateur, outline auto
   rgb(229,151,0) — visible, donc AA respecte, mais hors charte. */
.elementor a:focus-visible, .elementor button:focus-visible,
.elementor [role="button"]:focus-visible,
.elementor .elementor-button:focus-visible, .elementor input:focus-visible,
.elementor textarea:focus-visible, .elementor select:focus-visible{
  outline:none; box-shadow:0 1px 0 0 #171512;
}
.hv-sombre a:focus-visible, .hv-sombre button:focus-visible,
.hv-sombre [role="button"]:focus-visible,
.hv-sombre .elementor-button:focus-visible, .hv-sombre input:focus-visible,
.hv-sombre textarea:focus-visible, .hv-sombre select:focus-visible{
  box-shadow:0 1px 0 0 #fcfbf9;
}

/* §3.5 — portraits de l'equipe en noir et blanc permanent, cadres en 3/4 */
.hv-portrait img{filter:grayscale(1) contrast(1.04); aspect-ratio:3/4; object-fit:cover; width:100%}

/* §3.4 — grille a interstice d'un pixel */
.hv-grille-filet{background-color:#e8e5de; gap:1px}
.hv-grille-filet > .e-con, .hv-grille-filet > .elementor-element{background-color:#fcfbf9}

/* §13 — cibles tactiles d'au moins 44px.
   Le bouton d'envoi d'un formulaire demande une regle propre : le widget
   Formulaire impose .elementor-form .elementor-button.elementor-size-sm
   {min-height:40px}, plus specifique que la regle generale. */
@media (max-width:767px), (pointer:coarse){
  .elementor .elementor-button{
    min-height:44px; display:inline-flex; align-items:center; justify-content:center;
  }
  .elementor .elementor-widget-form .elementor-button[type="submit"]{min-height:44px}

  /* Les listes de la barre de recherche : 4px manquants, sans effet de bord. */
  .hv-champ-liste select{min-height:44px}

  /* Liens et bascules en ligne, dont la hauteur vient d'une typographie
     fixee au §7 et au §8. Deux traitements, selon que grandir deplace ou
     non le dessin.

     a) La cible est isolee, ou son voisin est assez loin : la zone est
        etendue par un pseudo-element transparent, hors flux. Le dessin ne
        bouge pas d'un pixel. C'est le cas du logo, du lien « Toutes les
        locations » et des etiquettes de la barre de recherche. */
  .hv-logo a, .hv-lien-agence a, .hv-champ-offre label{ position:relative }
  .hv-logo a::before, .hv-lien-agence a::before, .hv-champ-offre label::before{
    content:""; position:absolute; left:0; right:0; top:50%;
    transform:translateY(-50%); height:44px;
  }
  .hv-champ-offre label::before{left:-14px; right:-14px}

  /* b) Les listes serrees, ou le pas mesure est bien inferieur a 44px :
        pied de page colonne « Navigation » (22,5px), telephone et courriel
        de la page Contact (23px), options des filtres de l'archive (29px).
        Un pseudo-element de 44px y superposerait deux cibles voisines, qui
        se voleraient les touchers — pire que des cibles courtes. On
        agrandit donc les liens eux-memes : dans une colonne flex, la liste
        s'ecarte au lieu de se chevaucher.

        Le §7 fixe « gap: 10px » pour la colonne Navigation, le §13 exige
        « des cibles tactiles d'au moins 44 px » : les deux ne tiennent pas
        ensemble. Le §13 est la section qui regit le tactile et son exigence
        est chiffree — c'est elle qui l'emporte, et seulement la ou le
        pointeur est grossier. Sur ecran a souris, le pied de page garde
        exactement l'espacement du §7. Ecart consigne au rapport. */
  .hv-footer-nav .hv-lien-clair a, .hv-lien-sombre a, .hv-filtre-option{
    display:inline-flex; align-items:center; min-height:44px;
  }
}

/* §13 — aucun defilement horizontal, a aucune largeur */
html,body{overflow-x:hidden; max-width:100%}

/* Un titre porteur d'un lien garde la couleur reglee sur le widget */
.elementor-widget-heading .elementor-heading-title a{
  color:inherit; text-decoration:none; transition:color .25s ease;
}

/* ============ §8 CARTE DE BIEN — modele de boucle ============ */
/* Composant partage par l'accueil, l'archive et le bien individuel : son CSS
   a donc sa place ici et non dans un widget HTML de page. Tout le reste de la
   carte (fonds, survol, typographies, espacements, lien) vient des reglages. */

/* Cellules d'egale hauteur : la carte remplit la case que lui donne la grille */
.hv-carte-bien{height:100%; position:relative}

/* « La carte entiere est cliquable » : le lien du titre couvre la carte.
   Une seule ancre, dont le nom accessible reste le titre du bien. */
.hv-carte-bien .hv-carte-titre a::after{content:""; position:absolute; inset:0; z-index:1}
.hv-carte-bien:has(a:focus-visible){box-shadow:inset 0 0 0 1px #171512}


/* Ratio 5/4 et recadrage : aucun reglage natif de container ne les produit */
.hv-carte-image{aspect-ratio:5/4; background-color:var(--hv-reserve-image); overflow:hidden}
.hv-carte-image > .elementor-widget,
.hv-carte-image .elementor-widget-container,
.hv-carte-image figure,
.hv-carte-image .elementor-widget-image a{display:block; width:100%; height:100%; margin:0}

/* Ligne de meta : « N° 01 — A louer » et « 92 m² » restent sur une seule ligne,
   chacun colle a son bord. .e-con > .elementor-widget{min-width:0} d'Elementor
   les laisserait sinon se replier. */
.hv-carte-meta > .elementor-widget{flex:0 0 auto; min-width:0}
.hv-carte-meta .elementor-heading-title{white-space:nowrap}

/* ==================== §6 EN-TETE ==================== */

/* Accueil : en-tete transparent superpose a l'image du hero */
body.home .elementor-location-header{position:absolute; top:0; left:0; right:0; z-index:50}

/* L'entree « Estimation » du menu ne sert qu'au panneau mobile */
.elementor-location-header .elementor-nav-menu--main .menu-item--cta{display:none}

/* Bouton d'ouverture du panneau — marque a deux traits.
   Cadre, fond et couleurs viennent des reglages natifs du widget
   (Style > Bouton bascule) : filet d'un pixel, rayon nul comme partout
   au §3.3, ivoire a 65 % qui passe a 100 % au survol. Restent ici les
   deux seules choses que le widget ne sait pas faire : dessiner la
   marque, et la plier en croix a l'ouverture — Elementor se contente
   d'echanger eicon-menu-bar contre eicon-close, sans transition.
   Le carre de 44 px tient la cible tactile du §13 : la bascule native
   mesure 30x30, icone de 20 px plus .25rem de marge interne. */
.elementor-location-header .elementor-menu-toggle{
  position:relative; z-index:70;
  min-width:44px; min-height:44px;
  display:flex; align-items:center; justify-content:center;
}
/* Les deux glyphes natifs cedent la place. Elementor 4.2 les rend en
   <svg class="elementor-menu-toggle__icon--open|--close">, et non plus
   en <i class="eicon-...">. Quatre classes : la regle de Pro qui revele
   le glyphe de fermeture a l'ouverture en pese trois, et elle
   emporterait sinon nos deux traits. */
.elementor-location-header .elementor-widget-nav-menu .elementor-menu-toggle .elementor-menu-toggle__icon--open,
.elementor-location-header .elementor-widget-nav-menu .elementor-menu-toggle .elementor-menu-toggle__icon--close{display:none}
/* currentColor : la couleur des traits reste pilotee par le reglage
   « Couleur » du widget, normal et survol compris. */
.elementor-location-header .elementor-menu-toggle::before,
.elementor-location-header .elementor-menu-toggle::after{
  content:""; position:absolute; left:50%; top:50%; height:1px;
  background-color:currentColor;
  transition:width .38s cubic-bezier(.22,.61,.36,1),
             transform .38s cubic-bezier(.22,.61,.36,1);
}
/* Centrage par translate et non par « right » : la marque garde sa place
   quelle que soit l'epaisseur de bordure reglee sur le widget. */
.elementor-location-header .elementor-menu-toggle::before{
  width:20px; transform:translate(-50%,-50%) translateY(-3.5px);
}
.elementor-location-header .elementor-menu-toggle::after{
  width:13px; transform:translate(-50%,-50%) translate(3.5px,3.5px);
}
/* Survol : le trait court rattrape le long, aligne a droite. */
.elementor-location-header .elementor-menu-toggle:hover::after,
.elementor-location-header .elementor-menu-toggle:focus-visible::after{
  width:20px; transform:translate(-50%,-50%) translateY(3.5px);
}
/* Ouvert : les deux traits se croisent. aria-expanded double la classe,
   au cas ou Pro renommerait elementor-active. */
.elementor-location-header .elementor-menu-toggle.elementor-active::before,
.elementor-location-header .elementor-menu-toggle[aria-expanded="true"]::before{
  transform:translate(-50%,-50%) rotate(45deg);
}
.elementor-location-header .elementor-menu-toggle.elementor-active::after,
.elementor-location-header .elementor-menu-toggle[aria-expanded="true"]::after{
  width:20px; transform:translate(-50%,-50%) rotate(-45deg);
}
@media (prefers-reduced-motion:reduce){
  .elementor-location-header .elementor-menu-toggle::before,
  .elementor-location-header .elementor-menu-toggle::after{transition:none}
}

/* Panneau lateral sous 1024 px (§6) */
@media (max-width:1023px){
  .elementor-location-header nav.elementor-nav-menu--dropdown{
    position:fixed; top:0; right:0; left:auto;
    /* Elementor Pro pose margin-top:10px sur le panneau : a annuler en fixed */
    margin-top:0;
    width:min(86vw, 400px);
    height:100dvh !important; max-height:none !important;
    padding:92px var(--hv-marge) 40px;
    overflow-y:auto;
    /* le fond du panneau vient du reglage natif « Menu deroulant > Arriere-plan » */
    border-left:1px solid var(--hv-i14);
    z-index:60;
  }
  .elementor-location-header nav.elementor-nav-menu--dropdown > ul.elementor-nav-menu{
    display:flex; flex-direction:column; min-height:calc(100dvh - 132px);
  }
  .elementor-location-header .elementor-nav-menu--dropdown .elementor-item{
    justify-content:flex-start; text-align:left;
  }
  /* Bouton « Estimation » en pied de panneau */
  .elementor-location-header .elementor-nav-menu--dropdown .menu-item--cta{
    margin-top:auto; padding-top:32px;
  }
  /* 6 classes : la typo du menu deroulant du widget pese 0,5,0 et emporterait
     sinon la fonte et la taille de ce bouton. */
  .elementor-location-header .elementor-widget-nav-menu .elementor-nav-menu--dropdown .elementor-nav-menu .menu-item--cta .elementor-item{
    font-family:"Figtree", sans-serif; font-size:11px; font-weight:400;
    line-height:1.2em; letter-spacing:.18em; text-transform:uppercase;
    border:1px solid var(--hv-i65);
    padding:15px 20px !important;
    justify-content:center; text-align:center;
  }
  .elementor-location-header .elementor-widget-nav-menu .elementor-nav-menu--dropdown .elementor-nav-menu .menu-item--cta .elementor-item:hover,
  .elementor-location-header .elementor-widget-nav-menu .elementor-nav-menu--dropdown .elementor-nav-menu .menu-item--cta .elementor-item:focus{
    background-color:#fcfbf9; color:#171512;
  }
}

/* ==================== §7 PIED DE PAGE ==================== */
.elementor-location-footer .elementor-heading-title a:hover{color:#fcfbf9}

/* ==================== §8 MOUVEMENT REDUIT ==================== */
/* Les animations d'entree viennent des reglages natifs. Aucun panneau
   Elementor ne gere « prefers-reduced-motion » : le contenu doit rester
   visible et le mouvement se taire. */
@media (prefers-reduced-motion:reduce){
  .elementor-invisible{visibility:visible !important; opacity:1 !important}
  .elementor-element.animated{animation:none !important}
}/* End custom CSS */