/*
Theme Name:   Logement Intermittent
Theme URI:    https://logement-intermittent.fr
Description:  Thème enfant de ListingHive — identité « clair & acidulé » : framboise pop, or lumineux, liquid glass. Templates sur-mesure (header, footer, cartes). Ne jamais modifier le thème parent.
Author:       Logement Intermittent
Template:     listinghive
Version:      1.6.0
Text Domain:  logement-intermittent
*/

/* =========================================================================
   1. TOKENS — palette framboise / or, clair & acidulé.
   On conserve les anciens noms --li-* en alias (rétro-compat pages.css).
   ========================================================================= */
:root{
  --cream:#FDF9F3; --cream-2:#F7EFE3; --card:#FFFFFF;
  --rasp:#EE3D6F; --rasp-br:#F96E93; --rasp-deep:#C91E52;
  /* CONTRASTE (mesure du 25/07/2026, texte sur blanc) :
       --rasp      #EE3D6F -> 3,80:1  => APLATS et GRAND texte uniquement (>=3:1,
                                        ex. le prix de la fiche en 34px) ;
       --rasp-deep #C91E52 -> 5,54:1  => tout PETIT texte (< 24px, ou < 19px en
                                        gras), la ou le seuil AA est de 4,5:1.
     Pas de quatrieme rose : une premiere version de ce correctif avait introduit
     un token de plus (#D62E5E, 4,76:1) alors que --rasp-deep existait deja,
     etait deja conforme (5,54:1), et est deja la couleur de tous les liens. */
  --gold:#D0861E; --gold-br:#F3BE6B; --gold-deep:#A86A12;
  --ink:#241726; --ink-2:#7E6E80; --border:#EEE3DB;
  --serif:"Fraunces","Cormorant Garamond",Georgia,serif;
  --sans:"Inter","Manrope",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --r-sm:10px; --r:18px; --r-lg:26px; --pill:999px;
  --shadow-sm:0 4px 18px rgba(36,23,38,.07);
  --shadow:0 14px 50px rgba(201,30,82,.12),0 2px 8px rgba(36,23,38,.05);
  --shadow-lg:0 28px 60px rgba(201,30,82,.16);
  --ease:cubic-bezier(.22,1,.36,1); --transition:240ms var(--ease);
  --container:1200px;
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px;--s8:64px;

  /* Couleurs système de CONFIANCE — officialisées, pilotées ici, appliquées
     site-wide (badges profils/fiches/messages + page Confiance).
     Bleu = IDENTITÉ vérifiée · Turquoise = STATUT intermittent. */
  --trust-blue:#2563EB; --trust-blue-lite:#3B82F6; --trust-blue-deep:#1E4FBF;
  --trust-teal:#0D9488; --trust-teal-lite:#10B981; --trust-teal-deep:#0F766E;

  /* Alias rétro-compat (pages.css / verification / certification) */
  --li-bg:var(--cream); --li-card:var(--card); --li-text:var(--ink); --li-text-2:var(--ink-2);
  --li-velvet:var(--rasp); --li-velvet-dark:var(--rasp-deep); --li-brass:var(--gold); --li-brass-soft:var(--gold-br);
  --li-border:var(--border); --li-glass:rgba(255,255,255,.55);
  --li-font-title:var(--serif); --li-font-body:var(--sans);
  --li-radius-sm:var(--r-sm); --li-radius:var(--r); --li-radius-lg:var(--r-lg); --li-radius-pill:var(--pill);
  --li-shadow-sm:var(--shadow-sm); --li-shadow:var(--shadow); --li-shadow-lg:var(--shadow-lg);
  --li-ease:var(--ease); --li-transition:var(--transition); --li-container:var(--container);
  --li-space-1:4px;--li-space-2:8px;--li-space-3:12px;--li-space-4:16px;--li-space-5:24px;--li-space-6:32px;--li-space-7:48px;--li-space-8:64px;
}

/* =========================================================================
   2. BASE
   ========================================================================= */
body{background:var(--cream);color:var(--ink);font-family:var(--sans);line-height:1.6;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,.li-serif{font-family:var(--serif);font-weight:600;line-height:1.08;letter-spacing:-.02em;color:var(--ink)}
a{color:var(--rasp-deep);text-decoration:none;transition:color var(--transition)}
a:hover{color:var(--rasp-deep)}
img{max-width:100%;height:auto}
::selection{background:rgba(238,61,111,.18);color:var(--ink)}
:focus-visible{outline:2px solid var(--rasp);outline-offset:2px;border-radius:6px}

/* Texte en dégradé */
.li-gold-text{background:linear-gradient(118deg,var(--gold-deep),var(--gold) 45%,var(--gold-br) 90%);-webkit-background-clip:text;background-clip:text;color:transparent}
.li-rasp-text{background:linear-gradient(118deg,var(--rasp-deep),var(--rasp) 55%,var(--rasp-br));-webkit-background-clip:text;background-clip:text;color:transparent}

/* =========================================================================
   3. BOUTONS
   ========================================================================= */
.li-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;font-family:var(--sans);font-weight:600;font-size:1rem;line-height:1;white-space:nowrap;
  padding:.92em 1.7em;border-radius:var(--pill);border:none;cursor:pointer;text-align:center;text-decoration:none;transition:transform var(--transition),box-shadow var(--transition),background var(--transition)}
