/* ============================================================
   UNAPERCU — STYLE CLEAN (dedupe + no !important)
   Généré automatiquement depuis ton style.css
   ============================================================ */*{
  box-sizing: border-box;
}html,body{
  margin: 0;
  padding: 0;
}body{
  font-family: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  background: var(--page-bg, var(--bg));
  color: var(--text);
  line-height: 1.35;
}a{
  color: inherit;
  text-decoration: none;
}img{
  max-width: 100%;
  display: block;
}.container{
  width: min(1100px, calc(100% - 32px));
  margin: 0 auto;
}.page-main{
  padding: 24px 0 60px;
}.header-inner{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 0;
}.logo{
  display: flex;
  align-items: center;
  gap: 10px;
}.logo-img{
  height: 34px;
  width: auto;
}.nav{
  display: flex;
  align-items: center;
  gap: 14px;
}.nav-link{
  color: var(--text-muted);
  font-weight: 800;
  padding: 8px 10px;
  border-radius: 999px;
  transition: background var(--transition), color var(--transition);
}.nav-link:hover{
  color: var(--text);
  background: var(--accent-soft);
}.nav-user{
  color: var(--text-muted);
  font-weight: 800;
  padding: 8px 10px;
}.btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--accent);
  color: #fff;
  font-weight: 900;
  cursor: pointer;
  transition: background-color .15s ease, transform .12s ease;
}.btn:hover{
  filter: brightness(.96);
}.btn:active{
  transform: translateY(1px);
}.mnav-inner{
  padding: 10px 0 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}.mnav-link{
  padding: 10px 12px;
  border-radius: 12px;
  color: var(--text);
  font-weight: 900;
  background: var(--bg-soft);
  border: 1px solid var(--border);
}.mnav-danger{
  color: #b91c1c;
}input,
select,
textarea{
  width: 100%;
  padding: 12px 12px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--field-bg, var(--card));
  color: var(--text);
  outline: none;
}input:focus,select:focus,textarea:focus{
  border-color: #cbd5e1;
  box-shadow: 0 0 0 3px rgba(15,23,42,.08);
}input::placeholder, textarea::placeholder{
  color: var(--text-muted);
}.hero{
  padding: 24px 0 10px;
}.hero-inner{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
}.hero-title{
  margin: 0;
  font-size: 44px;
  line-height: 1.05;
  letter-spacing: -.02em;
}.hero-name{
  font-weight: 950;
}.hero-tagline{
  display: block;
  margin-top: 10px;
  font-size: 22px;
  color: var(--text-muted);
  font-weight: 850;
}.hero-subtitle{
  margin: 12px 0 0;
  color: var(--text-muted);
  font-weight: 650;
  max-width: 62ch;
}/* ============================================================
   HOME — SEARCH GRID (2x2 + bouton périmètre)
   ============================================================ */.ua-search-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 12px;
  align-items: end;
}.ua-cell{ min-width: 0; }.ua-help{
  margin-top: 6px;
  font-size: 12px;
  font-weight: 750;
  color: var(--text-muted);
}.ua-search-submit{
  grid-column: 1 / -1;
  width: 100%;
  justify-content: center;
}/* Périmètre */.ua-perimeter{ position: relative; }.ua-perimeter-wrap{
  position: relative;
  display: flex;
  justify-content: flex-end;
}.ua-perimeter-btn{
  width: 44px;
  height: 44px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--card);
  color: var(--text);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}.ua-perimeter-btn:hover{
  filter: brightness(.98);
}.ua-perimeter-pop{
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  width: min(260px, 80vw);
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 14px;
  box-shadow: var(--shadow);
  padding: 10px;
  z-index: 50;
}/* Nettoyage visuel après retrait des labels */.ua-perimeter{
  padding-top: 22px; /* aligne mieux avec le champ “Où ?” */
}/* Mobile : on garde 2 colonnes (logo à droite), mais on empile si trop serré */@media (max-width: 520px){.ua-search-grid{
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }.ua-perimeter-btn{
    width: 42px;
    height: 42px;
  }}.with-offers{
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 900;
  color: var(--text);
}.with-offers input[type="checkbox"]{
  width: 18px;
  height: 18px;
}.filters-toggle{
  margin-left: auto;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--card);
  font-weight: 950;
  cursor: pointer;
}.suggestions-wrapper{
  position: relative;
}.suggestions-box{
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 6px);
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  box-shadow: 0 18px 45px rgba(15,23,42,.10);
  overflow: hidden;
  z-index: 20;
}.suggestion-item{
  padding: 10px 12px;
  cursor: pointer;
  font-weight: 900;
  color: var(--text);
}.suggestion-item:hover{
  background: var(--bg-soft);
}.section-title{
  margin: 28px 0 8px;
  font-size: 26px;
  letter-spacing: -.01em;
}.section-subtitle{
  margin: 0 0 14px;
  color: var(--text-muted);
  font-weight: 650;
}.card:hover{
  transform: translateY(-2px);
  box-shadow: 0 18px 55px rgba(15,23,42,.12);
}.card-city, .card-distance{
  white-space: nowrap;
}.biz-offers-list{
  display: flex;
  flex-direction: column;
  gap: 10px;
}.biz-offer-thumb.fallback{
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 900;
  color: var(--text-muted);
}.biz-offer-info{
  flex: 1;
  min-width: 0;
}.biz-offer-cta,
.biz-offer-more{
  display: none;
}.biz-offers-list > *:empty{
  display: none;
  height: 0;
  margin: 0;
  padding: 0;
  border: 0;
}.pagination{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin: 24px 0 0;
}.pg-btn{
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--card);
  font-weight: 950;
}.pg-btn.is-disabled{
  opacity: .45;
  pointer-events: none;
}.pg-info{
  color: var(--text-muted);
  font-weight: 900;
}.site-footer{
  background: var(--card);
  border-top: 1px solid var(--border);
}.footer-inner{
  padding: 16px 0;
  color: var(--text-muted);
  font-weight: 700;
}.card-description{
  margin-top: 6px;
  font-size: .9rem;
  line-height: 1.25;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}.biz-offers{
  margin-top: 6px;
}.biz-offers-title{
  font-weight: 950;
  font-size: 15px;
  letter-spacing: -.01em;
  margin: 0 0 10px;
  margin-bottom: 4px;
}.biz-offer-thumb{
  width: 34px;
  height: 34px;
  flex: 0 0 46px;
  border-radius: 8px;
  background: var(--bg-soft);
  overflow: hidden;
  object-fit: cover;
}.biz-offers-list > .biz-offer-item:nth-child(n+4){
  display: none;
}.card{
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 16px;
  box-shadow: 0 12px 35px rgba(15,23,42,.08);
  overflow: hidden;
  transition: transform var(--transition), box-shadow var(--transition);
  
  width: 100%;
  min-width: 0;
}.page-dashboard .dashboard-form input,
.page-dashboard .dashboard-form textarea,
.page-dashboard .dashboard-form select{
  color: var(--text);
  background: #fff;
  border: 1px solid var(--border);
}.page-dashboard .dashboard-form input::placeholder,
.page-dashboard .dashboard-form textarea::placeholder{
  color: var(--text-muted);
}.btn-pro{
  background: #f59e0b;
  color: #111;
}.btn-pro:hover{
  background: #fbbf24;
}.btn-normal{
  background: #22c55e;
  color: #062e14;
}.btn-normal:hover{
  background: #4ade80;
}.card-pro{
  border: 2px solid rgba(245,158,11,.55);
  box-shadow: 0 10px 30px rgba(245,158,11,.15);
}.card-normal{
  border: 2px solid rgba(34,197,94,.55);
  box-shadow: 0 10px 30px rgba(34,197,94,.15);
}.btn-upgrade-pro{
  background: #f59e0b;
  color: #111;
  font-weight: 700;
}.btn-upgrade-pro:hover{
  background: #fbbf24;
}.btn-upgrade-pro,
.btn-upgrade-pro:disabled,
.btn-upgrade-pro[disabled]{
  background: #f59e0b;
  color: #111;
  opacity: 1;
}.btn.btn-upgrade-pro,
.btn.btn-upgrade-pro:disabled,
.btn.btn-upgrade-pro[disabled]{
  background: #f59e0b;
  color: #111;
  opacity: 1;
  filter: none;
}.limit-pro-card{
  border: 2px solid rgba(245,158,11,.45);
  box-shadow: 0 10px 30px rgba(245,158,11,.12);
}.limit-pro-link{
  display: inline-block;
  margin-left: .35rem;
  padding: .35rem .6rem;
  border-radius: 999px;
  background: #f59e0b;
  color: #111;
  font-weight: 700;
  text-decoration: none;
}.limit-pro-link:hover{
  background: #fbbf24;
}.badge-pro-engage{
  display: inline-block;
  margin-bottom: 6px;
  font-size: 12px;
  padding: 4px 8px;
  border-radius: 999px;
  border: 1px solid rgba(255, 140, 0, .6);
  background: rgba(255, 140, 0, .08);
  color: #b45309;
  font-weight: 500;
}.card-pro-engage{
  border: 2px solid rgba(245,158,11,.65);
  box-shadow: 0 0 0 1px rgba(245,158,11,.12);
  outline: 2px solid rgba(245,158,11,.55);
  outline-offset: -2px;
}.offer-page{
  max-width: 720px;
  margin: 0 auto;
}.offer-back{
  display: inline-block;
  margin-bottom: 16px;
  color: var(--text-muted);
  text-decoration: none;
}.offer-subtitle{
  opacity: .85;
  margin-bottom: 24px;
}.offer-note{
  font-size: 14px;
  opacity: .8;
  margin-top: 12px;
}.offer-badge.is-available{
  border-color: rgba(34,197,94,.35);
}.offer-badge.is-unavailable{
  border-color: rgba(239,68,68,.35);
  opacity: .9;
}.account-type{
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items: stretch;
}.account-type__option{
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  user-select: none;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: rgba(255,255,255,.03);
  flex: 1 1 170px;
}.account-type__option input[type="radio"]{
  margin: 0;
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
}.card-pro-engage,
.card-business,
.business-card,
.is-business{
  border: 2px solid #f59e0b;
  box-shadow: 0 0 0 1px rgba(245,158,11,.18);
}.badge-pro-engage,
.badge-business{
  border: 1px solid rgba(245,158,11,.55);
  background: rgba(245,158,11,.15);
  color: #92400e;
  font-weight: 900;
}.card-free{
  border: 1px solid var(--border);
  box-shadow: none;
}.card-basic{
  border: 2px solid rgba(34,197,94,.55);
  box-shadow: 0 0 0 1px rgba(34,197,94,.12);
}.card-business{
  border: 2px solid rgba(245,158,11,.65);
  box-shadow: 0 0 0 1px rgba(245,158,11,.15);
}.badge-business{
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: .78rem;
  font-weight: 900;
  border: 1px solid rgba(245,158,11,.55);
  background: rgba(245,158,11,.15);
  color: #92400e;
}.page-business .card{
  border-color: rgba(245,158,11,.35);
}.page-business #presentation,
.page-business #details{
  border: 2px solid rgba(245,158,11,.35);
  border-radius: var(--radius);
  padding: 12px;
  background: var(--card);
}.page-business .card-section{
  border: 1px solid var(--border);
  box-shadow: var(--shadow);
}.page-business .card-section.is-business{
  border: 2px solid rgba(245,158,11,.45);
  box-shadow: 0 0 0 1px rgba(245,158,11,.10), var(--shadow);
}.offer-page,
.offer-wrap,
.offer-container,
.offer-layout,
.offer-media,
.offer-gallery{
  overflow-x: hidden;
}.offer-gallery,
.offer-media{
  display: grid;
  grid-template-columns: minmax(320px, 1fr) 260px;
  gap: 14px;
  align-items: start;
}#offerMainImage,
.offer-main-image img,
.offer-carousel img{
  width: 100%;
  height: 420px;
  object-fit: contain;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 16px;
}.offer-main-image,
.offer-carousel,
.offer-media-main{
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 10px;
}.offer-thumbs,
.offer-thumbnails,
#offerThumbs,
.offer-media-thumbs{
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 10px;
  height: 440px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 10px;
}.offer-thumbs .thumbs-grid,
.offer-thumbnails .thumbs-grid,
#offerThumbs,
.offer-media-thumbs{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  overflow-y: auto;
  scrollbar-width: thin;
}.offer-thumbs::-webkit-scrollbar,
.offer-thumbnails::-webkit-scrollbar,
#offerThumbs::-webkit-scrollbar,
.offer-media-thumbs::-webkit-scrollbar{
  width: 8px;
}.offer-thumbs::-webkit-scrollbar-thumb,
.offer-thumbnails::-webkit-scrollbar-thumb,
#offerThumbs::-webkit-scrollbar-thumb,
.offer-media-thumbs::-webkit-scrollbar-thumb{
  background: rgba(100,116,139,.35);
  border-radius: 999px;
}.offer-thumbs img,
.offer-thumbnails img,
#offerThumbs img,
.offer-media-thumbs img{
  width: 100%;
  aspect-ratio: 1/1;
  object-fit: cover;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg-soft);
  cursor: pointer;
  transition: transform .12s ease, filter .12s ease;
}.offer-thumbs img:hover,
.offer-thumbnails img:hover,
#offerThumbs img:hover,
.offer-media-thumbs img:hover{
  transform: translateY(-1px);
  filter: brightness(.97);
}.offer-thumbs img.active,
.offer-thumbnails img.active,
#offerThumbs img.active,
.offer-media-thumbs img.active{
  outline: 2px solid rgba(245,158,11,.65);
  outline-offset: 2px;
}.offer-carousel .nav-btn,
.offer-main-image .nav-btn,
.offer-carousel button,
.offer-main-image button{
  border-radius: 999px;
}.offer-detail-card{
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 0;
  align-items: start;
}.offer-detail-left{
  background: var(--card-soft);
}.offer-detail-right{
  background: var(--card);
  border-left: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  min-width: 0;
}.offer-detail-image img{
  width: 100%;
  height: 420px;
  object-fit: contain;
  background: var(--card-soft);
  display: block;
}.offer-gallery-thumbs{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  padding: 12px;
  background: rgba(0,0,0,0.06);
  border-bottom: 1px solid var(--border);
  overflow-y: auto;
  max-height: 120px;
}.offer-thumbbtn{
  width: 100%;
  height: auto;
  aspect-ratio: 4/3;
  border-radius: 12px;
  overflow: hidden;
  opacity: .9;
}.offer-thumbbtn img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}.offer-thumbbtn.is-active{
  opacity: 1;
  outline: 2px solid rgba(245,158,11,.55);
  outline-offset: 2px;
}.offer-detail-body{
  padding: 14px 16px 16px;
}.biz-offer-item{
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 8px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--card);
  overflow: hidden;
  min-width: 0;
}.biz-offer-row{
  display: flex;
  align-items: center;
  gap: 8px 10px;
  min-width: 0;
  flex-wrap: wrap;
}.biz-offer-name{
  flex: 1 1 100%;
  min-width: 0;
  white-space: normal;
  overflow: hidden;
  text-overflow: ellipsis;
  font-weight: 950;
  font-size: .9rem;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-height: 1.15;
  max-height: 2.3em;
  order: 1;
}.offer-badge{
  display: inline-flex;
  align-items: center;
  height: 18px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: .72rem;
  font-weight: 800;
  border: 1px solid var(--border);
  background: rgba(255,255,255,.04);
  white-space: nowrap;
  order: 2;
  flex: 0 0 auto;
}.biz-offer-price{
  flex: 0 0 auto;
  white-space: nowrap;
  font-weight: 900;
  color: var(--text);
  font-size: .85rem;
  order: 3;
}.page-theme-overlay.dark{
  background: rgba(10,14,20,.72);
}:root{
  --page-bg: #E8E8E8;
  --bg: #A3A3A3;
  --bg-soft: #999999;
  --card: #ffffff;
  --card-soft: #f3f5f9;
  --text: #2E2E2E;
  --text-muted: #7D7D7D;
  --accent: #333333;
  --accent-soft: rgba(17,24,39,.08);
  --border: #e5e7eb;
  --radius: 18px;
  --shadow: 0 18px 45px rgba(15,23,42,.08);
  --transition: .18s ease-out;
  --biz-accent: #f59e0b;
  --biz-accent-soft: rgba(245,158,11,.14);
}.btn-biz{
  background: var(--biz-accent);
  color: #111;
  font-weight: 950;
  border-color: rgba(0,0,0,.10);
}.biz-accent-border{
  border-color: color-mix(in srgb, var(--biz-accent) 40%, var(--border));
}.drag-list{
  display: grid;
  gap: 10px;
}.drag-item{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: var(--card);
  box-shadow: var(--shadow);
  cursor: grab;
  user-select: none;
}.drag-item.is-dragging{
  opacity: .6;
}.drag-title{
  font-weight: 950;
}.drag-sub{
  color: var(--text-muted);
  font-size: .85rem;
  margin-top: 2px;
}.page-business .is-business .pill{
  border-color: color-mix(in srgb, var(--biz-accent) 35%, var(--border));
  background: color-mix(in srgb, var(--biz-accent) 14%, transparent);
}.page-business .is-business a:hover{
  color: var(--biz-accent);
}.page-theme-wrap{
  min-height: 100vh;
  background: var(--bg);
  width: 100%;
  margin: 0;
  padding: 0;
  background-color: var(--bg);
}.page-theme-wrap.has-bg{
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: scroll;
}.page-theme-overlay{
  background: rgba(246,247,251,.4);
  min-height: 100vh;
  width: 100%;
  margin: 0;
  padding: 0;
}.page-theme-wrap .site-header,
.page-theme-wrap header{
  background: transparent;
}.page-theme-wrap .business-page,
.page-theme-wrap .offer-page{
  margin-top: 0;
  margin-bottom: 0;
  padding-top: 16px;
  padding-bottom: 24px;
}.page-business .card-section.is-business,
.page-business .business-offers-carousel.is-business,
.page-business .hours-panel .card-section.is-business{
  border: 2px solid color-mix(in srgb, var(--biz-accent, #f59e0b) 55%, transparent);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--biz-accent, #f59e0b) 14%, transparent), var(--shadow);
}.page-business .business-offers-carousel.is-business{
  border-radius: 22px;
  padding: 14px;
  background: rgba(255,255,255,.78);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  border: 2px solid color-mix(in srgb, var(--biz-accent, #f59e0b) 55%, transparent);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--biz-accent, #f59e0b) 14%, transparent), var(--shadow);
}.page-business .business-offers-carousel.is-business h2,
.page-business .business-offers-carousel.is-business .section-title{
  margin-top: 4px;
}.page-business .business-offers-carousel.is-business .offer-card,
.page-business .business-offers-carousel.is-business .product-card{
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(0,0,0,.10);
  border-radius: 16px;
}.page-theme-wrap,
.page-theme-overlay{
  min-height: 100vh;
}.page-theme-wrap .offer-page{
  margin: 0 auto;
  padding: 16px 12px 24px;
}.page-theme-wrap footer,
.page-theme-wrap .site-footer{
  background: transparent;
  box-shadow: none;
}.business-page button[id*="hours"],
.business-page button[class*="hours"],
.business-page .hours-toggle,
.business-page .hours-toggle-btn,
.business-page .btn-hours,
.business-page .hours-btn,
.business-page .toggle-hours{
  color: #fff;
  background: rgba(0,0,0,.45);
  border: 2px solid color-mix(in srgb, var(--biz-accent, #f59e0b) 65%, rgba(255,255,255,.2));
  border-radius: 16px;
  box-shadow: 0 10px 24px rgba(0,0,0,.18);
}.business-page button[id*="hours"] span,
.business-page button[class*="hours"] span,
.business-page .hours-toggle span{
  color: #fff;
}.business-page button[id*="hours"]:active,
.business-page button[class*="hours"]:active,
.business-page .hours-toggle:active{
  background: rgba(0,0,0,.60);
}.drag-item.dragging{
  opacity: .75;
}.drag-handle{
  width: 32px;
  height: 32px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  border: 1px solid var(--border);
  background: var(--bg-soft);
  font-weight: 950;
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
}.survey-fab{
  position: fixed;
  right: 14px;
  bottom: 14px;
  z-index: 9999;
  padding: 10px 12px;
  border-radius: 999px;
  background: var(--accent);
  color: #fff;
  font-weight: 900;
  box-shadow: var(--shadow);
}.survey-fab:hover{
  filter: brightness(1.03);
}.drag-ud{
  display: flex;
  gap: 8px;
  align-items: center;
}.drag-ud .btn-ud{
  width: 34px;
  height: 34px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--card);
  color: var(--text);
  font-weight: 900;
}.toast{
  position: fixed;
  left: 50%;
  bottom: 16px;
  transform: translateX(-50%);
  z-index: 99999;
  padding: 10px 12px;
  border-radius: 14px;
  font-weight: 900;
  box-shadow: var(--shadow);
  border: 1px solid var(--border);
  background: var(--card);
  color: var(--text);
  max-width: calc(100% - 24px);
  text-align: center;
}.toast--ok{
  outline: 2px solid rgba(50,213,131,.25);
}.toast--bad{
  outline: 2px solid rgba(255,77,77,.25);
}.toast-hide{
  opacity: 0;
  transform: translateX(-50%) translateY(10px);
  transition: opacity .35s ease, transform .35s ease;
}.nearby-card{
  position: relative;
  display: block;
  aspect-ratio: 1 / 1;
  border-radius: 14px;
  overflow: hidden;
  background: #000;
  border: 1px solid var(--border);
  text-decoration: none;
}.nearby-img{
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
}.nearby-overlay{
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 8px;
  background: linear-gradient(to top,
    rgba(0,0,0,.65) 0%,
    rgba(0,0,0,.25) 45%,
    rgba(0,0,0,0) 100%);
}.nearby-cat{
  font-size: 10px;
  font-weight: 800;
  padding: 3px 6px;
  border-radius: 999px;
  background: rgba(0,0,0,.45);
  color: #fff;
  margin-bottom: 4px;
  width: fit-content;
}.nearby-title{
  font-size: 12px;
  font-weight: 900;
  line-height: 1.1;
  color: #fff;
  max-height: 2.2em;
  overflow: hidden;
  text-shadow: 0 1px 8px rgba(0,0,0,.6);
}.nearby-meta{
  font-size: 10px;
  font-weight: 800;
  color: rgba(255,255,255,.85);
  margin-top: 3px;
}.hours-desktop{
  display: block;
}.hours-mobile{
  display: none;
}.hero-brand{
  display: inline-flex;
  align-items: flex-start;
  gap: 0px;
}.hero-logo{
  width: auto;
  height: 50px;
  object-fit: contain;
  opacity: 1;
  display: block;
  position: relative;
  top: 6px;
}.hero-domain{
  font-size: 30px;
  line-height: 1;
  font-weight: 950;
  letter-spacing: -.02em;
  display: block;
  vertical-align: middle;
  position: relative;
  top: 10px;
  align-items: center;
  height: 42px;
}.card-right{
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
}.biz-share-btn{
  position: absolute;
  right: 14px;
  bottom: 46px;
  width: 38px;
  height: 38px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,0.10);
  background: rgba(255,255,255,0.78);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 9999;
  pointer-events: auto;
  box-shadow: 0 10px 25px rgba(0,0,0,0.10);
  transition: transform .15s ease-out, opacity .15s ease-out, background .15s ease-out;
  transform: translateZ(0);
}.biz-share-btn:hover{
  transform: translateY(-1px) scale(1.04);
  background: rgba(255,255,255,0.92);
}.biz-share-btn:active{
  transform: scale(.98);
}.biz-share-btn svg{
  width: 18px;
  height: 18px;
  display: block;
}.btn-google{
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 12px;
  background: #fff;
  color: #111;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
  box-shadow: 0 1px 2px rgba(0,0,0,.06);
  transition: transform .08s ease, box-shadow .12s ease;
}.btn-google:hover{
  box-shadow: 0 6px 16px rgba(0,0,0,.10);
}.btn-google:active{
  transform: translateY(1px);
}.btn-google-icon{
  width: 22px;
  height: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border-radius: 6px;
}.btn-google-text{
  line-height: 1;
}.site-header{
  position: sticky;
  top: 0;
  z-index: 99999;
  background: var(--card);
  border-bottom: 1px solid var(--border);
}.site-header .header-inner{
  position: relative;
  z-index: 99999;
}.mnav-btn{
  display: none;
  border: 1px solid var(--border);
  background: var(--card);
  color: var(--text);
  border-radius: 12px;
  padding: 8px 10px;
  font-size: 18px;
  cursor: pointer;
  position: relative;
  z-index: 100000;
  pointer-events: auto;
  touch-action: manipulation;
}.mnav-panel{
  border-top: 1px solid var(--border);
  background: var(--card);
  z-index: 99998;
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
}.site-header, .site-header *{
  pointer-events: auto;
}.nearby-grid{
  display: flex;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 18px;
  overflow-x: auto;
  padding: 8px 2px 4px;
  scroll-snap-type: x mandatory;
}.nearby-grid::-webkit-scrollbar{
  height: 10px;
}.nearby-grid::-webkit-scrollbar-thumb{
  border-radius: 999px;
  background: rgba(0,0,0,.15);
}.nearby-head2.is-light{
  color: var(--text, #0f172a);
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.55));
}.nearby-cat2{
  font-size: 12px;
  font-weight: 800;
  opacity: .95;
}.nearby-dist2{
  font-size: 12px;
  font-weight: 900;
  opacity: .95;
}.nearby-card2.no-hero .nearby-title2{
  text-shadow: none;
}.nearby-card2.no-hero .nearby-bottom2{
  background: var(--card, #fff);
}.nearby-prod-grid2{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 7px;
}.nearby-prod-link{
  display: block;
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: 0 6px 14px rgba(15,23,42,.10);
}.nearby-prod{
  width: 100%;
  height: 46px;
  object-fit: cover;
  display: block;
}.nearby-card2::before{
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.05) 45%, rgba(0,0,0,.00));
  pointer-events: none;
}.nearby-head2,
.nearby-bottom2{
  position: relative;
  z-index: 1;
}.nearby-head2{
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  padding: 8px 12px 6px;
  color: #fff;
  background: linear-gradient(180deg, rgba(0,0,0,.55), rgba(0,0,0,.10));
}.nearby-head2-top{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 4px;
}.nearby-cat2,
.nearby-dist2{
  font-size: 11px;
  font-weight: 700;
}.nearby-title2{
  margin-top: 6px;
  font-size: 14px;
  font-weight: 900;
  line-height: 1.15;
  text-shadow: 0 8px 18px rgba(0,0,0,.35);
  white-space: normal;
  overflow: hidden;
  text-overflow: unset;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}.nearby-bottom2{
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 10px 12px 12px;
  background: #333333;
  backdrop-filter: blur(6px);
}.nearby-more2{
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 8px;
  padding: 6px 10px;
  border-radius: 12px;
  font-size: 13px;
  font-weight: 900;
  text-decoration: none;
  color: #fff;
  background: var(--brand-red, #d11f2f);
  width: 100%;
  min-height: 34px;
  line-height: 1;
}.nearby-card2{
  position: relative;
  flex: 0 0 320px;
  height: 210px;
  border-radius: 18px;
  overflow: hidden;
  cursor: pointer;
  background-color: #111;
  background-size: cover;
  background-position: center;
  box-shadow: 0 14px 30px rgba(15,23,42,.14);
  scroll-snap-align: start;
  background-repeat: no-repeat;
  box-sizing: border-box;
  border: 1px solid transparent;
}.nearby-card2.no-hero{
  background-image: none;
  background: var(--card, #fff);
  border: 1px solid var(--border, #e5e7eb);
  border-color: var(--border, #e5e7eb);
}@media (max-width:980px){.hero-inner{
    flex-direction: column;
  }}@media (max-width:768px){.biz-offer-name{
    font-size: 1rem;
  }.biz-offer-price{
    font-size: .95rem;
  }.card-pill{
    font-size: .72rem;
    padding: 4px 8px;
  }.card-title{
    font-size: 18px;
    line-height: 1.2;
  }.card{
    }.card-thumb{
    height: 105px;
    aspect-ratio: 1 / 1;
    border-radius: 12px;
    max-height: 180px;
  }.card-content{
    padding: 10px 12px;
  }.logo{
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
  }.nav{
    display: none;
  }.hero-inner{
    text-align: center;
    align-items: center;
  }.hero-title{
    font-size: 36px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    margin-bottom: 6px;
  }.hero-tagline{
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--text-muted);
    text-align: center;
  }.hero-subtitle{
    display: none;
  }input,
  textarea,
  select{
    font-size: 16px;
  }html, body{
    overflow-x: hidden;
  }.hours-desktop{
    display: none;
  }.hours-mobile{
    display: block;
  }.site-header{
    border-bottom: 1px solid rgba(229,231,235,.7);
  }.header-inner{
    position: relative;
    justify-content: flex-start;
    padding: 8px 0;
  }.logo-img{
    height: 28px;
  }.page-home .hero-inner{
    gap: 10px;
  }.page-home .hero-tagline{
    margin-top: 4px;
    font-size: 16px;
    line-height: 1.15;
  }.page-home input,
  .page-home select{
    padding: 9px 10px;
    border-radius: 12px;
  }.hero-logo{
    width: 30px;
    height: 50px;
    margin: 0 auto;
    opacity: .85;
    top: 5px;
  }.hero-domain{
    font-size: 20px;
    line-height: 30px;
    top: 0px;
    height: 34px;
  }.page-home .hero-brand{
    display: inline-flex;
    align-items: flex-start;
    gap: 0px;
  }.page-home .hero-logo{
    width: auto;
    height: 42px;
    max-height: none;
    top: 7px;
  }.page-home .hero-domain{
    font-size: 24px;
    line-height: 1;
    top: 12px;
  }input[type="checkbox"],
  input[type="radio"],
  select{
    accent-color: var(--accent);
  }.filters-toggle,
  .filters-toggle:visited{
    color: var(--text);
  }.card-right{
    gap: 6px;
  }.badge-favcount{
    padding: 3px 9px;
    font-size: 12px;
  }.biz-share-btn{
    right: 10px;
    bottom: 42px;
    width: 36px;
    height: 36px;
  }.biz-share-btn svg{
    width: 17px;
    height: 17px;
  }.nearby-prod{
    height: 44px;
  }.nearby-bottom2{
    background: #333333;
    backdrop-filter: none;
    border-radius: 0 0 18px 18px;
    padding-bottom: 12px;
  }.nearby-card2{
    flex-basis: 280px;
    height: 220px;
  }.site-header .header-inner{
    position: relative;
    padding: 6px 0;
    min-height: 44px;
  }.mnav-btn{
    display: inline-flex;
    position: relative;
    z-index: 100000;
    padding: 6px 8px;
    margin-left: 10px;
  }.site-header .logo{
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    margin: 0;
    z-index: 99999;
  }.page-main{
    padding-top: 2px;
  }.page-home .hero{
    padding: 6px 0 4px;
    padding-top: 2px;
    margin-top: 0;
  }.site-header + div{
    margin-top: 0;
    padding-top: 0;
    min-height: 0;
  }.page-home .hero-title{
    margin: 6px 0 4px;
    font-size: 32px;
    display: block;
    margin-top: 2px;
  }.page-home .section-subtitle:has(+ .nearby-grid){
    margin: 0 0 6px;
    font-size: 13px;
    line-height: 1.15;
    font-weight: 700;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
  }.page-home .section-title:has(+ .section-subtitle + .nearby-grid){
    margin: 12px 0 4px;
    font-size: 22px;
    line-height: 1.05;
    letter-spacing: -.01em;
  }.nearby-grid{
    margin-top: 0;
    padding-top: 2px;
  }:root{
    --page-bg: linear-gradient(180deg, #F7F7F7 0%, #efe6dc 100%);
    --field-bg: #fff;
    --pill-bg: rgba(17,24,39,.08);
    --pill-text: var(--text);
    --theme-overlay: rgba(246,247,251,.30);
  }html.theme-dark{
    --bg: #0b1220;
    --bg-soft: #0f172a;
    --card: #0f172a;
    --card-soft: #111c33;
    --text: #e5e7eb;
    --text-muted: #94a3b8;
    --accent: #e5e7eb;
    --accent-soft: rgba(226,232,240,.10);
    --border: rgba(148,163,184,.20);
    --shadow: 0 18px 45px rgba(0,0,0,.38);
    --page-bg: radial-gradient(1200px 700px at 20% -10%, rgba(245,158,11,.12), transparent 55%),
    linear-gradient(180deg, #060a12 0%, #0b1220 60%, #060a12 100%);
    --field-bg: rgba(255,255,255,.06);
    --pill-bg: rgba(255,255,255,.08);
    --pill-text: var(--text);
    --theme-overlay: rgba(10,14,20,.72);
  }body{
    background: var(--page-bg, var(--bg));
    color: var(--text);
  }input,select,textarea{
    background: var(--field-bg, var(--card));
    color: var(--text);
    border-color: var(--border);
  }.pill,
.card-pill{
    background: var(--pill-bg);
    color: var(--pill-text);
    border-color: var(--border);
  }.page-dashboard .dashboard-form input,
.page-dashboard .dashboard-form textarea,
.page-dashboard .dashboard-form select{
    background: var(--field-bg, var(--card));
    color: var(--text);
    border-color: var(--border);
  }html.theme-dark .btn{
    background: var(--accent);
    color: #0b1220;
    border-color: color-mix(in srgb, var(--accent) 35%, transparent);
  }html.theme-dark .btn-google{
    background: rgba(255,255,255,.06);
    color: var(--text);
    border-color: rgba(255,255,255,.14);
    box-shadow: none;
  }html.theme-dark .btn-google-icon{
    background: rgba(255,255,255,.10);
  }html.theme-dark .nearby-bottom2{
    background: rgba(15,23,42,.92);
  }html.theme-dark .nearby-prod-link{
    background: rgba(255,255,255,.06);
    border-color: rgba(255,255,255,.14);
  }html.theme-dark input[type="checkbox"],
html.theme-dark input[type="radio"],
html.theme-dark select{
    accent-color: #f59e0b;
  }.site-header .nav{
    display: none;
    position: relative;
    z-index: 200000;
  }.site-header .nav .theme-toggle{
    position: relative;
    z-index: 200001;
    pointer-events: auto;

  }html.theme-dark .logo-img,
html.theme-dark .hero-logo{
    background: transparent;
  }html.theme-dark .badge-verified{
    background: rgba(255,255,255,.08);
    color: #e5e7eb;
    border-color: rgba(255,255,255,.18);
  }html.theme-dark .badge-verified--neutral{
    background: rgba(148,163,184,.16);
    color: #e5e7eb;
    border-color: rgba(148,163,184,.28);
  }html.theme-dark .badge-verified--orange{
    background: rgba(245,158,11,.22);
    color: #ffd08a;
    border-color: rgba(245,158,11,.45);
  }html.theme-dark .page-theme-overlay{
    background: var(--theme-overlay);
  }html.theme-dark .offer-page,
html.theme-dark .offer-page h1,
html.theme-dark .offer-page h2,
html.theme-dark .offer-page p{
    color: var(--text);
  }@media (max-width:768px){.page-home .hero{
      padding: 8px 0 6px;
    }.page-home .hero-title{
      margin: 6px 0 4px;
    }.page-home .hero-tagline{
      margin-top: 6px;
      font-size: 18px;
      line-height: 1.15;
    }.page-home input,
  .page-home select{
      padding: 9px 10px;
      border-radius: 12px;
    }.page-home .with-offers{
      gap: 8px;
    }.page-home .filters-toggle{
      padding: 8px 10px;
      border-radius: 12px;
    }body.page-home .hero{
      padding: 6px 0 4px;
    }body.page-home .hero-inner{
      gap: 10px;
    }body.page-home .with-offers input[type="checkbox"]{
      width: 16px;
      height: 16px;
    }body.page-home .with-offers{
      gap: 8px;
      font-size: 11px;
      font-weight: 750;
    }body.page-home .filters-toggle{
      padding: 5px 8px;
      border-radius: 12px;
      font-size: 10px;
    }}@media (max-width:380px){.page-home .hero-tagline{
      font-size: 17px;
    }}@media (max-width:900px){.offer-gallery,
  .offer-media{
    grid-template-columns: 1fr;
  }#offerMainImage,
  .offer-main-image img,
  .offer-carousel img{
    height: 360px;
  }.offer-thumbs,
  .offer-thumbnails,
  #offerThumbs,
  .offer-media-thumbs{
    height: auto;
    overflow: visible;
    padding: 10px;
    display: flex;
    flex-direction: row;
    gap: 8px;
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: 6px;
  }.offer-thumbs img,
  .offer-thumbnails img,
  #offerThumbs img,
  .offer-media-thumbs img{
    width: 72px;
    height: 72px;
    aspect-ratio: auto;
    flex: 0 0 auto;
  }.offer-detail-card{
    grid-template-columns: 1fr;
  }.offer-detail-right{
    border-left: none;
    border-top: 1px solid var(--border);
  }.offer-detail-image img{
    height: 300px;
  }.offer-gallery-thumbs{
    display: flex;
    max-height: none;
    overflow-x: auto;
    overflow-y: hidden;
    grid-template-columns: none;
  }.offer-thumbbtn{
    flex: 0 0 84px;
    aspect-ratio: 1/1;
  }.offer-row[draggable="true"]{
    draggable: false;
  }.offer-move-ud .btn-ud{
    padding: 8px 10px;
    font-size: 16px;
    line-height: 1;
  }.offer-move .btn-move{
    display: none;
  }.offer-move-ud{
    display: flex;
    gap: 8px;
  }.drag-handle{
    display: none;
  }}@media (max-width:480px){.biz-offer-name{
    font-size: .95rem;
  }.biz-offer-price{
    font-size: .95rem;
  }.business-card .business-cover,
  .result-card .business-cover{
    max-height: 160px;
  }}@media (min-width:900px){.nearby-grid{
    grid-template-columns: repeat(5, minmax(0,1fr));
    gap: 12px;
  }}@media (max-width:380px){.page-home .hero-tagline{
    font-size: 17px;
  }}/* ============================================================
   HEADER — Desktop clean (une ligne + police fine + #333)
   Remplace le bloc @media (min-width:769px) existant
   ============================================================ */@media (min-width:769px){.site-header .header-inner{
    padding: 10px 0;
    gap: 12px;
    flex-wrap: nowrap;          /* ✅ jamais de retour ligne */
  }/* Le nav prend l’espace dispo et se colle à droite */.site-header .nav{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex: 1 1 auto;             /* ✅ évite que le menu “pousse” bizarrement */
    flex-wrap: nowrap;          /* ✅ une seule ligne */
    gap: 10px;                  /* ✅ un poil plus serré */
    min-width: 0;               /* ✅ autorise l’ellipsis des éléments longs */
    white-space: nowrap;
  }/* Liens menu : plus fin + couleur demandée */.site-header .nav-link{
    font-size: 13px;
    font-weight: 500;           /* ✅ plus fin */
    padding: 6px 8px;
    letter-spacing: .01em;
    border-radius: 999px;
    white-space: nowrap;
    color: #333333;             /* ✅ couleur demandée */
  }/* Nom utilisateur : le principal “casseur” de ligne si trop long */.site-header .nav-user{
    font-size: 12.5px;
    font-weight: 500;           /* ✅ plus fin */
    color: #333333;             /* ✅ couleur demandée */
    padding: 0 6px;
    white-space: nowrap;

    max-width: 220px;           /* ✅ empêche le menu de partir à la ligne */
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 0 1 auto;
    min-width: 0;
  }/* Bouton Déconnexion etc : même logique, plus fin + #333 */.site-header .nav .btn.small{
    font-size: 12.5px;
    font-weight: 600;
    padding: 6px 10px;
    border-radius: 999px;
    background: transparent;
    color: #333333;
    border: 1px solid rgba(51,51,51,.25);
    box-shadow: none;
    white-space: nowrap;
    line-height: 1.1;
  }.site-header .nav .btn.small:hover{
    background: rgba(51,51,51,.08);
  }}@media (min-width:769px) and (max-width:1060px){.site-header .nav a[href="/contact.php"]{
    display: none;
  }}@media (min-width:769px) and (max-width:960px){.site-header .nav a[href="/infos.php"]{
    display: none;
  }}/* ============================================================
   RESULT CARDS (mobile hero + dock produits)
   ============================================================ *//* Desktop: 3 par ligne */@media (min-width: 1024px){}}/* Tablette: 2 par ligne */@media (min-width: 769px) and (max-width: 1023px){}/* Mobile: 1 par ligne */@media (max-width: 768px){}.result-card{
  position:relative;
  border-radius: var(--radius);
  overflow:hidden;
  min-height: 260px;
  background-size: cover;
  background-position:center;
  box-shadow: var(--shadow);
  border: 1px solid var(--border);
  cursor:pointer;
}/* si pas d’image de fond */.result-card:not([style*="background-image"]){
  background: var(--card-soft);
}.result-overlay{
  position:absolute; inset:0;
  background: linear-gradient(180deg,
    rgba(0,0,0,.10) 0%,
    rgba(0,0,0,.35) 35%,
    rgba(0,0,0,.65) 100%);
}.result-head{
  position:relative;
  padding:14px 14px 0 14px;
  color:#fff;
  text-shadow: 0 2px 18px rgba(0,0,0,.55);
}.result-head-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}.result-title{
  font-weight:900;
  font-size:22px;
  line-height:1.05;
}.result-right{ display:flex; gap:10px; align-items:center; }.result-dist{
  font-weight:800;
  font-size:14px;
  padding:6px 10px;
  border-radius:999px;
  background: rgba(0,0,0,.28);
  border:1px solid rgba(255,255,255,.18);
}.result-meta{
  margin-top:10px;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
  font-weight:700;
}.result-city{
  opacity:.95;
  font-size:14px;
}.result-pill{
  font-size:12px;
  font-weight:900;
  padding:6px 10px;
  border-radius:999px;
  background: rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.18);
  color:#fff;
  text-decoration:none;
}.result-fav{
  font-size:12px;
  font-weight:900;
  padding:6px 10px;
  border-radius:999px;
  background: rgba(0,0,0,.28);
  border:1px solid rgba(255,255,255,.18);
}.result-dock{
  position:absolute;
  left:12px; right:12px; bottom:12px;
  display:grid;
  grid-template-columns: 1.15fr 1fr;
  gap:10px;
  padding:10px;
  border-radius: 16px;
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(0,0,0,.08);
  backdrop-filter: blur(6px);
}.dock-featured{
  display:flex;
  gap:10px;
  align-items:center;
  text-decoration:none;
  color: var(--text);
  min-width:0;
}.dock-featured-img{
  width:92px; height:72px;
  border-radius:12px;
  object-fit:cover;
  border:1px solid rgba(0,0,0,.08);
  flex:0 0 auto;
}.dock-featured-txt{ min-width:0; }.dock-featured-name{
  font-weight:900;
  font-size:14px;
  line-height:1.15;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}.dock-featured-price{
  margin-top:4px;
  font-weight:900;
  font-size:13px;
  opacity:.9;
}.dock-thumbs{
  display:flex;
  gap:8px;
  overflow:auto;
  padding-bottom:2px;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
}.dock-thumb{
  border:0;
  background:transparent;
  padding:0;
  cursor:pointer;
  flex:0 0 auto;
  scroll-snap-align:start;
}.dock-thumb img{
  width:62px; height:62px;
  border-radius:12px;
  object-fit:cover;
  border:1px solid rgba(0,0,0,.10);
}/* Desktop: cartes un peu plus basses pour afficher + */@media (min-width: 1024px){.result-card{ min-height: 220px; }.result-title{ font-size:18px; }}@media (max-width: 1023px){.cards-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }}@media (max-width: 768px){.cards-grid{ grid-template-columns: 1fr; }}.result-overlay{
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,
    rgba(0,0,0,.10) 0%,
    rgba(0,0,0,.35) 35%,
    rgba(0,0,0,.65) 100%);
}.result-head{
  position: relative;
  padding: 14px 14px 0 14px;
  color: #fff;
  text-shadow: 0 2px 18px rgba(0,0,0,.55);
}.result-head-top{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}.result-title{
  font-weight: 900;
  font-size: 22px;
  line-height: 1.05;
}.result-right{
  display: flex;
  gap: 10px;
  align-items: center;
}.result-dist{
  font-weight: 800;
  font-size: 14px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(0,0,0,.28);
  border: 1px solid rgba(255,255,255,.18);
}.result-meta{
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  font-weight: 700;
}.result-city{
  opacity: .95;
  font-size: 14px;
}.result-pill{
  font-size: 12px;
  font-weight: 900;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.16);
  border: 1px solid rgba(255,255,255,.18);
  color: #fff;
  text-decoration: none;
}.result-fav{
  font-size: 12px;
  font-weight: 900;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(0,0,0,.28);
  border: 1px solid rgba(255,255,255,.18);
}@media (min-width: 1024px){.result-card{ min-height: 220px; }.result-title{ font-size: 18px; }}/* ============================================================
   RESULTS / CARDS — CLEAN BLOCK (single source of truth)
   - Grid desktop 3 colonnes, tablette 2, mobile 1
   ============================================================ */.page-home .cards-grid{
  display:grid;
  gap:16px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}@media (max-width: 1023px){.page-home .cards-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }}@media (max-width: 768px){.page-home .cards-grid{ grid-template-columns: 1fr; }}/* Carte résultat (background = miniature) */.page-home .result-card{
  position: relative;
  border-radius: 22px;
  overflow: hidden;
  min-height: 220px;
  background-size: cover;
  background-position: center;
  box-shadow: var(--shadow);
  border: 1px solid rgba(17,24,39,.10);
  cursor: pointer;
}/* voile pour lisibilité */.page-home .result-card::before{
  content:"";
  position:absolute; inset:0;
  background: radial-gradient(120% 90% at 20% 80%, rgba(0,0,0,.55), rgba(0,0,0,.15) 55%, rgba(0,0,0,.05) 100%);
  pointer-events:none;
}/* Header overlay */.page-home .result-card .card-head{
  position:absolute;
  inset:16px 16px auto 16px;
  z-index:2;
  color:#fff;
  text-shadow: 0 8px 28px rgba(0,0,0,.55);
  display:grid;
  grid-template-columns: 1fr auto;
  gap:12px;
  align-items:start;
}.page-home .result-card .card-head .title{
  text-align:center;
  font-weight:900;
  letter-spacing:.01em;
  font-size: 24px;
  line-height: 1.1;
}.page-home .result-card .card-head .meta{
  display:flex;
  flex-direction:column;
  gap:10px;
  align-items:flex-end;
}/* Pastilles meta */.page-home .pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.24);
  color:#fff;
  font-weight:800;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  white-space: nowrap;
}.page-home .pill.small{ padding:6px 10px; font-weight:800; font-size: 13px; opacity:.95; }/* ============================================================
   DOCK (bas) — glass + layout (image + infos + thumbs)
   ============================================================ */.page-home .result-dock{
  position:absolute;
  left:16px; right:16px; bottom:16px;
  z-index:2;
  border-radius: 18px;
  background: rgba(10,10,10,.42);
  border: 1px solid rgba(255,255,255,.14);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  padding:14px;
  display:grid;
  grid-template-columns: 160px 1fr;
  gap:14px;
  overflow:hidden;
}/* image principale swipe */.page-home .dock-featured{
  position: relative;
  overflow: hidden;
  border-radius: 16px;
  display:block;
  touch-action: pan-y;
}/* swipe track 3 panneaux */.page-home .dock-swipe-track{
  display:flex;
  height:100%;
  width:300%;
  transform: translateX(-33.333%);
  will-change: transform;
  transition: transform .18s ease;
}.page-home .dock-featured.is-swiping .dock-swipe-track{ transition: none !important; }.page-home .dock-swipe-item{ width:33.333%; display:flex; }.page-home .dock-swipe-item img{
  width:100%;
  height:100%;
  object-fit: cover;
  border-radius: 16px;
}/* colonne droite */.page-home .dock-side{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:10px;
}/* ligne titre + prix */.page-home .dock-info{
  display: grid;
  grid-template-columns: 1fr auto; /* ✅ titre prend le reste, prix à droite */
  align-items: start;
  column-gap: 12px;
  text-decoration: none;
  color: #fff;
  min-width: 0;
}/* ===============================
   DOCK — Titre produit multi-lignes
   =============================== */.page-home .dock-featured-name{
  min-width: 0;
  font-weight: 950;
  font-size: 16px;
  line-height: 1.12;

  white-space: normal;
  overflow: hidden;

  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4; /* ✅ 4 lignes */
  line-clamp: 4;

  text-overflow: ellipsis;
}.page-home .dock-featured-price{
  flex:0 0 auto;
  white-space: nowrap;
  font-weight:950;
  font-size: 14px;
  opacity:.95;
}/* miniatures */.page-home .dock-thumbs{
  display:flex;
  gap:10px;
  overflow:auto;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 2px;
}.page-home .dock-thumb{
  border:0;
  background: transparent;
  padding:0;
  cursor:pointer;
}.page-home .dock-thumb img{
  width:46px;
  height:46px;
  border-radius: 12px;
  object-fit: cover;
  border: 1px solid rgba(255,255,255,.18);
}/* Mobile: dock plus compact */@media (max-width: 768px){.page-home .result-card{ min-height: 260px; }.page-home .result-dock{
    grid-template-columns: 1fr 1fr;
    padding:12px;
  }}/* ============================================================
   RESULT DOCK — Desktop controls (no mouse-drag)
   ============================================================ */.page-home .dock-nav{
  position:absolute;
  inset:0;
  display:none;
  align-items:center;
  justify-content:space-between;
  padding:8px;
  pointer-events:none; /* on active sur boutons seulement */
}.page-home .dock-nav-btn{
  pointer-events:auto;
  width:34px;
  height:34px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.22);
  background: rgba(0,0,0,.35);
  color:#fff;
  font-weight:900;
  font-size:20px;
  line-height:1;
  display:grid;
  place-items:center;
  cursor:pointer;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}.page-home .dock-nav-btn:hover{ background: rgba(0,0,0,.50); }.page-home .dock-nav-btn:active{ transform: translateY(1px); }@media (min-width: 769px){.page-home .dock-nav{ display:flex; }}/* ============================================================
   RESULT DOCK — Final sizing (compact + lisible)
   ============================================================ */.page-home .result-card{ min-height: 240px; }.page-home .result-dock{
  left:14px; right:14px; bottom:14px;
  padding:12px;
  border-radius:18px;
  grid-template-columns: 150px 1fr;
}.page-home .dock-featured{
  height: 104px;
}.page-home .dock-swipe-item img{
  height: 104px;
}.page-home .dock-featured-name{
  font-size: 15px;
}.page-home .dock-featured-price{
  font-size: 14px;
}.page-home .dock-thumbs{ gap: 10px; }.page-home .dock-thumb img{
  width: 44px;
  height: 44px;
}@media (max-width: 768px){.page-home .result-card{ min-height: 280px; }.page-home .result-dock{
    grid-template-columns: 1fr 1fr;
    padding:12px;
  }.page-home .dock-featured{
    height: 124px;
  }.page-home .dock-swipe-item img{
    height: 124px;
  }.page-home .dock-thumb img{
    width: 46px;
    height: 46px;
  }}/* ============================================================
   RESULT DOCK (FIX) — desktop + mobile
   (manquait dans le CSS => affichage cassé)
   ============================================================ *//* Carte résultat */.result-card{
  position: relative;
  border-radius: 22px;
  overflow: hidden;
  background-size: cover;
  background-position: center;
  box-shadow: var(--shadow);
}/* overlay sombre stylé */.result-overlay{
  position:absolute;
  inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.18) 0%, rgba(0,0,0,.45) 70%, rgba(0,0,0,.55) 100%);
}/* Infos entreprise en haut (laisse respirer) */.result-card .result-header,
.result-card .result-business,
.result-card .result-title{
  position: relative;
  z-index: 2;
}/* Dock produit en bas */.result-dock{
  position:absolute;
  left:14px; right:14px; bottom:14px;
  z-index:3;
  display:grid;
  grid-template-columns: 140px 1fr;
  gap:12px;
  padding:12px;
  border-radius: 18px;
  background: rgba(15,23,42,.55);
  border: 1px solid rgba(255,255,255,.16);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}/* Image principale (zone swipe) */.dock-featured{
  position: relative;
  display:block;
  width: 140px;
  height: 140px;
  border-radius: 14px;
  overflow:hidden;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
}/* Track 3 images (prev/cur/next) */.dock-swipe-track{
  width: 300%;
  height: 100%;
  display:flex;
  transform: translate3d(-33.333%, 0, 0);
  transition: transform .25s ease;
}.dock-swipe-item{
  width: 33.333%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
}.dock-swipe-item img{
  width:100%;
  height:100%;
  object-fit: cover;
  display:block;
}/* Colonne droite */.dock-side{
  min-width: 0;
  display:flex;
  flex-direction: column;
  justify-content: space-between;
  gap:10px;
}.dock-info{
  display:flex;
  align-items: baseline;
  justify-content: space-between;
  gap:10px;
  text-decoration:none;
  color:#fff;
}.dock-featured-name{
  font-weight: 800;
  font-size: 16px;
  line-height: 1.1;
  white-space: nowrap;
  overflow:hidden;
  text-overflow: ellipsis;
}.dock-featured-price{
  font-weight: 900;
  font-size: 16px;
  opacity: .95;
  white-space: nowrap;
}/* Miniatures suggérées */.dock-thumbs{
  display:flex;
  gap:8px;
  overflow:auto;
  padding-bottom: 2px;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
}.dock-thumbs::-webkit-scrollbar{ height: 6px; }.dock-thumb{
  width: 46px;
  height: 46px;
  border-radius: 10px;
  overflow:hidden;
  flex: 0 0 auto;
  scroll-snap-align: start;
  border:1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.08);
  cursor:pointer;
}.dock-thumb img{
  width:100%;
  height:100%;
  object-fit: cover;
  display:block;
}.dock-thumb.is-active{
  border-color: rgba(255,255,255,.85);
  box-shadow: 0 0 0 2px rgba(255,255,255,.18) inset;
}/* Flèches desktop sur l'image */.dock-arrow{
  position:absolute;
  top:50%;
  transform: translateY(-50%);
  width: 34px;
  height: 34px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(0,0,0,.35);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 22px;
  line-height: 1;
  cursor:pointer;
}.dock-arrow-left{ left: 8px; }.dock-arrow-right{ right: 8px; }/* Mobile: dock plus compact pour laisser voir la fiche derrière */@media (max-width: 768px){.result-dock{
    left:12px; right:12px; bottom:12px;
    grid-template-columns: 120px 1fr;
    padding:10px;
    border-radius: 16px;
  }.dock-featured{ width:120px; height:120px; border-radius: 12px; }.dock-featured-name, .dock-featured-price{ font-size: 15px; }.dock-thumb{ width: 42px; height: 42px; border-radius: 10px; }}/* Desktop: pas de drag, seulement flèches (si tu veux cacher les thumbs sur PC tu peux) */@media (min-width: 1024px){.dock-arrow{ opacity: .95; }.dock-arrow:hover{ opacity: 1; }}/* Flèches desktop (pas mobile) */.dock-nav{ display:none; position:absolute; inset:0; pointer-events:none; }.dock-nav-btn{
  pointer-events:auto;
  position:absolute; top:50%; transform:translateY(-50%);
  width:34px; height:34px; border-radius:999px;
  border:1px solid rgba(255,255,255,.22);
  background: rgba(0,0,0,.35);
  color:#fff; font-weight:900; line-height:1;
}.dock-nav-btn[data-dir="-1"]{ left:10px; }.dock-nav-btn[data-dir="1"]{ right:10px; }@media (hover:hover) and (pointer:fine){.dock-featured{ position:relative; }.dock-nav{ display:block; }}/* ============================================================
   INDEX (page-home) — FIXES MINIMAUX
   - Badge "vérifiée" (lisible, pas "blanc dans le titre")
   - Titre entreprise + badge: wrap propre
   - Titre produit: 2 lignes (pas coupé)
   - PC: miniatures scroll + barre visible + flèches nav visibles
   - Carte: fond cliquable (overlay ne bloque pas)
   ============================================================ *//* 1) Fond cliquable : l’overlay ne doit jamais capter le clic */.page-home .result-overlay{
  pointer-events:none;
}/* 2) Titre entreprise + badge: alignement + retour ligne propre */.page-home .result-title{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
}/* 3) Badge "vérifiée" : vrai badge, lisible sur fond sombre */.page-home .badge-verified{
  display:inline-flex;
  align-items:center;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
  border: 1px solid rgba(34,197,94,.55);
  background: rgba(34,197,94,.18);
  color: rgba(236,253,245,.98); /* vert très clair, lisible */
  text-shadow: none;            /* évite l’effet "blanc dans le titre" */
}/* 4) Titre produit (dock) : 4 lignes avant "…" */.page-home .dock-featured-name{
  white-space: normal !important;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4; /* ✅ 4 lignes */
  line-clamp: 4;
}/* 5) PC : rendre évident qu’on peut faire défiler les miniatures */@media (hover:hover) and (pointer:fine){.page-home .dock-thumbs{
    scrollbar-width: thin;                 /* Firefox */
    scroll-behavior: smooth;
    padding-bottom: 6px;
  }.page-home .dock-thumbs::-webkit-scrollbar{ height: 8px; }.page-home .dock-thumbs::-webkit-scrollbar-thumb{
    background: rgba(255,255,255,.28);
    border-radius: 999px;
  }.page-home .dock-thumbs::-webkit-scrollbar-track{
    background: rgba(255,255,255,.08);
    border-radius: 999px;
  }/* flèches sur l’image (dock-nav) visibles sur PC */.page-home .dock-nav{ display:flex; }}/* === INDEX RESULT DOCK — REF OK (2026-01-24) === *//* ============================================================
   HOME — SEARCH GRID (compact 2x2 + périmètre 1-clic)
   ============================================================ */.ua-search-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 14px;
  align-items:end;
}.ua-cell{ min-width:0; }.ua-search-submit{
  grid-column: 1 / -1;
  width: 100%;
  justify-content: center;
}/* aide sous “Où ?” (optionnelle) */.ua-help{
  margin-top: 6px;
  font-size: 12px;
  font-weight: 750;
  color: var(--text-muted);
}/* Périmètre : icône + select invisible au-dessus (1 clic) */.ua-perimeter-wrap{
  position: relative;
  display:flex;
  justify-content:flex-end;
  align-items:center;
  height: 44px;
}.ua-perimeter-icon{
  width: 44px;
  height: 44px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--card);
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}.ua-perimeter-icon img{
  width: 22px;
  height: 22px;
  display:block;
}/* le select couvre exactement l’icône mais reste invisible */.ua-perimeter-select{
  position:absolute;
  right:0;
  top:0;
  width: 44px;
  height: 44px;
  opacity: 0;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  border: none;
  background: transparent;
}/* Mobile : un peu plus serré */@media (max-width: 520px){.ua-search-grid{ gap: 8px 10px; }.ua-perimeter-wrap,
  .ua-perimeter-icon,
  .ua-perimeter-select{
    width: 42px;
    height: 42px;
  }}/* --- Rendre le bloc recherche moins "géant" --- *//* Champs plus compacts (hauteur/padding) *//* Grille plus “serrée” */.ua-search-grid{
  grid-template-columns: 1fr 1fr;
  gap: 10px 14px;
}/* Ligne "Où ?" : input + bouton logo côte à côte */.ua-where{
  grid-column: 1 / -1; /* prend toute la largeur pour avoir la place de mettre le logo à côté */
}.ua-where-row{
  display: flex;
  gap: 10px;
  align-items: center;
}.ua-where-input{
  flex: 1 1 auto;
  min-width: 0;
}/* Bouton périmètre inline (garde ton 1 clic) */.ua-perimeter-inline{
  flex: 0 0 auto;
  width: 46px;
  height: 46px;
}/* On force l’icône à être pile la taille du champ */.ua-perimeter-wrap{
  position: relative;
  display:flex;
  justify-content:flex-end;
  align-items:center;
}.ua-perimeter-icon{
  width: 46px;
  height: 46px;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: var(--card);
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}.ua-perimeter-icon img{
  width: 22px;
  height: 22px;
  display:block;
}.ua-perimeter-select{
  position:absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  border: none;
  background: transparent;
}/* Bouton rechercher un peu moins massif (optionnel) */.ua-search-submit{
  height: 54px;
  border-radius: 999px;
}/* Mobile : on repasse en 1 colonne si besoin */@media (max-width: 560px){.ua-search-grid{
    grid-template-columns: 1fr;
  }.ua-where-row{
    gap: 8px;
  }}/* ============================================================
   SEARCH — bouton Rechercher (desktop vs mobile)
   ============================================================ *//* Desktop */@media (min-width: 768px){.ua-search-submit{
    height: 30px;          /* avant : ~54–60px */
    font-size: 15px;
    border-radius: 800px;
    padding: 0 1px;
  }}/* Mobile : on garde plus gros */@media (max-width: 767px){.ua-search-submit{
    height: 40px;
    font-size: 10px;
  }}/* ============================================================
   Couleur fond bloc recherche
   ============================================================ *//* (optionnel mais souvent mieux) : champs avec bordure plus nette *//* Bouton Rechercher = même couleur que "Voir +" (nearby-more2) *//* HOME — couleur labels bloc recherche *//* ============================================================
   HOME — Champs de recherche plus compacts (PC + mobile)
   ============================================================ */.result-meta{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:nowrap;
}.result-loc{
  display:inline-flex;
  align-items:center;
  gap:8px;
  white-space:nowrap; /* ✅ ville + distance jamais sur 2 lignes */
}.result-dist{
  white-space:nowrap; /* ✅ km jamais coupé */
}/* =========================================
   RESULT CARD — dock en bas + meta visible
   ========================================= *//* La carte devient un "conteneur" */.result-card{
  position: relative;
}/* On réserve de la place pour le dock (sinon il masque catégorie/lieu) */.result-card:has(.result-dock){
  padding-bottom: 170px; /* ajuste si besoin (150-200) */
}/* Header au-dessus du dock */.result-head{
  position: relative;
  z-index: 2;
}/* Dock collé en bas, marge réduite */.result-dock{
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 12px;

  margin: 0;          /* ✅ plus de grosse marge */
  padding: 10px;      /* ✅ dock plus compact */
  z-index: 1;
}/* Optionnel : compacter encore l'intérieur du dock */.dock-side{
  padding: 0;
  margin: 0;
}.dock-info{
  margin: 0 0 6px;
}/* =========================================
   Favoris ⭐ — jamais sur 2 lignes
   ========================================= */.result-fav.is-top{
  white-space: nowrap;     /* ✅ une seule ligne */
  display: inline-flex;
  align-items: center;
  gap: 6px;

  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 6;
}/* Si ton badge est "rond" et trop étroit, on lui donne un peu d'air */.result-fav.is-top{
  min-width: 44px;
  justify-content: center;
}/* =========================================
   Meta (catégorie + lieu + distance) — reste lisible
   ========================================= */.result-meta{
  position: relative;
  z-index: 3; /* au-dessus des overlays */
}/* Mobile : le dock prend plus de place -> on réserve plus */@media (max-width: 768px){.result-card:has(.result-dock){
    padding-bottom: 190px;
  }}/* =========================================
   Badge catégorie — UNE SEULE LIGNE
   ========================================= */.result-pill{
  white-space: nowrap;        /* ✅ jamais à la ligne */
  display: inline-flex;
  align-items: center;
  max-width: 100%;
}/* ===============================
   DOCK — Prix dans l’image (badge)
   =============================== */.page-home .dock-featured{
  position: relative; /* ✅ nécessaire pour positionner le badge */
}/* badge prix */.page-home .dock-price-badge{
  position: absolute;
  right: 8px;
  bottom: 8px;
  z-index: 5;

  display: inline-flex;
  align-items: center;
  padding: 4px 8px;
  border-radius: 999px;

  font-size: 12px;
  font-weight: 950;
  line-height: 1;
  white-space: nowrap;

  background: rgba(0,0,0,.45);
  border: 1px solid rgba(255,255,255,.22);
  color: #fff;

  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}/* si pas de prix => on cache */.page-home .dock-price-badge.is-hidden{
  display: none;
}/* Prix plus dans la ligne texte */.page-home .dock-featured-price{
  display: none !important;
}/* Cache la scrollbar des miniatures (PC) */.page-home .dock-thumbs{
  overflow-x: auto;
  scrollbar-width: none; /* Firefox */
}.page-home .dock-thumbs::-webkit-scrollbar{
  height: 0;             /* Chrome/Safari */
  display: none;
}/* ============================================================
   DOCK — Flèches discrètes (à cheval dehors/dedans)
   ============================================================ *//* le wrapper doit laisser dépasser les flèches */.page-home .dock-featured-wrap{
  position: relative;
  overflow: visible;
}/* on garde l'image bien coupée */.page-home .dock-featured{
  position: relative;
  overflow: hidden;
  border-radius: 16px;
}/* couche flèches */.page-home .dock-nav{
  position: absolute;
  inset: 0;
  z-index: 50;
  pointer-events: none; /* la couche ne bloque rien */
}/* boutons : petits, sans badge */.page-home .dock-nav-btn{
  pointer-events: auto;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 26px;
  height: 26px;

  /* pas de rond / pas de fond */
  background: transparent;
  border: 0;
  padding: 0;

  color: rgba(255,255,255,.92);
  font-size: 28px;
  font-weight: 950;
  line-height: 1;
  cursor: pointer;

  /* lisible sur photo */
  text-shadow: 0 8px 18px rgba(0,0,0,.55);
}/* à cheval sur le bord (moitié dehors) */.page-home .dock-nav-btn[data-dir="-1"]{ left: -16px; }.page-home .dock-nav-btn[data-dir="1"]{ right: -6px; }/* petit feedback */.page-home .dock-nav-btn:hover{
  color: rgba(255,255,255,1);
  transform: translateY(-50%) scale(1.05);
}.page-home .dock-nav-btn:active{
  transform: translateY(-50%) scale(.95);
}/* ============================================================
   FORCE HEADER (PC) — passe au-dessus de tous les conflits
   À COLLER TOUT EN BAS du style.css
   ============================================================ */@media (min-width: 769px){/* 1) header en 1 ligne quoiqu’il arrive */.site-header .header-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    flex-wrap: nowrap !important;
  }/* 2) le menu prend la place, reste sur 1 ligne */.site-header .nav{
    display:flex !important;
    align-items:center;
    justify-content:flex-end;
    gap:10px;
    flex: 1 1 auto;
    min-width:0;
    white-space: nowrap;
    flex-wrap: nowrap !important;
    overflow: hidden; /* empêche le passage à la ligne */
  }/* 3) liens menu (même si pas de .nav-link) */.site-header .nav a{
    color:#333333 !important;
    font-weight:500 !important; /* plus fin */
    font-size:13px;
    padding:6px 8px;
    border-radius:999px;
    white-space:nowrap;
  }/* hover propre */.site-header .nav a:hover{
    background: rgba(51,51,51,.08);
  }/* 4) le “Bonjour, …” (souvent le casse-ligne) */.site-header .nav-user,
  .site-header .nav .nav-user,
  .site-header .nav span,
  .site-header .nav .user{
    color:#333333 !important;
    font-weight:500 !important;
    max-width: 220px;
    overflow:hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width:0;
    flex: 0 1 auto;
  }/* 5) bouton (Déconnexion etc) même s’il n’a pas .btn.small */.site-header .nav .btn,
  .site-header .nav button,
  .site-header .nav input[type="submit"]{
    color:#333333 !important;
    font-weight:600 !important;
    background: transparent !important;
    border: 1px solid rgba(51,51,51,.25) !important;
    padding: 6px 10px;
    border-radius: 999px;
    white-space: nowrap;
    box-shadow: none !important;
  }.site-header .nav .btn:hover,
  .site-header .nav button:hover,
  .site-header .nav input[type="submit"]:hover{
    background: rgba(51,51,51,.08) !important;
  }}/* =========================================
   DOCK — (1/3) différent du titre
   ========================================= */.page-home .dock-featured-name .dock-pos{
  color: rgba(255,255,255,.62);
  font-weight: 700;
  margin-right: 6px;
  font-size: .92em;
}.page-home .dock-featured-name .dock-title{
  color: #fff;
  font-weight: 950; /* garde ton style titre */
}/* === AUTOUR DE VOUS — remonter le titre entreprise (éviter qu'il soit mangé) === */.page-home .nearby-head2{
  padding: 6px 12px 8px;     /* moins de padding en bas */
}.page-home .nearby-title2{
  margin-top: 2px;           /* avant: 6px */
  -webkit-line-clamp: 2;
  line-height: 1.12;         /* un poil plus compact */
}/* le bloc blanc du bas prend un peu moins de place */.page-home .nearby-bottom2{
  padding: 8px 12px 10px;    /* avant: 10px 12px 12px */
}/* ============================================================
   OFFER — MOBILE COMPACT (FORCE OVERRIDE)
   ============================================================ */@media (max-width: 768px){/* Page plus compacte */.offer-page{
    padding: 8px 10px 14px !important;
  }/* IMAGE PRINCIPALE — c’est LA clé */.offer-detail-image img{
    height: 200px !important;   /* ⬅️ avant : 300 / 420 */
    object-fit: contain;
  }/* Galerie miniatures plus basse */.offer-gallery-thumbs{
    padding: 6px 8px !important;
    gap: 6px !important;
    max-height: 84px !important;
  }.offer-thumbbtn{
    flex: 0 0 64px !important;
    aspect-ratio: 4 / 3;
  }/* Corps de fiche plus serré */.offer-detail-body{
    padding: 10px 12px !important;
  }/* TITRE */.offer-page h1{
    font-size: 1.15rem;
    line-height: 1.1;
    margin: 4px 0 6px;
  }/* DESCRIPTION — évite le 2e écran */.offer-detail-text{
    font-size: .92rem;
    line-height: 1.45;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }/* Boutons plus petits */.offer-detail-actions .btn{
    padding: 8px 12px;
    font-size: .85rem;
  }}/* OFFER — gagner de la place en haut */@media (max-width: 768px){/* page plus "tassée" */.offer-page{
    padding-top: 6px !important;
  }/* titre + marges */.offer-page h1{
    margin: 2px 0 6px !important;
    font-size: 1.1rem;
    line-height: 1.1;
  }/* si tu as un sous-titre */.offer-subtitle{
    margin: 0 0 8px !important;
  }}/* ============================================================
   OFFER (detail) — compact mobile
   ============================================================ */@media (max-width:768px){/* Titre moins haut */.offer-page h1{
    font-size: 1.12rem !important;
    line-height: 1.08 !important;
    margin: 2px 0 6px !important;
  }/* Image principale moins haute */.offer-detail-image img{
    height: 170px !important;   /* baisse encore si tu veux: 175/180 */
    border-radius: 14px !important;
  }/* Thumbs plus compacts */.offer-gallery-thumbs{
    padding: 4px 8px 6px !important;
    gap: 6px !important;
  }.offer-thumbbtn{
    width: 56px !important;
    height: 42px !important;
    border-radius: 10px !important;
  }/* Bloc infos plus serré */.offer-detail-body{
    padding: 10px 12px 12px !important;
    gap: 8px !important;
  }}/* ============================================================
   HEADER — SEARCH GLOBAL
   ============================================================ */.site-header .header-inner{
  display:flex;
  align-items:center;
  gap:12px;
}.ua-header-search{
  position: relative;
  display:flex;
  align-items:center;
  gap:10px;
  flex: 1 1 520px;
  min-width: 220px;
}.ua-hs-input{
  flex: 1 1 auto;
  min-width: 0;
  height: 40px;
  border-radius: 999px;
  border: 1px solid #333333;
  background: var(--card);
  color: var(--text);
  padding: 0 14px;
}.ua-hs-submit,
.ua-hs-filters{
  height: 40px;
  border-radius: 999px;
  border: 1px solid #333333;
  background: var(--card);
  color: var(--text);
  padding: 0 12px;
  cursor: pointer;
  flex: 0 0 auto;
}.ua-hs-panel{
  position: absolute;
  left: 0;
  top: calc(100% + 10px);
  width: min(760px, 100%);
  background: var(--card);
  border: 1px solid #333333;
  border-radius: 14px;
  padding: 12px;
  display:grid;
  grid-template-columns: 1fr 1fr 180px;
  gap: 10px;
  z-index: 99999;
  box-shadow: 0 12px 30px rgba(0,0,0,.25);
}.ua-hs-label{
  font-size: 12px;
  opacity: .8;
  margin: 0 0 6px 2px;
}.ua-hs-text,
.ua-hs-select{
  width:100%;
  height: 40px;
  border-radius: 12px;
  border: 1px solid #333333;
  background: var(--bg);
  color: var(--text);
  padding: 0 12px;
}@media (max-width: 900px){.ua-header-search{ flex: 1 1 auto; }.ua-hs-panel{ grid-template-columns: 1fr; }}.ua-hs-panel[hidden]{ 
  display:none !important; 
}
.ua-hs-submit{
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.ua-hs-icon{
  width: 18px;
  height: 18px;
  display:block;
}
/* Logo header : jamais déformé */
.site-header .logo-img{
  height: 28px;
  width: auto;
  display:block;
}
/* ===== HEADER LAYOUT (desktop) ===== */
.site-header .header-inner{
  display:flex;
  align-items:center;
  gap:12px;
}

/* le bloc recherche ne doit pas pousser la nav */
.ua-header-search{
  flex: 0 1 350px;     /* largeur max raisonnable */
  max-width: 420px;
  min-width: 220px;
  display:flex;
  align-items:center;
  gap:10px;
}

/* IMPORTANT: permet au champ de "shrink" sans déborder */
.ua-hs-input{ min-width: 0; flex: 1 1 auto; }

/* nav prend le reste et reste à droite */
.site-header .nav{
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:12px;
}
/* =========================================================
   HEADER MOBILE (clean) — burger gauche / logo centre / toggle droite
   -> aucune règle doublon, pas de .theme-toggle-top inutile
   ========================================================= */

@media (max-width: 820px){


  /* Référence pour les positions absolues */
  .site-header .header-inner{
    position: relative;
    height: 100%;
  }

  /* ====== LIGNE 1 : BURGER / LOGO / MODE SOMBRE ====== */

  /* Burger en haut à gauche */
  .site-header .header-inner > .mnav-btn{
    position: absolute;
    top: 14px;
    left: 14px;

    width: 38px;
    height: 38px;
    padding: 0;
    border-radius: 999px;

    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    z-index: 100001;
  }

  /* Toggle thème en haut à droite (cible EXACTEMENT ton bouton) */
  .site-header .header-inner > .theme-toggle{
    position: absolute;
    top: 14px;
    right: 14px;
    left: auto;
    bottom: auto;

    width: 38px;
    height: 38px;
    padding: 0;
    border-radius: 999px;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    z-index: 100001;
  }

  /* Logo centré en haut */
  .site-header .logo{
    position: absolute;
    top: 16px;
    left: 50%;
    transform: translateX(-50%);
    line-height: 0;
  }

  .site-header .logo-img{
    height: 48px;
    width: auto;
    max-width: none;
    display: block;
  }

  /* ====== LIGNE 2 : BARRE DE RECHERCHE ====== */
  .ua-header-search{
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: 14px;

    display: flex;
    align-items: center;
    gap: 8px;
  }

  .ua-hs-input{
    flex: 1 1 auto;
    height: 36px;
    font-size: 14px;
  }

  .ua-hs-submit,
  .ua-hs-filters{
    height: 36px;
    padding: 0 10px;
    font-size: 13px;
    border-radius: 999px;
  }

  .ua-hs-icon{
    width: 18px;
    height: 18px;
    display: block;
  }

  /* Menu desktop off */
  .site-header .nav{
    display: none !important;
  }

  /* Empêche le contenu de passer sous le header */
  .page-main{
    padding-top: 0;
  }
}

/* Dark mode : pastille logo header SANS rétrécir le logo */
.theme-dark .site-header .logo{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: fit-content;
  max-width: none;
  flex: 0 0 auto;
  overflow: visible;

  background: #fff;
  border-radius: 16px;
  padding: 1px 4px;
  line-height: 0;
}

.theme-dark .site-header .logo-img{
  display: block;
  height: 46px;
  width: auto;
  max-width: none;
}

/* Dark mode : pastille blanche aussi sur le bouton rechercher */
.theme-dark .ua-hs-submit{
  background: #fff;
  border: 1px solid rgba(0,0,0,.15);
}
.theme-dark .ua-hs-submit .ua-hs-icon{
  filter: none;
}

/* (Optionnel) si tu veux masquer la loupe sous 768px */
@media (max-width: 768px){
  .ua-hs-submit{ display: none; }
}

/* ===== Theme toggle: transition soleil <-> lune ===== */
.theme-toggle{
  position: relative;
  width: 38px;
  height: 38px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--card);
  color: var(--text);

  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Les 2 icônes se superposent */
.theme-toggle .theme-icon{
  position: absolute;
  width: 20px;
  height: 20px;
  transition: opacity .18s ease, transform .18s ease;
  pointer-events: none;
}

/* état clair : soleil visible */
.theme-toggle .sun{
  opacity: 1;
  transform: rotate(0deg) scale(1);
}
.theme-toggle .moon{
  opacity: 0;
  transform: rotate(20deg) scale(.85);
}

/* état sombre : lune visible */
html.theme-dark .theme-toggle .sun{
  opacity: 0;
  transform: rotate(-20deg) scale(.85);
}
html.theme-dark .theme-toggle .moon{
  opacity: 1;
  transform: rotate(0deg) scale(1);
}

/* DESKTOP — masquer bouton mode sombre */
@media (min-width: 769px){
  .theme-toggle{
    display: none !important;
  }
}
/* ✅ MOBILE ONLY — bouton "Filtres" comme un champ */
@media (max-width: 820px){
  .ua-header-search .ua-hs-filters{
    height: 36px;
    padding: 0 14px;
    border-radius: 999px;           /* même style que le champ */
    border: 1px solid #333333;      /* même bordure */
    background: var(--card);        /* même fond */
    color: var(--text);
    font-weight: 950;
    font-size: 14px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
  }
}
.page-home .hero-title{
  font-size: clamp(18px, 2.2vw, 24px);
  line-height: 1.2;
  font-weight: 800;
  margin: 0 0 10px;
  opacity: .95;
}

.page-home .hero-subtitle{
  font-size: clamp(14px, 1.6vw, 16px);
}
.search-input,
.search-bar input,
.hero-search input{
  font-size: 16px;
}
/* iOS Safari — empêcher le zoom au focus (font-size doit être >= 16px) */
@supports (-webkit-touch-callout: none) {
  input[type="text"],
  input[type="search"],
  input[type="email"],
  input[type="tel"],
  input[type="url"],
  input[type="password"],
  textarea,
  select{
    font-size: 16px !important;
  }
}
/* ============================================================
   MOBILE — HEADER TOUJOURS VISIBLE AU SCROLL (FORCE FIXED)
   ============================================================ */
@media (max-width: 820px){

  :root{ --mobile-header-h: 130px; } /* ajuste si besoin */

  /* ✅ force le fixed */
  header.site-header{
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: var(--mobile-header-h) !important;
    z-index: 999999 !important;
    background: var(--card) !important;
    border-bottom: 1px solid var(--border) !important;
  }

  /* ✅ si un parent avait un transform, ça peut casser le fixed (iOS) */
  html, body{
    transform: none !important;
    filter: none !important;
  }

  /* ✅ le contenu passe sous le header (sans créer un “trou” énorme) */
  main.page-main{
    padding-top: 0 !important;
    margin-top: var(--mobile-header-h) !important;
  }

  /* éviter un margin top du 1er bloc qui rajoute du vide */
  main.page-main > :first-child{
    margin-top: 0 !important;
  }

  /* panneau burger attaché au header */
  .mnav-panel{
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    right: 0 !important;
  }
}
/* ============================================================
   MOBILE — Header auto-hide (down = hide, up = show)
   ============================================================ */
@media (max-width: 820px){
  header.site-header{
    /* tu es déjà en fixed, on ajoute juste l’animation */
    transition: transform .22s ease;
    will-change: transform;
  }

  /* caché */
  header.site-header.is-hidden{
    transform: translateY(-100%);
  }

  /* (optionnel) quand caché, on évite le “trou” visuel en remontant le contenu */
  body.ua-header-hidden main.page-main{
    margin-top: 0 !important;
  }
}
/* =========================================
   FIX — enlever la pastille blanche du logo en mode sombre
   (uniquement header)
   ========================================= */
html.theme-dark .site-header a.logo{
  background: transparent !important;
  padding: 0 !important;
  border-radius: 0 !important;
}
html.theme-dark header.site-header a.logo{
  filter: drop-shadow(0 0 3px rgba(255,255,255,.75));
}
/* iOS fix: le transform reste sur .logo, l'effet reste sur un enfant sans transform */
.site-header a.logo{ overflow: visible; }
.site-header a.logo .logo-ink{
  display: inline-block;
  padding: 6px;                 /* donne de l’air pour le glow */
  overflow: visible;
}

html.theme-dark header.site-header a.logo .logo-ink{
  filter: drop-shadow(0 0 3px rgba(255,255,255,.75));
  will-change: filter;
  transform: translateZ(0);      /* force compositing iOS */
}

.site-header .logo-img{ display:block; } /* évite des micro-clips */
/* ==============================
   HEADER SEARCH — autocomplete width (PC)
   ============================== */
@media (min-width: 900px){
  .ua-hs-panel .suggestions-wrapper{
    position: relative;
  }

  /* La dropdown = au moins 280px, sinon 100% du champ */
  .ua-hs-panel .suggestions-box{
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    width: 100%;
    min-width: 280px;                 /* ✅ élargit sur PC */
    max-width: min(520px, 92vw);      /* ✅ évite de dépasser l’écran */
    z-index: 1000;
  }

  /* Optionnel : évite que le texte soit coupé */
  .ua-hs-panel .suggestions-box .suggestion-item{
    white-space: normal;
    line-height: 1.2;
  }
}
.dashboard-form .dash-stats{
  display:flex;
  gap:10px;
  margin: 12px 0;
  flex-wrap:wrap;
}

.dashboard-form .dash-stat{
  flex:1;
  min-width: 160px;
  background: var(--card);
  border: 1px solid #333333;
  border-radius: 14px;
  padding: 10px 12px;
}

.dashboard-form .dash-stat-num{
  font-size: 22px;
  font-weight: 800;
  line-height: 1;
}

.dashboard-form .dash-stat-label{
  margin-top: 6px;
  font-size: 12px;
  opacity: .8;
}
/* ============================================================
   MOBILE HEADER — FINAL (1 seul bloc)
   - Align burger / logo / theme
   - Logo même taille clair + sombre
   - Recherche + filtres remontés (plus proche du titre)
   - Gagne de la place pour futurs boutons posts
   ============================================================ */
@media (max-width: 820px){

  /* Hauteur header mobile (utilisée par ton header fixed existant) */
  :root{ --mobile-header-h: 104px; } /* + compact que 112 */

  /* ===== Ligne du haut : burger / logo / theme ===== */

  .site-header .header-inner > .mnav-btn{
    top: 8px;
    left: 12px;
    width: 36px;
    height: 36px;
  }

  .site-header .header-inner > .theme-toggle{
    top: 8px;
    right: 12px;
    width: 36px;
    height: 36px;
  }

  .site-header .logo{
    top: 8px;
    left: 50%;
    transform: translateX(-50%);
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 0;
  }

  /* Logo: même taille en clair ET en sombre */
  .site-header .logo-img,
  html.theme-dark .site-header .logo-img{
    height: 46px;
    width: auto;
    max-width: none;
    display: block;
  }

  /* ===== Ligne du bas : barre de recherche + filtres ===== */

  .ua-header-search{
    left: 12px;
    right: 12px;

    /* ✅ remonte la barre (plus proche du logo) */
    bottom: 6px;

    display: flex;
    align-items: center;
    gap: 8px;
  }

  /* Champs un poil plus compacts (gagne de la place verticale) */
  .ua-hs-input{
    height: 32px;
    font-size: 16px;     /* iOS: pas de zoom */
    padding: 0 12px;
  }

  .ua-hs-filters{
    height: 32px;
    padding: 0 12px;
    font-size: 14px;
  }

  /* Loupe masquée sur mobile (comme chez toi) */
  .ua-hs-submit{ display: none !important; }
}


  /* ✅ Logo: même taille en clair ET en sombre */
  .site-header .logo-img,
  html.theme-dark .site-header .logo-img{
    height: 46px;              /* ← mets 48px si tu veux exactement comme ton dark */
    width: auto;
    max-width: none;
    display: block;
  }

  /* ===== Ligne du bas : barre de recherche ===== */

  .ua-header-search{
    left: 12px;
    right: 12px;
    bottom: 6px;
    gap: 8px;
  }

  .ua-hs-input{
    height: 34px;
    font-size: 16px;           /* iOS: pas de zoom */
    padding: 0 12px;
  }

  .ua-hs-filters{
    height: 34px;
    padding: 0 12px;
    font-size: 14px;
  }

  /* Loupe cachée sur mobile (comme chez toi) */
  .ua-hs-submit{ display: none !important; }
} 

