/* ===================================================================== V2.053 — L'ACCUEIL DU COMBO VALIDÉ ===================================================================== Hero photo plein cadre sous un en-tête transparent, « Comment ça marche » et « Mes besoins » en haut, messages qui défilent seuls, recherche en pilule blanche et « Publier un bien » en verre. Puis : l'éventail des villes, les catégories rondes, les communes, les biens, les réels, deux portes, Yafoye Autentik, le pied de page. Cette feuille vient en DERNIER dans la page : les règles anciennes de l'accueil sont nombreuses, souvent en `!important`. Chaque règle ici est donc préfixée `html body.yf-premium-home:has(#yfShowcaseSections)` (l'identifiant compte : certaines règles anciennes en portent un) pour gagner sans surenchère supplémentaire, et n'emploie `!important` que là où une règle plus ancienne l'emploie déjà. */ html body.yf-premium-home:has(#yfShowcaseSections){ --yfa-encre:#071a2e;--yfa-fond:#eef3f7;--yfa-ligne:#dbe4ec;--yfa-doux:#56677a; --yfa-ciel:#8fd3ff;--yfa-bleu:#2f7fc1;--yfa-or:#e8cf8f;--yfa-or2:#c9a24a; --yfa-verre:rgba(255,255,255,.14);--yfa-verre-bord:rgba(255,255,255,.42); background:var(--yfa-fond)!important;padding-bottom:0!important; } html body.yf-premium-home:has(#yfShowcaseSections) main{background:var(--yfa-fond)!important} /* --------------------------------------------------------------------- 1. L'EN-TÊTE, TRANSPARENT SUR LA PHOTO La classe `yfa-defile` est posée dès qu'on a quitté le haut du hero : l'en-tête reprend alors son fond. */ html body.yf-premium-home:has(#yfShowcaseSections):not(.yfa-defile):not(.yf-search-open):not(.yf-premium-menu-open) .yf-unified-header{ background:linear-gradient(180deg,rgba(4,16,30,.55),rgba(4,16,30,0))!important; border-bottom-color:transparent!important;box-shadow:none!important; -webkit-backdrop-filter:none!important;backdrop-filter:none!important; } html body.yf-premium-home:has(#yfShowcaseSections) .yf-unified-header{transition:background .3s ease,box-shadow .3s ease} html body.yf-premium-home:has(#yfShowcaseSections):not(.yfa-defile):not(.yf-search-open):not(.yf-premium-menu-open) .yf-unified-header :is(.yf-unified-brand,.yf-unified-brand b,.yf-unified-profile small,.yf-premium-menu-toggle,.yf-header-favorites){color:#fff!important} html body.yf-premium-home:has(#yfShowcaseSections):not(.yfa-defile):not(.yf-search-open):not(.yf-premium-menu-open) .yf-unified-header :is(.yf-space-switch,.yf-premium-menu-toggle,.yf-header-favorites){ background:var(--yfa-verre)!important;border:1px solid var(--yfa-verre-bord)!important;color:#fff!important; -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:999px!important; } html body.yf-premium-home:has(#yfShowcaseSections):not(.yfa-defile):not(.yf-search-open):not(.yf-premium-menu-open) .yf-unified-header :is(.yf-premium-menu-toggle,.yf-header-favorites) :is(i,svg,.yf-lucide){color:#fff!important;stroke:currentColor} /* --------------------------------------------------------------------- 2. LE HERO */ html body.yf-premium-home:has(#yfShowcaseSections) .hero.yf-hero-visuel{ margin-top:-72px!important;padding:72px 0 0!important; min-height:0!important;display:flex!important;flex-direction:column!important; border-radius:0!important;overflow:hidden; } html body.yf-premium-home:has(#yfShowcaseSections) .hero.yf-hero-visuel:after{ background:linear-gradient(180deg,rgba(4,16,30,.62) 0%,rgba(4,16,30,.30) 30%,rgba(4,16,30,.38) 55%,rgba(4,16,30,.92) 100%)!important; } html body.yf-premium-home:has(#yfShowcaseSections) .hero .hero-inner.yf-focus-hero{ flex:1 1 auto;display:flex!important;flex-direction:column!important;align-items:stretch!important; width:100%!important;max-width:760px!important;margin:0 auto!important;box-sizing:border-box; padding:20px 16px 28px!important;gap:0; } html body.yf-premium-home:has(#yfShowcaseSections) .yf-marketing{order:1;min-height:0!important;display:flex;flex-direction:column;gap:18px;text-align:left} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-hero-actions{display:flex;flex-wrap:wrap;gap:8px} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-comment, html body.yf-premium-home:has(#yfShowcaseSections) .yf-focus-hero .ym-besoins{ flex:none;display:inline-flex;align-items:center;gap:8px;height:42px;min-height:42px;margin:0!important; padding:0 15px;border-radius:21px;font:800 14px/1 Manrope,Arial,sans-serif;white-space:nowrap; text-decoration:none;cursor:pointer;box-sizing:border-box;width:auto!important; } html body.yf-premium-home:has(#yfShowcaseSections) .yfa-comment{padding-left:6px;border:0;background:#fff;color:var(--yfa-encre)} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-comment-ico{width:30px;height:30px;border-radius:15px;background:var(--yfa-encre);color:#fff;display:grid;place-items:center} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-comment:hover{box-shadow:var(--ombre-haute)} html body.yf-premium-home:has(#yfShowcaseSections) .yf-focus-hero .ym-besoins{ border:1px solid var(--yfa-verre-bord)!important;background:var(--yfa-verre)!important;color:#fff!important; -webkit-backdrop-filter:blur(14px) saturate(150%);backdrop-filter:blur(14px) saturate(150%); } html body.yf-premium-home:has(#yfShowcaseSections) .yf-focus-hero .ym-besoins i{display:none} html body.yf-premium-home:has(#yfShowcaseSections) .yf-focus-hero .ym-besoins .yf-nav-badge{position:static;min-width:20px;height:20px;border-radius:10px;background:#3fa9f5;color:var(--yfa-encre);font-size:11px;box-shadow:none} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-messages{min-height:212px;justify-content:flex-end;display:flex;flex-direction:column;gap:10px;transition:opacity .26s ease,transform .26s ease} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-messages.est-sortant{opacity:0;transform:translateY(6px)} html body.yf-premium-home:has(#yfShowcaseSections) .yf-marketing .ym-title{ margin:0!important;color:#fff!important;font:800 clamp(34px,9.6vw,58px)/1.05 Sora,Manrope,Arial,sans-serif!important; letter-spacing:-.03em!important;text-shadow:0 2px 24px rgba(0,24,39,.35);max-width:15ch; } html body.yf-premium-home:has(#yfShowcaseSections) .yf-marketing .ym-title em{font-family:inherit;font-style:normal;font-weight:800;color:var(--yfa-ciel)} html body.yf-premium-home:has(#yfShowcaseSections) .yf-marketing .ym-lead{margin:0!important;max-width:34ch;font:500 15px/1.5 Manrope,Arial,sans-serif!important;color:rgba(255,255,255,.88)!important;display:block!important;-webkit-line-clamp:unset} /* La recherche : une pilule blanche, poussée en bas du hero. */ html body.yf-premium-home:has(#yfShowcaseSections) .yf-focus-hero .yf-search-launch{ order:2;margin:26px 0 0!important;width:100%!important;min-height:58px!important;height:58px;box-sizing:border-box; display:flex!important;align-items:center;gap:12px;padding:0 7px 0 18px!important;border:0!important; border-radius:29px!important;background:#fff!important;color:var(--yfa-encre)!important; box-shadow:var(--ombre-haute)!important;text-align:left;font-size:15px!important;cursor:pointer; } html body.yf-premium-home:has(#yfShowcaseSections) .yf-focus-hero .yf-search-launch-ico{width:auto;height:auto;background:none!important;color:#0b4f7a!important;box-shadow:none!important;display:grid;place-items:center;font-size:19px} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-recherche-texte{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-recherche-texte b{font:800 15px/1.2 Manrope,Arial,sans-serif;color:var(--yfa-encre);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-recherche-texte small{font:600 12px/1.2 Manrope,Arial,sans-serif;color:var(--yfa-doux)} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-recherche-fleche{flex:none;width:44px;height:44px;border-radius:22px;background:var(--yfa-encre);color:#fff;display:grid;place-items:center} /* « Publier un bien » : verre, centré sous la recherche. */ html body.yf-premium-home:has(#yfShowcaseSections) .hero .yf-focus-hero .yf-search-entry{order:4} html body.yf-premium-home:has(#yfShowcaseSections) .hero .yf-focus-hero .yf-home-publish-bar{order:3!important;display:flex!important;justify-content:center!important;width:100%!important;margin:16px 0 0!important;animation:none} html body.yf-premium-home:has(#yfShowcaseSections) .hero .yf-focus-hero .yf-home-publish-btn{ display:inline-flex!important;align-items:center;justify-content:center;gap:9px;width:auto!important;margin:0 auto!important; min-height:46px!important;height:46px;padding:0 22px!important;border-radius:23px!important; border:1px solid rgba(255,255,255,.45)!important;background:var(--yfa-verre)!important;color:#fff!important; -webkit-backdrop-filter:blur(14px) saturate(150%);backdrop-filter:blur(14px) saturate(150%); box-shadow:none!important;font:800 14px/1 Manrope,Arial,sans-serif!important;text-decoration:none; } html body.yf-premium-home:has(#yfShowcaseSections) .hero .yf-focus-hero .yf-home-publish-btn:hover{background:rgba(255,255,255,.24)!important} /* --------------------------------------------------------------------- 3. LA VITRINE */ html body.yf-premium-home:has(#yfShowcaseSections) .yf-home-showcase{ width:100%!important;max-width:1180px;margin:0 auto;padding:6px 0 30px!important; background:transparent!important;color:var(--yfa-encre)!important;box-sizing:border-box; } html body.yf-premium-home:has(#yfShowcaseSections) #yfShowcaseSections{display:block} html body.yf-premium-home:has(#yfShowcaseSections) .yf-outcome-count{margin:18px 16px 0;font:700 13px Manrope,Arial,sans-serif;color:var(--yfa-doux)} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-tete{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 16px 14px} html body.yf-premium-home:has(#yfShowcaseSections) :is(.yfa-tete h2,.yfa-categories h2){margin:0;font:800 21px/1.2 Sora,Manrope,Arial,sans-serif;letter-spacing:-.01em;color:var(--yfa-encre)} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-titre{min-width:0;display:flex;flex-direction:column;gap:2px} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-titre h2{font-size:20px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-titre p{margin:0;font:600 13px/1.35 Manrope,Arial,sans-serif;color:var(--yfa-doux)} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-lien{flex:none;border:0;background:none;padding:6px 0;font:800 14px Manrope,Arial,sans-serif;color:#0b4f7a;cursor:pointer} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-plus{flex:none;display:inline-flex;align-items:center;height:34px;padding:0 14px;border-radius:17px;background:#fff;border:1px solid var(--yfa-ligne);font:800 13px Manrope,Arial,sans-serif;color:#0b4f7a;text-decoration:none;white-space:nowrap} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-plus:hover{border-color:#0b4f7a} /* 3.1 L'éventail des villes */ html body.yf-premium-home:has(#yfShowcaseSections) .yfa-villes{padding-top:30px} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-eventail{ --l:min(40vw,170px);--h:calc(var(--l) * 1.3);/* V2.063 — plus petite : on voit une ville de chaque côté */ display:flex;align-items:center;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory; padding:12px calc(50% - var(--l) / 2) 18px;scrollbar-width:none;-webkit-overflow-scrolling:touch; } html body.yf-premium-home:has(#yfShowcaseSections) .yfa-eventail::-webkit-scrollbar{display:none} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-eventail>button{ position:relative;flex:0 0 var(--l);height:var(--h);margin:0 calc(var(--l) * -0.06);padding:0;border:3px solid #fff!important;border-radius:22px; overflow:hidden;background:#cfdbe6;scroll-snap-align:center;cursor:pointer;transform-origin:50% 50%;transition:opacity .2s; box-shadow:var(--ombre);color:#fff;will-change:transform; } html body.yf-premium-home:has(#yfShowcaseSections) .yfa-eventail>button.est-centre{box-shadow:var(--ombre-haute)} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-eventail>button>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-eventail>button.yf-ville-sans-photo{background:linear-gradient(160deg,#0b3a63,#0d7ea4)} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-eventail>button.yf-ville-sans-photo>i{position:absolute;top:40%;left:50%;transform:translate(-50%,-50%);font-size:34px;opacity:.7} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-ville-nom{ position:absolute;left:10px;right:10px;bottom:10px;display:flex;flex-direction:column;gap:1px;padding:8px 12px; border-radius:14px;background:rgba(6,24,43,.62); font:800 14px/1.25 Manrope,Arial,sans-serif;text-align:left; } html body.yf-premium-home:has(#yfShowcaseSections) .yfa-ville-nom small{font-weight:600;font-size:12px;opacity:.85} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-eventail>button.yf-toutes-villes{ display:grid;place-items:center;align-content:center;gap:14px;background:#fff;color:var(--yfa-encre);border-color:#fff; font:800 15px Manrope,Arial,sans-serif; } html body.yf-premium-home:has(#yfShowcaseSections) .yfa-eventail .yf-eventail{position:relative;display:block;width:96px;height:80px} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-eventail .yf-eventail img{position:absolute;top:0;left:50%;width:52px;height:72px;margin-left:-26px;border-radius:12px;object-fit:cover;border:2px solid #fff;box-shadow:var(--ombre)} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-eventail .yf-ev-1{transform:rotate(-12deg) translateX(-26px)} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-eventail .yf-ev-3{transform:rotate(12deg) translateX(26px)} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-eventail .yf-ev-2{z-index:1} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-aide{margin:4px 16px 0;text-align:center;font:600 13px Manrope,Arial,sans-serif;color:var(--yfa-doux)} /* 3.2 Les catégories rondes */ html body.yf-premium-home:has(#yfShowcaseSections) .yfa-categories{padding-top:28px} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-categories h2{margin:0 16px} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-ronds{display:flex;gap:12px;overflow-x:auto;padding:14px 16px 4px;scroll-padding-inline:16px;scrollbar-width:none;scroll-snap-type:x proximity} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-ronds::-webkit-scrollbar{display:none} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-ronds button{ flex:0 0 auto;min-width:76px;display:flex;flex-direction:column;align-items:center;gap:6px;padding:0;border:0;background:none;cursor:pointer; color:#4a5d70;scroll-snap-align:start;font-family:Manrope,Arial,sans-serif; } html body.yf-premium-home:has(#yfShowcaseSections) .yfa-rond{width:72px;height:72px;border-radius:36px;padding:3px;box-sizing:border-box;display:block;background:transparent;transition:background .2s} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-rond img{width:100%;height:100%;border-radius:50%;object-fit:cover;display:block;border:2px solid var(--yfa-fond);box-sizing:border-box} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-ronds button[aria-selected="true"] .yfa-rond{background:linear-gradient(135deg,#3fa9f5,#0b3a63)} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-ronds b{font-size:12px;font-weight:700;line-height:1.2;text-align:center;white-space:nowrap} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-ronds button[aria-selected="true"] b{color:var(--yfa-encre);font-weight:800} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-ronds small{min-height:14px;font-size:11px;font-weight:700;color:var(--yfa-doux)} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-ronds button.est-vide .yfa-rond img{filter:saturate(.55);opacity:.8} /* 3.3 Les communes : des onglets soulignés */ html body.yf-premium-home:has(#yfShowcaseSections) .yfa-communes{display:flex;gap:22px;margin:22px 16px 0;overflow-x:auto;border-bottom:1px solid var(--yfa-ligne);scrollbar-width:none} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-communes::-webkit-scrollbar{display:none} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-communes[hidden]{display:none} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-communes button{ flex:none;position:relative;display:flex;align-items:center;gap:7px;height:48px;padding:0;border:0;background:none;cursor:pointer; font:700 15px Manrope,Arial,sans-serif;color:#6a7b8c;white-space:nowrap; } html body.yf-premium-home:has(#yfShowcaseSections) .yfa-communes button small{font-size:12px;font-weight:700} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-communes button[aria-selected="true"]{color:var(--yfa-encre);font-weight:800} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-communes button[aria-selected="true"] small{color:#0b4f7a} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-communes button[aria-selected="true"]::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px;border-radius:2px;background:var(--yfa-bleu)} /* 3.4 Les biens, en cartes immersives */ html body.yf-premium-home:has(#yfShowcaseSections) .yfa-annonces{padding-top:18px;scroll-margin-top:90px} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-piste{ --gap:12px;display:flex;gap:var(--gap);overflow-x:auto;padding:0 16px 6px;scroll-snap-type:x mandatory;scroll-padding-inline:16px;scrollbar-width:none; } html body.yf-premium-home:has(#yfShowcaseSections) .yfa-piste::-webkit-scrollbar{display:none} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-carte, html body.yf-premium-home:has(#yfShowcaseSections) .yfa-piste .yf-tout-afficher{ position:relative;flex:0 0 calc((100% - 32px - var(--gap) - 34px) / 2);min-width:150px;max-width:280px;aspect-ratio:3/4.3; border-radius:26px;overflow:hidden;scroll-snap-align:start;scroll-snap-stop:always;text-decoration:none;color:#fff;background:#cfdbe6; } html body.yf-premium-home:has(#yfShowcaseSections) .yfa-carte img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-carte:hover img{transform:scale(1.04)} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-carte-etat{position:absolute;top:10px;left:10px;display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:12px;background:rgba(255,255,255,.93);color:#0f6b3e;font:800 11px/1.2 Manrope,Arial,sans-serif} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-carte-etat::before{content:"";width:7px;height:7px;border-radius:50%;background:#1f9d5c} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-carte-etat.est-pris{color:#8a4b0f} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-carte-etat.est-pris::before{background:#d98a2b} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-carte-verre{ position:absolute;left:8px;right:8px;bottom:8px;display:flex;flex-direction:column;gap:2px;padding:10px 11px;border-radius:16px; background:rgba(7,26,46,.55);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px); } html body.yf-premium-home:has(#yfShowcaseSections) .yfa-carte-verre b{font:800 13px/1.25 Manrope,Arial,sans-serif} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-carte-verre b small{white-space:nowrap} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-carte-verre b small{font-weight:600;font-size:11px;opacity:.8} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-carte-verre span{font:600 11.5px/1.3 Manrope,Arial,sans-serif;opacity:.88;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-piste .yf-tout-afficher{display:grid;place-items:center;align-content:center;gap:16px;min-height:0;background:#fff;border:1px solid var(--yfa-ligne);color:var(--yfa-encre)} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-piste.est-vide{display:block} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-piste .yf-vide-cat{margin:0;border-radius:24px} /* 3.5 Les réels */ html body.yf-premium-home:has(#yfShowcaseSections) .yfa-reels{padding-top:30px} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-reel{position:relative;flex:0 0 122px;height:214px;border-radius:22px;overflow:hidden;display:block;background:#0b2a40;scroll-snap-align:start} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-reel img{width:100%;height:100%;object-fit:cover;display:block} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-reel-lecture{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:44px;height:44px;border-radius:22px;background:rgba(255,255,255,.3);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;display:grid;place-items:center} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-reel-prix{position:absolute;left:8px;right:8px;bottom:8px;font:800 12px Manrope,Arial,sans-serif;color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.6)} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-reels-vide{margin:0 16px;padding:18px;border-radius:20px;background:#fff;border:1px solid var(--yfa-ligne);font:600 14px/1.5 Manrope,Arial,sans-serif;color:var(--yfa-doux)} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-reels-vide a{font-weight:800;color:#0b4f7a} /* 3.6 Squelette de chargement */ html body.yf-premium-home:has(#yfShowcaseSections) .yfa-squelette{padding:30px 16px 10px;display:grid;gap:18px} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-squelette span{display:block;border-radius:22px;background:linear-gradient(90deg,#e1e9f0,#f2f6f9,#e1e9f0);background-size:200% 100%;animation:yfaLueur 1.3s ease-in-out infinite} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-sq-titre{width:46%;height:22px} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-sq-eventail{position:relative;display:flex;justify-content:center;gap:0;height:230px} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-sq-eventail span{width:150px;height:200px;margin:14px -18px 0} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-sq-eventail span:nth-child(2){width:170px;height:230px;margin-top:0;z-index:1} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-sq-ronds{display:flex;gap:14px;overflow:hidden} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-sq-ronds span{flex:none;width:70px;height:70px;border-radius:50%} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-sq-cartes{display:flex;gap:12px;overflow:hidden} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-sq-cartes span{flex:none;width:44%;aspect-ratio:3/4.3} @keyframes yfaLueur{to{background-position:-200% 0}} /* --------------------------------------------------------------------- 4. LES DEUX PORTES ET YAFOYE AUTENTIK */ html body.yf-premium-home:has(#yfShowcaseSections) .yfa-portes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:24px 16px 0} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-porte{position:relative;height:170px;border-radius:26px;overflow:hidden;display:block;color:#fff;text-decoration:none} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-porte img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-porte:hover img{transform:scale(1.04)} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-porte::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 28%,rgba(7,26,46,.86))} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-porte-texte{position:absolute;z-index:1;left:14px;right:14px;bottom:14px;display:flex;flex-direction:column;gap:3px} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-porte-texte b{font:800 16px/1.2 Sora,Manrope,Arial,sans-serif} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-porte-texte small{font:600 12px/1.3 Manrope,Arial,sans-serif;opacity:.88} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-autentik{position:relative;margin:18px 16px 0;border-radius:30px;overflow:hidden;color:#fff;isolation:isolate} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-autentik>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-autentik::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(7,26,46,.30),rgba(7,26,46,.94))} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-autentik-texte{padding:64px 20px 22px;display:flex;flex-direction:column;gap:10px} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-autentik-nom{display:inline-flex;align-items:center;gap:8px;font:700 15px Sora,Manrope,Arial,sans-serif;color:var(--yfa-or)} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-autentik h2{margin:0;max-width:22ch;font:800 26px/1.12 Sora,Manrope,Arial,sans-serif;color:#fff} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-autentik p{margin:0;max-width:44ch;font:500 14px/1.55 Manrope,Arial,sans-serif;color:rgba(255,255,255,.85)} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-autentik-bouton{margin-top:6px;align-self:flex-start;display:inline-flex;align-items:center;height:48px;padding:0 20px;border-radius:24px;background:linear-gradient(135deg,var(--yfa-or),var(--yfa-or2));color:var(--yfa-encre);font:800 14px Manrope,Arial,sans-serif;text-decoration:none} /* --------------------------------------------------------------------- 5. LE PIED DE PAGE */ html body.yf-premium-home:has(#yfShowcaseSections) .yf-home-footer{ margin:34px 0 0!important;padding:30px 20px calc(110px + env(safe-area-inset-bottom))!important; border-radius:30px 30px 0 0;background:var(--yfa-encre)!important;color:#fff!important;border:0!important; } html body.yf-premium-home:has(#yfShowcaseSections) .yfa-pied-marque{display:flex;align-items:center;gap:10px;font:800 19px Sora,Manrope,Arial,sans-serif} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-pied-marque img{width:36px;height:36px;border-radius:10px} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-pied-slogan{margin:10px 0 0;font:500 14px/1.5 Manrope,Arial,sans-serif;color:rgba(255,255,255,.75)} html body.yf-premium-home:has(#yfShowcaseSections) .yf-home-footer-columns{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:24px 16px!important;margin-top:24px;padding:0!important;border:0!important;max-width:none!important} html body.yf-premium-home:has(#yfShowcaseSections) .yf-home-footer-columns>div{display:flex;flex-direction:column;gap:10px} html body.yf-premium-home:has(#yfShowcaseSections) .yf-home-footer-columns h3{margin:0 0 2px!important;font:800 14px Manrope,Arial,sans-serif!important;color:#fff!important;text-transform:none!important;letter-spacing:0!important} html body.yf-premium-home:has(#yfShowcaseSections) .yf-home-footer-columns a{min-height:0!important;padding:2px 0!important;font:600 13px/1.4 Manrope,Arial,sans-serif!important;color:rgba(255,255,255,.72)!important;text-decoration:none} html body.yf-premium-home:has(#yfShowcaseSections) .yf-home-footer-columns a:hover{color:#fff!important} html body.yf-premium-home:has(#yfShowcaseSections) .yf-home-footer-bottom{margin-top:26px!important;padding-top:18px!important;border-top:1px solid rgba(255,255,255,.14)!important;font:600 12px/1.6 Manrope,Arial,sans-serif!important;color:rgba(255,255,255,.6)!important;text-align:left!important} /* --------------------------------------------------------------------- 6. GRAND ÉCRAN */ @media(min-width:900px){ html body.yf-premium-home:has(#yfShowcaseSections) .hero.yf-hero-visuel{min-height:0!important} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-messages{min-height:250px} html body.yf-premium-home:has(#yfShowcaseSections) .hero .hero-inner.yf-focus-hero{max-width:1180px!important;padding:40px 32px 44px!important} html body.yf-premium-home:has(#yfShowcaseSections) .yf-marketing{max-width:680px} html body.yf-premium-home:has(#yfShowcaseSections) .yf-focus-hero .yf-search-launch{max-width:640px} html body.yf-premium-home:has(#yfShowcaseSections) .hero .yf-focus-hero .yf-home-publish-bar{justify-content:flex-start;max-width:640px} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-tete,html body.yf-premium-home:has(#yfShowcaseSections) .yfa-categories h2{margin-left:32px;margin-right:32px} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-eventail{--l:210px} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-ronds,html body.yf-premium-home:has(#yfShowcaseSections) .yfa-piste{padding-left:32px;padding-right:32px;scroll-padding-inline:32px} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-ronds{justify-content:center;scroll-padding-inline:32px} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-communes{margin-left:32px;margin-right:32px} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-carte,html body.yf-premium-home:has(#yfShowcaseSections) .yfa-piste .yf-tout-afficher{flex-basis:250px} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-reel{flex-basis:160px;height:284px} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-portes{margin:44px 32px 0;gap:16px} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-porte{height:240px} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-autentik{margin:20px 32px 0} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-autentik-texte{padding:120px 44px 40px} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-autentik h2{font-size:34px} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-portes,html body.yf-premium-home:has(#yfShowcaseSections) .yfa-autentik{max-width:1116px;margin-left:auto;margin-right:auto} html body.yf-premium-home:has(#yfShowcaseSections) .yf-home-footer{padding:44px max(32px,calc(50% - 560px)) 40px!important} html body.yf-premium-home:has(#yfShowcaseSections) .yf-home-footer-columns{grid-template-columns:repeat(3,minmax(0,1fr))!important;max-width:760px!important} } @media(prefers-reduced-motion:reduce){ html body.yf-premium-home:has(#yfShowcaseSections) .yfa-messages{transition:none} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-squelette span{animation:none} } html body.yf-premium-home:has(#yfShowcaseSections):not(.yfa-defile):not(.yf-search-open):not(.yf-premium-menu-open) .yf-unified-header .yf-unified-desktop-nav a:not(.is-active){color:rgba(255,255,255,.85)!important} /* V2.054 — les styles d'onglets d'autres pages (role=tab sélectionné, fond dégradé bleu) restaient appliqués au retour des Réels : on les neutralise. */ html body.yf-premium-home:has(#yfShowcaseSections) .yfa-ronds button,html body.yf-premium-home:has(#yfShowcaseSections) .yfa-ronds button[aria-selected],html body.yf-premium-home:has(#yfShowcaseSections) .yfa-communes button,html body.yf-premium-home:has(#yfShowcaseSections) .yfa-communes button[aria-selected]{background:none!important;background-image:none!important;box-shadow:none!important;border:0!important;outline-offset:2px} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-ronds button[aria-selected="true"] b{color:var(--yfa-encre)!important;-webkit-text-fill-color:currentColor!important} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-ronds button small{color:var(--yfa-doux)!important;-webkit-text-fill-color:currentColor!important} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-communes button{color:#6a7b8c!important;-webkit-text-fill-color:currentColor!important} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-communes button[aria-selected="true"]{color:var(--yfa-encre)!important} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-communes button[aria-selected="true"] small{color:#0b4f7a!important} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-communes button :is(svg,i){color:inherit!important;background:none!important} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-eventail>button{background-image:none} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-carte-verre b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis} /* V2.054 — le lecteur des réels de l'accueil. */ .yfa-lecteur{position:fixed;inset:0;z-index:20000;display:grid;place-items:center;background:rgba(4,12,22,.86);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);opacity:0;transition:opacity .26s ease} .yfa-lecteur.est-ouvert{opacity:1} .yfa-lecteur.est-sortant{opacity:0} .yfa-lecteur-cadre{position:relative;width:min(100vw,calc(100dvh * 9 / 16));height:min(100dvh,calc(100vw * 16 / 9));max-height:100dvh;background:#000;overflow:hidden;transform:scale(.96);transition:transform .32s cubic-bezier(.2,.8,.2,1)} .yfa-lecteur.est-ouvert .yfa-lecteur-cadre{transform:none} @media(min-width:700px){.yfa-lecteur-cadre{height:min(88dvh,820px);width:calc(min(88dvh,820px) * 9 / 16);border-radius:28px;box-shadow:var(--ombre-haute)}} .yfa-lecteur-video{width:100%;height:100%;object-fit:cover;display:block;transition:opacity .28s ease} .yfa-lecteur.est-change .yfa-lecteur-video{opacity:.25} .yfa-lecteur-cadre::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,.45),transparent 22%,transparent 55%,rgba(0,0,0,.78))} .yfa-lecteur-barre{position:absolute;z-index:3;left:14px;right:14px;top:calc(10px + env(safe-area-inset-top));height:3px;border-radius:2px;background:rgba(255,255,255,.28);overflow:hidden} .yfa-lecteur-barre span{display:block;height:100%;width:0;background:#fff;transition:width .25s linear} .yfa-lecteur-btn{position:absolute;z-index:4;width:46px;height:46px;border-radius:23px;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.14);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:#fff;display:grid;place-items:center;cursor:pointer;padding:0} .yfa-lecteur-btn[hidden]{display:none} .yfa-lecteur-fermer{top:calc(24px + env(safe-area-inset-top));right:14px} .yfa-lecteur-son{top:calc(24px + env(safe-area-inset-top));left:14px} .yfa-lecteur-prec{right:14px;top:calc(50% - 54px)} .yfa-lecteur-suiv{right:14px;top:calc(50% + 8px)} .yfa-lecteur-pause{position:absolute;z-index:3;left:50%;top:50%;width:76px;height:76px;margin:-38px 0 0 -38px;border-radius:38px;background:rgba(255,255,255,.22);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;display:grid;place-items:center;opacity:0;transform:scale(.8);transition:opacity .2s,transform .2s;pointer-events:none} .yfa-lecteur-pause svg{width:30px;height:30px} .yfa-lecteur.est-pause .yfa-lecteur-pause{opacity:1;transform:none} .yfa-lecteur-infos{position:absolute;z-index:3;left:14px;right:14px;bottom:calc(16px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:4px;padding:16px;border-radius:22px;background:rgba(7,26,46,.5);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);color:#fff;font-family:Manrope,Arial,sans-serif} .yfa-lecteur-prix{font:800 20px Sora,Manrope,Arial,sans-serif} .yfa-lecteur-titre{font:700 15px/1.3 Manrope,Arial,sans-serif} .yfa-lecteur-lieu{font:600 13px Manrope,Arial,sans-serif;opacity:.82} .yfa-lecteur-actions{display:flex;gap:8px;margin-top:10px} .yfa-lecteur-actions a{flex:1;display:inline-flex;align-items:center;justify-content:center;height:44px;border-radius:22px;font:800 14px Manrope,Arial,sans-serif;text-decoration:none} .yfa-lecteur-annonce{background:#fff;color:#071a2e} .yfa-lecteur-tous{border:1px solid rgba(255,255,255,.45);color:#fff;background:rgba(255,255,255,.12)} body.yfa-lecteur-ouvert{overflow:hidden} body.yfa-lecteur-ouvert .yf-unified-bottom-nav{opacity:0;pointer-events:none} @media(prefers-reduced-motion:reduce){.yfa-lecteur,.yfa-lecteur-cadre,.yfa-lecteur-video{transition:none}} /* ===================================================================== V2.055 — MODE NUIT DE L'ACCUEIL Le hero et le pied restent tels quels (ils sont déjà sombres) ; la vitrine passe sur un fond bleu nuit, les titres en clair. ===================================================================== */ html[data-theme="nuit"] body.yf-premium-home:has(#yfShowcaseSections){--yfa-fond:#06131f;--yfa-ligne:rgba(255,255,255,.12);--yfa-doux:rgba(238,244,249,.62);color:#eef4f9} html[data-theme="nuit"] body.yf-premium-home:has(#yfShowcaseSections) :is(.yfa-tete h2,.yfa-categories h2,.yfa-titre h2){color:#eef4f9} html[data-theme="nuit"] body.yf-premium-home:has(#yfShowcaseSections) :is(.yfa-lien,.yfa-reels-vide a){color:#8fd3ff} html[data-theme="nuit"] body.yf-premium-home:has(#yfShowcaseSections) :is(.yfa-plus,.yfa-piste .yf-tout-afficher,.yfa-reels-vide){background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14);color:#eef4f9} html[data-theme="nuit"] body.yf-premium-home:has(#yfShowcaseSections) .yfa-plus:hover{border-color:#8fd3ff} html[data-theme="nuit"] body.yf-premium-home:has(#yfShowcaseSections) .yfa-ronds b{color:rgba(238,244,249,.82)} html[data-theme="nuit"] body.yf-premium-home:has(#yfShowcaseSections) .yfa-ronds button[aria-selected="true"] b{color:#fff!important} html[data-theme="nuit"] body.yf-premium-home:has(#yfShowcaseSections) .yfa-communes button{color:rgba(238,244,249,.6)!important} html[data-theme="nuit"] body.yf-premium-home:has(#yfShowcaseSections) .yfa-communes button[aria-selected="true"]{color:#fff!important} html[data-theme="nuit"] body.yf-premium-home:has(#yfShowcaseSections) .yfa-communes button[aria-selected="true"] small{color:#8fd3ff!important} html[data-theme="nuit"] body.yf-premium-home:has(#yfShowcaseSections) .yfa-communes{border-color:rgba(255,255,255,.1)} html[data-theme="nuit"] body.yf-premium-home:has(#yfShowcaseSections) .yfa-squelette span{background:linear-gradient(90deg,#0d2133,#16304a,#0d2133);background-size:200% 100%} html[data-theme="nuit"] body.yf-premium-home:has(#yfShowcaseSections) .yfa-carte-etat{background:rgba(7,26,46,.82);color:#7fe0aa} html[data-theme="nuit"] body.yf-premium-home:has(#yfShowcaseSections) .yfa-carte-etat.est-pris{color:#f3b46b} html[data-theme="nuit"] body.yf-premium-home:has(#yfShowcaseSections) .yf-home-footer{border-top:1px solid rgba(255,255,255,.08)} html[data-theme="nuit"] body.yf-premium-home:has(#yfShowcaseSections) .yfa-recherche-texte small{color:#56677a} /* V2.056 — l'assistant (proposition A) occupe l'écran : plus de carte blanche autour, le fond de la page porte la question. */ html body.yf-premium-home.yf-search-open:has(#yfShowcaseSections) :is(main,.hero.yf-hero-visuel,.yf-search-entry.is-open){background:#f6f8fa!important} html body.yf-premium-home.yf-search-open:has(#yfShowcaseSections) #searchAssistant.yf-conversation-search{padding:4px 0 0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important} html[data-theme="nuit"] body.yf-premium-home.yf-search-open:has(#yfShowcaseSections) :is(main,.hero.yf-hero-visuel,.yf-search-entry.is-open){background:#06131f!important} html[data-theme="nuit"] body.yf-premium-home.yf-search-open:has(#yfShowcaseSections) .yf-search-entry.is-open .yf-search-close{background:rgba(255,255,255,.06) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23eef4f9' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 12H5'/%3E%3Cpath d='m12 19-7-7 7-7'/%3E%3C/svg%3E") no-repeat 12px center/18px!important;color:#eef4f9!important;border-color:rgba(255,255,255,.14)!important} html[data-theme="nuit"] body.yf-premium-home.yf-search-open:has(#yfShowcaseSections) .yf-search-entry.is-open .yf-search-close::before,html[data-theme="nuit"] body.yf-premium-home.yf-search-open:has(#yfShowcaseSections) .yf-search-entry.is-open .yf-search-close::after{color:#eef4f9!important;-webkit-text-fill-color:currentColor!important} /* V2.059 — rien ne déborde de l'écran : la page ne glisse plus de côté après une recherche, et l'assistant garde la largeur du téléphone. */ html:has(body.yf-premium-home),html body.yf-premium-home{overflow-x:clip!important;max-width:100%} html body.yf-premium-home #yfHomeMatches{display:block;margin:0;padding:22px 0 6px;background:var(--yfa-fond,#eef3f7);max-width:100vw;overflow:hidden} html body.yf-premium-home #yfHomeMatches[hidden]{display:none} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-resultats .yfa-plus{cursor:pointer} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-resultats .yf-tout-afficher{flex:0 0 46%;min-height:0;border-radius:24px;display:grid;place-items:center;align-content:center;gap:6px;text-decoration:none;text-align:center;padding:16px} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-resultats .yf-tout-afficher b{font:800 15px Manrope,Arial,sans-serif;color:var(--yfa-encre)} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-resultats .yf-tout-afficher span{font:700 12.5px Manrope,Arial,sans-serif;color:var(--yfa-doux)} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-resultats .yfa-reels-vide{margin:0 16px} /* L'assistant ouvert : rien plus large que l'écran, et pas de bande blanche en bas. */ html body.yf-premium-home.yf-search-open .yf-search-entry.is-open{left:0!important;right:0!important;width:100%!important;max-width:100vw!important;overflow-x:hidden!important;overflow-y:auto!important;bottom:0!important} html body.yf-premium-home.yf-search-open #searchAssistant,html body.yf-premium-home.yf-search-open .yq.yq-a{max-width:100%!important;box-sizing:border-box} html body.yf-premium-home.yf-search-open .yf-search-entry.is-open .yq.yq-a{padding-bottom:120px!important} /* V2.060 — « Comment ça marche » et « Mes besoins » se partagent la largeur : même marge à gauche et à droite, la rangée est centrée. */ @media(max-width:899px){ html body.yf-premium-home:has(#yfShowcaseSections) .yfa-hero-actions{flex-wrap:nowrap!important;justify-content:center!important} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-hero-actions>:is(.yfa-comment,.ym-besoins){flex:1 1 auto!important;justify-content:center} } /* V2.061 — le bouton « Découvrir Yafoye Autentik » est centré. */ html body.yf-premium-home:has(#yfShowcaseSections) .yfa-autentik-bouton{align-self:center!important;margin-left:auto!important;margin-right:auto!important} /* V2.063 — à qui parle le message : une simple ligne de texte, centrée, encadrée de deux filets. Plus de pastille floutée ni de voyant. */ html body.yf-premium-home .yfa-messages .ym-pour{display:flex;align-items:center;justify-content:center;gap:10px;align-self:center;width:100%;margin:0 0 6px;padding:0;background:none;border:0;color:rgba(255,255,255,.82);font:600 13px/1.3 Manrope,Arial,sans-serif;text-align:center} html body.yf-premium-home .yfa-messages .ym-pour::before,html body.yf-premium-home .yfa-messages .ym-pour::after{content:"";flex:0 0 22px;height:1px;background:currentColor;opacity:.55} /* V2.063 — « Votre ville » à la souris : deux flèches de part et d'autre de la carte centrale. Sur écran tactile, on fait glisser. */ html body.yf-premium-home:has(#yfShowcaseSections) .yfa-eventail-cadre{position:relative} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-fleche{display:none;position:absolute;top:50%;z-index:40;width:44px;height:44px;margin-top:-22px;border-radius:50%;border:1px solid var(--yfa-ligne,rgba(7,26,46,.1));background:#fff;color:#0b2a47;box-shadow:var(--ombre);cursor:pointer;align-items:center;justify-content:center;font-size:16px} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-fleche:hover{background:#0b2a47;color:#fff} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-fleche-g{left:max(16px,calc(50% - 360px))} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-fleche-d{right:max(16px,calc(50% - 360px))} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-aide-souris{display:none} @media (hover:hover) and (pointer:fine){ html body.yf-premium-home:has(#yfShowcaseSections) .yfa-fleche{display:inline-flex} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-aide-tactile{display:none} html body.yf-premium-home:has(#yfShowcaseSections) .yfa-aide-souris{display:inline} } html[data-theme="nuit"] body.yf-premium-home:has(#yfShowcaseSections) .yfa-fleche{background:#132334;color:#eef4f9;border-color:rgba(255,255,255,.14)}