/* =========================================================================
   Vivannonces Rose — Annuaire rencontres local (préfixe sl-).
   Port fidèle du design Vivannonces, recolorié rose/framboise. Aucun CDN.
   Couleurs themables en --brand-* (injectées par le générateur).
   ========================================================================= */

:root {
    --brand-primary: #EC4899;      /* rose (ex-vert) */
    --brand-primary-dark: #DB2777;
    --brand-accent: #BE123C;       /* framboise (ex-orange) */
    --sl-accent-dark: #9F1239;
    --sl-bg: #F5F5F5;
    --sl-text: #212121;
    --sl-muted: #757575;
    --sl-border: #E0E0E0;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: 'Inter', Arial, sans-serif; background: var(--sl-bg); color: var(--sl-text); font-size: 14px; line-height: 1.5; }
a { color: inherit; }
img { max-width: 100%; display: block; }

/* ---- Grille autonome (remplace Bootstrap) ---- */
.sl-container { max-width: 1180px; margin: 0 auto; padding: 0 16px; }
.sl-header-row { display: grid; grid-template-columns: 260px 1fr; gap: 24px; align-items: center; }
.sl-listing-wrap { padding: 18px 16px; }
.sl-main-grid { display: grid; grid-template-columns: 270px 1fr 290px; gap: 16px; align-items: start; }
.sl-footer-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 28px; }