/* =========================
   ACTU (index) — CLEAN
   ========================= */

/* Tabs */
.actu-tabs{
  position: sticky;
  top: var(--header-h, 0px);
  z-index: 40;
  background: var(--page-bg, #fff);
  border-bottom: 1px solid rgba(0,0,0,.08);
}
.actu-tabs-inner{
  max-width: 1100px;
  margin: 0 auto;
  padding: .55rem 12px;
  display: flex;
  gap: .55rem;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}
.actu-tab{
  appearance: none;
  border: 1px solid rgba(0,0,0,.12);
  background: transparent;
  color: inherit;
  padding: .42rem .8rem;
  border-radius: 999px;
  font-weight: 700;
  cursor: pointer;
  line-height: 1;
}
.actu-tab.is-active{
  background: rgba(0,0,0,.08);
  border-color: rgba(0,0,0,.18);
}
html.theme-dark .actu-tabs{
  background: var(--page-bg, #111);
  border-bottom-color: rgba(255,255,255,.10);
}
html.theme-dark .actu-tab{ border-color: rgba(255,255,255,.16); }
html.theme-dark .actu-tab.is-active{
  background: rgba(255,255,255,.10);
  border-color: rgba(255,255,255,.22);
}

/* Bouton + (discret, centré) */
.actu-publish-wrap{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  margin: .35rem 0 .15rem;
}
.actu-publish-plus{
  width: 34px;
  height: 34px;
  border-radius: 999px;
  border: 1px dashed rgba(0,0,0,.25);
  background: transparent;
  color: inherit;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.55rem;
  font-weight: 900;
  line-height: 1;
  text-decoration: none;
  user-select: none;
  cursor: pointer;
  opacity: .7;
}
.actu-publish-plus:hover{ opacity: 1; border-style: solid; }
html.theme-dark .actu-publish-plus{ border-color: rgba(255,255,255,.35); }

/* Feed wrapper */
.actu-feed{
  max-width: 1100px;
  margin: 0 auto;
  padding: .35rem 12px 0;
}

/* =========================
   Carousel horizontal (PC 5 / Mobile 2)
   + cartes avec taille max
   ========================= */
.actu-list{
  --actu-gap: .8rem;

  max-width: 1100px;
  margin: .5rem auto 0;
  padding: 0 12px 10px;

  display: flex;
  gap: var(--actu-gap);

  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;

  scroll-snap-type: x mandatory;
  scroll-padding-left: 12px;
}

.actu-card{
  position: relative;
  scroll-snap-align: start;

  /* 5 visibles sur PC */
  flex: 0 0 calc((100% - (var(--actu-gap) * 4)) / 5);

  /* taille max pour éviter les “gros pavés” */
  max-width: 240px;

  border: 1px solid rgba(0,0,0,.10);
  border-radius: 16px;
  overflow: hidden;
  background: rgba(0,0,0,.02);
}
html.theme-dark .actu-card{
  border-color: rgba(255,255,255,.12);
  background: rgba(255,255,255,.05);
}

/* 3 visibles tablette */
@media (max-width: 900px){
  .actu-card{
    flex-basis: calc((100% - (var(--actu-gap) * 2)) / 3);
    max-width: 260px;
  }
}

/* 2 visibles mobile */
@media (max-width: 520px){
  .actu-card{
    flex-basis: calc((100% - var(--actu-gap)) / 2);
    max-width: 220px;
    border-radius: 14px;
  }
}

/* Image */
.actu-media{
  position: relative;
  aspect-ratio: 4 / 3;     /* + compact que 16/10 => mieux sur mobile */
  background-size: cover;
  background-position: center;
}
.actu-media.no-media{
  background: rgba(0,0,0,.06);
}
html.theme-dark .actu-media.no-media{ background: rgba(255,255,255,.08); }

/* =========================
   Infos SUR l’image (overlay)
   ========================= */

/* on transforme le body en overlay en bas */
.actu-body{
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;

  padding: .55rem .6rem .55rem;
  color: #fff;

  /* dégradé lisible */
  background: linear-gradient(to top, rgba(0,0,0,.70), rgba(0,0,0,.00));
}

/* Titre (nom business) */
.actu-biz{
  display: block;
  font-weight: 900;
  font-size: .95rem;
  line-height: 1.1;

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Meta (distance / ville) */
.actu-meta{
  margin-top: .2rem;
  opacity: .95;
  font-size: .82rem;
  display: flex;
  gap: .4rem;
  flex-wrap: nowrap;

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Texte (si tu en as) -> on le limite fort pour éviter la carte verticale */
.actu-text{
  margin-top: .25rem;
  font-size: .82rem;
  opacity: .95;

  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Like en pastille sur l’image (haut droite) */
.actu-like{
  position: absolute;
  top: .5rem;
  right: .5rem;

  border: 1px solid rgba(255,255,255,.55);
  background: rgba(0,0,0,.35);
  color: #fff;

  border-radius: 999px;
  padding: .22rem .5rem;
  font-weight: 900;
  font-size: .82rem;
  line-height: 1;

  cursor: pointer;
}
.actu-like.is-on{
  background: rgba(255,255,255,.18);
  border-color: rgba(255,255,255,.75);
}

/* Mobile : typo plus petite */
@media (max-width: 520px){
  .actu-body{ padding: .5rem .55rem .5rem; }
  .actu-biz{ font-size: .88rem; }
  .actu-meta, .actu-text, .actu-like{ font-size: .78rem; }
}

/* scrollbar soft (optionnel mais léger) */
.actu-list{ scrollbar-width: thin; }
.actu-list::-webkit-scrollbar{ height: 10px; }
.actu-list::-webkit-scrollbar-thumb{
  background: rgba(0,0,0,.18);
  border-radius: 999px;
}
html.theme-dark .actu-list::-webkit-scrollbar-thumb{ background: rgba(255,255,255,.18); }
.post-modal{ position:fixed; inset:0; display:none; z-index:9999; }
.post-modal.is-open{ display:block; }
.post-modal__backdrop{ position:absolute; inset:0; background:rgba(0,0,0,.55); }

.post-modal__panel{
  position:relative;
  width:min(820px, calc(100% - 24px));
  margin: 12px auto;
  background: var(--page-bg, #fff);
  border-radius: 18px;
  overflow:hidden;
}

.post-modal__close{
  position:absolute; top:10px; right:10px;
  border:0; background:rgba(0,0,0,.45); color:#fff;
  width:34px; height:34px; border-radius:999px;
}

.post-modal__media{ background:#000; }
.post-modal__media img{ width:100%; max-height:70vh; object-fit:contain; display:block; }

.post-modal__body{ padding: 14px 14px 16px; }
.post-modal__top{ display:flex; justify-content:space-between; gap:10px; align-items:flex-start; }
.post-modal__title{ font-weight:900; }
.post-modal__meta{ opacity:.8; margin-top:6px; }
.post-modal__text{ margin-top:10px; white-space:pre-wrap; }
/* Modal post : éviter le "cut" quand pas d'image */
.post-modal__panel{
  max-height: 92vh;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

/* Quand pas d'image : on supprime la zone media et on remonte proprement le contenu */
.post-modal.no-media .post-modal__media{
  display: none;
}

.post-modal.no-media .post-modal__body{
  padding-top: 16px;
}
/* ===========================
   FIX MODAL POSTS (béton)
   =========================== */

/* overlay plein écran */
.post-modal{
  position: fixed !important;
  inset: 0 !important;
  z-index: 99999 !important;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 14px;
}

.post-modal.is-open{ display: flex !important; }

/* backdrop */
.post-modal__backdrop{
  position: absolute !important;
  inset: 0 !important;
}

/* panneau centré + scroll */
.post-modal__panel{
  position: relative !important;
  width: min(980px, calc(100% - 24px)) !important;
  max-height: calc(100vh - 24px) !important;
  overflow: hidden !important;

  /* neutralise les vieux styles qui te le font "partir" */
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  transform: none !important;
  margin: 0 !important;

  display: grid !important;
  grid-template-columns: 44% 56% !important;
}

/* zone media */
.post-modal__media{
  min-height: 260px;
}

/* body scrollable */
.post-modal__body{
  overflow: auto !important;
  -webkit-overflow-scrolling: touch;
  max-height: calc(100vh - 24px) !important;
}

/* ===== NO MEDIA => 1 colonne, plus de zone vide ===== */
.post-modal.no-media .post-modal__panel{
  display: block !important;
  overflow: auto !important;
}

.post-modal.no-media .post-modal__media{
  display: none !important;
}

.post-modal.no-media .post-modal__body{
  max-height: calc(100vh - 24px) !important;
}
/* ===== ACTU / BONS PLANS TABS (PC + MOBILE) ===== */
.actu-tabs {
  display: flex;
  justify-content: center;
  width: 100%;
}

.actu-tabs > .actu-tabs {
  display: inline-flex; /* clé pour le centrage desktop */
  gap: .6rem;
  justify-content: center;
  align-items: center;
}
/* Dropdown suggest: ne change pas le layout du form */
.ua-suggest{
  position: fixed;         /* important: hors du flow du header */
  z-index: 100000;
  display: none;
}

.ua-suggest-box{
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 12px 30px rgba(0,0,0,.12);
}

.ua-suggest-title{
  padding: 8px 12px;
  font-size: 12px;
  opacity: .7;
  border-top: 1px solid var(--border);
}
.ua-suggest-title:first-child{ border-top: 0; }

.ua-suggest-item{
  width: 100%;
  padding: 10px 12px;
  display: flex;
  justify-content: space-between;
  gap: 10px;
  background: transparent;
  border: 0;
  color: var(--text);
  text-align: left;
}
.ua-suggest-item small{ opacity:.7; white-space:nowrap; }

.actu-media{ position:relative; }
.actu-play{
  position:absolute;
  left:50%; top:50%;
  transform:translate(-50%,-50%);
  width:52px; height:52px;
  border-radius:999px;
  border:0;
  cursor:pointer;
  background:rgba(0,0,0,.55);
  color:#fff;
  font-size:22px;
  display:flex; align-items:center; justify-content:center;
}
/* ============================================================
   POST MODAL — MEDIA FIX (no aspect-ratio forced)
   - vidéo: width:100% + height:auto => plus de bande noire "en bas"
   - mobile: modal en 1 colonne (media au dessus)
   ============================================================ */

/* panel desktop */
.post-modal__panel{
  width: min(980px, calc(100% - 24px)) !important;
  max-height: calc(100vh - 24px) !important;
  overflow: hidden !important;
  display: grid !important;
  grid-template-columns: 44% 56% !important;
  border-radius: 18px;
}

/* media box */
.post-modal__media{
  background: #000;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

/* IMPORTANT: on retire le wrapper 16/9 */
.post-modal__mediaWrap{
  width: 100% !important;
  aspect-ratio: auto !important;
  border-radius: 0 !important;
  background: #000;
  overflow: hidden;
}

/* vidéo = hauteur naturelle (plus de "bande noire en bas" due au container) */
.post-modal__video{
  width: 100% !important;
  height: auto !important;
  max-height: 78vh;            /* limite écran */
  display: block;
  object-fit: contain !important; /* ne coupe pas */
  background: #000;
}

/* image (pareil) */
.post-modal__img{
  width: 100% !important;
  height: auto !important;
  max-height: 78vh;
  display: block;
  object-fit: contain !important;
  background: #000;
}

/* body scrollable */
.post-modal__body{
  overflow: auto !important;
  -webkit-overflow-scrolling: touch;
}

/* ===== MOBILE: 1 colonne (sinon rendu ridicule) ===== */
@media (max-width: 820px){
  .post-modal{
    padding: 10px !important;
    align-items: center;
    justify-content: center;
  }

  .post-modal__panel{
    width: calc(100% - 12px) !important;
    max-height: calc(100vh - 12px) !important;
    grid-template-columns: 1fr !important;
    border-radius: 18px;
  }

  .post-modal__media{
    max-height: 46vh;          /* media grand sur mobile */
  }

  .post-modal__video,
  .post-modal__img{
    max-height: 46vh !important;
  }
}
.actu-media.is-video-no-thumb{
  position: relative;
  background: linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.55));
}
.actu-video-badge{
  position:absolute; left:10px; bottom:10px;
  padding:6px 10px; border-radius:999px;
  background: rgba(0,0,0,.45);
  color:#fff; font-size:12px;
}
/* Badge catégorie = bordure forte + fond teinté (comme badge vérifié) */
.pill.pill-cat{
  border: 1px solid color-mix(in srgb, var(--cat) 55%, transparent);
  background: color-mix(in srgb, var(--cat) 18%, transparent);
  color: #111;   /* texte noir */
  font-weight: 900;
}
html.theme-dark .pill.pill-cat{
  color: #FFFFFF;
  border-color: color-mix(in srgb, var(--cat) 60%, rgba(255,255,255,.15));
  background: color-mix(in srgb, var(--cat) 22%, transparent);
}