.li-btn--rasp{background:linear-gradient(120deg,var(--rasp-br),var(--rasp) 60%,var(--rasp-deep));color:#fff;box-shadow:0 6px 22px rgba(238,61,111,.34)}
.li-btn--rasp:hover{transform:translateY(-2px);box-shadow:0 12px 32px rgba(238,61,111,.46);color:#fff}
.li-btn--gold{background:linear-gradient(120deg,var(--gold-br),var(--gold) 60%,var(--gold-deep));color:#3A2606;box-shadow:0 6px 22px rgba(208,134,30,.34)}
.li-btn--gold:hover{transform:translateY(-2px);box-shadow:0 12px 32px rgba(208,134,30,.46);color:#3A2606}
.li-btn--ghost{background:rgba(255,255,255,.6);color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--border)}
.li-btn--ghost:hover{box-shadow:inset 0 0 0 1.5px var(--rasp);color:var(--rasp-deep)}
/* Contour framboise : CTA secondaire de marque (remplace le gris terne, ex. « Voir toutes les annonces » accueil). */
.li-btn--rasp-outline{background:transparent;color:var(--rasp-deep);box-shadow:inset 0 0 0 1.5px var(--rasp)}
.li-btn--rasp-outline:hover{background:var(--rasp);color:#fff;transform:translateY(-2px);box-shadow:0 10px 26px rgba(238,61,111,.28)}
/* Action-phare « proposer / publier une annonce » — dégradé de marque framboise→or + reflet.
   Variante unifiée sur tous les points d'entrée de publication. */
.li-btn--publish{position:relative;overflow:hidden;background:linear-gradient(118deg,var(--rasp-deep),var(--rasp) 44%,var(--rasp-br) 72%,var(--gold) 130%);color:#fff;box-shadow:0 6px 22px rgba(238,61,111,.32),0 3px 10px rgba(208,134,30,.18)}
.li-btn--publish::before{content:"";position:absolute;top:0;left:-130%;width:55%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.5),transparent);transform:skewX(-18deg);transition:left .6s var(--ease);pointer-events:none}
.li-btn--publish:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(238,61,111,.44),0 5px 16px rgba(208,134,30,.26);color:#fff}
.li-btn--publish:hover::before{left:140%}
.li-btn--publish>i{font-size:.92em;position:relative}
/* Variante douce : contextes où « publier » est l'action secondaire (accueil, header déconnecté). */
.li-btn--publish-soft{background:linear-gradient(120deg,rgba(249,110,147,.16),rgba(208,134,30,.16));color:var(--rasp-deep);box-shadow:inset 0 0 0 1.6px rgba(238,61,111,.42)}
.li-btn--publish-soft:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 1.6px var(--rasp),0 10px 26px rgba(238,61,111,.20);color:var(--rasp-deep)}
.li-btn--publish-soft>i{font-size:.92em;color:var(--rasp)}
/* Bandeau final framboise : le dégradé de marque se confond avec le fond → CTA inversé blanc + texte framboise (contraste max). Scopé à .li-final, les autres boutons « publier » restent inchangés. */
.li-final .li-btn--publish{background:#fff;color:var(--rasp-deep);box-shadow:0 6px 22px rgba(0,0,0,.16)}
.li-final .li-btn--publish::before{display:none}
.li-final .li-btn--publish>i{color:var(--rasp)}
.li-final .li-btn--publish:hover{background:#fff;color:var(--rasp-deep);transform:translateY(-2px);box-shadow:0 12px 30px rgba(0,0,0,.22)}
@media (prefers-reduced-motion:reduce){.li-btn--publish::before{transition:none}.li-btn--publish:hover,.li-btn--publish-soft:hover{transform:none}}

/* == Anti-fuite thème parent (boutons <button>/<input type=submit>) =======
   ListingHive pose `button[type=submit],input[type=submit]{border-radius:3px;
   background-image:dégradé blanc}` (0,1,1) et le customizer un fond plat :
   plus spécifiques que `.li-btn` (0,1,0) → boutons carrés délavés sur tous les
   formulaires. On re-déclare en (0,2,0) — classe doublée — pour reprendre la
   main sans !important. Base d'abord, variantes ensuite (l'ordre compte). */
.li-btn.li-btn{border-radius:var(--pill);border:none;background-image:none;text-shadow:none}
.li-btn--rasp.li-btn--rasp{background:linear-gradient(120deg,var(--rasp-br),var(--rasp) 60%,var(--rasp-deep));color:#fff}
.li-btn--gold.li-btn--gold{background:linear-gradient(120deg,var(--gold-br),var(--gold) 60%,var(--gold-deep));color:#3A2606}
.li-btn--ghost.li-btn--ghost{background:rgba(255,255,255,.6);color:var(--ink)}
.li-btn--ghost.li-btn--ghost:hover{color:var(--rasp-deep)}
.li-btn--rasp-outline.li-btn--rasp-outline{background:transparent;color:var(--rasp-deep)}
.li-btn--rasp-outline.li-btn--rasp-outline:hover{background:var(--rasp);color:#fff}
.li-btn--publish.li-btn--publish{background:linear-gradient(118deg,var(--rasp-deep),var(--rasp) 44%,var(--rasp-br) 72%,var(--gold) 130%);color:#fff}
.li-btn--publish-soft.li-btn--publish-soft{background:linear-gradient(120deg,rgba(249,110,147,.16),rgba(208,134,30,.16));color:var(--rasp-deep)}
.li-final .li-btn--publish.li-btn--publish{background:#fff;color:var(--rasp-deep)}

/* =========================================================================
   4. GLASS (liquid glass « jour »)
   ========================================================================= */
.li-glass{position:relative;background:rgba(255,255,255,.55);
  -webkit-backdrop-filter:blur(22px) saturate(165%);backdrop-filter:blur(22px) saturate(165%);
  border:1px solid rgba(255,255,255,.8);
  box-shadow:0 14px 50px rgba(201,30,82,.12),0 2px 8px rgba(36,23,38,.05),inset 0 1px 0 rgba(255,255,255,.9)}
.li-glass::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(140deg,rgba(255,255,255,.7),transparent 42%);opacity:.6}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.li-glass{background:rgba(255,255,255,.92)}}

.li-wrap{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:30px}

/* =========================================================================
   5. HEADER sur-mesure (.li-hdr)
   ========================================================================= */
.li-hdr{position:sticky;top:0;z-index:200;background:rgba(253,249,243,.72);
  -webkit-backdrop-filter:blur(18px) saturate(150%);backdrop-filter:blur(18px) saturate(150%);border-bottom:1px solid var(--border)}
.li-hdr__in{display:flex;align-items:center;justify-content:space-between;height:74px;gap:14px;max-width:none;padding-inline:clamp(20px,3.5vw,56px)}
.li-logo{display:flex;align-items:center;gap:10px;font-family:var(--serif);font-size:1.28rem;font-weight:600;color:var(--ink);letter-spacing:-.01em;white-space:nowrap}
.li-logo svg,.li-logo img{width:34px;height:34px;flex:none}
/* Logo : FRAMBOISE au survol (identité de marque), encre au repos — et JAMAIS
   le bleu de lien, qu'HivePress réintroduisait sur les pages d'annonce. */
.li-logo:visited,.li-logo:active{color:var(--ink)}
.li-logo:hover,.li-logo:focus,
.li-logo:hover *,.li-logo:focus *{color:var(--rasp)!important;text-decoration:none}
.li-hdr__nav{display:flex;align-items:center;gap:14px;margin:0 auto}
.li-hdr__nav ul{display:flex;gap:14px;list-style:none;margin:0;padding:0}
.li-hdr__nav li{position:relative}
.li-hdr__nav a{position:relative;font-size:.9rem;font-weight:500;color:var(--ink);padding:6px 0;white-space:nowrap}
.li-hdr__nav a::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--rasp),var(--gold));transform:scaleX(0);transform-origin:left;transition:transform .26s var(--ease)}
.li-hdr__nav a:hover,.li-hdr__nav .current-menu-item>a{color:var(--rasp-deep)}
.li-hdr__nav a:hover::after,.li-hdr__nav .current-menu-item>a::after{transform:scaleX(1)}
.li-hdr__nav-cta{display:none}
/* Entrées secondaires (Confiance/FAQ/Contact) : masquées dans la barre desktop, visibles dans le tiroir. */
/* Entrees secondaires masquees dans la BARRE desktop (elles restent dans le tiroir
   et dans le pied de page). Le selecteur ne peut PAS etre `.li-hdr__nav>ul` :
   mobile-nav.js insere un wrapper `.li-nav__scroll` autour du `ul` (mis en
   `display:contents` en desktop). `display:contents` ne change que la mise en
   page, pas l'arbre DOM : la regle en enfant direct ne matchait donc plus rien
   et FAQ/Contact restaient visibles (verifie au navigateur le 25/07/2026). */
@media(min-width:1231px){.li-hdr__nav li.li-nav-secondary{display:none}}
.li-hdr__cta{display:flex;align-items:center;gap:14px;flex:none}
.li-hdr__cta>*{flex:none}
.li-logo{flex:none}
.li-hdr__nav{min-width:0}

/* Compte connecté : avatar + dropdown (cache tout sauf l'avatar, révèle au survol) */
.li-hdr__account{position:relative}
.li-hdr__avatar{width:42px;height:42px;border-radius:50%;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1rem;color:#3A2606;background:linear-gradient(135deg,var(--gold-br),var(--gold-deep));box-shadow:0 4px 14px rgba(208,134,30,.3)}
/* Le menu flotte librement : on neutralise le clip vertical du conteneur parent
   (thème listinghive : .site-container{overflow:hidden}) qui rognait le menu dès
   qu'il dépassait sous le footer. overflow-x:clip garde l'anti-débordement horizontal. */
.site-container{overflow-x:clip!important;overflow-y:visible!important}
.li-hdr__menu{position:absolute!important;top:calc(100% + 14px);right:0;min-width:264px;max-width:300px;max-height:calc(100dvh - 97px);overflow-y:auto;overscroll-behavior:contain;background:#fff;border:1px solid var(--border);border-radius:var(--r);box-shadow:var(--shadow-lg,var(--shadow));padding:8px;opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .2s,transform .2s,visibility .2s;z-index:300}
.li-hdr__menu::-webkit-scrollbar{width:8px}.li-hdr__menu::-webkit-scrollbar-thumb{background:var(--border);border-radius:8px}
.li-hdr__account::after{content:"";position:absolute;top:100%;right:0;width:70px;height:16px}
.li-hdr__account:hover .li-hdr__menu,.li-hdr__account:focus-within .li-hdr__menu,.li-hdr__account.is-open .li-hdr__menu{opacity:1;visibility:visible;transform:none}
.li-hdr__account ul{display:flex;flex-direction:column;gap:2px;list-style:none;margin:0;padding:0}
.li-hdr__account li{width:100%}
.li-hdr__account a{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;color:var(--ink);font-size:.92rem;font-weight:500;word-break:break-word}
.li-hdr__account a:hover{background:var(--cream-2);color:var(--rasp)}
.li-hdr__account i{color:var(--rasp);font-size:1rem;width:18px;text-align:center;flex:none}
/* En-tête du menu compte (nom du membre) + séparateur + déconnexion */
.li-hdr__menu-head{padding:8px 12px 11px;margin-bottom:4px;border-bottom:1px solid var(--border);display:flex;flex-direction:column;gap:2px}
.li-hdr__menu-name{font-family:var(--serif);font-weight:600;font-size:1.02rem;color:var(--ink);line-height:1.2;word-break:break-word}
.li-hdr__menu-sub{font-size:.7rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-2)}
/* Chips de statut (formule + confiance) dans l'en-tête du menu compte */
.li-status{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.li-status__chip{display:inline-flex;align-items:center;gap:5px;padding:3px 9px 3px 8px;border-radius:var(--pill);font-size:.72rem;font-weight:700;line-height:1.45;border:1px solid transparent;white-space:nowrap}
.li-status__chip i{font-size:.74rem;width:auto;flex:none}
.li-status__chip em{font-style:normal;font-size:.78rem;line-height:1;margin-left:1px}
.li-status__chip--free{background:var(--cream-2);color:var(--ink-2);border-color:var(--border)}
.li-status__chip--free i{color:var(--ink-2)}
.li-status__chip--member{background:rgba(238,61,111,.10);color:var(--rasp-deep);border-color:rgba(238,61,111,.24)}
.li-status__chip--member i{color:var(--rasp)}
.li-status__chip--support{background:rgba(208,134,30,.14);color:var(--gold-deep);border-color:rgba(208,134,30,.32)}
.li-status__chip--support i,.li-status__chip--support em{color:var(--gold-deep)}
/* Profil vérifié = BLEU ; Membre de confiance = VERT (cohérent partout). */
.li-status__chip--verified{background:rgba(37,99,235,.12);color:#1E4FBF;border-color:rgba(37,99,235,.30)}
.li-status__chip--verified i{color:#2563EB}
.li-status__chip--trust{background:rgba(13,148,136,.12);color:#0B7A6E;border-color:rgba(13,148,136,.30)}
.li-status__chip--trust i{color:#0D9488}
.li-hdr__menu-sep{height:1px;background:var(--border);margin:5px 8px}
.li-hdr__menu-link--out{color:var(--ink-2)}
.li-hdr__menu-link--out:hover{color:var(--rasp);background:var(--cream-2)}
.li-hdr__menu-link--out i{color:var(--ink-2)}
.li-hdr__menu-link--out:hover i{color:var(--rasp)}
.li-hdr__menu-pro{margin-left:auto;flex:none;font-size:.6rem;font-weight:700;letter-spacing:.01em;color:var(--gold-deep);background:rgba(208,134,30,.14);border:1px solid rgba(208,134,30,.32);border-radius:var(--pill);padding:2px 7px;line-height:1.35}

/* Burger (mobile) */
.li-hdr__burger{display:none;flex-direction:column;justify-content:center;gap:5px;width:44px;height:44px;padding:11px;background:none;border:none;cursor:pointer;border-radius:12px}
.li-hdr__burger span{display:block;height:2px;width:100%;background:var(--ink);border-radius:2px;transition:transform .3s var(--ease),opacity .2s}
body.li-menu-open .li-hdr__burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
body.li-menu-open .li-hdr__burger span:nth-child(2){opacity:0}
body.li-menu-open .li-hdr__burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* Overlay du tiroir */
.li-overlay{position:fixed;inset:0;background:rgba(36,23,38,.42);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s;z-index:190}
body.li-menu-open .li-overlay{opacity:1;visibility:visible}
body.li-menu-open{overflow:hidden}

@media(max-width:1230px){
	/* CRUCIAL : en mobile le tiroir .li-hdr__nav est position:fixed. Le header
	   .li-hdr porte un backdrop-filter (glass) qui CRÉE un containing block pour
	   ses descendants fixed → le tiroir se cale sur le header (poussé ~300px plus
	   bas par le bandeau d'inscription en flux) au lieu du viewport, et son bas
	   (« Connexion ») déborde sous l'écran, inatteignable au scroll. On retire le
	   flou en mobile (imperceptible ici) pour que le tiroir soit ancré au viewport. */
	.li-hdr{-webkit-backdrop-filter:none!important;backdrop-filter:none!important;background:rgba(253,249,243,.96)}
	.li-hdr__nav{position:fixed;top:0;right:0;height:100dvh;width:min(84vw,360px);margin:0;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:0;background:var(--cream);padding:96px 28px calc(32px + env(safe-area-inset-bottom,0px));transform:translateX(100%);transition:transform .36s var(--ease);z-index:210;overflow-y:auto}
	body.li-menu-open .li-hdr__nav{transform:translateX(0);box-shadow:-24px 0 60px rgba(36,23,38,.18)}
	/* Ceinture-bretelles : le bandeau d'inscription (hors .site-container) ne doit
	   pas cohabiter visuellement avec le tiroir plein écran. */
	body.li-menu-open #li-signup-bar{display:none}
	/* Intitulé « MENU » en tête du tiroir (même style que « MON ESPACE MEMBRE »). */
	.li-hdr__nav::before{content:"Menu";display:block;text-transform:uppercase;font-size:.72rem;font-weight:700;letter-spacing:.06em;color:var(--ink-2);margin:0 0 6px}
	.li-hdr__nav ul{flex-direction:column;gap:0;width:100%}
	.li-hdr__nav a{display:block;padding:15px 0;font-size:1.12rem;border-bottom:1px solid var(--border)}
	.li-hdr__nav a::after{display:none}
	.li-hdr__nav-cta{display:flex;flex-direction:column;gap:12px;margin-top:26px}
	/* Les CTA du tiroir doivent rester des pilules IDENTIQUES à celles de l'en-tête :
	   `.li-hdr__nav a` (ci-dessus, 0,1,1) leur imposait sinon le style des liens du
	   menu (padding 15px 0, 1.12rem, filet bas). On re-déclare la base .li-btn,
	   y compris les COULEURS par variante (le color:var(--ink) des liens gagnait
	   aussi → texte sombre sur la pilule framboise). */
	.li-hdr__nav-cta .li-btn{justify-content:center;display:inline-flex;padding:.92em 1.7em;font-size:1rem;border-bottom:0}
	.li-hdr__nav-cta .li-btn--rasp,.li-hdr__nav-cta .li-btn--rasp:hover,
	.li-hdr__nav-cta .li-btn--publish,.li-hdr__nav-cta .li-btn--publish:hover{color:#fff}
	.li-hdr__nav-cta .li-btn--ghost{color:var(--ink)}
	.li-hdr__nav-cta .li-btn--ghost:hover{color:var(--rasp-deep)}
	.li-hdr__burger{display:flex}
	.li-hdr__cta .li-hide-sm{display:none}
	/* Mobile : pas de menu déroulant sur l'avatar (le compte vit dans le tiroir
	   burger, section « Mon espace membre »). L'avatar redevient un simple lien
	   vers « Mon profil » — plus de double menu compte. */
	.li-hdr__menu{display:none!important}
	/* Liens « Mon espace membre » du tiroir : conserver le flex + le MÊME écart
	   icône↔texte que le pop-over compte desktop (gap:10px, colonne d'icône 18px).
	   Sans ça, `.li-hdr__nav a{display:block}` (ci-dessus) l'emporte en spécificité
	   et met le lien en inline → le `gap` tombe et l'icône se colle au texte. */
	.li-hdr__nav a.li-drawer-acct__link{display:flex;align-items:center;gap:10px}
	.li-hdr__nav a.li-drawer-acct__link i{width:18px;text-align:center;flex:none;font-size:1rem}
}

/* Bloc « compte » dans le tiroir mobile (liens dropdown inatteignables au tactile) */
.li-drawer-acct{display:flex;flex-direction:column;border-top:1px solid var(--border);margin-top:8px;padding-top:14px}
.li-drawer-acct__head{font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2);margin-bottom:6px}
.li-drawer-acct__link{display:flex;align-items:center;gap:12px;padding:13px 0;font-size:1.06rem;color:var(--ink);border-bottom:1px solid var(--border)}
.li-drawer-acct__link i{color:var(--rasp);width:20px;text-align:center;flex:none}
.li-drawer-acct__link:hover{color:var(--rasp)}
.li-drawer-acct__link--out{color:var(--ink-2)}
.li-drawer-acct__link--out i{color:var(--ink-2)}

/* =========================================================================
   6. FOOTER sur-mesure (.li-ft)
   ========================================================================= */
.li-ft{background:#241726;color:rgba(255,255,255,.66);padding:64px 0 32px;margin-top:0}
.li-ft a{color:rgba(255,255,255,.66)}.li-ft a:hover{color:var(--gold-br)}
.li-ft__grid{display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr;gap:40px;margin-bottom:44px}
.li-ft__brand .li-logo{color:#fff}
.li-ft__brand p{margin-top:14px;font-size:.92rem;max-width:300px;line-height:1.7;color:rgba(255,255,255,.6)}
.li-ft__social{display:flex;gap:10px;margin-top:18px}
.li-ft__social a{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.2);color:rgba(255,255,255,.66);transition:color .18s,border-color .18s}
.li-ft__social a:hover{color:var(--gold-br);border-color:var(--gold-br)}
.li-ft__social svg{width:16px;height:16px;fill:currentColor}
.li-ft h4{color:#fff;font-family:var(--sans);font-size:.78rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;margin:0 0 16px}
.li-ft ul{list-style:none;display:grid;gap:10px;margin:0;padding:0}
.li-ft__menu li{margin:0}
.li-ft a{font-size:.92rem}
.li-ft__hl{display:inline-flex;align-items:center;gap:7px;font-weight:600;color:var(--gold-br)!important}
.li-ft__hl i{font-size:.85em;color:var(--rasp-br)}
.li-ft__hl:hover{color:#fff!important}
.li-ft__bottom{border-top:1px solid rgba(255,255,255,.12);padding-top:22px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:.84rem;color:rgba(255,255,255,.5)}
.li-ft__credit{color:rgba(255,255,255,.7)}
.li-ft__credit strong{color:var(--gold-br);font-weight:600}
.li-ft__grid>*{min-width:0}
@media(max-width:820px){.li-ft__grid{grid-template-columns:1fr 1fr;gap:28px}}
@media(max-width:600px){.li-ft__grid{grid-template-columns:1fr;gap:22px}}

/* =========================================================================
   7. Conteneur full-bleed sur l'accueil
   ========================================================================= */
.home .site-content>.container,.container--full{max-width:none!important;padding:0!important;margin:0!important;width:100%!important}

/* Fil d'Ariane */
.li-bc{max-width:var(--container);margin:18px auto -6px;padding-inline:clamp(20px,3.5vw,56px);font-size:.85rem;color:var(--ink-2)}
.li-bc ol{list-style:none;display:flex;flex-wrap:nowrap;align-items:baseline;gap:.45em;margin:0;padding:0;min-width:0}
.li-bc li{display:flex;align-items:center;gap:.45em;min-width:0;margin:0;padding:0}
.li-bc li:not(:last-child){flex:0 0 auto}
.li-bc li:last-child{flex:1 1 auto;min-width:0}
.li-bc li:not(:last-child)::after{content:"›";opacity:.5;line-height:1.45;transform:translateY(.04em)}
.li-bc a{color:var(--ink-2);text-decoration:none;white-space:nowrap;line-height:1.45}
.li-bc a:hover{color:var(--rasp-deep)}
.li-bc [aria-current="page"]{color:var(--ink);font-weight:500;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.45}
.home .li-bc{display:none}

/* Bannière PWA « Installer l'application » (mobile) */
.li-pwa{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));z-index:9000;display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--border);border-radius:var(--r);box-shadow:var(--shadow-lg);padding:11px 13px;animation:li-pwa-up .35s var(--ease)}
@keyframes li-pwa-up{from{transform:translateY(120%);opacity:0}to{transform:translateY(0);opacity:1}}
.li-pwa__ic{width:44px;height:44px;border-radius:12px;flex:none}
.li-pwa__txt{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.25}
.li-pwa__txt b{font-size:.95rem;color:var(--ink)}
.li-pwa__txt small{color:var(--ink-2);font-size:.8rem;margin-top:1px}
.li-pwa__btn{flex:none;background:linear-gradient(120deg,var(--rasp-br),var(--rasp) 60%,var(--rasp-deep));color:#fff;border:none;border-radius:var(--pill);padding:.6em 1.1em;font-weight:600;font-size:.9rem;cursor:pointer}
.li-pwa__close{flex:none;background:none;border:none;font-size:1.5rem;line-height:1;color:var(--ink-2);cursor:pointer;padding:0 2px}
@media(min-width:821px){.li-pwa{display:none}}
/* Guide d'installation iOS pas à pas (feuille modale ouverte par la bannière PWA) */
.li-pwag{position:fixed;inset:0;z-index:9100;background:rgba(30,22,26,.55);display:flex;align-items:flex-end;justify-content:center}
.li-pwag__sheet{position:relative;width:100%;max-width:480px;background:#fff;border-radius:var(--r) var(--r) 0 0;padding:26px 22px calc(20px + env(safe-area-inset-bottom,0px));text-align:center;animation:li-pwa-up .35s var(--ease)}
@media(min-width:600px){.li-pwag{align-items:center}.li-pwag__sheet{border-radius:var(--r);margin:16px}}
.li-pwag__close{position:absolute;top:8px;right:12px;background:none;border:none;font-size:1.7rem;line-height:1;color:var(--ink-2);cursor:pointer;padding:4px}
.li-pwag__ic{width:56px;height:56px;border-radius:14px;box-shadow:var(--shadow)}
.li-pwag__title{font-size:1.25rem;margin:10px 0 2px}
.li-pwag__sub{color:var(--ink-2);font-size:.9rem;margin:0 0 14px}
.li-pwag__steps{list-style:none;margin:0 0 4px;padding:0;text-align:left;display:flex;flex-direction:column;gap:10px}
.li-pwag__steps li{display:flex;align-items:center;gap:12px;background:var(--bg-soft,#FDF9F3);border:1px solid var(--border);border-radius:var(--r);padding:10px 12px}
.li-pwag__n{flex:none;width:22px;height:22px;border-radius:50%;background:var(--rasp);color:#fff;font-size:.8rem;font-weight:700;display:flex;align-items:center;justify-content:center}
.li-pwag__ico{flex:none;width:40px;height:40px;border-radius:10px;background:#fff;border:1px solid var(--border);color:#0a7cff;display:flex;align-items:center;justify-content:center}
.li-pwag__ico--txt{font-size:.75rem;font-weight:700;color:var(--rasp-deep)}
.li-pwag__lbl{flex:1;min-width:0;font-size:.92rem;line-height:1.3;color:var(--ink)}
.li-pwag__lbl small{display:block;color:var(--ink-2);font-size:.78rem;margin-top:1px}
.li-pwag__note{font-size:.8rem;color:var(--ink-2);background:var(--bg-soft,#FDF9F3);border-radius:var(--r);padding:8px 10px;margin:10px 0 0}
.li-pwag__ok{width:100%;margin-top:14px}
.li-ft__install{color:var(--rasp-deep);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.li-ft__install:hover{color:var(--rasp)}
@media(min-width:821px){.li-ft__install{display:none}}

/* Marges latérales resserrées sur petit écran (30px de chaque côté « mangeaient »
   la largeur utile sur un mobile de 360px).
   Le conteneur HivePress (.container) vient du thème parent (flexboxgrid) avec
   2rem = 32px fixes à TOUS les breakpoints → trop de marge sur mobile sur TOUTES
   les pages (catalogue, compte, fiche…). On le resserre progressivement, aligné
   sur les pages maison (.li-wrap). */
@media(max-width:768px){
  .container{padding-left:20px!important;padding-right:20px!important}
}
@media(max-width:560px){
  .li-wrap{padding-inline:15px}
  .li-bc{padding-inline:15px;margin-top:14px}
  .container{padding-left:15px!important;padding-right:15px!important}
}

/* Accessibilité : réduire les animations */
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}}

/* =========================================================================
   FIX AFFICHAGE MOBILE — en-tête (2026-07-03)
   Le logo était figé à 1.36rem (flex:none, nowrap) sans réduction mobile :
   logo + pastille Bêta + burger débordaient → burger coupé au bord droit et
   pastille cassée sur 2 lignes. On réduit progressivement le logo, on compacte
   la pastille (nowrap) et on resserre les marges pour tout faire tenir.
   ========================================================================= */
@media (max-width:680px){
	.li-hdr__in{gap:10px;padding-inline:16px}
	.li-logo{font-size:1.08rem;gap:9px;min-width:0}
	.li-logo svg,.li-logo img{width:30px;height:30px}
	.li-beta{white-space:nowrap;font-size:.58em;margin-left:.35em}
}
@media (max-width:430px){
	.li-hdr__in{gap:8px;padding-inline:13px}
	.li-logo{font-size:.98rem;gap:8px}
	.li-logo svg,.li-logo img{width:27px;height:27px}
	.li-hdr__burger{width:40px;height:40px;padding:9px}
}
@media (max-width:360px){
	.li-logo{font-size:.9rem}
	.li-beta{font-size:.52em;padding:.1em .42em}
}

/* =========================================================================
   SÉCURITÉ RESPONSIVE DES FORMULAIRES (global, chargé partout)
   Un champ natif large (surtout <input type=file>) ou une grille flex sans
   min-width:0 poussait la carte au-delà de la largeur de l'écran sur mobile
   (débordement horizontal → contrôles coupés au bord droit). Filet de sécurité
   non destructif : les contrôles ne dépassent jamais leur conteneur.
   ========================================================================= */
input, select, textarea, button { max-width: 100%; box-sizing: border-box; }
input[type="file"] { max-width: 100%; }
img, video { max-width: 100%; height: auto; }

/* =========================================================================
   SPÉCIFICITÉS iOS / ANDROID (global)
   - Anti-zoom iOS : Safari zoome au focus si un champ texte fait < 16px.
     On force 16px sur mobile pour TOUS les champs de saisie, y compris les
     formulaires natifs HivePress (connexion, message, publication) dont on
     ne maîtrise pas la police.
   - Rendu natif iOS neutralisé sur les champs texte (ombre interne, coins
     arrondis system) et les boutons (dégradé bleu par défaut).
   - Suppression du flash gris/bleu au tap (Android/iOS).
   - text-size-adjust : pas de gonflement auto du texte en paysage.
   Le CTA collant de fiche, le pied du wizard, la bannière PWA et le tiroir
   de menu gèrent env(safe-area-inset-bottom) pour l'encoche/barre home iPhone.
   ========================================================================= */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
@media (max-width: 782px) {
	input[type="text"], input[type="email"], input[type="password"], input[type="url"],
	input[type="tel"], input[type="number"], input[type="search"], input[type="date"],
	input[type="time"], input:not([type]), textarea, select { font-size: 16px; }
}
input[type="text"], input[type="email"], input[type="password"], input[type="url"],
input[type="tel"], input[type="number"], input[type="search"], textarea {
	-webkit-appearance: none; appearance: none;
}
input[type="submit"], input[type="button"], button { -webkit-appearance: none; appearance: none; }
a, button, .li-btn, input, textarea, select, label, summary { -webkit-tap-highlight-color: transparent; }

/* =========================================================================
   LARGEUR HOMOGÈNE GRAND ÉCRAN (2026-07-08)
   Même gabarit que le catalogue plein écran (inc/listings-per-row.php) sur
   TOUT le site : cadre fluide dès 1200 px, plafonné à 1750 px et centré
   au-delà (plein écran jusqu'à 1750 px de viewport). Alignés sur ce cadre :
   le conteneur de contenu (.container, plafond parent 75.25rem neutralisé),
   l'en-tête (.li-hdr__in), le pied de page (.li-ft > .li-wrap) et le fil
   d'Ariane (.li-bc). Spécificité (0,2,0) sur header/footer : pages.css pose
   .li-wrap{max-width:none} sur les Pages, qui gagnerait sinon.
   La lisibilité ne souffre pas : la prose des pages texte reste plafonnée
   par .li-page (860 px, pages.css) ; la home (.container--full, !important
   + spécificité supérieure) garde son gabarit pleine largeur propre.
   ========================================================================= */
@media (min-width:1200px){
	.container{width:auto!important;max-width:1750px}
	.li-hdr .li-hdr__in,.li-ft>.li-wrap{max-width:1750px;padding-inline:2rem}
	.li-bc{max-width:1750px;padding-inline:2rem}
	/* Fiche annonce : la colonne hôte ne gonfle plus avec l'écran (33 % natif) —
	   largeur fixe, le contenu prend le reste (même logique que la sidebar
	   des filtres du catalogue, fixée à 320 px). */
	.single-hp_listing .hp-page>.hp-row>.hp-page__sidebar{-ms-flex:0 0 400px;flex:0 0 400px;max-width:400px}
	.single-hp_listing .hp-page>.hp-row>.hp-page__content{-ms-flex:1 1 0%;flex:1 1 0%;max-width:none;width:auto}
}
@media (min-width:1700px){
	.container{padding-left:3rem!important;padding-right:3rem!important}
	.li-hdr .li-hdr__in,.li-ft>.li-wrap,.li-bc{padding-inline:3rem}
}

/* ====================================================================
 * Bannière cookies (Complianz) aux couleurs du site (2026-07-15)
 * Le bouton « Accepter » magenta par défaut jurait avec la charte rose.
 * ==================================================================== */
.cmplz-cookiebanner {
	background: #FFFDF9 !important;
	border-radius: 18px !important;
	box-shadow: 0 18px 50px rgba(36, 23, 38, .18) !important;
	font-family: var(--sans, "Inter", sans-serif) !important;
}
.cmplz-cookiebanner .cmplz-title,
.cmplz-cookiebanner .cmplz-message,
.cmplz-cookiebanner .cmplz-body {
	color: #241726 !important;
	font-family: inherit !important;
}
.cmplz-cookiebanner .cmplz-btn {
	border-radius: 999px !important;
	font-family: inherit !important;
	font-weight: 700 !important;
	border: none !important;
	transition: transform .18s ease, box-shadow .18s ease;
}
.cmplz-cookiebanner .cmplz-btn:hover { transform: translateY(-1px); }
.cmplz-cookiebanner .cmplz-btn.cmplz-accept {
	background: linear-gradient(120deg, var(--rasp-br, #F96E93), var(--rasp, #EE3D6F) 60%, var(--rasp-deep, #C91E52)) !important;
	color: #fff !important;
	box-shadow: 0 6px 20px rgba(238, 61, 111, .35) !important;
}
.cmplz-cookiebanner .cmplz-btn.cmplz-deny,
.cmplz-cookiebanner .cmplz-btn.cmplz-view-preferences {
	background: #fff !important;
	color: var(--rasp-deep, #C91E52) !important;
	box-shadow: inset 0 0 0 1.5px rgba(238, 61, 111, .35) !important;
}
.cmplz-cookiebanner .cmplz-links a,
.cmplz-cookiebanner a {
	color: var(--rasp-deep, #C91E52) !important;
}

/* Interlignage global des paragraphes : 1.875 (thème parent) -> 1.6 */
p { line-height: 1.6; }