/* ---- Top bar ---- */
.sl-top-bar { background: #2E2E2E; color: #BDBDBD; font-size: 12px; padding: 6px 0; }
.sl-top-bar .sl-container { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px; }
.sl-top-bar a { color: #BDBDBD; text-decoration: none; margin-right: 18px; }
.sl-top-bar a:hover { color: #fff; }
.sl-btn-poster { background: var(--brand-accent); color: #fff !important; padding: 4px 14px; border-radius: 3px; font-weight: 700; margin-right: 0 !important; }
.sl-btn-poster:hover { background: var(--sl-accent-dark); color: #fff !important; }

/* ---- Header ---- */
.sl-main-header { background: #fff; border-bottom: 3px solid var(--brand-primary); padding: 18px 0; position: sticky; top: 0; z-index: 1000; }
.sl-logo { font-size: 28px; font-weight: 800; color: var(--brand-primary); line-height: 1; text-decoration: none; }
.sl-logo span { color: var(--brand-accent); }
.sl-logo-sub { font-size: 11px; color: var(--sl-muted); text-transform: uppercase; letter-spacing: 1px; }

/* ---- Search ---- */
.sl-search-mega { display: flex; gap: 0; border: 2px solid var(--brand-primary); border-radius: 4px; overflow: hidden; background: #fff; }
.sl-search-mega select, .sl-search-mega input { border: 0; padding: 12px 16px; font-size: 14px; outline: none; height: 48px; font-family: inherit; }
.sl-search-mega select { border-right: 1px solid var(--sl-border); min-width: 210px; background: #fff; }
.sl-search-mega input { flex: 1; min-width: 100px; }
.sl-search-mega button { background: var(--brand-accent); color: #fff; border: 0; padding: 0 30px; font-weight: 700; font-size: 15px; text-transform: uppercase; cursor: pointer; }
.sl-search-mega button:hover { background: var(--sl-accent-dark); }

/* ---- Categories bar ---- */
.sl-cat-bar { background: #fff; border-bottom: 1px solid var(--sl-border); padding: 10px 0; }
.sl-cat-bar .sl-container { overflow-x: auto; white-space: nowrap; }
.sl-cat-pill { display: inline-block; padding: 7px 16px; margin-right: 8px; background: #F5F5F5; color: var(--sl-text); border-radius: 20px; font-size: 13px; font-weight: 500; text-decoration: none; border: 1px solid transparent; }
.sl-cat-pill:hover { background: #FCE7F3; color: var(--brand-primary-dark); }
.sl-cat-pill.sl-active { background: var(--brand-primary); color: #fff; }

/* ---- Sidebar (filtres) ---- */
.sl-sidebar-box { background: #fff; border: 1px solid var(--sl-border); border-radius: 4px; margin-bottom: 15px; }
.sl-sidebar-title { background: var(--brand-primary); color: #fff; padding: 10px 14px; font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; border-radius: 3px 3px 0 0; display: flex; align-items: center; gap: 6px; }
.sl-sidebar-title--accent { background: var(--brand-accent); }
.sl-sidebar-body { padding: 14px; }
.sl-filter-label { font-size: 13px; font-weight: 600; color: #424242; margin-bottom: 8px; margin-top: 14px; }
.sl-filter-label:first-child { margin-top: 0; }
.sl-filter-input { width: 100%; padding: 7px 10px; border: 1px solid var(--sl-border); border-radius: 3px; font-size: 13px; font-family: inherit; margin-bottom: 8px; }

.sl-city-list { max-height: 180px; overflow-y: auto; border: 1px solid var(--sl-border); padding: 6px; border-radius: 3px; background: #fafafa; }
.sl-city-list label { display: flex; justify-content: space-between; padding: 5px 8px; font-size: 13px; cursor: pointer; border-radius: 2px; }
.sl-city-list label:hover { background: #FCE7F3; }
.sl-city-list .sl-count { color: var(--sl-muted); font-size: 12px; }

.sl-range-wrap { display: flex; gap: 8px; align-items: center; }
.sl-range-wrap input { width: 64px; padding: 5px 8px; border: 1px solid var(--sl-border); border-radius: 3px; font-size: 13px; }
.sl-check-list label { display: flex; align-items: center; padding: 4px 0; font-size: 13px; cursor: pointer; }
.sl-check-list input { margin-right: 8px; }

.sl-toggle-row { display: flex; justify-content: space-between; align-items: center; padding: 6px 0; font-size: 13px; }
.sl-toggle { position: relative; width: 38px; height: 20px; background: #ccc; border-radius: 10px; cursor: pointer; flex-shrink: 0; }
.sl-toggle::after { content: ''; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; background: #fff; border-radius: 50%; transition: .2s; }
.sl-toggle.sl-on { background: var(--brand-primary); }
.sl-toggle.sl-on::after { left: 20px; }

.sl-btn-apply { background: var(--brand-primary); color: #fff; border: 0; padding: 12px; width: 100%; font-weight: 700; font-size: 13px; text-transform: uppercase; border-radius: 3px; margin-top: 12px; letter-spacing: .5px; cursor: pointer; }
.sl-btn-apply:hover { background: var(--brand-primary-dark); }
.sl-reset-link { display: block; text-align: center; margin-top: 8px; font-size: 12px; color: var(--sl-muted); text-decoration: none; }

/* ---- Résultats + tri ---- */
.sl-results-header { background: #fff; border: 1px solid var(--sl-border); border-radius: 4px; padding: 14px 18px; display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; flex-wrap: wrap; gap: 10px; }
.sl-results-count { font-size: 14px; color: #424242; }
.sl-results-count strong { color: var(--brand-primary-dark); }
.sl-results-count h1 { font-size: 16px; font-weight: 700; color: var(--sl-text); display: inline; }
.sl-sort-wrap { display: flex; align-items: center; gap: 6px; }
.sl-sort-wrap label { font-size: 12px; }
.sl-sort-wrap select { border: 1px solid var(--sl-border); padding: 7px 12px; font-size: 13px; border-radius: 3px; font-family: inherit; }

/* ---- Annonce ---- */
.sl-annonce { background: #fff; border: 1px solid var(--sl-border); border-left: 3px solid transparent; border-radius: 4px; padding: 14px; margin-bottom: 10px; display: flex; gap: 15px; transition: all .15s; }
.sl-annonce:hover { border-color: var(--brand-primary); box-shadow: 0 2px 8px rgba(0, 0, 0, .06); }
.sl-annonce.sl-urgent { border-left-color: #E53935; }
.sl-annonce.sl-premium { border-left-color: var(--brand-accent); background: #FFF1F5; }
.sl-annonce-photo { width: 120px; height: 120px; border-radius: 4px; object-fit: cover; flex-shrink: 0; filter: blur(8px); }
.sl-annonce-photo:hover { filter: blur(8px); }
.sl-annonce-body { flex: 1; min-width: 0; }
.sl-annonce-title { font-size: 16px; font-weight: 700; color: #212121; margin-bottom: 4px; line-height: 1.3; }
.sl-annonce-title a { color: inherit; text-decoration: none; }
.sl-annonce-title a:hover { color: var(--brand-primary-dark); }
.sl-annonce-location { font-size: 12px; color: var(--sl-muted); margin-bottom: 8px; display: flex; align-items: center; gap: 4px; }
.sl-annonce-location .sl-distance { color: var(--sl-accent-dark); font-weight: 600; margin-left: 8px; }
.sl-annonce-desc { font-size: 13px; color: #424242; line-height: 1.5; margin-bottom: 10px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.sl-annonce-tags .sl-tag { display: inline-block; background: #F5F5F5; color: #616161; padding: 3px 8px; border-radius: 3px; font-size: 11px; margin-right: 4px; font-weight: 500; }
.sl-annonce-tags .sl-tag-verified { background: #FCE7F3; color: var(--brand-primary-dark); }
.sl-annonce-tags .sl-tag-photo { background: #E3F2FD; color: #1976D2; }
.sl-annonce-side { width: 130px; flex-shrink: 0; display: flex; flex-direction: column; align-items: flex-end; justify-content: space-between; text-align: right; gap: 8px; }
.sl-annonce-date { font-size: 11px; color: var(--sl-muted); display: block; margin-top: 4px; }
.sl-badge-urgent { background: #E53935; color: #fff; padding: 3px 8px; border-radius: 3px; font-size: 11px; font-weight: 700; text-transform: uppercase; }
.sl-badge-premium { background: var(--brand-accent); color: #fff; padding: 3px 8px; border-radius: 3px; font-size: 11px; font-weight: 700; text-transform: uppercase; }
.sl-badge-online { background: #4CAF50; color: #fff; padding: 3px 8px; border-radius: 3px; font-size: 11px; font-weight: 600; display: inline-flex; align-items: center; gap: 4px; }
.sl-badge-online::before { content: ''; width: 6px; height: 6px; background: #fff; border-radius: 50%; }
.sl-btn-contact { background: var(--brand-primary); color: #fff; border: 0; padding: 8px 16px; font-size: 13px; font-weight: 600; border-radius: 3px; width: 100%; text-align: center; text-decoration: none; cursor: pointer; }
.sl-btn-contact:hover { background: var(--brand-primary-dark); color: #fff; }

/* ---- Sidebar droite ---- */
.sl-mini-profile { display: flex; gap: 10px; padding: 10px; border-bottom: 1px solid var(--sl-border); text-decoration: none; color: inherit; }
.sl-mini-profile:last-child { border-bottom: 0; }
.sl-mini-profile:hover { background: #FFF1F5; }
.sl-mini-profile img { width: 50px; height: 50px; border-radius: 50%; object-fit: cover; filter: blur(5px); }
.sl-mini-name { font-size: 13px; font-weight: 600; color: #212121; }
.sl-mini-meta { font-size: 11px; color: var(--sl-muted); display: flex; align-items: center; gap: 4px; }

.sl-city-pop { display: flex; justify-content: space-between; padding: 7px 0; font-size: 13px; border-bottom: 1px dashed #eee; }
.sl-city-pop:last-child { border-bottom: 0; }
.sl-city-pop a { color: #424242; text-decoration: none; }
.sl-city-pop a:hover { color: var(--brand-primary-dark); }
.sl-city-pop .sl-num { background: #F5F5F5; color: #616161; padding: 1px 8px; border-radius: 10px; font-size: 11px; font-weight: 600; }
.sl-see-all { display: block; text-align: center; margin-top: 10px; font-size: 12px; color: var(--brand-primary-dark); font-weight: 600; text-decoration: none; }

.sl-safety-box { background: #FFF1F5; border: 1px solid #FBCFE8; border-radius: 4px; padding: 12px; margin-bottom: 15px; }
.sl-safety-box h6 { font-size: 13px; font-weight: 700; color: var(--sl-accent-dark); margin-bottom: 8px; display: flex; align-items: center; gap: 6px; }
.sl-safety-box ul { font-size: 12px; color: #6b3a4a; padding-left: 18px; margin: 0; line-height: 1.6; }
.sl-safety-box a { font-size: 12px; color: var(--sl-accent-dark); font-weight: 600; text-decoration: none; }

.sl-ad-premium { background: linear-gradient(135deg, var(--brand-accent) 0%, var(--sl-accent-dark) 100%); color: #fff; padding: 18px; border-radius: 4px; text-align: center; margin-bottom: 15px; }
.sl-ad-premium h5 { font-weight: 800; margin-bottom: 6px; font-size: 16px; }
.sl-ad-premium p { font-size: 12px; margin: 0; }
.sl-ad-premium .sl-price { font-size: 24px; font-weight: 800; margin: 8px 0; }
.sl-ad-premium .sl-price small { font-size: 12px; }
.sl-ad-premium a { background: #fff; color: var(--sl-accent-dark); font-weight: 700; padding: 8px 20px; border-radius: 3px; text-decoration: none; display: inline-block; margin-top: 8px; font-size: 13px; }

/* ---- Pagination ---- */
.sl-pagination { display: flex; justify-content: center; flex-wrap: wrap; gap: 4px; margin: 20px 0; }
.sl-pagination a, .sl-pagination span { padding: 8px 14px; background: #fff; border: 1px solid var(--sl-border); color: #424242; text-decoration: none; border-radius: 3px; font-size: 13px; }
.sl-pagination .sl-current { background: var(--brand-primary); color: #fff; border-color: var(--brand-primary); font-weight: 600; }
.sl-pagination a:hover { background: #FCE7F3; }
.sl-results-note { text-align: center; color: var(--sl-muted); font-size: 12px; }

/* ---- Footer ---- */
.sl-footer { background: #2E2E2E; color: #BDBDBD; padding: 40px 0 20px; margin-top: 40px; font-size: 13px; }
.sl-footer h6 { color: #fff; font-size: 13px; font-weight: 700; text-transform: uppercase; margin-bottom: 15px; letter-spacing: .5px; }
.sl-footer a { color: #BDBDBD; text-decoration: none; display: block; padding: 3px 0; font-size: 12px; }
.sl-footer a:hover { color: var(--brand-primary); }
.sl-footer-bottom { border-top: 1px solid #424242; padding-top: 18px; margin-top: 25px; font-size: 11px; color: #757575; text-align: center; }

/* ---- Page hero (service / statiques) ---- */
.sl-page-hero { background: #fff; border-bottom: 1px solid var(--sl-border); padding: 22px 0; }
.sl-breadcrumb { font-size: 12px; color: var(--sl-muted); margin-bottom: 6px; }
.sl-breadcrumb a { color: var(--brand-primary-dark); text-decoration: none; }
.sl-page-hero h1 { font-size: 22px; font-weight: 800; color: var(--sl-text); }

/* =========================================================================
   Slot contenu IA — .sl-redac (bloc SEO sous le listing)
   ========================================================================= */
.sl-seo-block { background: #fff; border: 1px solid var(--sl-border); border-radius: 4px; padding: 22px; margin-top: 14px; }
.sl-redac { color: #424242; font-size: 14px; line-height: 1.7; }
.sl-redac h2 { font-size: 20px; color: var(--sl-text); margin: 22px 0 12px; }
.sl-redac h3 { font-size: 16px; color: var(--sl-text); margin: 18px 0 8px; }
.sl-redac p { margin-bottom: 14px; }
.sl-redac ul, .sl-redac ol { margin: 0 0 14px 20px; }
.sl-redac li { margin-bottom: 5px; }
.sl-redac a { color: var(--brand-primary-dark); }
.sl-redac table { width: 100%; border-collapse: collapse; margin: 14px 0; }
.sl-redac th, .sl-redac td { border: 1px solid var(--sl-border); padding: 9px 12px; text-align: left; }
.sl-redac th { background: #FCE7F3; color: var(--sl-text); }

/* Modules du kit éditorial (préfixés sl-) */
.sl-service-pillars { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 18px 0; }
.sl-service-pillar { background: #FCE7F3; border-radius: 6px; padding: 16px; text-align: center; }
.sl-pillar-icon { font-size: 1.6rem; color: var(--brand-primary); margin-bottom: 6px; }
.sl-blog-stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin: 18px 0; }
.sl-blog-stat { text-align: center; background: #FCE7F3; border-radius: 6px; padding: 14px; }
.sl-stat-number { font-size: 1.6rem; font-weight: 800; color: var(--brand-primary); }
.sl-stat-label { font-size: 11px; color: var(--sl-muted); }
.sl-blog-keyfigure { display: flex; align-items: baseline; gap: 12px; background: var(--brand-primary); color: #fff; border-radius: 6px; padding: 16px 20px; margin: 18px 0; }
.sl-keyfigure-number { font-size: 2rem; font-weight: 800; }
.sl-blog-highlight { border-left: 4px solid var(--brand-accent); background: #FFF1F5; padding: 14px 18px; border-radius: 0 6px 6px 0; margin: 18px 0; }
.sl-blog-steps { counter-reset: step; margin: 18px 0; }
.sl-step { position: relative; padding: 10px 0 10px 46px; counter-increment: step; }
.sl-step::before { content: counter(step); position: absolute; left: 0; top: 8px; width: 30px; height: 30px; background: var(--brand-primary); color: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 700; }
.sl-blog-accordion { border: 1px solid var(--sl-border); border-radius: 6px; margin: 8px 0; overflow: hidden; }
.sl-accordion-content { padding: 12px 16px; }
.sl-article-cta { background: linear-gradient(135deg, var(--brand-primary), var(--brand-accent)); color: #fff; border-radius: 8px; padding: 24px; text-align: center; margin: 22px 0; }
.sl-article-cta h3 { color: #fff; }
.sl-cta-button { display: inline-block; background: #fff; color: var(--brand-primary-dark); font-weight: 700; border-radius: 4px; padding: 10px 24px; margin-top: 10px; text-decoration: none; }

/* ---- Formulaire ---- */
.sl-form { display: grid; gap: 12px; max-width: 560px; }
.sl-form input, .sl-form textarea { width: 100%; padding: 11px 14px; border: 1px solid var(--sl-border); border-radius: 4px; font: inherit; }
.sl-form textarea { min-height: 130px; resize: vertical; }
.sl-form button { background: var(--brand-primary); color: #fff; border: 0; padding: 12px 22px; font-weight: 700; border-radius: 4px; cursor: pointer; justify-self: start; }

/* ---- Responsive ---- */
@media (max-width: 991px) {
    .sl-header-row { grid-template-columns: 1fr; gap: 14px; }
    .sl-main-grid { grid-template-columns: 1fr; }
    .sl-right-col { display: none; }
    .sl-footer-grid { grid-template-columns: repeat(2, 1fr); }
    .sl-service-pillars, .sl-blog-stats-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
    .sl-annonce { flex-wrap: wrap; }
    .sl-annonce-photo { width: 100%; height: 180px; }
    .sl-annonce-side { width: 100%; flex-direction: row; align-items: center; }
    .sl-footer-grid { grid-template-columns: 1fr; }
    .sl-blog-stats-grid, .sl-service-pillars { grid-template-columns: 1fr; }
    .sl-cta-hero h1, .sl-cta-hero h2 { font-size: 23px; }
}

/* ── CTA héro dominant — intention de recherche : rejoindre le club (affilié) ── */
.sl-cta-hero { background: linear-gradient(135deg, var(--brand-primary), var(--brand-accent)); color: #fff; border-radius: 8px; padding: 36px 28px; margin: 0 0 22px; text-align: center; box-shadow: 0 12px 32px rgba(190, 18, 60, .28); }
.sl-cta-hero-tag { display: inline-block; background: rgba(255, 255, 255, .2); color: #fff; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; padding: 5px 14px; border-radius: 50rem; margin-bottom: 14px; }
.sl-cta-hero h1, .sl-cta-hero h2 { color: #fff; font-size: 30px; font-weight: 800; line-height: 1.18; margin: 0 0 10px; }
.sl-cta-hero p { color: rgba(255, 255, 255, .93); font-size: 15px; max-width: 580px; margin: 0 auto 22px; }
.sl-cta-hero-btn { display: inline-block; background: #fff; color: var(--brand-accent); font-weight: 800; font-size: 18px; padding: 16px 42px; border-radius: 50rem; text-decoration: none; box-shadow: 0 8px 20px rgba(0, 0, 0, .2); transition: transform .15s; }
.sl-cta-hero-btn:hover { transform: translateY(-2px); color: var(--sl-accent-dark); }
.sl-cta-hero-trust { margin-top: 16px; font-size: 12.5px; color: rgba(255, 255, 255, .88); }
/* CTA optimisé conversion : indicateur live, urgence, bouton qui attire l'œil */
.sl-cta-hero--boost { margin: 18px 0 0; }
.sl-live-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #22c55e; margin-right: 6px; vertical-align: middle; box-shadow: 0 0 0 0 rgba(34, 197, 94, .7); animation: sl-pulse 1.6s infinite; }
@keyframes sl-pulse { 0% { box-shadow: 0 0 0 0 rgba(34, 197, 94, .6); } 70% { box-shadow: 0 0 0 9px rgba(34, 197, 94, 0); } 100% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0); } }
.sl-cta-hero-urgency { margin-top: 14px; font-size: 13px; font-weight: 700; color: #fff; background: rgba(0, 0, 0, .18); display: inline-block; padding: 7px 16px; border-radius: 50rem; }
.sl-cta-hero-urgency i { margin-right: 6px; }
.sl-cta-hero-btn { animation: sl-btn-glow 2.4s ease-in-out infinite; }
@keyframes sl-btn-glow { 0%, 100% { box-shadow: 0 8px 20px rgba(0, 0, 0, .2); } 50% { box-shadow: 0 10px 30px rgba(255, 255, 255, .6); } }
@media (prefers-reduced-motion: reduce) { .sl-live-dot, .sl-cta-hero-btn { animation: none; } }

/* ── Profils floutés (teaser → CTA, curiosité « débloque en rejoignant ») ── */
.sl-list-label { font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; color: var(--sl-muted); margin: 4px 0 12px; }
.sl-annonce-photo-wrap { position: relative; width: 120px; height: 120px; flex-shrink: 0; }
.sl-annonce-photo-wrap .sl-annonce-photo { width: 100%; height: 100%; filter: blur(9px); }
.sl-annonce-photo-wrap .sl-annonce-photo:hover { filter: blur(9px); }
.sl-lock { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; background: linear-gradient(180deg, rgba(33, 33, 33, .12), rgba(190, 18, 60, .48)); color: #fff; border-radius: 4px; font-size: 10.5px; font-weight: 700; text-align: center; padding: 6px; text-transform: uppercase; letter-spacing: .3px; }
.sl-lock i { font-size: 22px; }
a.sl-annonce { color: inherit; }
a.sl-annonce:hover { text-decoration: none; border-color: var(--brand-primary); }


:root{--brand-primary:#EC4899;--brand-primary-dark:#BE123C;--brand-accent:#BE123C;}
/* Maillage interne — régions / villes / catégories (rendu visible du page_links 04) */
.sl-mesh { margin-top: 32px; border-top: 1px solid var(--sl-border, #E0E0E0); padding-top: 24px; display: flex; flex-direction: column; gap: 20px; }
.sl-mesh-title { font-size: 1rem; font-weight: 700; margin: 0 0 10px; color: var(--sl-text, #212121); }
.sl-mesh-links { display: flex; flex-wrap: wrap; gap: 8px; }
.sl-mesh-links a { font-size: .85rem; padding: 5px 12px; background: var(--sl-bg, #F5F5F5); border: 1px solid var(--sl-border, #E0E0E0); border-radius: 999px; color: var(--sl-text, #424242); text-decoration: none; transition: background .15s, color .15s, border-color .15s; }
.sl-mesh-links a:hover { background: var(--brand-primary, #EC4899); border-color: var(--brand-primary, #EC4899); color: #fff; }

/* Fix numérotation des étapes : supprime le marqueur <ol> natif et le .step-num non stylé
   (doublons), ne garde que le badge rose .sl-step::before (counter). */
.sl-blog-steps { list-style: none; padding-left: 0; margin-left: 0; }
.sl-blog-steps .step-num { display: none; }

/* Process / étapes service (sl-process) — badge numéroté propre (sl-s.css n'est pas chargé) */
.sl-service-process { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 18px; margin: 18px 0; }
.sl-process-step { position: relative; }
.sl-process-number { width: 36px; height: 36px; border-radius: 50%; background: var(--brand-primary, #EC4899); color: #fff; font-weight: 700; display: flex; align-items: center; justify-content: center; margin-bottom: 10px; }
.sl-process-step h4 { margin: 0 0 .25rem; font-size: 1.05rem; color: var(--sl-text, #212121); }
.sl-process-step p { margin: 0; color: var(--sl-muted, #757575); }

/* Carte teaser floutée (style Google) — conversion vers l'inscription */
.sl-map-teaser { position: relative; margin: 18px 0; border-radius: 14px; overflow: hidden; min-height: 260px; border: 1px solid var(--sl-border, #E0E0E0); }
.sl-map-canvas { position: absolute; inset: -12px; filter: blur(5px); background-color: #e8eaed;
  background-image:
    radial-gradient(circle at 82% 74%, #a9d6ff 0 78px, transparent 80px),
    radial-gradient(circle at 16% 26%, #c7e7c9 0 58px, transparent 60px),
    linear-gradient(90deg, transparent 0 38%, #ffffff 38% 41%, transparent 41%),
    linear-gradient(0deg,  transparent 0 57%, #ffffff 57% 60%, transparent 60%),
    linear-gradient(58deg, transparent 0 47%, #fdf3c4 47% 49%, transparent 49%),
    repeating-linear-gradient(0deg,  #f4f4f2 0 26px, #e2e2de 26px 27px),
    repeating-linear-gradient(90deg, #f4f4f2 0 26px, #e2e2de 26px 27px);
}
.sl-map-pin { position: absolute; left: 50%; top: 44%; width: 16px; height: 16px; background: var(--brand-accent, #BE123C); border: 3px solid #fff; border-radius: 50% 50% 50% 0; transform: translate(-50%, -50%) rotate(45deg); box-shadow: 0 2px 6px rgba(0,0,0,.3); }
.sl-map-overlay { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 10px; padding: 24px; background: linear-gradient(180deg, rgba(255,255,255,.35), rgba(255,255,255,.7)); }
.sl-map-badge { width: 48px; height: 48px; border-radius: 50%; background: var(--brand-primary, #EC4899); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 1.4rem; box-shadow: 0 4px 14px rgba(236,72,153,.4); }
.sl-map-title { font-size: 1.3rem; font-weight: 800; color: var(--sl-text, #212121); margin: 0; }
.sl-map-sub { font-size: .9rem; color: #444; margin: 0; max-width: 430px; }
.sl-map-cta { margin-top: 4px; background: var(--brand-primary, #EC4899); color: #fff; padding: 10px 22px; border-radius: 999px; font-weight: 700; text-decoration: none; display: inline-flex; align-items: center; gap: 8px; }
.sl-map-cta:hover { background: var(--brand-primary-dark, #DB2777); color: #fff; }

/* Sidebar fonctionnelle : villes cliquables, bouton-lien, filtre live */
.sl-hidden { display: none !important; }
.sl-city-row { display: flex; justify-content: space-between; align-items: center; width: 100%; gap: 8px; text-decoration: none; color: inherit; padding: 4px 0; }
.sl-city-row:hover { color: var(--brand-primary, #EC4899); }
.sl-check-list a { text-decoration: none; color: inherit; }
.sl-check-list a:hover { color: var(--brand-primary, #EC4899); }
a.sl-btn-apply { display: block; text-align: center; text-decoration: none; }

/* Sidebar — liste de navigation à choix unique (catégories) */
.sl-nav-list { display: flex; flex-direction: column; gap: 4px; margin: 4px 0 14px; }
.sl-nav-row { display: block; padding: 8px 12px; border-radius: 8px; background: var(--sl-bg, #F5F5F5); color: var(--sl-text, #212121); text-decoration: none; font-size: .9rem; transition: background .15s, color .15s; }
.sl-nav-row:hover { background: #FCE7F3; color: var(--brand-primary, #EC4899); }
.sl-nav-row.sl-active { background: var(--brand-primary, #EC4899); color: #fff; font-weight: 600; }

/* ===== Optimisation MOBILE — funnel vers le CTA ===== */
.sl-mobile-cta { display: none; }
@media (max-width: 991px) {
    body { padding-bottom: 68px; }                 /* espace pour la barre fixe */
    /* Barre CTA collante en bas, toujours visible */
    .sl-mobile-cta {
        display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 1100;
        align-items: center; justify-content: center; gap: 9px;
        background: linear-gradient(135deg, var(--brand-primary), var(--brand-accent));
        color: #fff; font-weight: 800; font-size: 16px; padding: 15px 16px;
        text-decoration: none; text-transform: uppercase; letter-spacing: .3px;
        box-shadow: 0 -3px 14px rgba(0,0,0,.22);
    }
    .sl-mobile-cta i { font-size: 19px; }
    .sl-mobile-cta:active { filter: brightness(.95); }
    /* Sidebar de filtres masquée sur mobile : nav via cat-bar + footer, focus sur le contenu + CTA */
    .sl-left-col { display: none; }
    /* Recherche d'en-tête : ne déborde plus (empile select / champ+bouton) */
    .sl-search-mega { flex-wrap: wrap; }
    .sl-search-mega select { min-width: 100%; border-right: 0; border-bottom: 1px solid var(--sl-border); }
    .sl-search-mega input { min-width: 60%; }
    .sl-cta-hero { padding: 26px 18px; }
    .sl-map-teaser { min-height: 220px; }
}
@media (max-width: 560px) {
    .sl-mobile-cta { font-size: 15px; padding: 14px 12px; }
    .sl-top-bar .sl-container > div:first-child { display: none; } /* allège la top-bar, garde les liens d'inscription */
}
